From fc1026b8b3e6c63806cf3657e39081e097dc8762 Mon Sep 17 00:00:00 2001
From: sebmarkbage <sebmarkbage@users.noreply.github.com>
Date: Wed, 29 Mar 2023 02:45:08 +0000
Subject: [PATCH] Refactor DOM special cases per tags including controlled
 fields (#26501)

I use a shared helper when setting properties into a helper whether it's
initial or update.

I moved the special cases per tag to commit phase so we can check it
only once. This also effectively inlines getHostProps which can be done
in a single check per prop key.

The diffProperties operation is simplified to mostly just generating a
plain diff of all properties, generating an update payload. This might
generate a few more entries that are now ignored in the commit phase.
that previously would've been ignored earlier. We could skip this and
just do the whole diff in the commit phase by always scheduling a commit
phase update.

I tested the attribute table (one change documented below) and a few
select DOM fixtures.

DiffTrain build for [85de6fde515148babd36eae2b7384ad8e62b732a](https://github.com/facebook/react/commit/85de6fde515148babd36eae2b7384ad8e62b732a)
---
 compiled/facebook-www/REVISION                |    2 +-
 compiled/facebook-www/React-dev.modern.js     |    2 +-
 compiled/facebook-www/ReactART-dev.classic.js |    2 +-
 compiled/facebook-www/ReactART-prod.modern.js |    4 +-
 compiled/facebook-www/ReactDOM-dev.classic.js | 1292 +++++++-------
 compiled/facebook-www/ReactDOM-dev.modern.js  | 1292 +++++++-------
 .../facebook-www/ReactDOM-prod.classic.js     | 1476 ++++++++--------
 compiled/facebook-www/ReactDOM-prod.modern.js | 1242 +++++++-------
 .../ReactDOM-profiling.classic.js             | 1520 ++++++++---------
 .../facebook-www/ReactDOM-profiling.modern.js | 1228 +++++++------
 .../ReactDOMTesting-dev.classic.js            | 1300 +++++++-------
 .../ReactDOMTesting-dev.modern.js             | 1292 +++++++-------
 .../ReactDOMTesting-prod.classic.js           | 1238 +++++++-------
 .../ReactDOMTesting-prod.modern.js            | 1242 +++++++-------
 .../ReactTestRenderer-dev.modern.js           |    2 +-
 15 files changed, 6251 insertions(+), 6883 deletions(-)

diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION
index 0e7e4f9207af0..dac374ec89a05 100644
--- a/compiled/facebook-www/REVISION
+++ b/compiled/facebook-www/REVISION
@@ -1 +1 @@
-f62cb39ee58e5918806218de2be8d2833023e7fc
+85de6fde515148babd36eae2b7384ad8e62b732a
diff --git a/compiled/facebook-www/React-dev.modern.js b/compiled/facebook-www/React-dev.modern.js
index c9b8744e8bc1a..c5316fd9a2bf3 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-0ec8c3f1";
+var ReactVersion = "18.3.0-www-modern-3ed4a7e4";
 
 // 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 7448444fa8004..200c405a1d053 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-31f56934";
+var ReactVersion = "18.3.0-www-classic-aa994cf1";
 
 var LegacyRoot = 0;
 var ConcurrentRoot = 1;
diff --git a/compiled/facebook-www/ReactART-prod.modern.js b/compiled/facebook-www/ReactART-prod.modern.js
index a15d1dcd2df7f..a57d5d28e03c2 100644
--- a/compiled/facebook-www/ReactART-prod.modern.js
+++ b/compiled/facebook-www/ReactART-prod.modern.js
@@ -9699,7 +9699,7 @@ var slice = Array.prototype.slice,
       return null;
     },
     bundleType: 0,
-    version: "18.3.0-www-modern-c4381c45",
+    version: "18.3.0-www-modern-0ad65545",
     rendererPackageName: "react-art"
   };
 var internals$jscomp$inline_1304 = {
@@ -9730,7 +9730,7 @@ var internals$jscomp$inline_1304 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-c4381c45"
+  reconcilerVersion: "18.3.0-www-modern-0ad65545"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_1305 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
diff --git a/compiled/facebook-www/ReactDOM-dev.classic.js b/compiled/facebook-www/ReactDOM-dev.classic.js
index 4f0cfaa17dc55..ef4bdc24aef7a 100644
--- a/compiled/facebook-www/ReactDOM-dev.classic.js
+++ b/compiled/facebook-www/ReactDOM-dev.classic.js
@@ -4569,17 +4569,6 @@ function isControlled(props) {
  * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
  */
 
-function getHostProps$2(element, props) {
-  var node = element;
-  var checked = props.checked;
-  var hostProps = assign({}, props, {
-    defaultChecked: undefined,
-    defaultValue: undefined,
-    value: undefined,
-    checked: checked != null ? checked : node._wrapperState.initialChecked
-  });
-  return hostProps;
-}
 function initWrapperState$2(element, props) {
   {
     checkControlledValueProps("input", props);
@@ -4625,9 +4614,13 @@ function initWrapperState$2(element, props) {
 
   var node = element;
   var defaultValue = props.defaultValue == null ? "" : props.defaultValue;
+  var initialChecked =
+    props.checked != null ? props.checked : props.defaultChecked;
   node._wrapperState = {
     initialChecked:
-      props.checked != null ? props.checked : props.defaultChecked,
+      typeof initialChecked !== "function" &&
+      typeof initialChecked !== "symbol" &&
+      !!initialChecked,
     initialValue: getToStringValue(
       props.value != null ? props.value : defaultValue
     ),
@@ -4813,19 +4806,20 @@ function postMountWrapper$3(element, props, isHydrating) {
 
   if (name !== "") {
     node.name = "";
+  } // The checked property never gets assigned. It must be manually set.
+  // We don't want to do this when hydrating so that existing user input isn't
+  // modified
+  // TODO: I'm pretty sure this is a bug because initialValueTracking won't be
+  // correct for the hydration case then.
+
+  if (!isHydrating) {
+    node.checked = !!node._wrapperState.initialChecked;
   }
 
   if (disableInputAttributeSyncing) {
-    // When not syncing the checked attribute, the checked property
-    // never gets assigned. It must be manually set. We don't want
-    // to do this when hydrating so that existing user input isn't
-    // modified
-    if (!isHydrating) {
-      updateChecked(element, props);
-    } // Only assign the checked attribute if it is defined. This saves
+    // Only assign the checked attribute if it is defined. This saves
     // a DOM write when controlling the checked attribute isn't needed
     // (text inputs, submit/reset)
-
     if (props.hasOwnProperty("defaultChecked")) {
       node.defaultChecked = !node.defaultChecked;
       node.defaultChecked = !!props.defaultChecked;
@@ -5110,11 +5104,6 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
  * selected.
  */
 
-function getHostProps$1(element, props) {
-  return assign({}, props, {
-    value: undefined
-  });
-}
 function initWrapperState$1(element, props) {
   var node = element;
 
@@ -5199,28 +5188,6 @@ var didWarnValDefaultVal = false;
  * `defaultValue` if specified, or the children content (deprecated).
  */
 
-function getHostProps(element, props) {
-  var node = element;
-
-  if (props.dangerouslySetInnerHTML != null) {
-    throw new Error(
-      "`dangerouslySetInnerHTML` does not make sense on <textarea>."
-    );
-  } // Always set children to the same thing. In IE9, the selection range will
-  // get reset if `textContent` is mutated.  We could add a check in setTextContent
-  // to only set the value if/when the value differs from the node value (which would
-  // completely solve this IE9 bug), but Sebastian+Sophie seemed to like this
-  // solution. The value can be a boolean or object so that's why it's forced
-  // to be a string.
-
-  var hostProps = assign({}, props, {
-    value: undefined,
-    defaultValue: undefined,
-    children: toString(node._wrapperState.initialValue)
-  });
-
-  return hostProps;
-}
 function initWrapperState(element, props) {
   var node = element;
 
@@ -5286,8 +5253,11 @@ function initWrapperState(element, props) {
     initialValue = defaultValue;
   }
 
+  var stringValue = getToStringValue(initialValue);
+  node.defaultValue = stringValue; // This will be toString:ed.
+
   node._wrapperState = {
-    initialValue: getToStringValue(initialValue)
+    initialValue: stringValue
   };
 }
 function updateWrapper(element, props) {
@@ -7277,189 +7247,146 @@ function trapClickOnNonInteractiveElement(node) {
   node.onclick = noop$2;
 }
 
-function setInitialDOMProperties(
-  tag,
-  domElement,
-  nextProps,
-  isCustomComponentTag
-) {
-  for (var propKey in nextProps) {
-    if (!nextProps.hasOwnProperty(propKey)) {
-      continue;
-    }
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style": {
+      if (value != null && typeof value !== "object") {
+        throw new Error(
+          "The `style` prop expects a mapping from style properties to values, " +
+            "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
+            "using JSX."
+        );
+      }
 
-    var nextProp = nextProps[propKey];
+      {
+        if (value) {
+          // Freeze the next style object so that we can assume it won't be
+          // mutated. We have already warned for this in the past.
+          Object.freeze(value);
+        }
+      } // Relies on `updateStylesByID` not mutating `styleUpdates`.
 
-    switch (propKey) {
-      case "style": {
-        if (nextProp != null && typeof nextProp !== "object") {
+      setValueForStyles(domElement, value);
+      break;
+    }
+
+    case "dangerouslySetInnerHTML": {
+      if (value != null) {
+        if (typeof value !== "object" || !("__html" in value)) {
           throw new Error(
-            "The `style` prop expects a mapping from style properties to values, " +
-              "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
-              "using JSX."
+            "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
+              "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
+              "for more information."
           );
         }
 
-        {
-          if (nextProp) {
-            // Freeze the next style object so that we can assume it won't be
-            // mutated. We have already warned for this in the past.
-            Object.freeze(nextProp);
-          }
-        } // Relies on `updateStylesByID` not mutating `styleUpdates`.
+        var nextHtml = value.__html;
 
-        setValueForStyles(domElement, nextProp);
-        break;
-      }
-
-      case "dangerouslySetInnerHTML": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "object" || !("__html" in nextProp)) {
+        if (nextHtml != null) {
+          if (props.children != null) {
             throw new Error(
-              "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
-                "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
-                "for more information."
+              "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
             );
           }
 
-          var nextHtml = nextProp.__html;
-
-          if (nextHtml != null) {
-            if (nextProps.children != null) {
-              throw new Error(
-                "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
-              );
-            }
-
-            if (disableIEWorkarounds) {
-              domElement.innerHTML = nextHtml;
-            } else {
-              setInnerHTML$1(domElement, nextHtml);
-            }
+          if (disableIEWorkarounds) {
+            domElement.innerHTML = nextHtml;
+          } else {
+            setInnerHTML$1(domElement, nextHtml);
           }
         }
-
-        break;
       }
 
-      case "children": {
-        if (typeof nextProp === "string") {
-          // Avoid setting initial textContent when the text is empty. In IE11 setting
-          // textContent on a <textarea> will cause the placeholder to not
-          // show within the <textarea> until it has been focused and blurred again.
-          // https://github.com/facebook/react/issues/6731#issuecomment-254874553
-          var canSetTextContent =
-            tag !== "body" && (tag !== "textarea" || nextProp !== "");
+      break;
+    }
 
-          if (canSetTextContent) {
-            setTextContent(domElement, nextProp);
-          }
-        } else if (typeof nextProp === "number") {
-          var _canSetTextContent = tag !== "body";
+    case "children": {
+      if (typeof value === "string") {
+        // Avoid setting initial textContent when the text is empty. In IE11 setting
+        // textContent on a <textarea> will cause the placeholder to not
+        // show within the <textarea> until it has been focused and blurred again.
+        // https://github.com/facebook/react/issues/6731#issuecomment-254874553
+        var canSetTextContent =
+          tag !== "body" && (tag !== "textarea" || value !== "");
 
-          if (_canSetTextContent) {
-            setTextContent(domElement, "" + nextProp);
-          }
+        if (canSetTextContent) {
+          setTextContent(domElement, value);
         }
+      } else if (typeof value === "number") {
+        var _canSetTextContent = tag !== "body";
 
-        break;
+        if (_canSetTextContent) {
+          setTextContent(domElement, "" + value);
+        }
       }
 
-      case "onScroll": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "function") {
-            warnForInvalidEventListener(propKey, nextProp);
-          }
+      break;
+    }
 
-          listenToNonDelegatedEvent("scroll", domElement);
+    case "onScroll": {
+      if (value != null) {
+        if (typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
         }
 
-        break;
+        listenToNonDelegatedEvent("scroll", domElement);
       }
 
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
+      break;
+    }
 
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
+    case "onClick": {
+      // TODO: This cast may not be sound for SVG, MathML or custom elements.
+      if (value != null) {
+        if (typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
+        }
 
-      case "autoFocus": {
-        // We polyfill it separately on the client during commit.
-        // We could have excluded it in the property list instead of
-        // adding a special case here, but then it wouldn't be emitted
-        // on server rendering (but we *do* want to emit it in SSR).
-        break;
+        trapClickOnNonInteractiveElement(domElement);
       }
 
-      case "innerText": // Properties
-
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
-        }
+      break;
+    }
 
-      // eslint-disable-next-line no-fallthrough
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue": // Reserved
 
-      default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          if (nextProp != null) {
-            if (typeof nextProp !== "function") {
-              warnForInvalidEventListener(propKey, nextProp);
-            }
-          }
-        } else if (nextProp != null) {
-          if (isCustomComponentTag) {
-            setValueForPropertyOnCustomComponent(domElement, propKey, nextProp);
-          } else {
-            setValueForProperty(domElement, propKey, nextProp);
-          }
-        }
-      }
+    case "defaultChecked":
+    case "innerHTML": {
+      // Noop
+      break;
     }
-  }
-}
-
-function updateDOMProperties(
-  domElement,
-  updatePayload,
-  wasCustomComponentTag,
-  isCustomComponentTag
-) {
-  // TODO: Handle wasCustomComponentTag
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i];
-    var propValue = updatePayload[i + 1];
 
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
+    case "autoFocus": {
+      // We polyfill it separately on the client during commit.
+      // We could have excluded it in the property list instead of
+      // adding a special case here, but then it wouldn't be emitted
+      // on server rendering (but we *do* want to emit it in SSR).
+      break;
+    }
 
-      case "dangerouslySetInnerHTML":
-        if (disableIEWorkarounds) {
-          domElement.innerHTML = propValue;
-        } else {
-          setInnerHTML$1(domElement, propValue);
-        }
+    case "innerText": // Properties
 
+    case "textContent":
+      if (enableCustomElementPropertySupport) {
         break;
+      }
 
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
+    // eslint-disable-next-line no-fallthrough
 
-      default:
+    default: {
+      if (registrationNameDependencies.hasOwnProperty(key)) {
+        if (value != null && typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
+        }
+      } else {
         if (isCustomComponentTag) {
-          setValueForPropertyOnCustomComponent(domElement, propKey, propValue);
+          setValueForPropertyOnCustomComponent(domElement, key, value);
         } else {
-          setValueForProperty(domElement, propKey, propValue);
+          setValueForProperty(domElement, key, value);
         }
-
-        break;
+      }
     }
   }
 } // creates a script element that won't execute
@@ -7590,291 +7517,305 @@ function createTextNode(text, rootContainerElement) {
     text
   );
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
-
+function setInitialProperties(domElement, tag, props) {
   {
-    validatePropertiesInDevelopment(tag, rawProps);
+    validatePropertiesInDevelopment(tag, props);
   } // TODO: Make sure that we check isMounted before firing any of these events.
 
-  var props;
-
   switch (tag) {
-    case "dialog":
-      listenToNonDelegatedEvent("cancel", domElement);
-      listenToNonDelegatedEvent("close", domElement);
-      props = rawProps;
-      break;
-
-    case "embed":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
-
-    // eslint-disable-next-line no-fallthrough
+    case "input": {
+      initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the invalid event.
 
-    case "iframe":
-    case "object":
-      // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the load event.
-      listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
-      break;
+      listenToNonDelegatedEvent("invalid", domElement);
 
-    case "video":
-    case "audio":
-      // We listen to these events in case to ensure emulated bubble
-      // listeners still fire for all the media events.
-      for (var i = 0; i < mediaEventTypes.length; i++) {
-        listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
-      }
+      for (var propKey in props) {
+        if (!props.hasOwnProperty(propKey)) {
+          continue;
+        }
 
-      props = rawProps;
-      break;
+        var propValue = props[propKey];
 
-    case "source":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      } // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the error event.
+        if (propValue == null) {
+          continue;
+        }
 
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
+        switch (propKey) {
+          case "checked": {
+            var node = domElement;
+            var checked =
+              propValue != null ? propValue : node._wrapperState.initialChecked;
+            node.checked =
+              !!checked &&
+              typeof checked !== "function" &&
+              checked !== "symbol";
+            break;
+          }
 
-    case "img":
-    case "link":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-    // eslint-disable-next-line no-fallthrough
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (propValue != null) {
+              throw new Error(
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
+              );
+            }
 
-    case "image":
-      // We listen to these events in case to ensure emulated bubble
-      // listeners still fire for error and load events.
-      listenToNonDelegatedEvent("error", domElement);
-      listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
-      break;
+            break;
+          }
+          // defaultChecked and defaultValue are ignored by setProp
 
-    case "details":
-      // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the toggle event.
-      listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
+          default: {
+            setProp(domElement, tag, propKey, propValue, false, props);
+          }
+        }
+      } // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
 
-    case "input":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
+      track(domElement);
+      postMountWrapper$3(domElement, props, false);
+      return;
+    }
 
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+    case "select": {
+      initWrapperState$1(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
-      break;
 
-    case "option":
-      validateProps(domElement, rawProps);
-      props = rawProps;
-      break;
+      for (var _propKey in props) {
+        if (!props.hasOwnProperty(_propKey)) {
+          continue;
+        }
 
-    case "select":
-      initWrapperState$1(domElement, rawProps);
-      props = getHostProps$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the invalid event.
+        var _propValue = props[_propKey];
 
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
+        if (_propValue == null) {
+          continue;
+        }
 
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+        switch (_propKey) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
+          // defaultValue are ignored by setProp
+
+          default: {
+            setProp(domElement, tag, _propKey, _propValue, false, props);
+          }
+        }
+      }
+
+      postMountWrapper$1(domElement, props);
+      return;
+    }
+
+    case "textarea": {
+      initWrapperState(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
-      break;
 
-    case "area":
-    case "base":
-    case "br":
-    case "col":
-    case "hr":
-    case "keygen":
-    case "meta":
-    case "param":
-    case "track":
-    case "wbr":
-    case "menuitem": {
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
-    }
-    // eslint-disable-next-line no-fallthrough
+      for (var _propKey2 in props) {
+        if (!props.hasOwnProperty(_propKey2)) {
+          continue;
+        }
 
-    default:
-      props = rawProps;
-  }
+        var _propValue2 = props[_propKey2];
 
-  setInitialDOMProperties(tag, domElement, props, isCustomComponentTag);
+        if (_propValue2 == null) {
+          continue;
+        }
 
-  switch (tag) {
-    case "input":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, false);
-      break;
+        switch (_propKey2) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-    case "textarea":
-      // TODO: Make sure we check if this is still unmounted or do any clean
+          case "children": {
+            // TODO: Handled by initWrapperState above.
+            break;
+          }
+
+          case "dangerouslySetInnerHTML": {
+            if (_propValue2 != null) {
+              // TODO: Do we really need a special error message for this. It's also pretty blunt.
+              throw new Error(
+                "`dangerouslySetInnerHTML` does not make sense on <textarea>."
+              );
+            }
+
+            break;
+          }
+          // defaultValue is ignored by setProp
+
+          default: {
+            setProp(domElement, tag, _propKey2, _propValue2, false, props);
+          }
+        }
+      } // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
+
       track(domElement);
       postMountWrapper(domElement);
-      break;
+      return;
+    }
 
-    case "option":
-      postMountWrapper$2(domElement, rawProps);
-      break;
+    case "option": {
+      validateProps(domElement, props);
 
-    case "select":
-      postMountWrapper$1(domElement, rawProps);
-      break;
+      for (var _propKey3 in props) {
+        if (!props.hasOwnProperty(_propKey3)) {
+          continue;
+        }
 
-    default:
-      if (typeof props.onClick === "function") {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
+        var _propValue3 = props[_propKey3];
+
+        if (_propValue3 == null) {
+          continue;
+        }
+
+        setProp(domElement, tag, _propKey3, _propValue3, false, props);
       }
 
-      break;
-  }
-} // Calculate the diff between the two objects.
+      postMountWrapper$2(domElement, props);
+      return;
+    }
 
-function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
-  {
-    validatePropertiesInDevelopment(tag, nextRawProps);
-  }
+    case "dialog": {
+      listenToNonDelegatedEvent("cancel", domElement);
+      listenToNonDelegatedEvent("close", domElement);
+      break;
+    }
 
-  var updatePayload = null;
-  var lastProps;
-  var nextProps;
+    case "iframe":
+    case "object": {
+      // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the load event.
+      listenToNonDelegatedEvent("load", domElement);
+      break;
+    }
 
-  switch (tag) {
-    case "input":
-      if (
-        nextRawProps.children != null ||
-        nextRawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
+    case "video":
+    case "audio": {
+      // We listen to these events in case to ensure emulated bubble
+      // listeners still fire for all the media events.
+      for (var i = 0; i < mediaEventTypes.length; i++) {
+        listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
       }
 
-      lastProps = getHostProps$2(domElement, lastRawProps);
-      nextProps = getHostProps$2(domElement, nextRawProps);
-      updatePayload = [];
       break;
+    }
 
-    case "select":
-      lastProps = getHostProps$1(domElement, lastRawProps);
-      nextProps = getHostProps$1(domElement, nextRawProps);
-      updatePayload = [];
+    case "image": {
+      // We listen to these events in case to ensure emulated bubble
+      // listeners still fire for error and load events.
+      listenToNonDelegatedEvent("error", domElement);
+      listenToNonDelegatedEvent("load", domElement);
       break;
+    }
 
-    case "textarea":
-      lastProps = getHostProps(domElement, lastRawProps);
-      nextProps = getHostProps(domElement, nextRawProps);
-      updatePayload = [];
+    case "details": {
+      // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the toggle event.
+      listenToNonDelegatedEvent("toggle", domElement);
       break;
+    }
 
+    case "embed":
+    case "source":
     case "img":
-    case "link":
+    case "link": {
+      // These are void elements that also need delegated events.
+      listenToNonDelegatedEvent("error", domElement);
+      listenToNonDelegatedEvent("load", domElement); // We fallthrough to the return of the void elements
+    }
+    // eslint-disable-next-line no-fallthrough
+
     case "area":
     case "base":
     case "br":
     case "col":
-    case "embed":
     case "hr":
     case "keygen":
     case "meta":
     case "param":
-    case "source":
     case "track":
     case "wbr":
     case "menuitem": {
-      if (
-        nextRawProps.children != null ||
-        nextRawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
+      // Void elements
+      for (var _propKey4 in props) {
+        if (!props.hasOwnProperty(_propKey4)) {
+          continue;
+        }
+
+        var _propValue4 = props[_propKey4];
+
+        if (_propValue4 == null) {
+          continue;
+        }
+
+        switch (_propKey4) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            // TODO: Can we make this a DEV warning to avoid this deny list?
+            throw new Error(
+              tag +
+                " is a void element tag and must neither have `children` nor " +
+                "use `dangerouslySetInnerHTML`."
+            );
+          }
+          // defaultChecked and defaultValue are ignored by setProp
+
+          default: {
+            // TODO: If the `is` prop is specified, this should go through the isCustomComponentTag flow.
+            setProp(domElement, tag, _propKey4, _propValue4, false, props);
+          }
+        }
       }
+
+      return;
     }
-    // eslint-disable-next-line no-fallthrough
+  }
 
-    default:
-      lastProps = lastRawProps;
-      nextProps = nextRawProps;
+  var isCustomComponentTag = isCustomComponent(tag, props);
 
-      if (
-        typeof lastProps.onClick !== "function" &&
-        typeof nextProps.onClick === "function"
-      ) {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
-      }
+  for (var _propKey5 in props) {
+    if (!props.hasOwnProperty(_propKey5)) {
+      continue;
+    }
 
-      break;
+    var _propValue5 = props[_propKey5];
+
+    if (_propValue5 == null) {
+      continue;
+    }
+
+    setProp(
+      domElement,
+      tag,
+      _propKey5,
+      _propValue5,
+      isCustomComponentTag,
+      props
+    );
   }
+} // Calculate the diff between the two objects.
 
+function diffProperties(domElement, tag, lastProps, nextProps) {
+  {
+    validatePropertiesInDevelopment(tag, nextProps);
+  }
+
+  var updatePayload = null;
   var propKey;
   var styleName;
   var styleUpdates = null;
@@ -7905,49 +7846,10 @@ function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
         break;
       }
 
-      case "dangerouslySetInnerHTML":
-      case "children": {
-        // Noop. This is handled by the clear text mechanism.
-        break;
-      }
-
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
-
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
-
-      case "autoFocus": {
-        // Noop. It doesn't work on updates anyway.
-        break;
-      }
-
-      case "innerText": // Properties
-
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
-        }
-
-      // eslint-disable-next-line no-fallthrough
-
       default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          // This is a special case. If any listener updates we need to ensure
-          // that the "current" fiber pointer gets updated so we need a commit
-          // to update this element.
-          if (!updatePayload) {
-            updatePayload = [];
-          }
-        } else {
-          // For all other deleted properties we add it to the queue. We use
-          // the allowed property list in the commit phase instead.
-          (updatePayload = updatePayload || []).push(propKey, null);
-        }
+        // For all other deleted properties we add it to the queue. We use
+        // the allowed property list in the commit phase instead.
+        (updatePayload = updatePayload || []).push(propKey, null);
       }
     }
   }
@@ -7957,237 +7859,258 @@ function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
     var lastProp = lastProps != null ? lastProps[propKey] : undefined;
 
     if (
-      !nextProps.hasOwnProperty(propKey) ||
-      nextProp === lastProp ||
-      (nextProp == null && lastProp == null)
+      nextProps.hasOwnProperty(propKey) &&
+      nextProp !== lastProp &&
+      (nextProp != null || lastProp != null)
     ) {
-      continue;
-    }
+      switch (propKey) {
+        case "style": {
+          if (lastProp) {
+            // Unset styles on `lastProp` but not on `nextProp`.
+            for (styleName in lastProp) {
+              if (
+                lastProp.hasOwnProperty(styleName) &&
+                (!nextProp || !nextProp.hasOwnProperty(styleName))
+              ) {
+                if (!styleUpdates) {
+                  styleUpdates = {};
+                }
 
-    switch (propKey) {
-      case "style": {
-        if (nextProp != null && typeof nextProp !== "object") {
-          throw new Error(
-            "The `style` prop expects a mapping from style properties to values, " +
-              "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
-              "using JSX."
-          );
-        }
+                styleUpdates[styleName] = "";
+              }
+            } // Update styles that changed since `lastProp`.
 
-        {
-          if (nextProp) {
-            // Freeze the next style object so that we can assume it won't be
-            // mutated. We have already warned for this in the past.
-            Object.freeze(nextProp);
-          }
-        }
+            for (styleName in nextProp) {
+              if (
+                nextProp.hasOwnProperty(styleName) &&
+                lastProp[styleName] !== nextProp[styleName]
+              ) {
+                if (!styleUpdates) {
+                  styleUpdates = {};
+                }
 
-        if (lastProp) {
-          // Unset styles on `lastProp` but not on `nextProp`.
-          for (styleName in lastProp) {
-            if (
-              lastProp.hasOwnProperty(styleName) &&
-              (!nextProp || !nextProp.hasOwnProperty(styleName))
-            ) {
-              if (!styleUpdates) {
-                styleUpdates = {};
+                styleUpdates[styleName] = nextProp[styleName];
               }
-
-              styleUpdates[styleName] = "";
             }
-          } // Update styles that changed since `lastProp`.
-
-          for (styleName in nextProp) {
-            if (
-              nextProp.hasOwnProperty(styleName) &&
-              lastProp[styleName] !== nextProp[styleName]
-            ) {
-              if (!styleUpdates) {
-                styleUpdates = {};
+          } else {
+            // Relies on `updateStylesByID` not mutating `styleUpdates`.
+            if (!styleUpdates) {
+              if (!updatePayload) {
+                updatePayload = [];
               }
 
-              styleUpdates[styleName] = nextProp[styleName];
-            }
-          }
-        } else {
-          // Relies on `updateStylesByID` not mutating `styleUpdates`.
-          if (!styleUpdates) {
-            if (!updatePayload) {
-              updatePayload = [];
+              updatePayload.push(propKey, styleUpdates);
             }
 
-            updatePayload.push(propKey, styleUpdates);
+            styleUpdates = nextProp;
           }
 
-          styleUpdates = nextProp;
+          break;
         }
 
-        break;
+        default: {
+          (updatePayload = updatePayload || []).push(propKey, nextProp);
+        }
       }
+    }
+  }
 
-      case "dangerouslySetInnerHTML": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "object" || !("__html" in nextProp)) {
-            throw new Error(
-              "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
-                "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
-                "for more information."
-            );
+  if (styleUpdates) {
+    {
+      validateShorthandPropertyCollisionInDev(styleUpdates, nextProps.style);
+    }
+
+    (updatePayload = updatePayload || []).push("style", styleUpdates);
+  }
+
+  return updatePayload;
+} // Apply the diff.
+
+function updateProperties(
+  domElement,
+  updatePayload,
+  tag,
+  lastProps,
+  nextProps
+) {
+  switch (tag) {
+    case "input": {
+      // Update checked *before* name.
+      // In the middle of an update, it is possible to have multiple checked.
+      // When a checked radio tries to change name, browser makes another radio's checked false.
+      if (nextProps.type === "radio" && nextProps.name != null) {
+        updateChecked(domElement, nextProps);
+      }
+
+      for (var i = 0; i < updatePayload.length; i += 2) {
+        var propKey = updatePayload[i];
+        var propValue = updatePayload[i + 1];
+
+        switch (propKey) {
+          case "checked": {
+            var node = domElement;
+            var checked =
+              propValue != null ? propValue : node._wrapperState.initialChecked;
+            node.checked =
+              !!checked &&
+              typeof checked !== "function" &&
+              checked !== "symbol";
+            break;
           }
 
-          var nextHtml = nextProp.__html;
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-          if (nextHtml != null) {
-            if (nextProps.children != null) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (propValue != null) {
               throw new Error(
-                "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
               );
             }
 
-            var lastHtml = lastProp ? lastProp.__html : undefined;
+            break;
+          }
+          // defaultChecked and defaultValue are ignored by setProp
 
-            if (lastHtml !== nextHtml) {
-              (updatePayload = updatePayload || []).push(propKey, nextHtml);
-            }
+          default: {
+            setProp(domElement, tag, propKey, propValue, false, nextProps);
           }
         }
+      } // Update the wrapper around inputs *after* updating props. This has to
+      // happen after updating the rest of props. Otherwise HTML5 input validations
+      // raise warnings and prevent the new value from being assigned.
 
-        break;
-      }
-
-      case "children": {
-        if (typeof nextProp === "string" || typeof nextProp === "number") {
-          (updatePayload = updatePayload || []).push(propKey, "" + nextProp);
-        }
+      updateWrapper$1(domElement, nextProps);
+      return;
+    }
 
-        break;
-      }
+    case "select": {
+      for (var _i = 0; _i < updatePayload.length; _i += 2) {
+        var _propKey6 = updatePayload[_i];
+        var _propValue6 = updatePayload[_i + 1];
 
-      case "onScroll": {
-        if (nextProp != null) {
-          // We eagerly listen to this even though we haven't committed yet.
-          if (typeof nextProp !== "function") {
-            warnForInvalidEventListener(propKey, nextProp);
+        switch (_propKey6) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
           }
+          // defaultValue are ignored by setProp
 
-          listenToNonDelegatedEvent("scroll", domElement);
+          default: {
+            setProp(domElement, tag, _propKey6, _propValue6, false, nextProps);
+          }
         }
+      } // <select> value update needs to occur after <option> children
+      // reconciliation
 
-        if (!updatePayload && lastProp !== nextProp) {
-          // This is a special case. If any listener updates we need to ensure
-          // that the "current" props pointer gets updated so we need a commit
-          // to update this element.
-          updatePayload = [];
-        }
+      postUpdateWrapper(domElement, nextProps);
+      return;
+    }
 
-        break;
-      }
+    case "textarea": {
+      for (var _i2 = 0; _i2 < updatePayload.length; _i2 += 2) {
+        var _propKey7 = updatePayload[_i2];
+        var _propValue7 = updatePayload[_i2 + 1];
 
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
+        switch (_propKey7) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
+          case "children": {
+            // TODO: This doesn't actually do anything if it updates.
+            break;
+          }
 
-      case "autoFocus": {
-        // Noop on updates
-        break;
-      }
+          case "dangerouslySetInnerHTML": {
+            if (_propValue7 != null) {
+              // TODO: Do we really need a special error message for this. It's also pretty blunt.
+              throw new Error(
+                "`dangerouslySetInnerHTML` does not make sense on <textarea>."
+              );
+            }
 
-      case "innerText": // Properties
+            break;
+          }
+          // defaultValue is ignored by setProp
 
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
+          default: {
+            setProp(domElement, tag, _propKey7, _propValue7, false, nextProps);
+          }
         }
+      }
 
-      // eslint-disable-next-line no-fallthrough
+      updateWrapper(domElement, nextProps);
+      return;
+    }
 
-      default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          if (nextProp != null) {
-            // We eagerly listen to this even though we haven't committed yet.
-            if (typeof nextProp !== "function") {
-              warnForInvalidEventListener(propKey, nextProp);
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem": {
+      // Void elements
+      for (var _i3 = 0; _i3 < updatePayload.length; _i3 += 2) {
+        var _propKey8 = updatePayload[_i3];
+        var _propValue8 = updatePayload[_i3 + 1];
+
+        switch (_propKey8) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (_propValue8 != null) {
+              // TODO: Can we make this a DEV warning to avoid this deny list?
+              throw new Error(
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
+              );
             }
+
+            break;
           }
+          // defaultChecked and defaultValue are ignored by setProp
 
-          if (!updatePayload && lastProp !== nextProp) {
-            // This is a special case. If any listener updates we need to ensure
-            // that the "current" props pointer gets updated so we need a commit
-            // to update this element.
-            updatePayload = [];
+          default: {
+            // TODO: If the `is` prop is specified, this should go through the isCustomComponentTag flow.
+            setProp(domElement, tag, _propKey8, _propValue8, false, nextProps);
           }
-        } else {
-          // For any other property we always add it to the queue and then we
-          // filter it out using the allowed property list during the commit.
-          (updatePayload = updatePayload || []).push(propKey, nextProp);
         }
       }
-    }
-  }
 
-  if (styleUpdates) {
-    {
-      validateShorthandPropertyCollisionInDev(styleUpdates, nextProps.style);
+      return;
     }
+  } // TODO: Handle wasCustomComponentTag. Changing "is" isn't valid.
+  // const wasCustomComponentTag = isCustomComponent(tag, lastProps);
 
-    (updatePayload = updatePayload || []).push("style", styleUpdates);
-  }
-
-  return updatePayload;
-} // Apply the diff.
+  var isCustomComponentTag = isCustomComponent(tag, nextProps); // Apply the diff.
 
-function updateProperties(
-  domElement,
-  updatePayload,
-  tag,
-  lastRawProps,
-  nextRawProps
-) {
-  // Update checked *before* name.
-  // In the middle of an update, it is possible to have multiple checked.
-  // When a checked radio tries to change name, browser makes another radio's checked false.
-  if (
-    tag === "input" &&
-    nextRawProps.type === "radio" &&
-    nextRawProps.name != null
-  ) {
-    updateChecked(domElement, nextRawProps);
-  }
-
-  var wasCustomComponentTag = isCustomComponent(tag, lastRawProps);
-  var isCustomComponentTag = isCustomComponent(tag, nextRawProps); // Apply the diff.
-
-  updateDOMProperties(
-    domElement,
-    updatePayload,
-    wasCustomComponentTag,
-    isCustomComponentTag
-  ); // TODO: Ensure that an update gets scheduled if any of the special props
-  // changed.
-
-  switch (tag) {
-    case "input":
-      // Update the wrapper around inputs *after* updating props. This has to
-      // happen after `updateDOMProperties`. Otherwise HTML5 input validations
-      // raise warnings and prevent the new value from being assigned.
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
-
-    case "select":
-      // <select> value update needs to occur after <option> children
-      // reconciliation
-      postUpdateWrapper(domElement, nextRawProps);
-      break;
+  for (var _i4 = 0; _i4 < updatePayload.length; _i4 += 2) {
+    var _propKey9 = updatePayload[_i4];
+    var _propValue9 = updatePayload[_i4 + 1];
+    setProp(
+      domElement,
+      tag,
+      _propKey9,
+      _propValue9,
+      isCustomComponentTag,
+      nextProps
+    );
   }
 }
 
@@ -8225,16 +8148,16 @@ function diffHydratedStyles(domElement, value) {
 function diffHydratedCustomComponent(
   domElement,
   tag,
-  rawProps,
+  props,
   parentNamespaceDev,
   extraAttributeNames
 ) {
-  for (var propKey in rawProps) {
-    if (!rawProps.hasOwnProperty(propKey)) {
+  for (var propKey in props) {
+    if (!props.hasOwnProperty(propKey)) {
       continue;
     }
 
-    var nextProp = rawProps[propKey];
+    var nextProp = props[propKey];
 
     if (nextProp == null) {
       continue;
@@ -8248,7 +8171,7 @@ function diffHydratedCustomComponent(
       continue;
     }
 
-    if (rawProps.suppressHydrationWarning === true) {
+    if (props.suppressHydrationWarning === true) {
       // Don't bother comparing. We're ignoring all these warnings.
       continue;
     } // Validate that the properties correspond to their expected values.
@@ -8336,16 +8259,16 @@ function diffHydratedCustomComponent(
 function diffHydratedGenericElement(
   domElement,
   tag,
-  rawProps,
+  props,
   parentNamespaceDev,
   extraAttributeNames
 ) {
-  for (var propKey in rawProps) {
-    if (!rawProps.hasOwnProperty(propKey)) {
+  for (var propKey in props) {
+    if (!props.hasOwnProperty(propKey)) {
       continue;
     }
 
-    var nextProp = rawProps[propKey];
+    var nextProp = props[propKey];
 
     if (nextProp == null) {
       continue;
@@ -8359,7 +8282,7 @@ function diffHydratedGenericElement(
       continue;
     }
 
-    if (rawProps.suppressHydrationWarning === true) {
+    if (props.suppressHydrationWarning === true) {
       // Don't bother comparing. We're ignoring all these warnings.
       continue;
     } // Validate that the properties correspond to their expected values.
@@ -8461,13 +8384,13 @@ function diffHydratedGenericElement(
 function diffHydratedProperties(
   domElement,
   tag,
-  rawProps,
+  props,
   isConcurrentMode,
   shouldWarnDev,
   parentNamespaceDev
 ) {
   {
-    validatePropertiesInDevelopment(tag, rawProps);
+    validatePropertiesInDevelopment(tag, props);
   } // TODO: Make sure that we check isMounted before firing any of these events.
 
   switch (tag) {
@@ -8516,37 +8439,46 @@ function diffHydratedProperties(
       break;
 
     case "input":
-      initWrapperState$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
-      listenToNonDelegatedEvent("invalid", domElement);
+      listenToNonDelegatedEvent("invalid", domElement); // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
+
+      track(domElement); // For input and textarea we current always set the value property at
+      // post mount to force it to diverge from attributes. However, for
+      // option and select we don't quite do the same thing and select
+      // is not resilient to the DOM state changing so we don't do that here.
+      // TODO: Consider not doing this for input and textarea.
+
+      postMountWrapper$3(domElement, props, true);
       break;
 
     case "option":
-      validateProps(domElement, rawProps);
+      validateProps(domElement, props);
       break;
 
     case "select":
-      initWrapperState$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState$1(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
       break;
 
     case "textarea":
-      initWrapperState(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-  }
+      listenToNonDelegatedEvent("invalid", domElement); // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
 
-  if (rawProps.hasOwnProperty("onScroll")) {
-    listenToNonDelegatedEvent("scroll", domElement);
+      track(domElement);
+      postMountWrapper(domElement);
+      break;
   }
 
   var updatePayload = null;
-  var children = rawProps.children; // For text content children we compare against textContent. This
+  var children = props.children; // For text content children we compare against textContent. This
   // might match additional HTML that is hidden when we read it using
   // textContent. E.g. "foo" will match "f<span>oo</span>" but that still
   // satisfies our requirement. Our requirement is not to produce perfect
@@ -8558,7 +8490,7 @@ function diffHydratedProperties(
 
   if (typeof children === "string" || typeof children === "number") {
     if (domElement.textContent !== "" + children) {
-      if (rawProps.suppressHydrationWarning !== true) {
+      if (props.suppressHydrationWarning !== true) {
         checkForUnmatchedText(
           domElement.textContent,
           children,
@@ -8573,12 +8505,21 @@ function diffHydratedProperties(
     }
   }
 
+  if (props.onScroll != null) {
+    listenToNonDelegatedEvent("scroll", domElement);
+  }
+
+  if (props.onClick != null) {
+    // TODO: This cast may not be sound for SVG, MathML or custom elements.
+    trapClickOnNonInteractiveElement(domElement);
+  }
+
   if (shouldWarnDev) {
     var extraAttributeNames = new Set();
     var attributes = domElement.attributes;
 
-    for (var _i = 0; _i < attributes.length; _i++) {
-      var name = attributes[_i].name.toLowerCase();
+    for (var _i5 = 0; _i5 < attributes.length; _i5++) {
+      var name = attributes[_i5].name.toLowerCase();
 
       switch (name) {
         // Controlled attributes are not validated
@@ -8595,15 +8536,15 @@ function diffHydratedProperties(
         default:
           // Intentionally use the original name.
           // See discussion in https://github.com/facebook/react/pull/10676.
-          extraAttributeNames.add(attributes[_i].name);
+          extraAttributeNames.add(attributes[_i5].name);
       }
     }
 
-    if (isCustomComponent(tag, rawProps)) {
+    if (isCustomComponent(tag, props)) {
       diffHydratedCustomComponent(
         domElement,
         tag,
-        rawProps,
+        props,
         parentNamespaceDev,
         extraAttributeNames
       );
@@ -8611,7 +8552,7 @@ function diffHydratedProperties(
       diffHydratedGenericElement(
         domElement,
         tag,
-        rawProps,
+        props,
         parentNamespaceDev,
         extraAttributeNames
       );
@@ -8619,45 +8560,12 @@ function diffHydratedProperties(
 
     if (
       extraAttributeNames.size > 0 &&
-      rawProps.suppressHydrationWarning !== true
+      props.suppressHydrationWarning !== true
     ) {
       warnForExtraAttributes(extraAttributeNames);
     }
   }
 
-  switch (tag) {
-    case "input":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, true);
-      break;
-
-    case "textarea":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-
-    case "select":
-    case "option":
-      // For input and textarea we current always set the value property at
-      // post mount to force it to diverge from attributes. However, for
-      // option and select we don't quite do the same thing and select
-      // is not resilient to the DOM state changing so we don't do that here.
-      // TODO: Consider not doing this for input and textarea.
-      break;
-
-    default:
-      if (typeof rawProps.onClick === "function") {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
-      }
-
-      break;
-  }
-
   return updatePayload;
 }
 function diffHydratedText(textNode, text, isConcurrentMode) {
@@ -39656,7 +39564,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-9a48e518";
+var ReactVersion = "18.3.0-www-classic-373670d7";
 
 function createPortal$1(
   children,
diff --git a/compiled/facebook-www/ReactDOM-dev.modern.js b/compiled/facebook-www/ReactDOM-dev.modern.js
index 1a1f9cd854128..7d7e40889b737 100644
--- a/compiled/facebook-www/ReactDOM-dev.modern.js
+++ b/compiled/facebook-www/ReactDOM-dev.modern.js
@@ -4358,17 +4358,6 @@ function isControlled(props) {
  * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
  */
 
-function getHostProps$2(element, props) {
-  var node = element;
-  var checked = props.checked;
-  var hostProps = assign({}, props, {
-    defaultChecked: undefined,
-    defaultValue: undefined,
-    value: undefined,
-    checked: checked != null ? checked : node._wrapperState.initialChecked
-  });
-  return hostProps;
-}
 function initWrapperState$2(element, props) {
   {
     checkControlledValueProps("input", props);
@@ -4414,9 +4403,13 @@ function initWrapperState$2(element, props) {
 
   var node = element;
   var defaultValue = props.defaultValue == null ? "" : props.defaultValue;
+  var initialChecked =
+    props.checked != null ? props.checked : props.defaultChecked;
   node._wrapperState = {
     initialChecked:
-      props.checked != null ? props.checked : props.defaultChecked,
+      typeof initialChecked !== "function" &&
+      typeof initialChecked !== "symbol" &&
+      !!initialChecked,
     initialValue: getToStringValue(
       props.value != null ? props.value : defaultValue
     ),
@@ -4602,19 +4595,20 @@ function postMountWrapper$3(element, props, isHydrating) {
 
   if (name !== "") {
     node.name = "";
+  } // The checked property never gets assigned. It must be manually set.
+  // We don't want to do this when hydrating so that existing user input isn't
+  // modified
+  // TODO: I'm pretty sure this is a bug because initialValueTracking won't be
+  // correct for the hydration case then.
+
+  if (!isHydrating) {
+    node.checked = !!node._wrapperState.initialChecked;
   }
 
   if (disableInputAttributeSyncing) {
-    // When not syncing the checked attribute, the checked property
-    // never gets assigned. It must be manually set. We don't want
-    // to do this when hydrating so that existing user input isn't
-    // modified
-    if (!isHydrating) {
-      updateChecked(element, props);
-    } // Only assign the checked attribute if it is defined. This saves
+    // Only assign the checked attribute if it is defined. This saves
     // a DOM write when controlling the checked attribute isn't needed
     // (text inputs, submit/reset)
-
     if (props.hasOwnProperty("defaultChecked")) {
       node.defaultChecked = !node.defaultChecked;
       node.defaultChecked = !!props.defaultChecked;
@@ -4899,11 +4893,6 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
  * selected.
  */
 
-function getHostProps$1(element, props) {
-  return assign({}, props, {
-    value: undefined
-  });
-}
 function initWrapperState$1(element, props) {
   var node = element;
 
@@ -4988,28 +4977,6 @@ var didWarnValDefaultVal = false;
  * `defaultValue` if specified, or the children content (deprecated).
  */
 
-function getHostProps(element, props) {
-  var node = element;
-
-  if (props.dangerouslySetInnerHTML != null) {
-    throw new Error(
-      "`dangerouslySetInnerHTML` does not make sense on <textarea>."
-    );
-  } // Always set children to the same thing. In IE9, the selection range will
-  // get reset if `textContent` is mutated.  We could add a check in setTextContent
-  // to only set the value if/when the value differs from the node value (which would
-  // completely solve this IE9 bug), but Sebastian+Sophie seemed to like this
-  // solution. The value can be a boolean or object so that's why it's forced
-  // to be a string.
-
-  var hostProps = assign({}, props, {
-    value: undefined,
-    defaultValue: undefined,
-    children: toString(node._wrapperState.initialValue)
-  });
-
-  return hostProps;
-}
 function initWrapperState(element, props) {
   var node = element;
 
@@ -5057,8 +5024,11 @@ function initWrapperState(element, props) {
     initialValue = defaultValue;
   }
 
+  var stringValue = getToStringValue(initialValue);
+  node.defaultValue = stringValue; // This will be toString:ed.
+
   node._wrapperState = {
-    initialValue: getToStringValue(initialValue)
+    initialValue: stringValue
   };
 }
 function updateWrapper(element, props) {
@@ -33705,7 +33675,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-c4381c45";
+var ReactVersion = "18.3.0-www-modern-0ad65545";
 
 function createPortal$1(
   children,
@@ -39147,189 +39117,146 @@ function trapClickOnNonInteractiveElement(node) {
   node.onclick = noop$1;
 }
 
-function setInitialDOMProperties(
-  tag,
-  domElement,
-  nextProps,
-  isCustomComponentTag
-) {
-  for (var propKey in nextProps) {
-    if (!nextProps.hasOwnProperty(propKey)) {
-      continue;
-    }
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style": {
+      if (value != null && typeof value !== "object") {
+        throw new Error(
+          "The `style` prop expects a mapping from style properties to values, " +
+            "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
+            "using JSX."
+        );
+      }
 
-    var nextProp = nextProps[propKey];
+      {
+        if (value) {
+          // Freeze the next style object so that we can assume it won't be
+          // mutated. We have already warned for this in the past.
+          Object.freeze(value);
+        }
+      } // Relies on `updateStylesByID` not mutating `styleUpdates`.
 
-    switch (propKey) {
-      case "style": {
-        if (nextProp != null && typeof nextProp !== "object") {
+      setValueForStyles(domElement, value);
+      break;
+    }
+
+    case "dangerouslySetInnerHTML": {
+      if (value != null) {
+        if (typeof value !== "object" || !("__html" in value)) {
           throw new Error(
-            "The `style` prop expects a mapping from style properties to values, " +
-              "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
-              "using JSX."
+            "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
+              "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
+              "for more information."
           );
         }
 
-        {
-          if (nextProp) {
-            // Freeze the next style object so that we can assume it won't be
-            // mutated. We have already warned for this in the past.
-            Object.freeze(nextProp);
-          }
-        } // Relies on `updateStylesByID` not mutating `styleUpdates`.
+        var nextHtml = value.__html;
 
-        setValueForStyles(domElement, nextProp);
-        break;
-      }
-
-      case "dangerouslySetInnerHTML": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "object" || !("__html" in nextProp)) {
+        if (nextHtml != null) {
+          if (props.children != null) {
             throw new Error(
-              "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
-                "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
-                "for more information."
+              "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
             );
           }
 
-          var nextHtml = nextProp.__html;
-
-          if (nextHtml != null) {
-            if (nextProps.children != null) {
-              throw new Error(
-                "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
-              );
-            }
-
-            if (disableIEWorkarounds) {
-              domElement.innerHTML = nextHtml;
-            } else {
-              setInnerHTML$1(domElement, nextHtml);
-            }
+          if (disableIEWorkarounds) {
+            domElement.innerHTML = nextHtml;
+          } else {
+            setInnerHTML$1(domElement, nextHtml);
           }
         }
-
-        break;
       }
 
-      case "children": {
-        if (typeof nextProp === "string") {
-          // Avoid setting initial textContent when the text is empty. In IE11 setting
-          // textContent on a <textarea> will cause the placeholder to not
-          // show within the <textarea> until it has been focused and blurred again.
-          // https://github.com/facebook/react/issues/6731#issuecomment-254874553
-          var canSetTextContent =
-            tag !== "body" && (tag !== "textarea" || nextProp !== "");
+      break;
+    }
 
-          if (canSetTextContent) {
-            setTextContent(domElement, nextProp);
-          }
-        } else if (typeof nextProp === "number") {
-          var _canSetTextContent = tag !== "body";
+    case "children": {
+      if (typeof value === "string") {
+        // Avoid setting initial textContent when the text is empty. In IE11 setting
+        // textContent on a <textarea> will cause the placeholder to not
+        // show within the <textarea> until it has been focused and blurred again.
+        // https://github.com/facebook/react/issues/6731#issuecomment-254874553
+        var canSetTextContent =
+          tag !== "body" && (tag !== "textarea" || value !== "");
 
-          if (_canSetTextContent) {
-            setTextContent(domElement, "" + nextProp);
-          }
+        if (canSetTextContent) {
+          setTextContent(domElement, value);
         }
+      } else if (typeof value === "number") {
+        var _canSetTextContent = tag !== "body";
 
-        break;
+        if (_canSetTextContent) {
+          setTextContent(domElement, "" + value);
+        }
       }
 
-      case "onScroll": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "function") {
-            warnForInvalidEventListener(propKey, nextProp);
-          }
+      break;
+    }
 
-          listenToNonDelegatedEvent("scroll", domElement);
+    case "onScroll": {
+      if (value != null) {
+        if (typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
         }
 
-        break;
+        listenToNonDelegatedEvent("scroll", domElement);
       }
 
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
+      break;
+    }
 
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
+    case "onClick": {
+      // TODO: This cast may not be sound for SVG, MathML or custom elements.
+      if (value != null) {
+        if (typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
+        }
 
-      case "autoFocus": {
-        // We polyfill it separately on the client during commit.
-        // We could have excluded it in the property list instead of
-        // adding a special case here, but then it wouldn't be emitted
-        // on server rendering (but we *do* want to emit it in SSR).
-        break;
+        trapClickOnNonInteractiveElement(domElement);
       }
 
-      case "innerText": // Properties
-
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
-        }
+      break;
+    }
 
-      // eslint-disable-next-line no-fallthrough
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue": // Reserved
 
-      default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          if (nextProp != null) {
-            if (typeof nextProp !== "function") {
-              warnForInvalidEventListener(propKey, nextProp);
-            }
-          }
-        } else if (nextProp != null) {
-          if (isCustomComponentTag) {
-            setValueForPropertyOnCustomComponent(domElement, propKey, nextProp);
-          } else {
-            setValueForProperty(domElement, propKey, nextProp);
-          }
-        }
-      }
+    case "defaultChecked":
+    case "innerHTML": {
+      // Noop
+      break;
     }
-  }
-}
-
-function updateDOMProperties(
-  domElement,
-  updatePayload,
-  wasCustomComponentTag,
-  isCustomComponentTag
-) {
-  // TODO: Handle wasCustomComponentTag
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i];
-    var propValue = updatePayload[i + 1];
 
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
+    case "autoFocus": {
+      // We polyfill it separately on the client during commit.
+      // We could have excluded it in the property list instead of
+      // adding a special case here, but then it wouldn't be emitted
+      // on server rendering (but we *do* want to emit it in SSR).
+      break;
+    }
 
-      case "dangerouslySetInnerHTML":
-        if (disableIEWorkarounds) {
-          domElement.innerHTML = propValue;
-        } else {
-          setInnerHTML$1(domElement, propValue);
-        }
+    case "innerText": // Properties
 
+    case "textContent":
+      if (enableCustomElementPropertySupport) {
         break;
+      }
 
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
+    // eslint-disable-next-line no-fallthrough
 
-      default:
+    default: {
+      if (registrationNameDependencies.hasOwnProperty(key)) {
+        if (value != null && typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
+        }
+      } else {
         if (isCustomComponentTag) {
-          setValueForPropertyOnCustomComponent(domElement, propKey, propValue);
+          setValueForPropertyOnCustomComponent(domElement, key, value);
         } else {
-          setValueForProperty(domElement, propKey, propValue);
+          setValueForProperty(domElement, key, value);
         }
-
-        break;
+      }
     }
   }
 } // creates a script element that won't execute
@@ -39460,291 +39387,305 @@ function createTextNode(text, rootContainerElement) {
     text
   );
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
-
+function setInitialProperties(domElement, tag, props) {
   {
-    validatePropertiesInDevelopment(tag, rawProps);
+    validatePropertiesInDevelopment(tag, props);
   } // TODO: Make sure that we check isMounted before firing any of these events.
 
-  var props;
-
   switch (tag) {
-    case "dialog":
-      listenToNonDelegatedEvent("cancel", domElement);
-      listenToNonDelegatedEvent("close", domElement);
-      props = rawProps;
-      break;
-
-    case "embed":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
-
-    // eslint-disable-next-line no-fallthrough
+    case "input": {
+      initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the invalid event.
 
-    case "iframe":
-    case "object":
-      // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the load event.
-      listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
-      break;
+      listenToNonDelegatedEvent("invalid", domElement);
 
-    case "video":
-    case "audio":
-      // We listen to these events in case to ensure emulated bubble
-      // listeners still fire for all the media events.
-      for (var i = 0; i < mediaEventTypes.length; i++) {
-        listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
-      }
+      for (var propKey in props) {
+        if (!props.hasOwnProperty(propKey)) {
+          continue;
+        }
 
-      props = rawProps;
-      break;
+        var propValue = props[propKey];
 
-    case "source":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      } // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the error event.
+        if (propValue == null) {
+          continue;
+        }
 
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
+        switch (propKey) {
+          case "checked": {
+            var node = domElement;
+            var checked =
+              propValue != null ? propValue : node._wrapperState.initialChecked;
+            node.checked =
+              !!checked &&
+              typeof checked !== "function" &&
+              checked !== "symbol";
+            break;
+          }
 
-    case "img":
-    case "link":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-    // eslint-disable-next-line no-fallthrough
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (propValue != null) {
+              throw new Error(
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
+              );
+            }
 
-    case "image":
-      // We listen to these events in case to ensure emulated bubble
-      // listeners still fire for error and load events.
-      listenToNonDelegatedEvent("error", domElement);
-      listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
-      break;
+            break;
+          }
+          // defaultChecked and defaultValue are ignored by setProp
 
-    case "details":
-      // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the toggle event.
-      listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
+          default: {
+            setProp(domElement, tag, propKey, propValue, false, props);
+          }
+        }
+      } // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
 
-    case "input":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
+      track(domElement);
+      postMountWrapper$3(domElement, props, false);
+      return;
+    }
 
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+    case "select": {
+      initWrapperState$1(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
-      break;
 
-    case "option":
-      validateProps(domElement, rawProps);
-      props = rawProps;
-      break;
+      for (var _propKey in props) {
+        if (!props.hasOwnProperty(_propKey)) {
+          continue;
+        }
 
-    case "select":
-      initWrapperState$1(domElement, rawProps);
-      props = getHostProps$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the invalid event.
+        var _propValue = props[_propKey];
 
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
+        if (_propValue == null) {
+          continue;
+        }
 
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+        switch (_propKey) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
+          // defaultValue are ignored by setProp
+
+          default: {
+            setProp(domElement, tag, _propKey, _propValue, false, props);
+          }
+        }
+      }
+
+      postMountWrapper$1(domElement, props);
+      return;
+    }
+
+    case "textarea": {
+      initWrapperState(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
-      break;
 
-    case "area":
-    case "base":
-    case "br":
-    case "col":
-    case "hr":
-    case "keygen":
-    case "meta":
-    case "param":
-    case "track":
-    case "wbr":
-    case "menuitem": {
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
-    }
-    // eslint-disable-next-line no-fallthrough
+      for (var _propKey2 in props) {
+        if (!props.hasOwnProperty(_propKey2)) {
+          continue;
+        }
 
-    default:
-      props = rawProps;
-  }
+        var _propValue2 = props[_propKey2];
 
-  setInitialDOMProperties(tag, domElement, props, isCustomComponentTag);
+        if (_propValue2 == null) {
+          continue;
+        }
 
-  switch (tag) {
-    case "input":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, false);
-      break;
+        switch (_propKey2) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-    case "textarea":
-      // TODO: Make sure we check if this is still unmounted or do any clean
+          case "children": {
+            // TODO: Handled by initWrapperState above.
+            break;
+          }
+
+          case "dangerouslySetInnerHTML": {
+            if (_propValue2 != null) {
+              // TODO: Do we really need a special error message for this. It's also pretty blunt.
+              throw new Error(
+                "`dangerouslySetInnerHTML` does not make sense on <textarea>."
+              );
+            }
+
+            break;
+          }
+          // defaultValue is ignored by setProp
+
+          default: {
+            setProp(domElement, tag, _propKey2, _propValue2, false, props);
+          }
+        }
+      } // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
+
       track(domElement);
       postMountWrapper(domElement);
-      break;
+      return;
+    }
 
-    case "option":
-      postMountWrapper$2(domElement, rawProps);
-      break;
+    case "option": {
+      validateProps(domElement, props);
 
-    case "select":
-      postMountWrapper$1(domElement, rawProps);
-      break;
+      for (var _propKey3 in props) {
+        if (!props.hasOwnProperty(_propKey3)) {
+          continue;
+        }
 
-    default:
-      if (typeof props.onClick === "function") {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
+        var _propValue3 = props[_propKey3];
+
+        if (_propValue3 == null) {
+          continue;
+        }
+
+        setProp(domElement, tag, _propKey3, _propValue3, false, props);
       }
 
-      break;
-  }
-} // Calculate the diff between the two objects.
+      postMountWrapper$2(domElement, props);
+      return;
+    }
 
-function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
-  {
-    validatePropertiesInDevelopment(tag, nextRawProps);
-  }
+    case "dialog": {
+      listenToNonDelegatedEvent("cancel", domElement);
+      listenToNonDelegatedEvent("close", domElement);
+      break;
+    }
 
-  var updatePayload = null;
-  var lastProps;
-  var nextProps;
+    case "iframe":
+    case "object": {
+      // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the load event.
+      listenToNonDelegatedEvent("load", domElement);
+      break;
+    }
 
-  switch (tag) {
-    case "input":
-      if (
-        nextRawProps.children != null ||
-        nextRawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
+    case "video":
+    case "audio": {
+      // We listen to these events in case to ensure emulated bubble
+      // listeners still fire for all the media events.
+      for (var i = 0; i < mediaEventTypes.length; i++) {
+        listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
       }
 
-      lastProps = getHostProps$2(domElement, lastRawProps);
-      nextProps = getHostProps$2(domElement, nextRawProps);
-      updatePayload = [];
       break;
+    }
 
-    case "select":
-      lastProps = getHostProps$1(domElement, lastRawProps);
-      nextProps = getHostProps$1(domElement, nextRawProps);
-      updatePayload = [];
+    case "image": {
+      // We listen to these events in case to ensure emulated bubble
+      // listeners still fire for error and load events.
+      listenToNonDelegatedEvent("error", domElement);
+      listenToNonDelegatedEvent("load", domElement);
       break;
+    }
 
-    case "textarea":
-      lastProps = getHostProps(domElement, lastRawProps);
-      nextProps = getHostProps(domElement, nextRawProps);
-      updatePayload = [];
+    case "details": {
+      // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the toggle event.
+      listenToNonDelegatedEvent("toggle", domElement);
       break;
+    }
 
+    case "embed":
+    case "source":
     case "img":
-    case "link":
+    case "link": {
+      // These are void elements that also need delegated events.
+      listenToNonDelegatedEvent("error", domElement);
+      listenToNonDelegatedEvent("load", domElement); // We fallthrough to the return of the void elements
+    }
+    // eslint-disable-next-line no-fallthrough
+
     case "area":
     case "base":
     case "br":
     case "col":
-    case "embed":
     case "hr":
     case "keygen":
     case "meta":
     case "param":
-    case "source":
     case "track":
     case "wbr":
     case "menuitem": {
-      if (
-        nextRawProps.children != null ||
-        nextRawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
+      // Void elements
+      for (var _propKey4 in props) {
+        if (!props.hasOwnProperty(_propKey4)) {
+          continue;
+        }
+
+        var _propValue4 = props[_propKey4];
+
+        if (_propValue4 == null) {
+          continue;
+        }
+
+        switch (_propKey4) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            // TODO: Can we make this a DEV warning to avoid this deny list?
+            throw new Error(
+              tag +
+                " is a void element tag and must neither have `children` nor " +
+                "use `dangerouslySetInnerHTML`."
+            );
+          }
+          // defaultChecked and defaultValue are ignored by setProp
+
+          default: {
+            // TODO: If the `is` prop is specified, this should go through the isCustomComponentTag flow.
+            setProp(domElement, tag, _propKey4, _propValue4, false, props);
+          }
+        }
       }
+
+      return;
     }
-    // eslint-disable-next-line no-fallthrough
+  }
 
-    default:
-      lastProps = lastRawProps;
-      nextProps = nextRawProps;
+  var isCustomComponentTag = isCustomComponent(tag, props);
 
-      if (
-        typeof lastProps.onClick !== "function" &&
-        typeof nextProps.onClick === "function"
-      ) {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
-      }
+  for (var _propKey5 in props) {
+    if (!props.hasOwnProperty(_propKey5)) {
+      continue;
+    }
 
-      break;
+    var _propValue5 = props[_propKey5];
+
+    if (_propValue5 == null) {
+      continue;
+    }
+
+    setProp(
+      domElement,
+      tag,
+      _propKey5,
+      _propValue5,
+      isCustomComponentTag,
+      props
+    );
   }
+} // Calculate the diff between the two objects.
 
+function diffProperties(domElement, tag, lastProps, nextProps) {
+  {
+    validatePropertiesInDevelopment(tag, nextProps);
+  }
+
+  var updatePayload = null;
   var propKey;
   var styleName;
   var styleUpdates = null;
@@ -39775,49 +39716,10 @@ function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
         break;
       }
 
-      case "dangerouslySetInnerHTML":
-      case "children": {
-        // Noop. This is handled by the clear text mechanism.
-        break;
-      }
-
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
-
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
-
-      case "autoFocus": {
-        // Noop. It doesn't work on updates anyway.
-        break;
-      }
-
-      case "innerText": // Properties
-
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
-        }
-
-      // eslint-disable-next-line no-fallthrough
-
       default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          // This is a special case. If any listener updates we need to ensure
-          // that the "current" fiber pointer gets updated so we need a commit
-          // to update this element.
-          if (!updatePayload) {
-            updatePayload = [];
-          }
-        } else {
-          // For all other deleted properties we add it to the queue. We use
-          // the allowed property list in the commit phase instead.
-          (updatePayload = updatePayload || []).push(propKey, null);
-        }
+        // For all other deleted properties we add it to the queue. We use
+        // the allowed property list in the commit phase instead.
+        (updatePayload = updatePayload || []).push(propKey, null);
       }
     }
   }
@@ -39827,237 +39729,258 @@ function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
     var lastProp = lastProps != null ? lastProps[propKey] : undefined;
 
     if (
-      !nextProps.hasOwnProperty(propKey) ||
-      nextProp === lastProp ||
-      (nextProp == null && lastProp == null)
+      nextProps.hasOwnProperty(propKey) &&
+      nextProp !== lastProp &&
+      (nextProp != null || lastProp != null)
     ) {
-      continue;
-    }
+      switch (propKey) {
+        case "style": {
+          if (lastProp) {
+            // Unset styles on `lastProp` but not on `nextProp`.
+            for (styleName in lastProp) {
+              if (
+                lastProp.hasOwnProperty(styleName) &&
+                (!nextProp || !nextProp.hasOwnProperty(styleName))
+              ) {
+                if (!styleUpdates) {
+                  styleUpdates = {};
+                }
 
-    switch (propKey) {
-      case "style": {
-        if (nextProp != null && typeof nextProp !== "object") {
-          throw new Error(
-            "The `style` prop expects a mapping from style properties to values, " +
-              "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
-              "using JSX."
-          );
-        }
+                styleUpdates[styleName] = "";
+              }
+            } // Update styles that changed since `lastProp`.
 
-        {
-          if (nextProp) {
-            // Freeze the next style object so that we can assume it won't be
-            // mutated. We have already warned for this in the past.
-            Object.freeze(nextProp);
-          }
-        }
+            for (styleName in nextProp) {
+              if (
+                nextProp.hasOwnProperty(styleName) &&
+                lastProp[styleName] !== nextProp[styleName]
+              ) {
+                if (!styleUpdates) {
+                  styleUpdates = {};
+                }
 
-        if (lastProp) {
-          // Unset styles on `lastProp` but not on `nextProp`.
-          for (styleName in lastProp) {
-            if (
-              lastProp.hasOwnProperty(styleName) &&
-              (!nextProp || !nextProp.hasOwnProperty(styleName))
-            ) {
-              if (!styleUpdates) {
-                styleUpdates = {};
+                styleUpdates[styleName] = nextProp[styleName];
               }
-
-              styleUpdates[styleName] = "";
             }
-          } // Update styles that changed since `lastProp`.
-
-          for (styleName in nextProp) {
-            if (
-              nextProp.hasOwnProperty(styleName) &&
-              lastProp[styleName] !== nextProp[styleName]
-            ) {
-              if (!styleUpdates) {
-                styleUpdates = {};
+          } else {
+            // Relies on `updateStylesByID` not mutating `styleUpdates`.
+            if (!styleUpdates) {
+              if (!updatePayload) {
+                updatePayload = [];
               }
 
-              styleUpdates[styleName] = nextProp[styleName];
-            }
-          }
-        } else {
-          // Relies on `updateStylesByID` not mutating `styleUpdates`.
-          if (!styleUpdates) {
-            if (!updatePayload) {
-              updatePayload = [];
+              updatePayload.push(propKey, styleUpdates);
             }
 
-            updatePayload.push(propKey, styleUpdates);
+            styleUpdates = nextProp;
           }
 
-          styleUpdates = nextProp;
+          break;
         }
 
-        break;
+        default: {
+          (updatePayload = updatePayload || []).push(propKey, nextProp);
+        }
       }
+    }
+  }
 
-      case "dangerouslySetInnerHTML": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "object" || !("__html" in nextProp)) {
-            throw new Error(
-              "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
-                "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
-                "for more information."
-            );
+  if (styleUpdates) {
+    {
+      validateShorthandPropertyCollisionInDev(styleUpdates, nextProps.style);
+    }
+
+    (updatePayload = updatePayload || []).push("style", styleUpdates);
+  }
+
+  return updatePayload;
+} // Apply the diff.
+
+function updateProperties(
+  domElement,
+  updatePayload,
+  tag,
+  lastProps,
+  nextProps
+) {
+  switch (tag) {
+    case "input": {
+      // Update checked *before* name.
+      // In the middle of an update, it is possible to have multiple checked.
+      // When a checked radio tries to change name, browser makes another radio's checked false.
+      if (nextProps.type === "radio" && nextProps.name != null) {
+        updateChecked(domElement, nextProps);
+      }
+
+      for (var i = 0; i < updatePayload.length; i += 2) {
+        var propKey = updatePayload[i];
+        var propValue = updatePayload[i + 1];
+
+        switch (propKey) {
+          case "checked": {
+            var node = domElement;
+            var checked =
+              propValue != null ? propValue : node._wrapperState.initialChecked;
+            node.checked =
+              !!checked &&
+              typeof checked !== "function" &&
+              checked !== "symbol";
+            break;
           }
 
-          var nextHtml = nextProp.__html;
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-          if (nextHtml != null) {
-            if (nextProps.children != null) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (propValue != null) {
               throw new Error(
-                "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
               );
             }
 
-            var lastHtml = lastProp ? lastProp.__html : undefined;
+            break;
+          }
+          // defaultChecked and defaultValue are ignored by setProp
 
-            if (lastHtml !== nextHtml) {
-              (updatePayload = updatePayload || []).push(propKey, nextHtml);
-            }
+          default: {
+            setProp(domElement, tag, propKey, propValue, false, nextProps);
           }
         }
+      } // Update the wrapper around inputs *after* updating props. This has to
+      // happen after updating the rest of props. Otherwise HTML5 input validations
+      // raise warnings and prevent the new value from being assigned.
 
-        break;
-      }
-
-      case "children": {
-        if (typeof nextProp === "string" || typeof nextProp === "number") {
-          (updatePayload = updatePayload || []).push(propKey, "" + nextProp);
-        }
+      updateWrapper$1(domElement, nextProps);
+      return;
+    }
 
-        break;
-      }
+    case "select": {
+      for (var _i = 0; _i < updatePayload.length; _i += 2) {
+        var _propKey6 = updatePayload[_i];
+        var _propValue6 = updatePayload[_i + 1];
 
-      case "onScroll": {
-        if (nextProp != null) {
-          // We eagerly listen to this even though we haven't committed yet.
-          if (typeof nextProp !== "function") {
-            warnForInvalidEventListener(propKey, nextProp);
+        switch (_propKey6) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
           }
+          // defaultValue are ignored by setProp
 
-          listenToNonDelegatedEvent("scroll", domElement);
+          default: {
+            setProp(domElement, tag, _propKey6, _propValue6, false, nextProps);
+          }
         }
+      } // <select> value update needs to occur after <option> children
+      // reconciliation
 
-        if (!updatePayload && lastProp !== nextProp) {
-          // This is a special case. If any listener updates we need to ensure
-          // that the "current" props pointer gets updated so we need a commit
-          // to update this element.
-          updatePayload = [];
-        }
+      postUpdateWrapper(domElement, nextProps);
+      return;
+    }
 
-        break;
-      }
+    case "textarea": {
+      for (var _i2 = 0; _i2 < updatePayload.length; _i2 += 2) {
+        var _propKey7 = updatePayload[_i2];
+        var _propValue7 = updatePayload[_i2 + 1];
 
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
+        switch (_propKey7) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
+          case "children": {
+            // TODO: This doesn't actually do anything if it updates.
+            break;
+          }
 
-      case "autoFocus": {
-        // Noop on updates
-        break;
-      }
+          case "dangerouslySetInnerHTML": {
+            if (_propValue7 != null) {
+              // TODO: Do we really need a special error message for this. It's also pretty blunt.
+              throw new Error(
+                "`dangerouslySetInnerHTML` does not make sense on <textarea>."
+              );
+            }
 
-      case "innerText": // Properties
+            break;
+          }
+          // defaultValue is ignored by setProp
 
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
+          default: {
+            setProp(domElement, tag, _propKey7, _propValue7, false, nextProps);
+          }
         }
+      }
 
-      // eslint-disable-next-line no-fallthrough
+      updateWrapper(domElement, nextProps);
+      return;
+    }
 
-      default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          if (nextProp != null) {
-            // We eagerly listen to this even though we haven't committed yet.
-            if (typeof nextProp !== "function") {
-              warnForInvalidEventListener(propKey, nextProp);
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem": {
+      // Void elements
+      for (var _i3 = 0; _i3 < updatePayload.length; _i3 += 2) {
+        var _propKey8 = updatePayload[_i3];
+        var _propValue8 = updatePayload[_i3 + 1];
+
+        switch (_propKey8) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (_propValue8 != null) {
+              // TODO: Can we make this a DEV warning to avoid this deny list?
+              throw new Error(
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
+              );
             }
+
+            break;
           }
+          // defaultChecked and defaultValue are ignored by setProp
 
-          if (!updatePayload && lastProp !== nextProp) {
-            // This is a special case. If any listener updates we need to ensure
-            // that the "current" props pointer gets updated so we need a commit
-            // to update this element.
-            updatePayload = [];
+          default: {
+            // TODO: If the `is` prop is specified, this should go through the isCustomComponentTag flow.
+            setProp(domElement, tag, _propKey8, _propValue8, false, nextProps);
           }
-        } else {
-          // For any other property we always add it to the queue and then we
-          // filter it out using the allowed property list during the commit.
-          (updatePayload = updatePayload || []).push(propKey, nextProp);
         }
       }
-    }
-  }
 
-  if (styleUpdates) {
-    {
-      validateShorthandPropertyCollisionInDev(styleUpdates, nextProps.style);
+      return;
     }
+  } // TODO: Handle wasCustomComponentTag. Changing "is" isn't valid.
+  // const wasCustomComponentTag = isCustomComponent(tag, lastProps);
 
-    (updatePayload = updatePayload || []).push("style", styleUpdates);
-  }
-
-  return updatePayload;
-} // Apply the diff.
+  var isCustomComponentTag = isCustomComponent(tag, nextProps); // Apply the diff.
 
-function updateProperties(
-  domElement,
-  updatePayload,
-  tag,
-  lastRawProps,
-  nextRawProps
-) {
-  // Update checked *before* name.
-  // In the middle of an update, it is possible to have multiple checked.
-  // When a checked radio tries to change name, browser makes another radio's checked false.
-  if (
-    tag === "input" &&
-    nextRawProps.type === "radio" &&
-    nextRawProps.name != null
-  ) {
-    updateChecked(domElement, nextRawProps);
-  }
-
-  var wasCustomComponentTag = isCustomComponent(tag, lastRawProps);
-  var isCustomComponentTag = isCustomComponent(tag, nextRawProps); // Apply the diff.
-
-  updateDOMProperties(
-    domElement,
-    updatePayload,
-    wasCustomComponentTag,
-    isCustomComponentTag
-  ); // TODO: Ensure that an update gets scheduled if any of the special props
-  // changed.
-
-  switch (tag) {
-    case "input":
-      // Update the wrapper around inputs *after* updating props. This has to
-      // happen after `updateDOMProperties`. Otherwise HTML5 input validations
-      // raise warnings and prevent the new value from being assigned.
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
-
-    case "select":
-      // <select> value update needs to occur after <option> children
-      // reconciliation
-      postUpdateWrapper(domElement, nextRawProps);
-      break;
+  for (var _i4 = 0; _i4 < updatePayload.length; _i4 += 2) {
+    var _propKey9 = updatePayload[_i4];
+    var _propValue9 = updatePayload[_i4 + 1];
+    setProp(
+      domElement,
+      tag,
+      _propKey9,
+      _propValue9,
+      isCustomComponentTag,
+      nextProps
+    );
   }
 }
 
@@ -40095,16 +40018,16 @@ function diffHydratedStyles(domElement, value) {
 function diffHydratedCustomComponent(
   domElement,
   tag,
-  rawProps,
+  props,
   parentNamespaceDev,
   extraAttributeNames
 ) {
-  for (var propKey in rawProps) {
-    if (!rawProps.hasOwnProperty(propKey)) {
+  for (var propKey in props) {
+    if (!props.hasOwnProperty(propKey)) {
       continue;
     }
 
-    var nextProp = rawProps[propKey];
+    var nextProp = props[propKey];
 
     if (nextProp == null) {
       continue;
@@ -40118,7 +40041,7 @@ function diffHydratedCustomComponent(
       continue;
     }
 
-    if (rawProps.suppressHydrationWarning === true) {
+    if (props.suppressHydrationWarning === true) {
       // Don't bother comparing. We're ignoring all these warnings.
       continue;
     } // Validate that the properties correspond to their expected values.
@@ -40206,16 +40129,16 @@ function diffHydratedCustomComponent(
 function diffHydratedGenericElement(
   domElement,
   tag,
-  rawProps,
+  props,
   parentNamespaceDev,
   extraAttributeNames
 ) {
-  for (var propKey in rawProps) {
-    if (!rawProps.hasOwnProperty(propKey)) {
+  for (var propKey in props) {
+    if (!props.hasOwnProperty(propKey)) {
       continue;
     }
 
-    var nextProp = rawProps[propKey];
+    var nextProp = props[propKey];
 
     if (nextProp == null) {
       continue;
@@ -40229,7 +40152,7 @@ function diffHydratedGenericElement(
       continue;
     }
 
-    if (rawProps.suppressHydrationWarning === true) {
+    if (props.suppressHydrationWarning === true) {
       // Don't bother comparing. We're ignoring all these warnings.
       continue;
     } // Validate that the properties correspond to their expected values.
@@ -40331,13 +40254,13 @@ function diffHydratedGenericElement(
 function diffHydratedProperties(
   domElement,
   tag,
-  rawProps,
+  props,
   isConcurrentMode,
   shouldWarnDev,
   parentNamespaceDev
 ) {
   {
-    validatePropertiesInDevelopment(tag, rawProps);
+    validatePropertiesInDevelopment(tag, props);
   } // TODO: Make sure that we check isMounted before firing any of these events.
 
   switch (tag) {
@@ -40386,37 +40309,46 @@ function diffHydratedProperties(
       break;
 
     case "input":
-      initWrapperState$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
-      listenToNonDelegatedEvent("invalid", domElement);
+      listenToNonDelegatedEvent("invalid", domElement); // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
+
+      track(domElement); // For input and textarea we current always set the value property at
+      // post mount to force it to diverge from attributes. However, for
+      // option and select we don't quite do the same thing and select
+      // is not resilient to the DOM state changing so we don't do that here.
+      // TODO: Consider not doing this for input and textarea.
+
+      postMountWrapper$3(domElement, props, true);
       break;
 
     case "option":
-      validateProps(domElement, rawProps);
+      validateProps(domElement, props);
       break;
 
     case "select":
-      initWrapperState$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState$1(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
       break;
 
     case "textarea":
-      initWrapperState(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-  }
+      listenToNonDelegatedEvent("invalid", domElement); // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
 
-  if (rawProps.hasOwnProperty("onScroll")) {
-    listenToNonDelegatedEvent("scroll", domElement);
+      track(domElement);
+      postMountWrapper(domElement);
+      break;
   }
 
   var updatePayload = null;
-  var children = rawProps.children; // For text content children we compare against textContent. This
+  var children = props.children; // For text content children we compare against textContent. This
   // might match additional HTML that is hidden when we read it using
   // textContent. E.g. "foo" will match "f<span>oo</span>" but that still
   // satisfies our requirement. Our requirement is not to produce perfect
@@ -40428,7 +40360,7 @@ function diffHydratedProperties(
 
   if (typeof children === "string" || typeof children === "number") {
     if (domElement.textContent !== "" + children) {
-      if (rawProps.suppressHydrationWarning !== true) {
+      if (props.suppressHydrationWarning !== true) {
         checkForUnmatchedText(
           domElement.textContent,
           children,
@@ -40443,12 +40375,21 @@ function diffHydratedProperties(
     }
   }
 
+  if (props.onScroll != null) {
+    listenToNonDelegatedEvent("scroll", domElement);
+  }
+
+  if (props.onClick != null) {
+    // TODO: This cast may not be sound for SVG, MathML or custom elements.
+    trapClickOnNonInteractiveElement(domElement);
+  }
+
   if (shouldWarnDev) {
     var extraAttributeNames = new Set();
     var attributes = domElement.attributes;
 
-    for (var _i = 0; _i < attributes.length; _i++) {
-      var name = attributes[_i].name.toLowerCase();
+    for (var _i5 = 0; _i5 < attributes.length; _i5++) {
+      var name = attributes[_i5].name.toLowerCase();
 
       switch (name) {
         // Controlled attributes are not validated
@@ -40465,15 +40406,15 @@ function diffHydratedProperties(
         default:
           // Intentionally use the original name.
           // See discussion in https://github.com/facebook/react/pull/10676.
-          extraAttributeNames.add(attributes[_i].name);
+          extraAttributeNames.add(attributes[_i5].name);
       }
     }
 
-    if (isCustomComponent(tag, rawProps)) {
+    if (isCustomComponent(tag, props)) {
       diffHydratedCustomComponent(
         domElement,
         tag,
-        rawProps,
+        props,
         parentNamespaceDev,
         extraAttributeNames
       );
@@ -40481,7 +40422,7 @@ function diffHydratedProperties(
       diffHydratedGenericElement(
         domElement,
         tag,
-        rawProps,
+        props,
         parentNamespaceDev,
         extraAttributeNames
       );
@@ -40489,45 +40430,12 @@ function diffHydratedProperties(
 
     if (
       extraAttributeNames.size > 0 &&
-      rawProps.suppressHydrationWarning !== true
+      props.suppressHydrationWarning !== true
     ) {
       warnForExtraAttributes(extraAttributeNames);
     }
   }
 
-  switch (tag) {
-    case "input":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, true);
-      break;
-
-    case "textarea":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-
-    case "select":
-    case "option":
-      // For input and textarea we current always set the value property at
-      // post mount to force it to diverge from attributes. However, for
-      // option and select we don't quite do the same thing and select
-      // is not resilient to the DOM state changing so we don't do that here.
-      // TODO: Consider not doing this for input and textarea.
-      break;
-
-    default:
-      if (typeof rawProps.onClick === "function") {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
-      }
-
-      break;
-  }
-
   return updatePayload;
 }
 function diffHydratedText(textNode, text, isConcurrentMode) {
diff --git a/compiled/facebook-www/ReactDOM-prod.classic.js b/compiled/facebook-www/ReactDOM-prod.classic.js
index 28120524a4b30..84dd353f1efaa 100644
--- a/compiled/facebook-www/ReactDOM-prod.classic.js
+++ b/compiled/facebook-www/ReactDOM-prod.classic.js
@@ -910,149 +910,8 @@ properties.formAction = new PropertyInfoRecord(
   );
 });
 var isJavaScriptProtocol =
-  /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i;
-function setValueForProperty(node, name, value) {
-  if (
-    !(2 < name.length) ||
-    ("o" !== name[0] && "O" !== name[0]) ||
-    ("n" !== name[1] && "N" !== name[1])
-  ) {
-    var JSCompiler_inline_result = properties.hasOwnProperty(name)
-      ? properties[name]
-      : null;
-    if (null !== JSCompiler_inline_result)
-      if (JSCompiler_inline_result.mustUseProperty)
-        node[JSCompiler_inline_result.propertyName] =
-          value && "function" !== typeof value && "symbol" !== typeof value;
-      else if (
-        ((name = JSCompiler_inline_result.attributeName), null === value)
-      )
-        node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (!JSCompiler_inline_result.acceptsBooleans) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        if (JSCompiler_inline_result.removeEmptyString && "" === value)
-          node.removeAttribute(name);
-        else
-          switch (JSCompiler_inline_result.type) {
-            case 3:
-              value ? node.setAttribute(name, "") : node.removeAttribute(name);
-              break;
-            case 4:
-              !0 === value
-                ? node.setAttribute(name, "")
-                : !1 === value
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 5:
-              isNaN(value)
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 6:
-              !isNaN(value) && 1 <= value
-                ? node.setAttribute(name, value)
-                : node.removeAttribute(name);
-              break;
-            default:
-              value = enableTrustedTypesIntegration ? value : "" + value;
-              if (
-                JSCompiler_inline_result.sanitizeURL &&
-                isJavaScriptProtocol.test(value.toString())
-              )
-                throw Error(formatProdErrorMessage(323));
-              (JSCompiler_inline_result =
-                JSCompiler_inline_result.attributeNamespace)
-                ? node.setAttributeNS(JSCompiler_inline_result, name, value)
-                : node.setAttribute(name, value);
-          }
-      }
-    else if (isAttributeNameSafe(name))
-      if (null === value) node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (
-              ((JSCompiler_inline_result = name.toLowerCase().slice(0, 5)),
-              "data-" !== JSCompiler_inline_result &&
-                "aria-" !== JSCompiler_inline_result)
-            ) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        node.setAttribute(
-          name,
-          enableTrustedTypesIntegration ? value : "" + value
-        );
-      }
-  }
-}
-function setValueForPropertyOnCustomComponent(node, name, value) {
-  if (
-    enableCustomElementPropertySupport &&
-    "o" === name[0] &&
-    "n" === name[1]
-  ) {
-    var useCapture = name.endsWith("Capture"),
-      eventName = name.substr(2, useCapture ? name.length - 9 : void 0),
-      prevProps = getFiberCurrentPropsFromNode(node);
-    prevProps = null != prevProps ? prevProps[name] : null;
-    "function" === typeof prevProps &&
-      node.removeEventListener(eventName, prevProps, useCapture);
-    if ("function" === typeof value) {
-      "function" !== typeof prevProps &&
-        null !== prevProps &&
-        (name in node
-          ? (node[name] = null)
-          : node.hasAttribute(name) && node.removeAttribute(name));
-      node.addEventListener(eventName, value, useCapture);
-      return;
-    }
-  }
-  if (enableCustomElementPropertySupport && name in node) node[name] = value;
-  else if (isAttributeNameSafe(name))
-    if (null === value) node.removeAttribute(name);
-    else {
-      switch (typeof value) {
-        case "undefined":
-        case "function":
-        case "symbol":
-          node.removeAttribute(name);
-          return;
-        case "boolean":
-          if (enableCustomElementPropertySupport) {
-            if (!0 === value) {
-              node.setAttribute(name, "");
-              return;
-            }
-            node.removeAttribute(name);
-            return;
-          }
-      }
-      node.setAttribute(
-        name,
-        enableTrustedTypesIntegration ? value : "" + value
-      );
-    }
-}
-var prefix;
+    /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i,
+  prefix;
 function describeBuiltInComponentFrame(name) {
   if (void 0 === prefix)
     try {
@@ -1254,24 +1113,18 @@ function getActiveElement(doc) {
     return doc.body;
   }
 }
-function getHostProps$2(element, props) {
-  var checked = props.checked;
-  return assign({}, props, {
-    defaultChecked: void 0,
-    defaultValue: void 0,
-    value: void 0,
-    checked: null != checked ? checked : element._wrapperState.initialChecked
-  });
-}
 function initWrapperState$2(element, props) {
   var defaultValue = null == props.defaultValue ? "" : props.defaultValue,
-    JSCompiler_temp_const =
+    initialChecked =
       null != props.checked ? props.checked : props.defaultChecked;
   defaultValue = getToStringValue(
     null != props.value ? props.value : defaultValue
   );
   element._wrapperState = {
-    initialChecked: JSCompiler_temp_const,
+    initialChecked:
+      "function" !== typeof initialChecked &&
+      "symbol" !== typeof initialChecked &&
+      !!initialChecked,
     initialValue: defaultValue,
     controlled:
       "checkbox" === props.type || "radio" === props.type
@@ -1279,19 +1132,16 @@ function initWrapperState$2(element, props) {
         : null != props.value
   };
 }
-function updateChecked(element, props) {
-  props = props.checked;
-  null != props && (element.checked = props);
-}
 function updateWrapper$1(element, props) {
-  updateChecked(element, props);
-  var value = getToStringValue(props.value),
-    type = props.type;
-  if (null != value)
+  var checked = props.checked;
+  null != checked && (element.checked = checked);
+  checked = getToStringValue(props.value);
+  var type = props.type;
+  if (null != checked)
     if ("number" === type) {
-      if ((0 === value && "" === element.value) || element.value != value)
-        element.value = "" + value;
-    } else element.value !== "" + value && (element.value = "" + value);
+      if ((0 === checked && "" === element.value) || element.value != checked)
+        element.value = "" + checked;
+    } else element.value !== "" + checked && (element.value = "" + checked);
   else if ("submit" === type || "reset" === type) {
     element.removeAttribute("value");
     return;
@@ -1300,7 +1150,7 @@ function updateWrapper$1(element, props) {
     ? props.hasOwnProperty("defaultValue") &&
       setDefaultValue(element, props.type, getToStringValue(props.defaultValue))
     : props.hasOwnProperty("value")
-    ? setDefaultValue(element, props.type, value)
+    ? setDefaultValue(element, props.type, checked)
     : props.hasOwnProperty("defaultValue") &&
       setDefaultValue(
         element,
@@ -1338,11 +1188,11 @@ function postMountWrapper$3(element, props, isHydrating) {
   }
   type = element.name;
   "" !== type && (element.name = "");
+  isHydrating || (element.checked = !!element._wrapperState.initialChecked);
   disableInputAttributeSyncing
-    ? (isHydrating || updateChecked(element, props),
-      props.hasOwnProperty("defaultChecked") &&
-        ((element.defaultChecked = !element.defaultChecked),
-        (element.defaultChecked = !!props.defaultChecked)))
+    ? props.hasOwnProperty("defaultChecked") &&
+      ((element.defaultChecked = !element.defaultChecked),
+      (element.defaultChecked = !!props.defaultChecked))
     : (element.defaultChecked = !!element._wrapperState.initialChecked);
   "" !== type && (element.name = type);
 }
@@ -1377,15 +1227,6 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
     null !== multiple && (multiple.selected = !0);
   }
 }
-function getHostProps(element, props) {
-  if (null != props.dangerouslySetInnerHTML)
-    throw Error(formatProdErrorMessage(91));
-  return assign({}, props, {
-    value: void 0,
-    defaultValue: void 0,
-    children: "" + element._wrapperState.initialValue
-  });
-}
 function initWrapperState(element, props) {
   var initialValue = props.value;
   if (null == initialValue) {
@@ -1402,7 +1243,9 @@ function initWrapperState(element, props) {
     null == props && (props = "");
     initialValue = props;
   }
-  element._wrapperState = { initialValue: getToStringValue(initialValue) };
+  props = getToStringValue(initialValue);
+  element.defaultValue = props;
+  element._wrapperState = { initialValue: props };
 }
 function updateWrapper(element, props) {
   var value = getToStringValue(props.value),
@@ -1534,30 +1377,6 @@ Object.keys(isUnitlessNumber).forEach(function (prop) {
     isUnitlessNumber[prefix] = isUnitlessNumber[prop];
   });
 });
-function setValueForStyles(node, styles) {
-  node = node.style;
-  for (var styleName in styles)
-    if (styles.hasOwnProperty(styleName)) {
-      var value = styles[styleName],
-        isCustomProperty = 0 === styleName.indexOf("--");
-      null == value || "boolean" === typeof value || "" === value
-        ? isCustomProperty
-          ? node.setProperty(styleName, "")
-          : "float" === styleName
-          ? (node.cssFloat = "")
-          : (node[styleName] = "")
-        : isCustomProperty
-        ? node.setProperty(styleName, value)
-        : "number" !== typeof value ||
-          0 === value ||
-          (isUnitlessNumber.hasOwnProperty(styleName) &&
-            isUnitlessNumber[styleName])
-        ? "float" === styleName
-          ? (node.cssFloat = value)
-          : (node[styleName] = ("" + value).trim())
-        : (node[styleName] = value + "px");
-    }
-}
 function isCustomComponent(tagName, props) {
   if (-1 === tagName.indexOf("-")) return "string" === typeof props.is;
   switch (tagName) {
@@ -1587,72 +1406,339 @@ function getOwnerDocumentFromRootContainer(rootContainerElement) {
     : rootContainerElement.ownerDocument;
 }
 function noop$2() {}
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style":
+      if (null != value && "object" !== typeof value)
+        throw Error(formatProdErrorMessage(62));
+      domElement = domElement.style;
+      for (var styleName in value)
+        value.hasOwnProperty(styleName) &&
+          ((key = value[styleName]),
+          (props = 0 === styleName.indexOf("--")),
+          null == key || "boolean" === typeof key || "" === key
+            ? props
+              ? domElement.setProperty(styleName, "")
+              : "float" === styleName
+              ? (domElement.cssFloat = "")
+              : (domElement[styleName] = "")
+            : props
+            ? domElement.setProperty(styleName, key)
+            : "number" !== typeof key ||
+              0 === key ||
+              (isUnitlessNumber.hasOwnProperty(styleName) &&
+                isUnitlessNumber[styleName])
+            ? "float" === styleName
+              ? (domElement.cssFloat = key)
+              : (domElement[styleName] = ("" + key).trim())
+            : (domElement[styleName] = key + "px"));
+      break;
+    case "dangerouslySetInnerHTML":
+      if (null != value) {
+        if ("object" !== typeof value || !("__html" in value))
+          throw Error(formatProdErrorMessage(61));
+        value = value.__html;
+        if (null != value) {
+          if (null != props.children) throw Error(formatProdErrorMessage(60));
+          disableIEWorkarounds
+            ? (domElement.innerHTML = value)
+            : setInnerHTML$1(domElement, value);
+        }
+      }
+      break;
+    case "children":
+      "string" === typeof value
+        ? "body" === tag ||
+          ("textarea" === tag && "" === value) ||
+          setTextContent(domElement, value)
+        : "number" === typeof value &&
+          "body" !== tag &&
+          setTextContent(domElement, "" + value);
+      break;
+    case "onScroll":
+      null != value && listenToNonDelegatedEvent("scroll", domElement);
+      break;
+    case "onClick":
+      null != value && (domElement.onclick = noop$2);
+      break;
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue":
+    case "defaultChecked":
+    case "innerHTML":
+      break;
+    case "autoFocus":
+      break;
+    case "innerText":
+    case "textContent":
+      if (enableCustomElementPropertySupport) break;
+    default:
+      if (!registrationNameDependencies.hasOwnProperty(key))
+        if (isCustomComponentTag)
+          a: {
+            if (
+              enableCustomElementPropertySupport &&
+              "o" === key[0] &&
+              "n" === key[1] &&
+              ((styleName = key.endsWith("Capture")),
+              (props = key.substr(2, styleName ? key.length - 9 : void 0)),
+              (tag = getFiberCurrentPropsFromNode(domElement)),
+              (tag = null != tag ? tag[key] : null),
+              "function" === typeof tag &&
+                domElement.removeEventListener(props, tag, styleName),
+              "function" === typeof value)
+            ) {
+              "function" !== typeof tag &&
+                null !== tag &&
+                (key in domElement
+                  ? (domElement[key] = null)
+                  : domElement.hasAttribute(key) &&
+                    domElement.removeAttribute(key));
+              domElement.addEventListener(props, value, styleName);
+              break a;
+            }
+            if (enableCustomElementPropertySupport && key in domElement)
+              domElement[key] = value;
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (enableCustomElementPropertySupport) {
+                      if (!0 === value) {
+                        domElement.setAttribute(key, "");
+                        break a;
+                      }
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+          }
+        else
+          a: if (
+            !(2 < key.length) ||
+            ("o" !== key[0] && "O" !== key[0]) ||
+            ("n" !== key[1] && "N" !== key[1])
+          )
+            if (
+              ((styleName = properties.hasOwnProperty(key)
+                ? properties[key]
+                : null),
+              null !== styleName)
+            )
+              if (styleName.mustUseProperty)
+                domElement[styleName.propertyName] =
+                  value &&
+                  "function" !== typeof value &&
+                  "symbol" !== typeof value;
+              else if (((key = styleName.attributeName), null === value))
+                domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (!styleName.acceptsBooleans) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                if (styleName.removeEmptyString && "" === value)
+                  domElement.removeAttribute(key);
+                else
+                  switch (styleName.type) {
+                    case 3:
+                      value
+                        ? domElement.setAttribute(key, "")
+                        : domElement.removeAttribute(key);
+                      break;
+                    case 4:
+                      !0 === value
+                        ? domElement.setAttribute(key, "")
+                        : !1 === value
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 5:
+                      isNaN(value)
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 6:
+                      !isNaN(value) && 1 <= value
+                        ? domElement.setAttribute(key, value)
+                        : domElement.removeAttribute(key);
+                      break;
+                    default:
+                      value = enableTrustedTypesIntegration
+                        ? value
+                        : "" + value;
+                      if (
+                        styleName.sanitizeURL &&
+                        isJavaScriptProtocol.test(value.toString())
+                      )
+                        throw Error(formatProdErrorMessage(323));
+                      (styleName = styleName.attributeNamespace)
+                        ? domElement.setAttributeNS(styleName, key, value)
+                        : domElement.setAttribute(key, value);
+                  }
+              }
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (
+                      ((styleName = key.toLowerCase().slice(0, 5)),
+                      "data-" !== styleName && "aria-" !== styleName)
+                    ) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+  }
+}
 function createHTMLElement(type, props, ownerDocument) {
   return "string" === typeof props.is
     ? ownerDocument.createElement(type, { is: props.is })
     : ownerDocument.createElement(type);
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
+function setInitialProperties(domElement, tag, props) {
   switch (tag) {
+    case "input":
+      initWrapperState$2(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey in props)
+        if (props.hasOwnProperty(propKey)) {
+          var propValue = props[propKey];
+          if (null != propValue)
+            switch (propKey) {
+              case "checked":
+                var node = domElement;
+                propValue =
+                  null != propValue
+                    ? propValue
+                    : node._wrapperState.initialChecked;
+                node.checked =
+                  !!propValue &&
+                  "function" !== typeof propValue &&
+                  "symbol" !== propValue;
+                break;
+              case "value":
+                break;
+              case "children":
+              case "dangerouslySetInnerHTML":
+                if (null != propValue)
+                  throw Error(formatProdErrorMessage(137, tag));
+                break;
+              default:
+                setProp(domElement, tag, propKey, propValue, !1, props);
+            }
+        }
+      track(domElement);
+      postMountWrapper$3(domElement, props, !1);
+      return;
+    case "select":
+      domElement._wrapperState = { wasMultiple: !!props.multiple };
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (propValue in props)
+        if (
+          props.hasOwnProperty(propValue) &&
+          ((propKey = props[propValue]), null != propKey)
+        )
+          switch (propValue) {
+            case "value":
+              break;
+            default:
+              setProp(domElement, tag, propValue, propKey, !1, props);
+          }
+      domElement.multiple = !!props.multiple;
+      tag = props.value;
+      null != tag
+        ? updateOptions(domElement, !!props.multiple, tag, !1)
+        : null != props.defaultValue &&
+          updateOptions(domElement, !!props.multiple, props.defaultValue, !0);
+      return;
+    case "textarea":
+      initWrapperState(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey$19 in props)
+        if (
+          props.hasOwnProperty(propKey$19) &&
+          ((propKey = props[propKey$19]), null != propKey)
+        )
+          switch (propKey$19) {
+            case "value":
+              break;
+            case "children":
+              break;
+            case "dangerouslySetInnerHTML":
+              if (null != propKey) throw Error(formatProdErrorMessage(91));
+              break;
+            default:
+              setProp(domElement, tag, propKey$19, propKey, !1, props);
+          }
+      track(domElement);
+      postMountWrapper(domElement);
+      return;
+    case "option":
+      for (var propKey$21 in props)
+        props.hasOwnProperty(propKey$21) &&
+          ((propKey = props[propKey$21]),
+          null != propKey &&
+            setProp(domElement, tag, propKey$21, propKey, !1, props));
+      null != props.value &&
+        domElement.setAttribute("value", "" + getToStringValue(props.value));
+      return;
     case "dialog":
       listenToNonDelegatedEvent("cancel", domElement);
       listenToNonDelegatedEvent("close", domElement);
-      var props = rawProps;
       break;
-    case "embed":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "iframe":
     case "object":
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "video":
     case "audio":
-      for (props = 0; props < mediaEventTypes.length; props++)
-        listenToNonDelegatedEvent(mediaEventTypes[props], domElement);
-      props = rawProps;
+      for (propKey = 0; propKey < mediaEventTypes.length; propKey++)
+        listenToNonDelegatedEvent(mediaEventTypes[propKey], domElement);
       break;
-    case "source":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
-    case "img":
-    case "link":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "image":
       listenToNonDelegatedEvent("error", domElement);
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "details":
       listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
-    case "input":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "option":
-      props = rawProps;
-      break;
-    case "select":
-      domElement._wrapperState = { wasMultiple: !!rawProps.multiple };
-      props = assign({}, rawProps, { value: void 0 });
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
       break;
+    case "embed":
+    case "source":
+    case "img":
+    case "link":
+      listenToNonDelegatedEvent("error", domElement),
+        listenToNonDelegatedEvent("load", domElement);
     case "area":
     case "base":
     case "br":
@@ -1664,163 +1750,159 @@ function setInitialProperties(domElement, tag, rawProps) {
     case "track":
     case "wbr":
     case "menuitem":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-    default:
-      props = rawProps;
-  }
-  var nextProps = props,
-    propKey;
-  for (propKey in nextProps)
-    if (nextProps.hasOwnProperty(propKey)) {
-      var nextProp = nextProps[propKey];
-      switch (propKey) {
-        case "style":
-          if (null != nextProp && "object" !== typeof nextProp)
-            throw Error(formatProdErrorMessage(62));
-          setValueForStyles(domElement, nextProp);
-          break;
-        case "dangerouslySetInnerHTML":
-          if (null != nextProp) {
-            if ("object" !== typeof nextProp || !("__html" in nextProp))
-              throw Error(formatProdErrorMessage(61));
-            nextProp = nextProp.__html;
-            if (null != nextProp) {
-              if (null != nextProps.children)
-                throw Error(formatProdErrorMessage(60));
-              disableIEWorkarounds
-                ? (domElement.innerHTML = nextProp)
-                : setInnerHTML$1(domElement, nextProp);
-            }
+      for (var propKey$23 in props)
+        if (
+          props.hasOwnProperty(propKey$23) &&
+          ((propKey = props[propKey$23]), null != propKey)
+        )
+          switch (propKey$23) {
+            case "children":
+            case "dangerouslySetInnerHTML":
+              throw Error(formatProdErrorMessage(137, tag));
+            default:
+              setProp(domElement, tag, propKey$23, propKey, !1, props);
           }
-          break;
-        case "children":
-          "string" === typeof nextProp
-            ? "body" === tag ||
-              ("textarea" === tag && "" === nextProp) ||
-              setTextContent(domElement, nextProp)
-            : "number" === typeof nextProp &&
-              "body" !== tag &&
-              setTextContent(domElement, "" + nextProp);
-          break;
-        case "onScroll":
-          null != nextProp && listenToNonDelegatedEvent("scroll", domElement);
-          break;
-        case "suppressContentEditableWarning":
-        case "suppressHydrationWarning":
-        case "defaultValue":
-        case "defaultChecked":
-        case "innerHTML":
-          break;
-        case "autoFocus":
-          break;
-        case "innerText":
-        case "textContent":
-          if (enableCustomElementPropertySupport) break;
-        default:
-          registrationNameDependencies.hasOwnProperty(propKey) ||
-            (null != nextProp &&
-              (isCustomComponentTag
-                ? setValueForPropertyOnCustomComponent(
-                    domElement,
-                    propKey,
-                    nextProp
-                  )
-                : setValueForProperty(domElement, propKey, nextProp)));
-      }
-    }
-  switch (tag) {
-    case "input":
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, !1);
-      break;
-    case "textarea":
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-    case "option":
-      null != rawProps.value &&
-        domElement.setAttribute("value", "" + getToStringValue(rawProps.value));
-      break;
-    case "select":
-      domElement.multiple = !!rawProps.multiple;
-      tag = rawProps.value;
-      null != tag
-        ? updateOptions(domElement, !!rawProps.multiple, tag, !1)
-        : null != rawProps.defaultValue &&
-          updateOptions(
-            domElement,
-            !!rawProps.multiple,
-            rawProps.defaultValue,
-            !0
-          );
-      break;
-    default:
-      "function" === typeof props.onClick && (domElement.onclick = noop$2);
+      return;
   }
+  propKey = isCustomComponent(tag, props);
+  for (node in props)
+    props.hasOwnProperty(node) &&
+      ((propValue = props[node]),
+      null != propValue &&
+        setProp(domElement, tag, node, propValue, propKey, props));
 }
 function updateProperties(
   domElement,
   updatePayload,
   tag,
-  lastRawProps,
-  nextRawProps
+  lastProps,
+  nextProps
 ) {
-  "input" === tag &&
-    "radio" === nextRawProps.type &&
-    null != nextRawProps.name &&
-    updateChecked(domElement, nextRawProps);
-  isCustomComponent(tag, lastRawProps);
-  lastRawProps = isCustomComponent(tag, nextRawProps);
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i],
-      propValue = updatePayload[i + 1];
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
-      case "dangerouslySetInnerHTML":
-        disableIEWorkarounds
-          ? (domElement.innerHTML = propValue)
-          : setInnerHTML$1(domElement, propValue);
-        break;
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
-      default:
-        lastRawProps
-          ? setValueForPropertyOnCustomComponent(domElement, propKey, propValue)
-          : setValueForProperty(domElement, propKey, propValue);
-    }
-  }
   switch (tag) {
     case "input":
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
+      "radio" === nextProps.type &&
+        null != nextProps.name &&
+        ((lastProps = nextProps.checked),
+        null != lastProps && (domElement.checked = lastProps));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) {
+        var propKey = updatePayload[lastProps],
+          propValue = updatePayload[lastProps + 1];
+        switch (propKey) {
+          case "checked":
+            propKey = domElement;
+            propValue =
+              null != propValue
+                ? propValue
+                : propKey._wrapperState.initialChecked;
+            propKey.checked =
+              !!propValue &&
+              "function" !== typeof propValue &&
+              "symbol" !== propValue;
+            break;
+          case "value":
+            break;
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propValue)
+              throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propKey, propValue, !1, nextProps);
+        }
+      }
+      updateWrapper$1(domElement, nextProps);
+      return;
     case "select":
-      (updatePayload = domElement._wrapperState.wasMultiple),
-        (domElement._wrapperState.wasMultiple = !!nextRawProps.multiple),
-        (tag = nextRawProps.value),
-        null != tag
-          ? updateOptions(domElement, !!nextRawProps.multiple, tag, !1)
-          : updatePayload !== !!nextRawProps.multiple &&
-            (null != nextRawProps.defaultValue
-              ? updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.defaultValue,
-                  !0
-                )
-              : updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.multiple ? [] : "",
-                  !1
-                ));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updatePayload = domElement._wrapperState.wasMultiple;
+      domElement._wrapperState.wasMultiple = !!nextProps.multiple;
+      tag = nextProps.value;
+      null != tag
+        ? updateOptions(domElement, !!nextProps.multiple, tag, !1)
+        : updatePayload !== !!nextProps.multiple &&
+          (null != nextProps.defaultValue
+            ? updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.defaultValue,
+                !0
+              )
+            : updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.multiple ? [] : "",
+                !1
+              ));
+      return;
+    case "textarea":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          case "children":
+            break;
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(91));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updateWrapper(domElement, nextProps);
+      return;
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      return;
   }
+  lastProps = isCustomComponent(tag, nextProps);
+  for (propValue = 0; propValue < updatePayload.length; propValue += 2)
+    setProp(
+      domElement,
+      tag,
+      updatePayload[propValue],
+      updatePayload[propValue + 1],
+      lastProps,
+      nextProps
+    );
 }
 function getLeafNode(node) {
   for (; node && node.firstChild; ) node = node.firstChild;
@@ -2313,14 +2395,14 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$18 = getStyleKey(href),
+          var key$40 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$18);
+            resource = as.get(key$40);
           if (resource) break;
           var state = { loading: 0, preload: null };
           if (
             (resource = resourceRoot.querySelector(
-              getStylesheetSelectorFromKey(key$18)
+              getStylesheetSelectorFromKey(key$40)
             ))
           )
             state.loading = 1;
@@ -2331,7 +2413,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             };
-            (options = preloadPropsMap.get(key$18)) &&
+            (options = preloadPropsMap.get(key$40)) &&
               adoptPreloadPropsForStylesheet(href, options);
             var link = (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -2357,15 +2439,15 @@ function preinit$1(href, options) {
             count: 1,
             state: state
           };
-          as.set(key$18, resource);
+          as.set(key$40, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$18 = getScriptKey(href)),
-            (precedence = as.get(key$18)),
+            (key$40 = getScriptKey(href)),
+            (precedence = as.get(key$40)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$18
+                "script[async]" + key$40
               )),
               precedence ||
                 ((href = {
@@ -2374,7 +2456,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$18)) &&
+                (options = preloadPropsMap.get(key$40)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -2387,13 +2469,13 @@ function preinit$1(href, options) {
                 count: 1,
                 state: null
               }),
-              as.set(key$18, precedence));
+              as.set(key$40, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$18 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$18 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$18 + '"]';
+        key$40 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$40 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$40 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -2410,7 +2492,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$18) &&
+          null === resourceRoot.querySelector(key$40) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -2443,17 +2525,17 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.precedence
       ) {
         type = getStyleKey(pendingProps.href);
-        var styles$27 = getResourcesFromRoot(currentProps).hoistableStyles,
-          resource$28 = styles$27.get(type);
-        resource$28 ||
+        var styles$49 = getResourcesFromRoot(currentProps).hoistableStyles,
+          resource$50 = styles$49.get(type);
+        resource$50 ||
           ((currentProps = currentProps.ownerDocument || currentProps),
-          (resource$28 = {
+          (resource$50 = {
             type: "stylesheet",
             instance: null,
             count: 0,
             state: { loading: 0, preload: null }
           }),
-          styles$27.set(type, resource$28),
+          styles$49.set(type, resource$50),
           preloadPropsMap.has(type) ||
             preloadStylesheet(
               currentProps,
@@ -2468,9 +2550,9 @@ function getResource(type, currentProps, pendingProps) {
                 hrefLang: pendingProps.hrefLang,
                 referrerPolicy: pendingProps.referrerPolicy
               },
-              resource$28.state
+              resource$50.state
             ));
-        return resource$28;
+        return resource$50;
       }
       return null;
     case "script":
@@ -2542,36 +2624,36 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$33 = hoistableRoot.querySelector(
+        var instance$55 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$33)
+        if (instance$55)
           return (
-            (resource.instance = instance$33),
-            markNodeAsHoistable(instance$33),
-            instance$33
+            (resource.instance = instance$55),
+            markNodeAsHoistable(instance$55),
+            instance$55
           );
         key = stylesheetPropsFromRawProps(props);
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$33 = (
+        instance$55 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$33);
-        var linkInstance = instance$33;
+        markNodeAsHoistable(instance$55);
+        var linkInstance = instance$55;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
         });
-        setInitialProperties(instance$33, "link", key);
+        setInitialProperties(instance$55, "link", key);
         resource.state.loading |= 4;
-        insertStylesheet(instance$33, props.precedence, hoistableRoot);
-        return (resource.instance = instance$33);
+        insertStylesheet(instance$55, props.precedence, hoistableRoot);
+        return (resource.instance = instance$55);
       case "script":
-        instance$33 = getScriptKey(props.src);
+        instance$55 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$33
+            "script[async]" + instance$55
           ))
         )
           return (
@@ -2580,7 +2662,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$33)))
+        if ((styleProps = preloadPropsMap.get(instance$55)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -3337,8 +3419,8 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "video":
     case "audio":
-      for (var i = 0; i < mediaEventTypes.length; i++)
-        listenToNonDelegatedEvent(mediaEventTypes[i], instance);
+      for (type = 0; type < mediaEventTypes.length; type++)
+        listenToNonDelegatedEvent(mediaEventTypes[type], instance);
       break;
     case "source":
       listenToNonDelegatedEvent("error", instance);
@@ -3355,6 +3437,8 @@ function prepareToHydrateHostInstance(fiber) {
     case "input":
       initWrapperState$2(instance, props);
       listenToNonDelegatedEvent("invalid", instance);
+      track(instance);
+      postMountWrapper$3(instance, props, !0);
       break;
     case "select":
       instance._wrapperState = { wasMultiple: !!props.multiple };
@@ -3362,34 +3446,21 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "textarea":
       initWrapperState(instance, props),
-        listenToNonDelegatedEvent("invalid", instance);
+        listenToNonDelegatedEvent("invalid", instance),
+        track(instance),
+        postMountWrapper(instance);
   }
-  props.hasOwnProperty("onScroll") &&
-    listenToNonDelegatedEvent("scroll", instance);
   var updatePayload = null;
-  i = props.children;
-  ("string" !== typeof i && "number" !== typeof i) ||
-    instance.textContent === "" + i ||
+  type = props.children;
+  ("string" !== typeof type && "number" !== typeof type) ||
+    instance.textContent === "" + type ||
     (!0 !== props.suppressHydrationWarning &&
       ((updatePayload = instance.textContent),
-      normalizeMarkupForTextOrAttribute(i),
+      normalizeMarkupForTextOrAttribute(type),
       normalizeMarkupForTextOrAttribute(updatePayload)),
-    (updatePayload = ["children", i]));
-  switch (type) {
-    case "input":
-      track(instance);
-      postMountWrapper$3(instance, props, !0);
-      break;
-    case "textarea":
-      track(instance);
-      postMountWrapper(instance);
-      break;
-    case "select":
-    case "option":
-      break;
-    default:
-      "function" === typeof props.onClick && (instance.onclick = noop$2);
-  }
+    (updatePayload = ["children", type]));
+  null != props.onScroll && listenToNonDelegatedEvent("scroll", instance);
+  null != props.onClick && (instance.onclick = noop$2);
   instance = updatePayload;
   fiber.updateQueue = instance;
   return null !== instance ? !0 : !1;
@@ -4871,10 +4942,10 @@ createFunctionComponentUpdateQueue = function () {
 function use(usable) {
   if (null !== usable && "object" === typeof usable) {
     if ("function" === typeof usable.then) {
-      var index$75 = thenableIndexCounter;
+      var index$97 = thenableIndexCounter;
       thenableIndexCounter += 1;
       null === thenableState && (thenableState = []);
-      usable = trackUsedThenable(thenableState, usable, index$75);
+      usable = trackUsedThenable(thenableState, usable, index$97);
       null === currentlyRenderingFiber$1.alternate &&
         (null === workInProgressHook
           ? null === currentlyRenderingFiber$1.memoizedState
@@ -5366,16 +5437,16 @@ function refreshCache(fiber, seedKey, seedValue) {
       case 3:
         var lane = requestUpdateLane(provider);
         fiber = createUpdate(lane);
-        var root$81 = enqueueUpdate(provider, fiber, lane);
-        if (null !== root$81) {
+        var root$103 = enqueueUpdate(provider, fiber, lane);
+        if (null !== root$103) {
           var eventTime = requestEventTime();
-          scheduleUpdateOnFiber(root$81, provider, lane, eventTime);
-          entangleTransitions(root$81, provider, lane);
+          scheduleUpdateOnFiber(root$103, provider, lane, eventTime);
+          entangleTransitions(root$103, provider, lane);
         }
         provider = createCache();
         null !== seedKey &&
           void 0 !== seedKey &&
-          null !== root$81 &&
+          null !== root$103 &&
           provider.data.set(seedKey, seedValue);
         fiber.payload = { cache: provider };
         return;
@@ -5582,15 +5653,15 @@ var HooksDispatcherOnMount = {
       getServerSnapshot = getServerSnapshot();
     } else {
       getServerSnapshot = getSnapshot();
-      var root$77 = workInProgressRoot;
-      if (null === root$77) throw Error(formatProdErrorMessage(349));
-      includesBlockingLane(root$77, renderLanes$1) ||
+      var root$99 = workInProgressRoot;
+      if (null === root$99) throw Error(formatProdErrorMessage(349));
+      includesBlockingLane(root$99, renderLanes$1) ||
         pushStoreConsistencyCheck(fiber, getSnapshot, getServerSnapshot);
     }
     hook.memoizedState = getServerSnapshot;
-    root$77 = { value: getServerSnapshot, getSnapshot: getSnapshot };
-    hook.queue = root$77;
-    mountEffect(subscribeToStore.bind(null, fiber, root$77, subscribe), [
+    root$99 = { value: getServerSnapshot, getSnapshot: getSnapshot };
+    hook.queue = root$99;
+    mountEffect(subscribeToStore.bind(null, fiber, root$99, subscribe), [
       subscribe
     ]);
     fiber.flags |= 2048;
@@ -5599,7 +5670,7 @@ var HooksDispatcherOnMount = {
       updateStoreInstance.bind(
         null,
         fiber,
-        root$77,
+        root$99,
         getServerSnapshot,
         getSnapshot
       ),
@@ -6098,10 +6169,10 @@ var markerInstanceStack = createCursor(null);
 function pushRootMarkerInstance(workInProgress) {
   if (enableTransitionTracing) {
     var transitions = workInProgressTransitions,
-      root$92 = workInProgress.stateNode;
+      root$114 = workInProgress.stateNode;
     null !== transitions &&
       transitions.forEach(function (transition) {
-        if (!root$92.incompleteTransitions.has(transition)) {
+        if (!root$114.incompleteTransitions.has(transition)) {
           var markerInstance = {
             tag: 0,
             transitions: new Set([transition]),
@@ -6109,11 +6180,11 @@ function pushRootMarkerInstance(workInProgress) {
             aborts: null,
             name: null
           };
-          root$92.incompleteTransitions.set(transition, markerInstance);
+          root$114.incompleteTransitions.set(transition, markerInstance);
         }
       });
     var markerInstances = [];
-    root$92.incompleteTransitions.forEach(function (markerInstance) {
+    root$114.incompleteTransitions.forEach(function (markerInstance) {
       markerInstances.push(markerInstance);
     });
     push(markerInstanceStack, markerInstances);
@@ -6813,14 +6884,14 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
   }
   JSCompiler_temp = current.memoizedState;
   if (null !== JSCompiler_temp) {
-    var dehydrated$99 = JSCompiler_temp.dehydrated;
-    if (null !== dehydrated$99)
+    var dehydrated$121 = JSCompiler_temp.dehydrated;
+    if (null !== dehydrated$121)
       return updateDehydratedSuspenseComponent(
         current,
         workInProgress,
         didSuspend,
         nextProps,
-        dehydrated$99,
+        dehydrated$121,
         JSCompiler_temp,
         renderLanes
       );
@@ -6830,7 +6901,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
     showFallback = nextProps.fallback;
     didSuspend = workInProgress.mode;
     JSCompiler_temp = current.child;
-    dehydrated$99 = JSCompiler_temp.sibling;
+    dehydrated$121 = JSCompiler_temp.sibling;
     var primaryChildProps = { mode: "hidden", children: nextProps.children };
     0 === (didSuspend & 1) && workInProgress.child !== JSCompiler_temp
       ? ((nextProps = workInProgress.child),
@@ -6839,8 +6910,8 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
         (workInProgress.deletions = null))
       : ((nextProps = createWorkInProgress(JSCompiler_temp, primaryChildProps)),
         (nextProps.subtreeFlags = JSCompiler_temp.subtreeFlags & 31457280));
-    null !== dehydrated$99
-      ? (showFallback = createWorkInProgress(dehydrated$99, showFallback))
+    null !== dehydrated$121
+      ? (showFallback = createWorkInProgress(dehydrated$121, showFallback))
       : ((showFallback = createFiberFromFragment(
           showFallback,
           didSuspend,
@@ -6859,10 +6930,10 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
       ? (didSuspend = mountSuspenseOffscreenState(renderLanes))
       : ((JSCompiler_temp = didSuspend.cachePool),
         null !== JSCompiler_temp
-          ? ((dehydrated$99 = CacheContext._currentValue),
+          ? ((dehydrated$121 = CacheContext._currentValue),
             (JSCompiler_temp =
-              JSCompiler_temp.parent !== dehydrated$99
-                ? { parent: dehydrated$99, pool: dehydrated$99 }
+              JSCompiler_temp.parent !== dehydrated$121
+                ? { parent: dehydrated$121, pool: dehydrated$121 }
                 : JSCompiler_temp))
           : (JSCompiler_temp = getSuspendedCache()),
         (didSuspend = {
@@ -6876,23 +6947,23 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
         ((JSCompiler_temp = enableTransitionTracing
           ? markerInstanceStack.current
           : null),
-        (dehydrated$99 = showFallback.updateQueue),
+        (dehydrated$121 = showFallback.updateQueue),
         (primaryChildProps = current.updateQueue),
-        null === dehydrated$99
+        null === dehydrated$121
           ? (showFallback.updateQueue = {
               transitions: didSuspend,
               markerInstances: JSCompiler_temp,
               retryQueue: null
             })
-          : dehydrated$99 === primaryChildProps
+          : dehydrated$121 === primaryChildProps
           ? (showFallback.updateQueue = {
               transitions: didSuspend,
               markerInstances: JSCompiler_temp,
               retryQueue:
                 null !== primaryChildProps ? primaryChildProps.retryQueue : null
             })
-          : ((dehydrated$99.transitions = didSuspend),
-            (dehydrated$99.markerInstances = JSCompiler_temp))));
+          : ((dehydrated$121.transitions = didSuspend),
+            (dehydrated$121.markerInstances = JSCompiler_temp))));
     showFallback.childLanes = current.childLanes & ~renderLanes;
     workInProgress.memoizedState = SUSPENDED_MARKER;
     return nextProps;
@@ -7854,177 +7925,62 @@ function markRef(workInProgress) {
   workInProgress.flags |= 2097664;
 }
 function updateHostComponent(current, workInProgress, type, newProps) {
-  var oldProps = current.memoizedProps;
-  if (oldProps !== newProps) {
-    current = workInProgress.stateNode;
-    var updatePayload = null;
-    switch (type) {
-      case "input":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-        type = getHostProps$2(current, oldProps);
-        newProps = getHostProps$2(current, newProps);
-        updatePayload = [];
-        break;
-      case "select":
-        type = assign({}, oldProps, { value: void 0 });
-        newProps = assign({}, newProps, { value: void 0 });
-        updatePayload = [];
-        break;
-      case "textarea":
-        type = getHostProps(current, oldProps);
-        newProps = getHostProps(current, newProps);
-        updatePayload = [];
-        break;
-      case "img":
-      case "link":
-      case "area":
-      case "base":
-      case "br":
-      case "col":
-      case "embed":
-      case "hr":
-      case "keygen":
-      case "meta":
-      case "param":
-      case "source":
-      case "track":
-      case "wbr":
-      case "menuitem":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-      default:
-        (type = oldProps),
-          "function" !== typeof type.onClick &&
-            "function" === typeof newProps.onClick &&
-            (current.onclick = noop$2);
-    }
-    var styleName;
-    oldProps = null;
-    for (JSCompiler_inline_result in type)
+  current = current.memoizedProps;
+  if (current !== newProps) {
+    type = null;
+    var propKey,
+      styleName,
+      styleUpdates = null;
+    for (propKey in current)
       if (
-        !newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        type.hasOwnProperty(JSCompiler_inline_result) &&
-        null != type[JSCompiler_inline_result]
+        !newProps.hasOwnProperty(propKey) &&
+        current.hasOwnProperty(propKey) &&
+        null != current[propKey]
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            var lastStyle = type[JSCompiler_inline_result];
+            var lastStyle = current[propKey];
             for (styleName in lastStyle)
               lastStyle.hasOwnProperty(styleName) &&
-                (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-            break;
-          case "dangerouslySetInnerHTML":
-          case "children":
-            break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
+                (styleUpdates || (styleUpdates = {}),
+                (styleUpdates[styleName] = ""));
             break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  null
-                );
+            (type = type || []).push(propKey, null);
         }
-    for (JSCompiler_inline_result in newProps) {
-      var nextProp = newProps[JSCompiler_inline_result];
-      lastStyle = null != type ? type[JSCompiler_inline_result] : void 0;
+    for (propKey in newProps) {
+      lastStyle = newProps[propKey];
+      var lastProp = null != current ? current[propKey] : void 0;
       if (
-        newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        nextProp !== lastStyle &&
-        (null != nextProp || null != lastStyle)
+        newProps.hasOwnProperty(propKey) &&
+        lastStyle !== lastProp &&
+        (null != lastStyle || null != lastProp)
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            if (null != nextProp && "object" !== typeof nextProp)
-              throw Error(formatProdErrorMessage(62));
-            if (lastStyle) {
+            if (lastProp) {
+              for (styleName in lastProp)
+                !lastProp.hasOwnProperty(styleName) ||
+                  (lastStyle && lastStyle.hasOwnProperty(styleName)) ||
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = ""));
               for (styleName in lastStyle)
-                !lastStyle.hasOwnProperty(styleName) ||
-                  (nextProp && nextProp.hasOwnProperty(styleName)) ||
-                  (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-              for (styleName in nextProp)
-                nextProp.hasOwnProperty(styleName) &&
-                  lastStyle[styleName] !== nextProp[styleName] &&
-                  (oldProps || (oldProps = {}),
-                  (oldProps[styleName] = nextProp[styleName]));
+                lastStyle.hasOwnProperty(styleName) &&
+                  lastProp[styleName] !== lastStyle[styleName] &&
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = lastStyle[styleName]));
             } else
-              oldProps ||
-                (updatePayload || (updatePayload = []),
-                updatePayload.push(JSCompiler_inline_result, oldProps)),
-                (oldProps = nextProp);
-            break;
-          case "dangerouslySetInnerHTML":
-            if (null != nextProp) {
-              if ("object" !== typeof nextProp || !("__html" in nextProp))
-                throw Error(formatProdErrorMessage(61));
-              nextProp = nextProp.__html;
-              if (null != nextProp) {
-                if (null != newProps.children)
-                  throw Error(formatProdErrorMessage(60));
-                (lastStyle ? lastStyle.__html : void 0) !== nextProp &&
-                  (updatePayload = updatePayload || []).push(
-                    JSCompiler_inline_result,
-                    nextProp
-                  );
-              }
-            }
-            break;
-          case "children":
-            ("string" !== typeof nextProp && "number" !== typeof nextProp) ||
-              (updatePayload = updatePayload || []).push(
-                JSCompiler_inline_result,
-                "" + nextProp
-              );
-            break;
-          case "onScroll":
-            null != nextProp && listenToNonDelegatedEvent("scroll", current);
-            updatePayload || lastStyle === nextProp || (updatePayload = []);
+              styleUpdates ||
+                (type || (type = []), type.push(propKey, styleUpdates)),
+                (styleUpdates = lastStyle);
             break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || lastStyle === nextProp || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  nextProp
-                );
+            (type = type || []).push(propKey, lastStyle);
         }
     }
-    oldProps && (updatePayload = updatePayload || []).push("style", oldProps);
-    var JSCompiler_inline_result = updatePayload;
-    (workInProgress.updateQueue = JSCompiler_inline_result) &&
-      markUpdate(workInProgress);
+    styleUpdates && (type = type || []).push("style", styleUpdates);
+    newProps = type;
+    (workInProgress.updateQueue = newProps) && markUpdate(workInProgress);
   }
 }
 function preloadResourceAndSuspendIfNeeded(workInProgress, resource) {
@@ -8069,14 +8025,14 @@ function cutOffTailIfNeeded(renderState, hasRenderedATailFallback) {
         break;
       case "collapsed":
         lastTailNode = renderState.tail;
-        for (var lastTailNode$130 = null; null !== lastTailNode; )
-          null !== lastTailNode.alternate && (lastTailNode$130 = lastTailNode),
+        for (var lastTailNode$152 = null; null !== lastTailNode; )
+          null !== lastTailNode.alternate && (lastTailNode$152 = lastTailNode),
             (lastTailNode = lastTailNode.sibling);
-        null === lastTailNode$130
+        null === lastTailNode$152
           ? hasRenderedATailFallback || null === renderState.tail
             ? (renderState.tail = null)
             : (renderState.tail.sibling = null)
-          : (lastTailNode$130.sibling = null);
+          : (lastTailNode$152.sibling = null);
     }
 }
 function bubbleProperties(completedWork) {
@@ -8086,19 +8042,19 @@ function bubbleProperties(completedWork) {
     newChildLanes = 0,
     subtreeFlags = 0;
   if (didBailout)
-    for (var child$131 = completedWork.child; null !== child$131; )
-      (newChildLanes |= child$131.lanes | child$131.childLanes),
-        (subtreeFlags |= child$131.subtreeFlags & 31457280),
-        (subtreeFlags |= child$131.flags & 31457280),
-        (child$131.return = completedWork),
-        (child$131 = child$131.sibling);
+    for (var child$153 = completedWork.child; null !== child$153; )
+      (newChildLanes |= child$153.lanes | child$153.childLanes),
+        (subtreeFlags |= child$153.subtreeFlags & 31457280),
+        (subtreeFlags |= child$153.flags & 31457280),
+        (child$153.return = completedWork),
+        (child$153 = child$153.sibling);
   else
-    for (child$131 = completedWork.child; null !== child$131; )
-      (newChildLanes |= child$131.lanes | child$131.childLanes),
-        (subtreeFlags |= child$131.subtreeFlags),
-        (subtreeFlags |= child$131.flags),
-        (child$131.return = completedWork),
-        (child$131 = child$131.sibling);
+    for (child$153 = completedWork.child; null !== child$153; )
+      (newChildLanes |= child$153.lanes | child$153.childLanes),
+        (subtreeFlags |= child$153.subtreeFlags),
+        (subtreeFlags |= child$153.flags),
+        (child$153.return = completedWork),
+        (child$153 = child$153.sibling);
   completedWork.subtreeFlags |= subtreeFlags;
   completedWork.childLanes = newChildLanes;
   return didBailout;
@@ -8835,8 +8791,8 @@ function safelyDetachRef(current, nearestMountedAncestor) {
     else if ("function" === typeof ref)
       try {
         ref(null);
-      } catch (error$161) {
-        captureCommitPhaseError(current, nearestMountedAncestor, error$161);
+      } catch (error$183) {
+        captureCommitPhaseError(current, nearestMountedAncestor, error$183);
       }
     else ref.current = null;
 }
@@ -9143,11 +9099,11 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
               current,
               finishedRoot.__reactInternalSnapshotBeforeUpdate
             );
-          } catch (error$163) {
+          } catch (error$185) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$163
+              error$185
             );
           }
         }
@@ -9821,8 +9777,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         }
         try {
           commitHookEffectListUnmount(5, finishedWork, finishedWork.return);
-        } catch (error$176) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$176);
+        } catch (error$198) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$198);
         }
       }
       break;
@@ -10000,11 +9956,11 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
               newProps
             );
             domElement[internalPropsKey] = newProps;
-          } catch (error$177) {
+          } catch (error$199) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$177
+              error$199
             );
           }
       break;
@@ -10040,8 +9996,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         root = finishedWork.stateNode;
         try {
           setTextContent(root, "");
-        } catch (error$178) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$178);
+        } catch (error$200) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$200);
         }
       }
       if (
@@ -10058,8 +10014,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         try {
           updateProperties(flags, maybeNodes, hoistableRoot, current, root),
             (flags[internalPropsKey] = root);
-        } catch (error$181) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$181);
+        } catch (error$203) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$203);
         }
       break;
     case 6:
@@ -10072,8 +10028,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         flags = finishedWork.memoizedProps;
         try {
           current.nodeValue = flags;
-        } catch (error$182) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$182);
+        } catch (error$204) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$204);
         }
       }
       break;
@@ -10087,8 +10043,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
       if (flags & 4 && null !== current && current.memoizedState.isDehydrated)
         try {
           retryIfBlockedOn(root.containerInfo);
-        } catch (error$183) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$183);
+        } catch (error$205) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$205);
         }
       break;
     case 4:
@@ -10118,8 +10074,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
               null !== retryQueue && suspenseCallback(new Set(retryQueue));
             }
           }
-        } catch (error$185) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$185);
+        } catch (error$207) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$207);
         }
         current = finishedWork.updateQueue;
         null !== current &&
@@ -10197,11 +10153,11 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
             if (null === current)
               try {
                 root.stateNode.nodeValue = domElement ? "" : root.memoizedProps;
-              } catch (error$166) {
+              } catch (error$188) {
                 captureCommitPhaseError(
                   finishedWork,
                   finishedWork.return,
-                  error$166
+                  error$188
                 );
               }
           } else if (
@@ -10276,21 +10232,21 @@ function commitReconciliationEffects(finishedWork) {
             insertOrAppendPlacementNode(finishedWork, before, parent$jscomp$0);
             break;
           case 5:
-            var parent$167 = JSCompiler_inline_result.stateNode;
+            var parent$189 = JSCompiler_inline_result.stateNode;
             JSCompiler_inline_result.flags & 32 &&
-              (setTextContent(parent$167, ""),
+              (setTextContent(parent$189, ""),
               (JSCompiler_inline_result.flags &= -33));
-            var before$168 = getHostSibling(finishedWork);
-            insertOrAppendPlacementNode(finishedWork, before$168, parent$167);
+            var before$190 = getHostSibling(finishedWork);
+            insertOrAppendPlacementNode(finishedWork, before$190, parent$189);
             break;
           case 3:
           case 4:
-            var parent$169 = JSCompiler_inline_result.stateNode.containerInfo,
-              before$170 = getHostSibling(finishedWork);
+            var parent$191 = JSCompiler_inline_result.stateNode.containerInfo,
+              before$192 = getHostSibling(finishedWork);
             insertOrAppendPlacementNodeIntoContainer(
               finishedWork,
-              before$170,
-              parent$169
+              before$192,
+              parent$191
             );
             break;
           default:
@@ -10760,9 +10716,9 @@ function recursivelyTraverseReconnectPassiveEffects(
           );
         break;
       case 22:
-        var instance$195 = finishedWork.stateNode;
+        var instance$217 = finishedWork.stateNode;
         null !== finishedWork.memoizedState
-          ? instance$195._visibility & 4
+          ? instance$217._visibility & 4
             ? recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork,
@@ -10775,7 +10731,7 @@ function recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork
               )
-            : ((instance$195._visibility |= 4),
+            : ((instance$217._visibility |= 4),
               recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork,
@@ -10783,7 +10739,7 @@ function recursivelyTraverseReconnectPassiveEffects(
                 committedTransitions,
                 includeWorkInProgressEffects
               ))
-          : ((instance$195._visibility |= 4),
+          : ((instance$217._visibility |= 4),
             recursivelyTraverseReconnectPassiveEffects(
               finishedRoot,
               finishedWork,
@@ -10796,7 +10752,7 @@ function recursivelyTraverseReconnectPassiveEffects(
           commitOffscreenPassiveMountEffects(
             finishedWork.alternate,
             finishedWork,
-            instance$195
+            instance$217
           );
         break;
       case 24:
@@ -11394,16 +11350,16 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
         exitStatus = renderRootSync(root, lanes);
         if (2 === exitStatus) {
           errorRetryLanes = lanes;
-          var errorRetryLanes$204 = getLanesToRetrySynchronouslyOnError(
+          var errorRetryLanes$226 = getLanesToRetrySynchronouslyOnError(
             root,
             errorRetryLanes
           );
-          0 !== errorRetryLanes$204 &&
-            ((lanes = errorRetryLanes$204),
+          0 !== errorRetryLanes$226 &&
+            ((lanes = errorRetryLanes$226),
             (exitStatus = recoverFromConcurrentError(
               root,
               errorRetryLanes,
-              errorRetryLanes$204
+              errorRetryLanes$226
             )));
         }
         if (1 === exitStatus)
@@ -11464,14 +11420,14 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
           if ((lanes & 8388480) === lanes) break;
           exitStatus = lanes;
           errorRetryLanes = root.eventTimes;
-          for (errorRetryLanes$204 = -1; 0 < exitStatus; ) {
+          for (errorRetryLanes$226 = -1; 0 < exitStatus; ) {
             var index$2 = 31 - clz32(exitStatus),
               lane = 1 << index$2;
             index$2 = errorRetryLanes[index$2];
-            index$2 > errorRetryLanes$204 && (errorRetryLanes$204 = index$2);
+            index$2 > errorRetryLanes$226 && (errorRetryLanes$226 = index$2);
             exitStatus &= ~lane;
           }
-          exitStatus = errorRetryLanes$204;
+          exitStatus = errorRetryLanes$226;
           exitStatus = now() - exitStatus;
           exitStatus =
             (120 > exitStatus
@@ -11842,8 +11798,8 @@ function renderRootSync(root, lanes) {
       }
       workLoopSync();
       break;
-    } catch (thrownValue$207) {
-      handleThrow(root, thrownValue$207);
+    } catch (thrownValue$229) {
+      handleThrow(root, thrownValue$229);
     }
   while (1);
   resetContextDependencies();
@@ -11949,8 +11905,8 @@ function renderRootConcurrent(root, lanes) {
       }
       workLoopConcurrent();
       break;
-    } catch (thrownValue$209) {
-      handleThrow(root, thrownValue$209);
+    } catch (thrownValue$231) {
+      handleThrow(root, thrownValue$231);
     }
   while (1);
   resetContextDependencies();
@@ -12105,10 +12061,10 @@ function throwAndUnwindWorkLoop(unitOfWork, thrownValue) {
                       };
                       suspenseBoundary.updateQueue = newOffscreenQueue;
                     } else {
-                      var retryQueue$87 = offscreenQueue.retryQueue;
-                      null === retryQueue$87
+                      var retryQueue$109 = offscreenQueue.retryQueue;
+                      null === retryQueue$109
                         ? (offscreenQueue.retryQueue = new Set([wakeable]))
-                        : retryQueue$87.add(wakeable);
+                        : retryQueue$109.add(wakeable);
                     }
                   }
                   break;
@@ -12305,12 +12261,12 @@ function commitRootImpl(
     var prevExecutionContext = executionContext;
     executionContext |= 4;
     ReactCurrentOwner.current = null;
-    var shouldFireAfterActiveInstanceBlur$211 = commitBeforeMutationEffects(
+    var shouldFireAfterActiveInstanceBlur$233 = commitBeforeMutationEffects(
       root,
       finishedWork
     );
     commitMutationEffectsOnFiber(finishedWork, root);
-    shouldFireAfterActiveInstanceBlur$211 &&
+    shouldFireAfterActiveInstanceBlur$233 &&
       ((_enabled = !0),
       dispatchAfterDetachedBlur(selectionInformation.focusedElem),
       (_enabled = !1));
@@ -12389,7 +12345,7 @@ function releaseRootPooledCache(root, remainingLanes) {
 }
 function flushPassiveEffects() {
   if (null !== rootWithPendingPassiveEffects) {
-    var root$212 = rootWithPendingPassiveEffects,
+    var root$234 = rootWithPendingPassiveEffects,
       remainingLanes = pendingPassiveEffectsRemainingLanes;
     pendingPassiveEffectsRemainingLanes = 0;
     var renderPriority = lanesToEventPriority(pendingPassiveEffectsLanes);
@@ -12405,7 +12361,7 @@ function flushPassiveEffects() {
     } finally {
       (currentUpdatePriority = previousPriority),
         (ReactCurrentBatchConfig$1.transition = prevTransition),
-        releaseRootPooledCache(root$212, remainingLanes);
+        releaseRootPooledCache(root$234, remainingLanes);
     }
   }
   return !1;
@@ -13712,12 +13668,12 @@ function getPublicRootInstance(container) {
 function attemptSynchronousHydration(fiber) {
   switch (fiber.tag) {
     case 3:
-      var root$214 = fiber.stateNode;
-      if (root$214.current.memoizedState.isDehydrated) {
-        var lanes = getHighestPriorityLanes(root$214.pendingLanes);
+      var root$236 = fiber.stateNode;
+      if (root$236.current.memoizedState.isDehydrated) {
+        var lanes = getHighestPriorityLanes(root$236.pendingLanes);
         0 !== lanes &&
-          (markRootEntangled(root$214, lanes | 2),
-          ensureRootIsScheduled(root$214, now()),
+          (markRootEntangled(root$236, lanes | 2),
+          ensureRootIsScheduled(root$236, now()),
           0 === (executionContext & 6) &&
             ((workInProgressRootRenderTargetTime = now() + 500),
             flushSyncCallbacks()));
@@ -14289,19 +14245,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$317;
+  var JSCompiler_inline_result$jscomp$338;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1602 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1602) {
-      var element$jscomp$inline_1603 = document.createElement("div");
-      element$jscomp$inline_1603.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1602 =
-        "function" === typeof element$jscomp$inline_1603.oninput;
+    var isSupported$jscomp$inline_1620 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1620) {
+      var element$jscomp$inline_1621 = document.createElement("div");
+      element$jscomp$inline_1621.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1620 =
+        "function" === typeof element$jscomp$inline_1621.oninput;
     }
-    JSCompiler_inline_result$jscomp$317 = isSupported$jscomp$inline_1602;
-  } else JSCompiler_inline_result$jscomp$317 = !1;
+    JSCompiler_inline_result$jscomp$338 = isSupported$jscomp$inline_1620;
+  } else JSCompiler_inline_result$jscomp$338 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$317 &&
+    JSCompiler_inline_result$jscomp$338 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -14439,20 +14395,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1615 = 0;
-  i$jscomp$inline_1615 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1615++
+  var i$jscomp$inline_1633 = 0;
+  i$jscomp$inline_1633 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1633++
 ) {
-  var eventName$jscomp$inline_1616 =
-      simpleEventPluginEvents[i$jscomp$inline_1615],
-    domEventName$jscomp$inline_1617 =
-      eventName$jscomp$inline_1616.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1618 =
-      eventName$jscomp$inline_1616[0].toUpperCase() +
-      eventName$jscomp$inline_1616.slice(1);
+  var eventName$jscomp$inline_1634 =
+      simpleEventPluginEvents[i$jscomp$inline_1633],
+    domEventName$jscomp$inline_1635 =
+      eventName$jscomp$inline_1634.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1636 =
+      eventName$jscomp$inline_1634[0].toUpperCase() +
+      eventName$jscomp$inline_1634.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1617,
-    "on" + capitalizedEvent$jscomp$inline_1618
+    domEventName$jscomp$inline_1635,
+    "on" + capitalizedEvent$jscomp$inline_1636
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -16031,11 +15987,11 @@ function legacyCreateRootFromDOMContainer(
     if ("function" === typeof callback) {
       var originalCallback = callback;
       callback = function () {
-        var instance = getPublicRootInstance(root$229);
+        var instance = getPublicRootInstance(root$251);
         originalCallback.call(instance);
       };
     }
-    var root$229 = createHydrationContainer(
+    var root$251 = createHydrationContainer(
       initialChildren,
       callback,
       container,
@@ -16047,23 +16003,23 @@ function legacyCreateRootFromDOMContainer(
       noopOnRecoverableError,
       null
     );
-    container._reactRootContainer = root$229;
-    container[internalContainerInstanceKey] = root$229.current;
+    container._reactRootContainer = root$251;
+    container[internalContainerInstanceKey] = root$251.current;
     listenToAllSupportedEvents(
       8 === container.nodeType ? container.parentNode : container
     );
     flushSync$1();
-    return root$229;
+    return root$251;
   }
   clearContainer(container);
   if ("function" === typeof callback) {
-    var originalCallback$230 = callback;
+    var originalCallback$252 = callback;
     callback = function () {
-      var instance = getPublicRootInstance(root$231);
-      originalCallback$230.call(instance);
+      var instance = getPublicRootInstance(root$253);
+      originalCallback$252.call(instance);
     };
   }
-  var root$231 = createFiberRoot(
+  var root$253 = createFiberRoot(
     container,
     0,
     !1,
@@ -16075,15 +16031,15 @@ function legacyCreateRootFromDOMContainer(
     noopOnRecoverableError,
     null
   );
-  container._reactRootContainer = root$231;
-  container[internalContainerInstanceKey] = root$231.current;
+  container._reactRootContainer = root$253;
+  container[internalContainerInstanceKey] = root$253.current;
   listenToAllSupportedEvents(
     8 === container.nodeType ? container.parentNode : container
   );
   flushSync$1(function () {
-    updateContainer(initialChildren, root$231, parentComponent, callback);
+    updateContainer(initialChildren, root$253, parentComponent, callback);
   });
-  return root$231;
+  return root$253;
 }
 function legacyRenderSubtreeIntoContainer(
   parentComponent,
@@ -16142,17 +16098,17 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1771 = {
+var devToolsConfig$jscomp$inline_1789 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-c8392bdc",
+  version: "18.3.0-www-classic-b530cd19",
   rendererPackageName: "react-dom"
 };
-var internals$jscomp$inline_2145 = {
-  bundleType: devToolsConfig$jscomp$inline_1771.bundleType,
-  version: devToolsConfig$jscomp$inline_1771.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1771.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1771.rendererConfig,
+var internals$jscomp$inline_2180 = {
+  bundleType: devToolsConfig$jscomp$inline_1789.bundleType,
+  version: devToolsConfig$jscomp$inline_1789.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1789.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1789.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -16168,26 +16124,26 @@ var internals$jscomp$inline_2145 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1771.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1789.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-c8392bdc"
+  reconcilerVersion: "18.3.0-www-classic-b530cd19"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2146 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2181 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2146.isDisabled &&
-    hook$jscomp$inline_2146.supportsFiber
+    !hook$jscomp$inline_2181.isDisabled &&
+    hook$jscomp$inline_2181.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2146.inject(
-        internals$jscomp$inline_2145
+      (rendererID = hook$jscomp$inline_2181.inject(
+        internals$jscomp$inline_2180
       )),
-        (injectedHook = hook$jscomp$inline_2146);
+        (injectedHook = hook$jscomp$inline_2181);
     } catch (err) {}
 }
 assign(Internals, {
@@ -16415,4 +16371,4 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-classic-c8392bdc";
+exports.version = "18.3.0-www-classic-b530cd19";
diff --git a/compiled/facebook-www/ReactDOM-prod.modern.js b/compiled/facebook-www/ReactDOM-prod.modern.js
index 4b3d6752d0f1a..d82de8c4665ae 100644
--- a/compiled/facebook-www/ReactDOM-prod.modern.js
+++ b/compiled/facebook-www/ReactDOM-prod.modern.js
@@ -722,149 +722,8 @@ properties.formAction = new PropertyInfoRecord(
   );
 });
 var isJavaScriptProtocol =
-  /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i;
-function setValueForProperty(node, name, value) {
-  if (
-    !(2 < name.length) ||
-    ("o" !== name[0] && "O" !== name[0]) ||
-    ("n" !== name[1] && "N" !== name[1])
-  ) {
-    var JSCompiler_inline_result = properties.hasOwnProperty(name)
-      ? properties[name]
-      : null;
-    if (null !== JSCompiler_inline_result)
-      if (JSCompiler_inline_result.mustUseProperty)
-        node[JSCompiler_inline_result.propertyName] =
-          value && "function" !== typeof value && "symbol" !== typeof value;
-      else if (
-        ((name = JSCompiler_inline_result.attributeName), null === value)
-      )
-        node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (!JSCompiler_inline_result.acceptsBooleans) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        if (JSCompiler_inline_result.removeEmptyString && "" === value)
-          node.removeAttribute(name);
-        else
-          switch (JSCompiler_inline_result.type) {
-            case 3:
-              value ? node.setAttribute(name, "") : node.removeAttribute(name);
-              break;
-            case 4:
-              !0 === value
-                ? node.setAttribute(name, "")
-                : !1 === value
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 5:
-              isNaN(value)
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 6:
-              !isNaN(value) && 1 <= value
-                ? node.setAttribute(name, value)
-                : node.removeAttribute(name);
-              break;
-            default:
-              value = enableTrustedTypesIntegration ? value : "" + value;
-              if (
-                JSCompiler_inline_result.sanitizeURL &&
-                isJavaScriptProtocol.test(value.toString())
-              )
-                throw Error(formatProdErrorMessage(323));
-              (JSCompiler_inline_result =
-                JSCompiler_inline_result.attributeNamespace)
-                ? node.setAttributeNS(JSCompiler_inline_result, name, value)
-                : node.setAttribute(name, value);
-          }
-      }
-    else if (isAttributeNameSafe(name))
-      if (null === value) node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (
-              ((JSCompiler_inline_result = name.toLowerCase().slice(0, 5)),
-              "data-" !== JSCompiler_inline_result &&
-                "aria-" !== JSCompiler_inline_result)
-            ) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        node.setAttribute(
-          name,
-          enableTrustedTypesIntegration ? value : "" + value
-        );
-      }
-  }
-}
-function setValueForPropertyOnCustomComponent(node, name, value) {
-  if (
-    enableCustomElementPropertySupport &&
-    "o" === name[0] &&
-    "n" === name[1]
-  ) {
-    var useCapture = name.endsWith("Capture"),
-      eventName = name.substr(2, useCapture ? name.length - 9 : void 0),
-      prevProps = getFiberCurrentPropsFromNode(node);
-    prevProps = null != prevProps ? prevProps[name] : null;
-    "function" === typeof prevProps &&
-      node.removeEventListener(eventName, prevProps, useCapture);
-    if ("function" === typeof value) {
-      "function" !== typeof prevProps &&
-        null !== prevProps &&
-        (name in node
-          ? (node[name] = null)
-          : node.hasAttribute(name) && node.removeAttribute(name));
-      node.addEventListener(eventName, value, useCapture);
-      return;
-    }
-  }
-  if (enableCustomElementPropertySupport && name in node) node[name] = value;
-  else if (isAttributeNameSafe(name))
-    if (null === value) node.removeAttribute(name);
-    else {
-      switch (typeof value) {
-        case "undefined":
-        case "function":
-        case "symbol":
-          node.removeAttribute(name);
-          return;
-        case "boolean":
-          if (enableCustomElementPropertySupport) {
-            if (!0 === value) {
-              node.setAttribute(name, "");
-              return;
-            }
-            node.removeAttribute(name);
-            return;
-          }
-      }
-      node.setAttribute(
-        name,
-        enableTrustedTypesIntegration ? value : "" + value
-      );
-    }
-}
-var REACT_ELEMENT_TYPE = Symbol.for("react.element"),
+    /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i,
+  REACT_ELEMENT_TYPE = Symbol.for("react.element"),
   REACT_PORTAL_TYPE = Symbol.for("react.portal"),
   REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
   REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"),
@@ -1097,24 +956,18 @@ function getActiveElement(doc) {
     return doc.body;
   }
 }
-function getHostProps$2(element, props) {
-  var checked = props.checked;
-  return assign({}, props, {
-    defaultChecked: void 0,
-    defaultValue: void 0,
-    value: void 0,
-    checked: null != checked ? checked : element._wrapperState.initialChecked
-  });
-}
 function initWrapperState$2(element, props) {
   var defaultValue = null == props.defaultValue ? "" : props.defaultValue,
-    JSCompiler_temp_const =
+    initialChecked =
       null != props.checked ? props.checked : props.defaultChecked;
   defaultValue = getToStringValue(
     null != props.value ? props.value : defaultValue
   );
   element._wrapperState = {
-    initialChecked: JSCompiler_temp_const,
+    initialChecked:
+      "function" !== typeof initialChecked &&
+      "symbol" !== typeof initialChecked &&
+      !!initialChecked,
     initialValue: defaultValue,
     controlled:
       "checkbox" === props.type || "radio" === props.type
@@ -1122,19 +975,16 @@ function initWrapperState$2(element, props) {
         : null != props.value
   };
 }
-function updateChecked(element, props) {
-  props = props.checked;
-  null != props && (element.checked = props);
-}
 function updateWrapper$1(element, props) {
-  updateChecked(element, props);
-  var value = getToStringValue(props.value),
-    type = props.type;
-  if (null != value)
+  var checked = props.checked;
+  null != checked && (element.checked = checked);
+  checked = getToStringValue(props.value);
+  var type = props.type;
+  if (null != checked)
     if ("number" === type) {
-      if ((0 === value && "" === element.value) || element.value != value)
-        element.value = "" + value;
-    } else element.value !== "" + value && (element.value = "" + value);
+      if ((0 === checked && "" === element.value) || element.value != checked)
+        element.value = "" + checked;
+    } else element.value !== "" + checked && (element.value = "" + checked);
   else if ("submit" === type || "reset" === type) {
     element.removeAttribute("value");
     return;
@@ -1143,7 +993,7 @@ function updateWrapper$1(element, props) {
     ? props.hasOwnProperty("defaultValue") &&
       setDefaultValue(element, props.type, getToStringValue(props.defaultValue))
     : props.hasOwnProperty("value")
-    ? setDefaultValue(element, props.type, value)
+    ? setDefaultValue(element, props.type, checked)
     : props.hasOwnProperty("defaultValue") &&
       setDefaultValue(
         element,
@@ -1181,11 +1031,11 @@ function postMountWrapper$3(element, props, isHydrating) {
   }
   type = element.name;
   "" !== type && (element.name = "");
+  isHydrating || (element.checked = !!element._wrapperState.initialChecked);
   disableInputAttributeSyncing
-    ? (isHydrating || updateChecked(element, props),
-      props.hasOwnProperty("defaultChecked") &&
-        ((element.defaultChecked = !element.defaultChecked),
-        (element.defaultChecked = !!props.defaultChecked)))
+    ? props.hasOwnProperty("defaultChecked") &&
+      ((element.defaultChecked = !element.defaultChecked),
+      (element.defaultChecked = !!props.defaultChecked))
     : (element.defaultChecked = !!element._wrapperState.initialChecked);
   "" !== type && (element.name = type);
 }
@@ -1220,22 +1070,15 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
     null !== multiple && (multiple.selected = !0);
   }
 }
-function getHostProps(element, props) {
-  if (null != props.dangerouslySetInnerHTML)
-    throw Error(formatProdErrorMessage(91));
-  return assign({}, props, {
-    value: void 0,
-    defaultValue: void 0,
-    children: "" + element._wrapperState.initialValue
-  });
-}
 function initWrapperState(element, props) {
   var initialValue = props.value;
   null == initialValue &&
     ((props = props.defaultValue),
     null == props && (props = ""),
     (initialValue = props));
-  element._wrapperState = { initialValue: getToStringValue(initialValue) };
+  props = getToStringValue(initialValue);
+  element.defaultValue = props;
+  element._wrapperState = { initialValue: props };
 }
 function updateWrapper(element, props) {
   var value = getToStringValue(props.value),
@@ -1367,30 +1210,6 @@ Object.keys(isUnitlessNumber).forEach(function (prop) {
     isUnitlessNumber[prefix] = isUnitlessNumber[prop];
   });
 });
-function setValueForStyles(node, styles) {
-  node = node.style;
-  for (var styleName in styles)
-    if (styles.hasOwnProperty(styleName)) {
-      var value = styles[styleName],
-        isCustomProperty = 0 === styleName.indexOf("--");
-      null == value || "boolean" === typeof value || "" === value
-        ? isCustomProperty
-          ? node.setProperty(styleName, "")
-          : "float" === styleName
-          ? (node.cssFloat = "")
-          : (node[styleName] = "")
-        : isCustomProperty
-        ? node.setProperty(styleName, value)
-        : "number" !== typeof value ||
-          0 === value ||
-          (isUnitlessNumber.hasOwnProperty(styleName) &&
-            isUnitlessNumber[styleName])
-        ? "float" === styleName
-          ? (node.cssFloat = value)
-          : (node[styleName] = ("" + value).trim())
-        : (node[styleName] = value + "px");
-    }
-}
 function isCustomComponent(tagName, props) {
   if (-1 === tagName.indexOf("-")) return "string" === typeof props.is;
   switch (tagName) {
@@ -1837,8 +1656,8 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "video":
     case "audio":
-      for (var i = 0; i < mediaEventTypes.length; i++)
-        listenToNonDelegatedEvent(mediaEventTypes[i], instance);
+      for (type = 0; type < mediaEventTypes.length; type++)
+        listenToNonDelegatedEvent(mediaEventTypes[type], instance);
       break;
     case "source":
       listenToNonDelegatedEvent("error", instance);
@@ -1855,6 +1674,8 @@ function prepareToHydrateHostInstance(fiber) {
     case "input":
       initWrapperState$2(instance, props);
       listenToNonDelegatedEvent("invalid", instance);
+      track(instance);
+      postMountWrapper$3(instance, props, !0);
       break;
     case "select":
       instance._wrapperState = { wasMultiple: !!props.multiple };
@@ -1862,34 +1683,21 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "textarea":
       initWrapperState(instance, props),
-        listenToNonDelegatedEvent("invalid", instance);
+        listenToNonDelegatedEvent("invalid", instance),
+        track(instance),
+        postMountWrapper(instance);
   }
-  props.hasOwnProperty("onScroll") &&
-    listenToNonDelegatedEvent("scroll", instance);
   var updatePayload = null;
-  i = props.children;
-  ("string" !== typeof i && "number" !== typeof i) ||
-    instance.textContent === "" + i ||
+  type = props.children;
+  ("string" !== typeof type && "number" !== typeof type) ||
+    instance.textContent === "" + type ||
     (!0 !== props.suppressHydrationWarning &&
       ((updatePayload = instance.textContent),
-      normalizeMarkupForTextOrAttribute(i),
+      normalizeMarkupForTextOrAttribute(type),
       normalizeMarkupForTextOrAttribute(updatePayload)),
-    (updatePayload = ["children", i]));
-  switch (type) {
-    case "input":
-      track(instance);
-      postMountWrapper$3(instance, props, !0);
-      break;
-    case "textarea":
-      track(instance);
-      postMountWrapper(instance);
-      break;
-    case "select":
-    case "option":
-      break;
-    default:
-      "function" === typeof props.onClick && (instance.onclick = noop$1);
-  }
+    (updatePayload = ["children", type]));
+  null != props.onScroll && listenToNonDelegatedEvent("scroll", instance);
+  null != props.onClick && (instance.onclick = noop$1);
   instance = updatePayload;
   fiber.updateQueue = instance;
   return null !== instance ? !0 : !1;
@@ -6299,177 +6107,62 @@ function markRef(workInProgress) {
   workInProgress.flags |= 2097664;
 }
 function updateHostComponent(current, workInProgress, type, newProps) {
-  var oldProps = current.memoizedProps;
-  if (oldProps !== newProps) {
-    current = workInProgress.stateNode;
-    var updatePayload = null;
-    switch (type) {
-      case "input":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-        type = getHostProps$2(current, oldProps);
-        newProps = getHostProps$2(current, newProps);
-        updatePayload = [];
-        break;
-      case "select":
-        type = assign({}, oldProps, { value: void 0 });
-        newProps = assign({}, newProps, { value: void 0 });
-        updatePayload = [];
-        break;
-      case "textarea":
-        type = getHostProps(current, oldProps);
-        newProps = getHostProps(current, newProps);
-        updatePayload = [];
-        break;
-      case "img":
-      case "link":
-      case "area":
-      case "base":
-      case "br":
-      case "col":
-      case "embed":
-      case "hr":
-      case "keygen":
-      case "meta":
-      case "param":
-      case "source":
-      case "track":
-      case "wbr":
-      case "menuitem":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-      default:
-        (type = oldProps),
-          "function" !== typeof type.onClick &&
-            "function" === typeof newProps.onClick &&
-            (current.onclick = noop$1);
-    }
-    var styleName;
-    oldProps = null;
-    for (JSCompiler_inline_result in type)
+  current = current.memoizedProps;
+  if (current !== newProps) {
+    type = null;
+    var propKey,
+      styleName,
+      styleUpdates = null;
+    for (propKey in current)
       if (
-        !newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        type.hasOwnProperty(JSCompiler_inline_result) &&
-        null != type[JSCompiler_inline_result]
+        !newProps.hasOwnProperty(propKey) &&
+        current.hasOwnProperty(propKey) &&
+        null != current[propKey]
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            var lastStyle = type[JSCompiler_inline_result];
+            var lastStyle = current[propKey];
             for (styleName in lastStyle)
               lastStyle.hasOwnProperty(styleName) &&
-                (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-            break;
-          case "dangerouslySetInnerHTML":
-          case "children":
+                (styleUpdates || (styleUpdates = {}),
+                (styleUpdates[styleName] = ""));
             break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  null
-                );
+            (type = type || []).push(propKey, null);
         }
-    for (JSCompiler_inline_result in newProps) {
-      var nextProp = newProps[JSCompiler_inline_result];
-      lastStyle = null != type ? type[JSCompiler_inline_result] : void 0;
+    for (propKey in newProps) {
+      lastStyle = newProps[propKey];
+      var lastProp = null != current ? current[propKey] : void 0;
       if (
-        newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        nextProp !== lastStyle &&
-        (null != nextProp || null != lastStyle)
+        newProps.hasOwnProperty(propKey) &&
+        lastStyle !== lastProp &&
+        (null != lastStyle || null != lastProp)
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            if (null != nextProp && "object" !== typeof nextProp)
-              throw Error(formatProdErrorMessage(62));
-            if (lastStyle) {
+            if (lastProp) {
+              for (styleName in lastProp)
+                !lastProp.hasOwnProperty(styleName) ||
+                  (lastStyle && lastStyle.hasOwnProperty(styleName)) ||
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = ""));
               for (styleName in lastStyle)
-                !lastStyle.hasOwnProperty(styleName) ||
-                  (nextProp && nextProp.hasOwnProperty(styleName)) ||
-                  (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-              for (styleName in nextProp)
-                nextProp.hasOwnProperty(styleName) &&
-                  lastStyle[styleName] !== nextProp[styleName] &&
-                  (oldProps || (oldProps = {}),
-                  (oldProps[styleName] = nextProp[styleName]));
+                lastStyle.hasOwnProperty(styleName) &&
+                  lastProp[styleName] !== lastStyle[styleName] &&
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = lastStyle[styleName]));
             } else
-              oldProps ||
-                (updatePayload || (updatePayload = []),
-                updatePayload.push(JSCompiler_inline_result, oldProps)),
-                (oldProps = nextProp);
-            break;
-          case "dangerouslySetInnerHTML":
-            if (null != nextProp) {
-              if ("object" !== typeof nextProp || !("__html" in nextProp))
-                throw Error(formatProdErrorMessage(61));
-              nextProp = nextProp.__html;
-              if (null != nextProp) {
-                if (null != newProps.children)
-                  throw Error(formatProdErrorMessage(60));
-                (lastStyle ? lastStyle.__html : void 0) !== nextProp &&
-                  (updatePayload = updatePayload || []).push(
-                    JSCompiler_inline_result,
-                    nextProp
-                  );
-              }
-            }
+              styleUpdates ||
+                (type || (type = []), type.push(propKey, styleUpdates)),
+                (styleUpdates = lastStyle);
             break;
-          case "children":
-            ("string" !== typeof nextProp && "number" !== typeof nextProp) ||
-              (updatePayload = updatePayload || []).push(
-                JSCompiler_inline_result,
-                "" + nextProp
-              );
-            break;
-          case "onScroll":
-            null != nextProp && listenToNonDelegatedEvent("scroll", current);
-            updatePayload || lastStyle === nextProp || (updatePayload = []);
-            break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || lastStyle === nextProp || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  nextProp
-                );
+            (type = type || []).push(propKey, lastStyle);
         }
     }
-    oldProps && (updatePayload = updatePayload || []).push("style", oldProps);
-    var JSCompiler_inline_result = updatePayload;
-    (workInProgress.updateQueue = JSCompiler_inline_result) &&
-      markUpdate(workInProgress);
+    styleUpdates && (type = type || []).push("style", styleUpdates);
+    newProps = type;
+    (workInProgress.updateQueue = newProps) && markUpdate(workInProgress);
   }
 }
 function preloadResourceAndSuspendIfNeeded(workInProgress, resource) {
@@ -13309,19 +13002,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$299;
+  var JSCompiler_inline_result$jscomp$320;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1526 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1526) {
-      var element$jscomp$inline_1527 = document.createElement("div");
-      element$jscomp$inline_1527.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1526 =
-        "function" === typeof element$jscomp$inline_1527.oninput;
+    var isSupported$jscomp$inline_1547 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1547) {
+      var element$jscomp$inline_1548 = document.createElement("div");
+      element$jscomp$inline_1548.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1547 =
+        "function" === typeof element$jscomp$inline_1548.oninput;
     }
-    JSCompiler_inline_result$jscomp$299 = isSupported$jscomp$inline_1526;
-  } else JSCompiler_inline_result$jscomp$299 = !1;
+    JSCompiler_inline_result$jscomp$320 = isSupported$jscomp$inline_1547;
+  } else JSCompiler_inline_result$jscomp$320 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$299 &&
+    JSCompiler_inline_result$jscomp$320 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -13630,20 +13323,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1567 = 0;
-  i$jscomp$inline_1567 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1567++
+  var i$jscomp$inline_1588 = 0;
+  i$jscomp$inline_1588 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1588++
 ) {
-  var eventName$jscomp$inline_1568 =
-      simpleEventPluginEvents[i$jscomp$inline_1567],
-    domEventName$jscomp$inline_1569 =
-      eventName$jscomp$inline_1568.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1570 =
-      eventName$jscomp$inline_1568[0].toUpperCase() +
-      eventName$jscomp$inline_1568.slice(1);
+  var eventName$jscomp$inline_1589 =
+      simpleEventPluginEvents[i$jscomp$inline_1588],
+    domEventName$jscomp$inline_1590 =
+      eventName$jscomp$inline_1589.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1591 =
+      eventName$jscomp$inline_1589[0].toUpperCase() +
+      eventName$jscomp$inline_1589.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1569,
-    "on" + capitalizedEvent$jscomp$inline_1570
+    domEventName$jscomp$inline_1590,
+    "on" + capitalizedEvent$jscomp$inline_1591
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -14483,72 +14176,339 @@ function getOwnerDocumentFromRootContainer(rootContainerElement) {
     : rootContainerElement.ownerDocument;
 }
 function noop$1() {}
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style":
+      if (null != value && "object" !== typeof value)
+        throw Error(formatProdErrorMessage(62));
+      domElement = domElement.style;
+      for (var styleName in value)
+        value.hasOwnProperty(styleName) &&
+          ((key = value[styleName]),
+          (props = 0 === styleName.indexOf("--")),
+          null == key || "boolean" === typeof key || "" === key
+            ? props
+              ? domElement.setProperty(styleName, "")
+              : "float" === styleName
+              ? (domElement.cssFloat = "")
+              : (domElement[styleName] = "")
+            : props
+            ? domElement.setProperty(styleName, key)
+            : "number" !== typeof key ||
+              0 === key ||
+              (isUnitlessNumber.hasOwnProperty(styleName) &&
+                isUnitlessNumber[styleName])
+            ? "float" === styleName
+              ? (domElement.cssFloat = key)
+              : (domElement[styleName] = ("" + key).trim())
+            : (domElement[styleName] = key + "px"));
+      break;
+    case "dangerouslySetInnerHTML":
+      if (null != value) {
+        if ("object" !== typeof value || !("__html" in value))
+          throw Error(formatProdErrorMessage(61));
+        value = value.__html;
+        if (null != value) {
+          if (null != props.children) throw Error(formatProdErrorMessage(60));
+          disableIEWorkarounds
+            ? (domElement.innerHTML = value)
+            : setInnerHTML$1(domElement, value);
+        }
+      }
+      break;
+    case "children":
+      "string" === typeof value
+        ? "body" === tag ||
+          ("textarea" === tag && "" === value) ||
+          setTextContent(domElement, value)
+        : "number" === typeof value &&
+          "body" !== tag &&
+          setTextContent(domElement, "" + value);
+      break;
+    case "onScroll":
+      null != value && listenToNonDelegatedEvent("scroll", domElement);
+      break;
+    case "onClick":
+      null != value && (domElement.onclick = noop$1);
+      break;
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue":
+    case "defaultChecked":
+    case "innerHTML":
+      break;
+    case "autoFocus":
+      break;
+    case "innerText":
+    case "textContent":
+      if (enableCustomElementPropertySupport) break;
+    default:
+      if (!registrationNameDependencies.hasOwnProperty(key))
+        if (isCustomComponentTag)
+          a: {
+            if (
+              enableCustomElementPropertySupport &&
+              "o" === key[0] &&
+              "n" === key[1] &&
+              ((styleName = key.endsWith("Capture")),
+              (props = key.substr(2, styleName ? key.length - 9 : void 0)),
+              (tag = getFiberCurrentPropsFromNode(domElement)),
+              (tag = null != tag ? tag[key] : null),
+              "function" === typeof tag &&
+                domElement.removeEventListener(props, tag, styleName),
+              "function" === typeof value)
+            ) {
+              "function" !== typeof tag &&
+                null !== tag &&
+                (key in domElement
+                  ? (domElement[key] = null)
+                  : domElement.hasAttribute(key) &&
+                    domElement.removeAttribute(key));
+              domElement.addEventListener(props, value, styleName);
+              break a;
+            }
+            if (enableCustomElementPropertySupport && key in domElement)
+              domElement[key] = value;
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (enableCustomElementPropertySupport) {
+                      if (!0 === value) {
+                        domElement.setAttribute(key, "");
+                        break a;
+                      }
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+          }
+        else
+          a: if (
+            !(2 < key.length) ||
+            ("o" !== key[0] && "O" !== key[0]) ||
+            ("n" !== key[1] && "N" !== key[1])
+          )
+            if (
+              ((styleName = properties.hasOwnProperty(key)
+                ? properties[key]
+                : null),
+              null !== styleName)
+            )
+              if (styleName.mustUseProperty)
+                domElement[styleName.propertyName] =
+                  value &&
+                  "function" !== typeof value &&
+                  "symbol" !== typeof value;
+              else if (((key = styleName.attributeName), null === value))
+                domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (!styleName.acceptsBooleans) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                if (styleName.removeEmptyString && "" === value)
+                  domElement.removeAttribute(key);
+                else
+                  switch (styleName.type) {
+                    case 3:
+                      value
+                        ? domElement.setAttribute(key, "")
+                        : domElement.removeAttribute(key);
+                      break;
+                    case 4:
+                      !0 === value
+                        ? domElement.setAttribute(key, "")
+                        : !1 === value
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 5:
+                      isNaN(value)
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 6:
+                      !isNaN(value) && 1 <= value
+                        ? domElement.setAttribute(key, value)
+                        : domElement.removeAttribute(key);
+                      break;
+                    default:
+                      value = enableTrustedTypesIntegration
+                        ? value
+                        : "" + value;
+                      if (
+                        styleName.sanitizeURL &&
+                        isJavaScriptProtocol.test(value.toString())
+                      )
+                        throw Error(formatProdErrorMessage(323));
+                      (styleName = styleName.attributeNamespace)
+                        ? domElement.setAttributeNS(styleName, key, value)
+                        : domElement.setAttribute(key, value);
+                  }
+              }
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (
+                      ((styleName = key.toLowerCase().slice(0, 5)),
+                      "data-" !== styleName && "aria-" !== styleName)
+                    ) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+  }
+}
 function createHTMLElement(type, props, ownerDocument) {
   return "string" === typeof props.is
     ? ownerDocument.createElement(type, { is: props.is })
     : ownerDocument.createElement(type);
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
+function setInitialProperties(domElement, tag, props) {
   switch (tag) {
+    case "input":
+      initWrapperState$2(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey in props)
+        if (props.hasOwnProperty(propKey)) {
+          var propValue = props[propKey];
+          if (null != propValue)
+            switch (propKey) {
+              case "checked":
+                var node = domElement;
+                propValue =
+                  null != propValue
+                    ? propValue
+                    : node._wrapperState.initialChecked;
+                node.checked =
+                  !!propValue &&
+                  "function" !== typeof propValue &&
+                  "symbol" !== propValue;
+                break;
+              case "value":
+                break;
+              case "children":
+              case "dangerouslySetInnerHTML":
+                if (null != propValue)
+                  throw Error(formatProdErrorMessage(137, tag));
+                break;
+              default:
+                setProp(domElement, tag, propKey, propValue, !1, props);
+            }
+        }
+      track(domElement);
+      postMountWrapper$3(domElement, props, !1);
+      return;
+    case "select":
+      domElement._wrapperState = { wasMultiple: !!props.multiple };
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (propValue in props)
+        if (
+          props.hasOwnProperty(propValue) &&
+          ((propKey = props[propValue]), null != propKey)
+        )
+          switch (propValue) {
+            case "value":
+              break;
+            default:
+              setProp(domElement, tag, propValue, propKey, !1, props);
+          }
+      domElement.multiple = !!props.multiple;
+      tag = props.value;
+      null != tag
+        ? updateOptions(domElement, !!props.multiple, tag, !1)
+        : null != props.defaultValue &&
+          updateOptions(domElement, !!props.multiple, props.defaultValue, !0);
+      return;
+    case "textarea":
+      initWrapperState(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey$200 in props)
+        if (
+          props.hasOwnProperty(propKey$200) &&
+          ((propKey = props[propKey$200]), null != propKey)
+        )
+          switch (propKey$200) {
+            case "value":
+              break;
+            case "children":
+              break;
+            case "dangerouslySetInnerHTML":
+              if (null != propKey) throw Error(formatProdErrorMessage(91));
+              break;
+            default:
+              setProp(domElement, tag, propKey$200, propKey, !1, props);
+          }
+      track(domElement);
+      postMountWrapper(domElement);
+      return;
+    case "option":
+      for (var propKey$202 in props)
+        props.hasOwnProperty(propKey$202) &&
+          ((propKey = props[propKey$202]),
+          null != propKey &&
+            setProp(domElement, tag, propKey$202, propKey, !1, props));
+      null != props.value &&
+        domElement.setAttribute("value", "" + getToStringValue(props.value));
+      return;
     case "dialog":
       listenToNonDelegatedEvent("cancel", domElement);
       listenToNonDelegatedEvent("close", domElement);
-      var props = rawProps;
       break;
-    case "embed":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "iframe":
     case "object":
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "video":
     case "audio":
-      for (props = 0; props < mediaEventTypes.length; props++)
-        listenToNonDelegatedEvent(mediaEventTypes[props], domElement);
-      props = rawProps;
+      for (propKey = 0; propKey < mediaEventTypes.length; propKey++)
+        listenToNonDelegatedEvent(mediaEventTypes[propKey], domElement);
       break;
-    case "source":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
-    case "img":
-    case "link":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "image":
       listenToNonDelegatedEvent("error", domElement);
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "details":
       listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
-    case "input":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "option":
-      props = rawProps;
-      break;
-    case "select":
-      domElement._wrapperState = { wasMultiple: !!rawProps.multiple };
-      props = assign({}, rawProps, { value: void 0 });
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
       break;
+    case "embed":
+    case "source":
+    case "img":
+    case "link":
+      listenToNonDelegatedEvent("error", domElement),
+        listenToNonDelegatedEvent("load", domElement);
     case "area":
     case "base":
     case "br":
@@ -14560,163 +14520,159 @@ function setInitialProperties(domElement, tag, rawProps) {
     case "track":
     case "wbr":
     case "menuitem":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-    default:
-      props = rawProps;
-  }
-  var nextProps = props,
-    propKey;
-  for (propKey in nextProps)
-    if (nextProps.hasOwnProperty(propKey)) {
-      var nextProp = nextProps[propKey];
-      switch (propKey) {
-        case "style":
-          if (null != nextProp && "object" !== typeof nextProp)
-            throw Error(formatProdErrorMessage(62));
-          setValueForStyles(domElement, nextProp);
-          break;
-        case "dangerouslySetInnerHTML":
-          if (null != nextProp) {
-            if ("object" !== typeof nextProp || !("__html" in nextProp))
-              throw Error(formatProdErrorMessage(61));
-            nextProp = nextProp.__html;
-            if (null != nextProp) {
-              if (null != nextProps.children)
-                throw Error(formatProdErrorMessage(60));
-              disableIEWorkarounds
-                ? (domElement.innerHTML = nextProp)
-                : setInnerHTML$1(domElement, nextProp);
-            }
+      for (var propKey$204 in props)
+        if (
+          props.hasOwnProperty(propKey$204) &&
+          ((propKey = props[propKey$204]), null != propKey)
+        )
+          switch (propKey$204) {
+            case "children":
+            case "dangerouslySetInnerHTML":
+              throw Error(formatProdErrorMessage(137, tag));
+            default:
+              setProp(domElement, tag, propKey$204, propKey, !1, props);
           }
-          break;
-        case "children":
-          "string" === typeof nextProp
-            ? "body" === tag ||
-              ("textarea" === tag && "" === nextProp) ||
-              setTextContent(domElement, nextProp)
-            : "number" === typeof nextProp &&
-              "body" !== tag &&
-              setTextContent(domElement, "" + nextProp);
-          break;
-        case "onScroll":
-          null != nextProp && listenToNonDelegatedEvent("scroll", domElement);
-          break;
-        case "suppressContentEditableWarning":
-        case "suppressHydrationWarning":
-        case "defaultValue":
-        case "defaultChecked":
-        case "innerHTML":
-          break;
-        case "autoFocus":
-          break;
-        case "innerText":
-        case "textContent":
-          if (enableCustomElementPropertySupport) break;
-        default:
-          registrationNameDependencies.hasOwnProperty(propKey) ||
-            (null != nextProp &&
-              (isCustomComponentTag
-                ? setValueForPropertyOnCustomComponent(
-                    domElement,
-                    propKey,
-                    nextProp
-                  )
-                : setValueForProperty(domElement, propKey, nextProp)));
-      }
-    }
-  switch (tag) {
-    case "input":
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, !1);
-      break;
-    case "textarea":
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-    case "option":
-      null != rawProps.value &&
-        domElement.setAttribute("value", "" + getToStringValue(rawProps.value));
-      break;
-    case "select":
-      domElement.multiple = !!rawProps.multiple;
-      tag = rawProps.value;
-      null != tag
-        ? updateOptions(domElement, !!rawProps.multiple, tag, !1)
-        : null != rawProps.defaultValue &&
-          updateOptions(
-            domElement,
-            !!rawProps.multiple,
-            rawProps.defaultValue,
-            !0
-          );
-      break;
-    default:
-      "function" === typeof props.onClick && (domElement.onclick = noop$1);
+      return;
   }
+  propKey = isCustomComponent(tag, props);
+  for (node in props)
+    props.hasOwnProperty(node) &&
+      ((propValue = props[node]),
+      null != propValue &&
+        setProp(domElement, tag, node, propValue, propKey, props));
 }
 function updateProperties(
   domElement,
   updatePayload,
   tag,
-  lastRawProps,
-  nextRawProps
+  lastProps,
+  nextProps
 ) {
-  "input" === tag &&
-    "radio" === nextRawProps.type &&
-    null != nextRawProps.name &&
-    updateChecked(domElement, nextRawProps);
-  isCustomComponent(tag, lastRawProps);
-  lastRawProps = isCustomComponent(tag, nextRawProps);
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i],
-      propValue = updatePayload[i + 1];
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
-      case "dangerouslySetInnerHTML":
-        disableIEWorkarounds
-          ? (domElement.innerHTML = propValue)
-          : setInnerHTML$1(domElement, propValue);
-        break;
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
-      default:
-        lastRawProps
-          ? setValueForPropertyOnCustomComponent(domElement, propKey, propValue)
-          : setValueForProperty(domElement, propKey, propValue);
-    }
-  }
   switch (tag) {
     case "input":
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
+      "radio" === nextProps.type &&
+        null != nextProps.name &&
+        ((lastProps = nextProps.checked),
+        null != lastProps && (domElement.checked = lastProps));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) {
+        var propKey = updatePayload[lastProps],
+          propValue = updatePayload[lastProps + 1];
+        switch (propKey) {
+          case "checked":
+            propKey = domElement;
+            propValue =
+              null != propValue
+                ? propValue
+                : propKey._wrapperState.initialChecked;
+            propKey.checked =
+              !!propValue &&
+              "function" !== typeof propValue &&
+              "symbol" !== propValue;
+            break;
+          case "value":
+            break;
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propValue)
+              throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propKey, propValue, !1, nextProps);
+        }
+      }
+      updateWrapper$1(domElement, nextProps);
+      return;
     case "select":
-      (updatePayload = domElement._wrapperState.wasMultiple),
-        (domElement._wrapperState.wasMultiple = !!nextRawProps.multiple),
-        (tag = nextRawProps.value),
-        null != tag
-          ? updateOptions(domElement, !!nextRawProps.multiple, tag, !1)
-          : updatePayload !== !!nextRawProps.multiple &&
-            (null != nextRawProps.defaultValue
-              ? updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.defaultValue,
-                  !0
-                )
-              : updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.multiple ? [] : "",
-                  !1
-                ));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updatePayload = domElement._wrapperState.wasMultiple;
+      domElement._wrapperState.wasMultiple = !!nextProps.multiple;
+      tag = nextProps.value;
+      null != tag
+        ? updateOptions(domElement, !!nextProps.multiple, tag, !1)
+        : updatePayload !== !!nextProps.multiple &&
+          (null != nextProps.defaultValue
+            ? updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.defaultValue,
+                !0
+              )
+            : updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.multiple ? [] : "",
+                !1
+              ));
+      return;
+    case "textarea":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          case "children":
+            break;
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(91));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updateWrapper(domElement, nextProps);
+      return;
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      return;
   }
+  lastProps = isCustomComponent(tag, nextProps);
+  for (propValue = 0; propValue < updatePayload.length; propValue += 2)
+    setProp(
+      domElement,
+      tag,
+      updatePayload[propValue],
+      updatePayload[propValue + 1],
+      lastProps,
+      nextProps
+    );
 }
 var Dispatcher$1 = Internals.Dispatcher,
   eventsEnabled = null,
@@ -15027,14 +14983,14 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$199 = getStyleKey(href),
+          var key$221 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$199);
+            resource = as.get(key$221);
           if (resource) break;
           var state = { loading: 0, preload: null };
           if (
             (resource = resourceRoot.querySelector(
-              getStylesheetSelectorFromKey(key$199)
+              getStylesheetSelectorFromKey(key$221)
             ))
           )
             state.loading = 1;
@@ -15045,7 +15001,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             };
-            (options = preloadPropsMap.get(key$199)) &&
+            (options = preloadPropsMap.get(key$221)) &&
               adoptPreloadPropsForStylesheet(href, options);
             var link = (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -15071,15 +15027,15 @@ function preinit$1(href, options) {
             count: 1,
             state: state
           };
-          as.set(key$199, resource);
+          as.set(key$221, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$199 = getScriptKey(href)),
-            (precedence = as.get(key$199)),
+            (key$221 = getScriptKey(href)),
+            (precedence = as.get(key$221)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$199
+                "script[async]" + key$221
               )),
               precedence ||
                 ((href = {
@@ -15088,7 +15044,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$199)) &&
+                (options = preloadPropsMap.get(key$221)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -15101,13 +15057,13 @@ function preinit$1(href, options) {
                 count: 1,
                 state: null
               }),
-              as.set(key$199, precedence));
+              as.set(key$221, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$199 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$199 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$199 + '"]';
+        key$221 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$221 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$221 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -15124,7 +15080,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$199) &&
+          null === resourceRoot.querySelector(key$221) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -15157,17 +15113,17 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.precedence
       ) {
         type = getStyleKey(pendingProps.href);
-        var styles$208 = getResourcesFromRoot(currentProps).hoistableStyles,
-          resource$209 = styles$208.get(type);
-        resource$209 ||
+        var styles$230 = getResourcesFromRoot(currentProps).hoistableStyles,
+          resource$231 = styles$230.get(type);
+        resource$231 ||
           ((currentProps = currentProps.ownerDocument || currentProps),
-          (resource$209 = {
+          (resource$231 = {
             type: "stylesheet",
             instance: null,
             count: 0,
             state: { loading: 0, preload: null }
           }),
-          styles$208.set(type, resource$209),
+          styles$230.set(type, resource$231),
           preloadPropsMap.has(type) ||
             preloadStylesheet(
               currentProps,
@@ -15182,9 +15138,9 @@ function getResource(type, currentProps, pendingProps) {
                 hrefLang: pendingProps.hrefLang,
                 referrerPolicy: pendingProps.referrerPolicy
               },
-              resource$209.state
+              resource$231.state
             ));
-        return resource$209;
+        return resource$231;
       }
       return null;
     case "script":
@@ -15256,36 +15212,36 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$214 = hoistableRoot.querySelector(
+        var instance$236 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$214)
+        if (instance$236)
           return (
-            (resource.instance = instance$214),
-            markNodeAsHoistable(instance$214),
-            instance$214
+            (resource.instance = instance$236),
+            markNodeAsHoistable(instance$236),
+            instance$236
           );
         key = stylesheetPropsFromRawProps(props);
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$214 = (
+        instance$236 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$214);
-        var linkInstance = instance$214;
+        markNodeAsHoistable(instance$236);
+        var linkInstance = instance$236;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
         });
-        setInitialProperties(instance$214, "link", key);
+        setInitialProperties(instance$236, "link", key);
         resource.state.loading |= 4;
-        insertStylesheet(instance$214, props.precedence, hoistableRoot);
-        return (resource.instance = instance$214);
+        insertStylesheet(instance$236, props.precedence, hoistableRoot);
+        return (resource.instance = instance$236);
       case "script":
-        instance$214 = getScriptKey(props.src);
+        instance$236 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$214
+            "script[async]" + instance$236
           ))
         )
           return (
@@ -15294,7 +15250,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$214)))
+        if ((styleProps = preloadPropsMap.get(instance$236)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -15665,17 +15621,17 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1740 = {
+var devToolsConfig$jscomp$inline_1758 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-23e19cb4",
+  version: "18.3.0-www-modern-7d28a9fd",
   rendererPackageName: "react-dom"
 };
-var internals$jscomp$inline_2132 = {
-  bundleType: devToolsConfig$jscomp$inline_1740.bundleType,
-  version: devToolsConfig$jscomp$inline_1740.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1740.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1740.rendererConfig,
+var internals$jscomp$inline_2167 = {
+  bundleType: devToolsConfig$jscomp$inline_1758.bundleType,
+  version: devToolsConfig$jscomp$inline_1758.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1758.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1758.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -15692,26 +15648,26 @@ var internals$jscomp$inline_2132 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1740.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1758.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-23e19cb4"
+  reconcilerVersion: "18.3.0-www-modern-7d28a9fd"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2133 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2168 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2133.isDisabled &&
-    hook$jscomp$inline_2133.supportsFiber
+    !hook$jscomp$inline_2168.isDisabled &&
+    hook$jscomp$inline_2168.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2133.inject(
-        internals$jscomp$inline_2132
+      (rendererID = hook$jscomp$inline_2168.inject(
+        internals$jscomp$inline_2167
       )),
-        (injectedHook = hook$jscomp$inline_2133);
+        (injectedHook = hook$jscomp$inline_2168);
     } catch (err) {}
 }
 exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
@@ -15868,4 +15824,4 @@ exports.unstable_createEventHandle = function (type, options) {
   return eventHandle;
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-modern-23e19cb4";
+exports.version = "18.3.0-www-modern-7d28a9fd";
diff --git a/compiled/facebook-www/ReactDOM-profiling.classic.js b/compiled/facebook-www/ReactDOM-profiling.classic.js
index 9e4b4a98486b1..bfd2ca406a13b 100644
--- a/compiled/facebook-www/ReactDOM-profiling.classic.js
+++ b/compiled/facebook-www/ReactDOM-profiling.classic.js
@@ -1054,149 +1054,8 @@ properties.formAction = new PropertyInfoRecord(
   );
 });
 var isJavaScriptProtocol =
-  /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i;
-function setValueForProperty(node, name, value) {
-  if (
-    !(2 < name.length) ||
-    ("o" !== name[0] && "O" !== name[0]) ||
-    ("n" !== name[1] && "N" !== name[1])
-  ) {
-    var JSCompiler_inline_result = properties.hasOwnProperty(name)
-      ? properties[name]
-      : null;
-    if (null !== JSCompiler_inline_result)
-      if (JSCompiler_inline_result.mustUseProperty)
-        node[JSCompiler_inline_result.propertyName] =
-          value && "function" !== typeof value && "symbol" !== typeof value;
-      else if (
-        ((name = JSCompiler_inline_result.attributeName), null === value)
-      )
-        node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (!JSCompiler_inline_result.acceptsBooleans) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        if (JSCompiler_inline_result.removeEmptyString && "" === value)
-          node.removeAttribute(name);
-        else
-          switch (JSCompiler_inline_result.type) {
-            case 3:
-              value ? node.setAttribute(name, "") : node.removeAttribute(name);
-              break;
-            case 4:
-              !0 === value
-                ? node.setAttribute(name, "")
-                : !1 === value
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 5:
-              isNaN(value)
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 6:
-              !isNaN(value) && 1 <= value
-                ? node.setAttribute(name, value)
-                : node.removeAttribute(name);
-              break;
-            default:
-              value = enableTrustedTypesIntegration ? value : "" + value;
-              if (
-                JSCompiler_inline_result.sanitizeURL &&
-                isJavaScriptProtocol.test(value.toString())
-              )
-                throw Error(formatProdErrorMessage(323));
-              (JSCompiler_inline_result =
-                JSCompiler_inline_result.attributeNamespace)
-                ? node.setAttributeNS(JSCompiler_inline_result, name, value)
-                : node.setAttribute(name, value);
-          }
-      }
-    else if (isAttributeNameSafe(name))
-      if (null === value) node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (
-              ((JSCompiler_inline_result = name.toLowerCase().slice(0, 5)),
-              "data-" !== JSCompiler_inline_result &&
-                "aria-" !== JSCompiler_inline_result)
-            ) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        node.setAttribute(
-          name,
-          enableTrustedTypesIntegration ? value : "" + value
-        );
-      }
-  }
-}
-function setValueForPropertyOnCustomComponent(node, name, value) {
-  if (
-    enableCustomElementPropertySupport &&
-    "o" === name[0] &&
-    "n" === name[1]
-  ) {
-    var useCapture = name.endsWith("Capture"),
-      eventName = name.substr(2, useCapture ? name.length - 9 : void 0),
-      prevProps = getFiberCurrentPropsFromNode(node);
-    prevProps = null != prevProps ? prevProps[name] : null;
-    "function" === typeof prevProps &&
-      node.removeEventListener(eventName, prevProps, useCapture);
-    if ("function" === typeof value) {
-      "function" !== typeof prevProps &&
-        null !== prevProps &&
-        (name in node
-          ? (node[name] = null)
-          : node.hasAttribute(name) && node.removeAttribute(name));
-      node.addEventListener(eventName, value, useCapture);
-      return;
-    }
-  }
-  if (enableCustomElementPropertySupport && name in node) node[name] = value;
-  else if (isAttributeNameSafe(name))
-    if (null === value) node.removeAttribute(name);
-    else {
-      switch (typeof value) {
-        case "undefined":
-        case "function":
-        case "symbol":
-          node.removeAttribute(name);
-          return;
-        case "boolean":
-          if (enableCustomElementPropertySupport) {
-            if (!0 === value) {
-              node.setAttribute(name, "");
-              return;
-            }
-            node.removeAttribute(name);
-            return;
-          }
-      }
-      node.setAttribute(
-        name,
-        enableTrustedTypesIntegration ? value : "" + value
-      );
-    }
-}
-var prefix;
+    /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i,
+  prefix;
 function describeBuiltInComponentFrame(name) {
   if (void 0 === prefix)
     try {
@@ -1398,24 +1257,18 @@ function getActiveElement(doc) {
     return doc.body;
   }
 }
-function getHostProps$2(element, props) {
-  var checked = props.checked;
-  return assign({}, props, {
-    defaultChecked: void 0,
-    defaultValue: void 0,
-    value: void 0,
-    checked: null != checked ? checked : element._wrapperState.initialChecked
-  });
-}
 function initWrapperState$2(element, props) {
   var defaultValue = null == props.defaultValue ? "" : props.defaultValue,
-    JSCompiler_temp_const =
+    initialChecked =
       null != props.checked ? props.checked : props.defaultChecked;
   defaultValue = getToStringValue(
     null != props.value ? props.value : defaultValue
   );
   element._wrapperState = {
-    initialChecked: JSCompiler_temp_const,
+    initialChecked:
+      "function" !== typeof initialChecked &&
+      "symbol" !== typeof initialChecked &&
+      !!initialChecked,
     initialValue: defaultValue,
     controlled:
       "checkbox" === props.type || "radio" === props.type
@@ -1423,19 +1276,16 @@ function initWrapperState$2(element, props) {
         : null != props.value
   };
 }
-function updateChecked(element, props) {
-  props = props.checked;
-  null != props && (element.checked = props);
-}
 function updateWrapper$1(element, props) {
-  updateChecked(element, props);
-  var value = getToStringValue(props.value),
-    type = props.type;
-  if (null != value)
+  var checked = props.checked;
+  null != checked && (element.checked = checked);
+  checked = getToStringValue(props.value);
+  var type = props.type;
+  if (null != checked)
     if ("number" === type) {
-      if ((0 === value && "" === element.value) || element.value != value)
-        element.value = "" + value;
-    } else element.value !== "" + value && (element.value = "" + value);
+      if ((0 === checked && "" === element.value) || element.value != checked)
+        element.value = "" + checked;
+    } else element.value !== "" + checked && (element.value = "" + checked);
   else if ("submit" === type || "reset" === type) {
     element.removeAttribute("value");
     return;
@@ -1444,7 +1294,7 @@ function updateWrapper$1(element, props) {
     ? props.hasOwnProperty("defaultValue") &&
       setDefaultValue(element, props.type, getToStringValue(props.defaultValue))
     : props.hasOwnProperty("value")
-    ? setDefaultValue(element, props.type, value)
+    ? setDefaultValue(element, props.type, checked)
     : props.hasOwnProperty("defaultValue") &&
       setDefaultValue(
         element,
@@ -1482,11 +1332,11 @@ function postMountWrapper$3(element, props, isHydrating) {
   }
   type = element.name;
   "" !== type && (element.name = "");
+  isHydrating || (element.checked = !!element._wrapperState.initialChecked);
   disableInputAttributeSyncing
-    ? (isHydrating || updateChecked(element, props),
-      props.hasOwnProperty("defaultChecked") &&
-        ((element.defaultChecked = !element.defaultChecked),
-        (element.defaultChecked = !!props.defaultChecked)))
+    ? props.hasOwnProperty("defaultChecked") &&
+      ((element.defaultChecked = !element.defaultChecked),
+      (element.defaultChecked = !!props.defaultChecked))
     : (element.defaultChecked = !!element._wrapperState.initialChecked);
   "" !== type && (element.name = type);
 }
@@ -1521,15 +1371,6 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
     null !== multiple && (multiple.selected = !0);
   }
 }
-function getHostProps(element, props) {
-  if (null != props.dangerouslySetInnerHTML)
-    throw Error(formatProdErrorMessage(91));
-  return assign({}, props, {
-    value: void 0,
-    defaultValue: void 0,
-    children: "" + element._wrapperState.initialValue
-  });
-}
 function initWrapperState(element, props) {
   var initialValue = props.value;
   if (null == initialValue) {
@@ -1546,7 +1387,9 @@ function initWrapperState(element, props) {
     null == props && (props = "");
     initialValue = props;
   }
-  element._wrapperState = { initialValue: getToStringValue(initialValue) };
+  props = getToStringValue(initialValue);
+  element.defaultValue = props;
+  element._wrapperState = { initialValue: props };
 }
 function updateWrapper(element, props) {
   var value = getToStringValue(props.value),
@@ -1678,30 +1521,6 @@ Object.keys(isUnitlessNumber).forEach(function (prop) {
     isUnitlessNumber[prefix] = isUnitlessNumber[prop];
   });
 });
-function setValueForStyles(node, styles) {
-  node = node.style;
-  for (var styleName in styles)
-    if (styles.hasOwnProperty(styleName)) {
-      var value = styles[styleName],
-        isCustomProperty = 0 === styleName.indexOf("--");
-      null == value || "boolean" === typeof value || "" === value
-        ? isCustomProperty
-          ? node.setProperty(styleName, "")
-          : "float" === styleName
-          ? (node.cssFloat = "")
-          : (node[styleName] = "")
-        : isCustomProperty
-        ? node.setProperty(styleName, value)
-        : "number" !== typeof value ||
-          0 === value ||
-          (isUnitlessNumber.hasOwnProperty(styleName) &&
-            isUnitlessNumber[styleName])
-        ? "float" === styleName
-          ? (node.cssFloat = value)
-          : (node[styleName] = ("" + value).trim())
-        : (node[styleName] = value + "px");
-    }
-}
 function isCustomComponent(tagName, props) {
   if (-1 === tagName.indexOf("-")) return "string" === typeof props.is;
   switch (tagName) {
@@ -1731,72 +1550,339 @@ function getOwnerDocumentFromRootContainer(rootContainerElement) {
     : rootContainerElement.ownerDocument;
 }
 function noop$2() {}
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style":
+      if (null != value && "object" !== typeof value)
+        throw Error(formatProdErrorMessage(62));
+      domElement = domElement.style;
+      for (var styleName in value)
+        value.hasOwnProperty(styleName) &&
+          ((key = value[styleName]),
+          (props = 0 === styleName.indexOf("--")),
+          null == key || "boolean" === typeof key || "" === key
+            ? props
+              ? domElement.setProperty(styleName, "")
+              : "float" === styleName
+              ? (domElement.cssFloat = "")
+              : (domElement[styleName] = "")
+            : props
+            ? domElement.setProperty(styleName, key)
+            : "number" !== typeof key ||
+              0 === key ||
+              (isUnitlessNumber.hasOwnProperty(styleName) &&
+                isUnitlessNumber[styleName])
+            ? "float" === styleName
+              ? (domElement.cssFloat = key)
+              : (domElement[styleName] = ("" + key).trim())
+            : (domElement[styleName] = key + "px"));
+      break;
+    case "dangerouslySetInnerHTML":
+      if (null != value) {
+        if ("object" !== typeof value || !("__html" in value))
+          throw Error(formatProdErrorMessage(61));
+        value = value.__html;
+        if (null != value) {
+          if (null != props.children) throw Error(formatProdErrorMessage(60));
+          disableIEWorkarounds
+            ? (domElement.innerHTML = value)
+            : setInnerHTML$1(domElement, value);
+        }
+      }
+      break;
+    case "children":
+      "string" === typeof value
+        ? "body" === tag ||
+          ("textarea" === tag && "" === value) ||
+          setTextContent(domElement, value)
+        : "number" === typeof value &&
+          "body" !== tag &&
+          setTextContent(domElement, "" + value);
+      break;
+    case "onScroll":
+      null != value && listenToNonDelegatedEvent("scroll", domElement);
+      break;
+    case "onClick":
+      null != value && (domElement.onclick = noop$2);
+      break;
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue":
+    case "defaultChecked":
+    case "innerHTML":
+      break;
+    case "autoFocus":
+      break;
+    case "innerText":
+    case "textContent":
+      if (enableCustomElementPropertySupport) break;
+    default:
+      if (!registrationNameDependencies.hasOwnProperty(key))
+        if (isCustomComponentTag)
+          a: {
+            if (
+              enableCustomElementPropertySupport &&
+              "o" === key[0] &&
+              "n" === key[1] &&
+              ((styleName = key.endsWith("Capture")),
+              (props = key.substr(2, styleName ? key.length - 9 : void 0)),
+              (tag = getFiberCurrentPropsFromNode(domElement)),
+              (tag = null != tag ? tag[key] : null),
+              "function" === typeof tag &&
+                domElement.removeEventListener(props, tag, styleName),
+              "function" === typeof value)
+            ) {
+              "function" !== typeof tag &&
+                null !== tag &&
+                (key in domElement
+                  ? (domElement[key] = null)
+                  : domElement.hasAttribute(key) &&
+                    domElement.removeAttribute(key));
+              domElement.addEventListener(props, value, styleName);
+              break a;
+            }
+            if (enableCustomElementPropertySupport && key in domElement)
+              domElement[key] = value;
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (enableCustomElementPropertySupport) {
+                      if (!0 === value) {
+                        domElement.setAttribute(key, "");
+                        break a;
+                      }
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+          }
+        else
+          a: if (
+            !(2 < key.length) ||
+            ("o" !== key[0] && "O" !== key[0]) ||
+            ("n" !== key[1] && "N" !== key[1])
+          )
+            if (
+              ((styleName = properties.hasOwnProperty(key)
+                ? properties[key]
+                : null),
+              null !== styleName)
+            )
+              if (styleName.mustUseProperty)
+                domElement[styleName.propertyName] =
+                  value &&
+                  "function" !== typeof value &&
+                  "symbol" !== typeof value;
+              else if (((key = styleName.attributeName), null === value))
+                domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (!styleName.acceptsBooleans) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                if (styleName.removeEmptyString && "" === value)
+                  domElement.removeAttribute(key);
+                else
+                  switch (styleName.type) {
+                    case 3:
+                      value
+                        ? domElement.setAttribute(key, "")
+                        : domElement.removeAttribute(key);
+                      break;
+                    case 4:
+                      !0 === value
+                        ? domElement.setAttribute(key, "")
+                        : !1 === value
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 5:
+                      isNaN(value)
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 6:
+                      !isNaN(value) && 1 <= value
+                        ? domElement.setAttribute(key, value)
+                        : domElement.removeAttribute(key);
+                      break;
+                    default:
+                      value = enableTrustedTypesIntegration
+                        ? value
+                        : "" + value;
+                      if (
+                        styleName.sanitizeURL &&
+                        isJavaScriptProtocol.test(value.toString())
+                      )
+                        throw Error(formatProdErrorMessage(323));
+                      (styleName = styleName.attributeNamespace)
+                        ? domElement.setAttributeNS(styleName, key, value)
+                        : domElement.setAttribute(key, value);
+                  }
+              }
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (
+                      ((styleName = key.toLowerCase().slice(0, 5)),
+                      "data-" !== styleName && "aria-" !== styleName)
+                    ) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+  }
+}
 function createHTMLElement(type, props, ownerDocument) {
   return "string" === typeof props.is
     ? ownerDocument.createElement(type, { is: props.is })
     : ownerDocument.createElement(type);
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
+function setInitialProperties(domElement, tag, props) {
   switch (tag) {
+    case "input":
+      initWrapperState$2(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey in props)
+        if (props.hasOwnProperty(propKey)) {
+          var propValue = props[propKey];
+          if (null != propValue)
+            switch (propKey) {
+              case "checked":
+                var node = domElement;
+                propValue =
+                  null != propValue
+                    ? propValue
+                    : node._wrapperState.initialChecked;
+                node.checked =
+                  !!propValue &&
+                  "function" !== typeof propValue &&
+                  "symbol" !== propValue;
+                break;
+              case "value":
+                break;
+              case "children":
+              case "dangerouslySetInnerHTML":
+                if (null != propValue)
+                  throw Error(formatProdErrorMessage(137, tag));
+                break;
+              default:
+                setProp(domElement, tag, propKey, propValue, !1, props);
+            }
+        }
+      track(domElement);
+      postMountWrapper$3(domElement, props, !1);
+      return;
+    case "select":
+      domElement._wrapperState = { wasMultiple: !!props.multiple };
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (propValue in props)
+        if (
+          props.hasOwnProperty(propValue) &&
+          ((propKey = props[propValue]), null != propKey)
+        )
+          switch (propValue) {
+            case "value":
+              break;
+            default:
+              setProp(domElement, tag, propValue, propKey, !1, props);
+          }
+      domElement.multiple = !!props.multiple;
+      tag = props.value;
+      null != tag
+        ? updateOptions(domElement, !!props.multiple, tag, !1)
+        : null != props.defaultValue &&
+          updateOptions(domElement, !!props.multiple, props.defaultValue, !0);
+      return;
+    case "textarea":
+      initWrapperState(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey$22 in props)
+        if (
+          props.hasOwnProperty(propKey$22) &&
+          ((propKey = props[propKey$22]), null != propKey)
+        )
+          switch (propKey$22) {
+            case "value":
+              break;
+            case "children":
+              break;
+            case "dangerouslySetInnerHTML":
+              if (null != propKey) throw Error(formatProdErrorMessage(91));
+              break;
+            default:
+              setProp(domElement, tag, propKey$22, propKey, !1, props);
+          }
+      track(domElement);
+      postMountWrapper(domElement);
+      return;
+    case "option":
+      for (var propKey$24 in props)
+        props.hasOwnProperty(propKey$24) &&
+          ((propKey = props[propKey$24]),
+          null != propKey &&
+            setProp(domElement, tag, propKey$24, propKey, !1, props));
+      null != props.value &&
+        domElement.setAttribute("value", "" + getToStringValue(props.value));
+      return;
     case "dialog":
       listenToNonDelegatedEvent("cancel", domElement);
       listenToNonDelegatedEvent("close", domElement);
-      var props = rawProps;
       break;
-    case "embed":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "iframe":
     case "object":
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "video":
     case "audio":
-      for (props = 0; props < mediaEventTypes.length; props++)
-        listenToNonDelegatedEvent(mediaEventTypes[props], domElement);
-      props = rawProps;
+      for (propKey = 0; propKey < mediaEventTypes.length; propKey++)
+        listenToNonDelegatedEvent(mediaEventTypes[propKey], domElement);
       break;
-    case "source":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
-    case "img":
-    case "link":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "image":
       listenToNonDelegatedEvent("error", domElement);
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "details":
       listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
-    case "input":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "option":
-      props = rawProps;
-      break;
-    case "select":
-      domElement._wrapperState = { wasMultiple: !!rawProps.multiple };
-      props = assign({}, rawProps, { value: void 0 });
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
       break;
+    case "embed":
+    case "source":
+    case "img":
+    case "link":
+      listenToNonDelegatedEvent("error", domElement),
+        listenToNonDelegatedEvent("load", domElement);
     case "area":
     case "base":
     case "br":
@@ -1808,163 +1894,159 @@ function setInitialProperties(domElement, tag, rawProps) {
     case "track":
     case "wbr":
     case "menuitem":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-    default:
-      props = rawProps;
-  }
-  var nextProps = props,
-    propKey;
-  for (propKey in nextProps)
-    if (nextProps.hasOwnProperty(propKey)) {
-      var nextProp = nextProps[propKey];
-      switch (propKey) {
-        case "style":
-          if (null != nextProp && "object" !== typeof nextProp)
-            throw Error(formatProdErrorMessage(62));
-          setValueForStyles(domElement, nextProp);
-          break;
-        case "dangerouslySetInnerHTML":
-          if (null != nextProp) {
-            if ("object" !== typeof nextProp || !("__html" in nextProp))
-              throw Error(formatProdErrorMessage(61));
-            nextProp = nextProp.__html;
-            if (null != nextProp) {
-              if (null != nextProps.children)
-                throw Error(formatProdErrorMessage(60));
-              disableIEWorkarounds
-                ? (domElement.innerHTML = nextProp)
-                : setInnerHTML$1(domElement, nextProp);
-            }
+      for (var propKey$26 in props)
+        if (
+          props.hasOwnProperty(propKey$26) &&
+          ((propKey = props[propKey$26]), null != propKey)
+        )
+          switch (propKey$26) {
+            case "children":
+            case "dangerouslySetInnerHTML":
+              throw Error(formatProdErrorMessage(137, tag));
+            default:
+              setProp(domElement, tag, propKey$26, propKey, !1, props);
           }
-          break;
-        case "children":
-          "string" === typeof nextProp
-            ? "body" === tag ||
-              ("textarea" === tag && "" === nextProp) ||
-              setTextContent(domElement, nextProp)
-            : "number" === typeof nextProp &&
-              "body" !== tag &&
-              setTextContent(domElement, "" + nextProp);
-          break;
-        case "onScroll":
-          null != nextProp && listenToNonDelegatedEvent("scroll", domElement);
-          break;
-        case "suppressContentEditableWarning":
-        case "suppressHydrationWarning":
-        case "defaultValue":
-        case "defaultChecked":
-        case "innerHTML":
-          break;
-        case "autoFocus":
-          break;
-        case "innerText":
-        case "textContent":
-          if (enableCustomElementPropertySupport) break;
-        default:
-          registrationNameDependencies.hasOwnProperty(propKey) ||
-            (null != nextProp &&
-              (isCustomComponentTag
-                ? setValueForPropertyOnCustomComponent(
-                    domElement,
-                    propKey,
-                    nextProp
-                  )
-                : setValueForProperty(domElement, propKey, nextProp)));
-      }
-    }
-  switch (tag) {
-    case "input":
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, !1);
-      break;
-    case "textarea":
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-    case "option":
-      null != rawProps.value &&
-        domElement.setAttribute("value", "" + getToStringValue(rawProps.value));
-      break;
-    case "select":
-      domElement.multiple = !!rawProps.multiple;
-      tag = rawProps.value;
-      null != tag
-        ? updateOptions(domElement, !!rawProps.multiple, tag, !1)
-        : null != rawProps.defaultValue &&
-          updateOptions(
-            domElement,
-            !!rawProps.multiple,
-            rawProps.defaultValue,
-            !0
-          );
-      break;
-    default:
-      "function" === typeof props.onClick && (domElement.onclick = noop$2);
+      return;
   }
+  propKey = isCustomComponent(tag, props);
+  for (node in props)
+    props.hasOwnProperty(node) &&
+      ((propValue = props[node]),
+      null != propValue &&
+        setProp(domElement, tag, node, propValue, propKey, props));
 }
 function updateProperties(
   domElement,
   updatePayload,
   tag,
-  lastRawProps,
-  nextRawProps
+  lastProps,
+  nextProps
 ) {
-  "input" === tag &&
-    "radio" === nextRawProps.type &&
-    null != nextRawProps.name &&
-    updateChecked(domElement, nextRawProps);
-  isCustomComponent(tag, lastRawProps);
-  lastRawProps = isCustomComponent(tag, nextRawProps);
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i],
-      propValue = updatePayload[i + 1];
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
-      case "dangerouslySetInnerHTML":
-        disableIEWorkarounds
-          ? (domElement.innerHTML = propValue)
-          : setInnerHTML$1(domElement, propValue);
-        break;
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
-      default:
-        lastRawProps
-          ? setValueForPropertyOnCustomComponent(domElement, propKey, propValue)
-          : setValueForProperty(domElement, propKey, propValue);
-    }
-  }
   switch (tag) {
     case "input":
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
+      "radio" === nextProps.type &&
+        null != nextProps.name &&
+        ((lastProps = nextProps.checked),
+        null != lastProps && (domElement.checked = lastProps));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) {
+        var propKey = updatePayload[lastProps],
+          propValue = updatePayload[lastProps + 1];
+        switch (propKey) {
+          case "checked":
+            propKey = domElement;
+            propValue =
+              null != propValue
+                ? propValue
+                : propKey._wrapperState.initialChecked;
+            propKey.checked =
+              !!propValue &&
+              "function" !== typeof propValue &&
+              "symbol" !== propValue;
+            break;
+          case "value":
+            break;
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propValue)
+              throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propKey, propValue, !1, nextProps);
+        }
+      }
+      updateWrapper$1(domElement, nextProps);
+      return;
     case "select":
-      (updatePayload = domElement._wrapperState.wasMultiple),
-        (domElement._wrapperState.wasMultiple = !!nextRawProps.multiple),
-        (tag = nextRawProps.value),
-        null != tag
-          ? updateOptions(domElement, !!nextRawProps.multiple, tag, !1)
-          : updatePayload !== !!nextRawProps.multiple &&
-            (null != nextRawProps.defaultValue
-              ? updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.defaultValue,
-                  !0
-                )
-              : updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.multiple ? [] : "",
-                  !1
-                ));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updatePayload = domElement._wrapperState.wasMultiple;
+      domElement._wrapperState.wasMultiple = !!nextProps.multiple;
+      tag = nextProps.value;
+      null != tag
+        ? updateOptions(domElement, !!nextProps.multiple, tag, !1)
+        : updatePayload !== !!nextProps.multiple &&
+          (null != nextProps.defaultValue
+            ? updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.defaultValue,
+                !0
+              )
+            : updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.multiple ? [] : "",
+                !1
+              ));
+      return;
+    case "textarea":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          case "children":
+            break;
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(91));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updateWrapper(domElement, nextProps);
+      return;
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      return;
   }
+  lastProps = isCustomComponent(tag, nextProps);
+  for (propValue = 0; propValue < updatePayload.length; propValue += 2)
+    setProp(
+      domElement,
+      tag,
+      updatePayload[propValue],
+      updatePayload[propValue + 1],
+      lastProps,
+      nextProps
+    );
 }
 function getLeafNode(node) {
   for (; node && node.firstChild; ) node = node.firstChild;
@@ -2457,14 +2539,14 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$21 = getStyleKey(href),
+          var key$43 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$21);
+            resource = as.get(key$43);
           if (resource) break;
           var state = { loading: 0, preload: null };
           if (
             (resource = resourceRoot.querySelector(
-              getStylesheetSelectorFromKey(key$21)
+              getStylesheetSelectorFromKey(key$43)
             ))
           )
             state.loading = 1;
@@ -2475,7 +2557,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             };
-            (options = preloadPropsMap.get(key$21)) &&
+            (options = preloadPropsMap.get(key$43)) &&
               adoptPreloadPropsForStylesheet(href, options);
             var link = (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -2501,15 +2583,15 @@ function preinit$1(href, options) {
             count: 1,
             state: state
           };
-          as.set(key$21, resource);
+          as.set(key$43, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$21 = getScriptKey(href)),
-            (precedence = as.get(key$21)),
+            (key$43 = getScriptKey(href)),
+            (precedence = as.get(key$43)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$21
+                "script[async]" + key$43
               )),
               precedence ||
                 ((href = {
@@ -2518,7 +2600,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$21)) &&
+                (options = preloadPropsMap.get(key$43)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -2531,13 +2613,13 @@ function preinit$1(href, options) {
                 count: 1,
                 state: null
               }),
-              as.set(key$21, precedence));
+              as.set(key$43, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$21 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$21 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$21 + '"]';
+        key$43 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$43 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$43 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -2554,7 +2636,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$21) &&
+          null === resourceRoot.querySelector(key$43) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -2587,17 +2669,17 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.precedence
       ) {
         type = getStyleKey(pendingProps.href);
-        var styles$30 = getResourcesFromRoot(currentProps).hoistableStyles,
-          resource$31 = styles$30.get(type);
-        resource$31 ||
+        var styles$52 = getResourcesFromRoot(currentProps).hoistableStyles,
+          resource$53 = styles$52.get(type);
+        resource$53 ||
           ((currentProps = currentProps.ownerDocument || currentProps),
-          (resource$31 = {
+          (resource$53 = {
             type: "stylesheet",
             instance: null,
             count: 0,
             state: { loading: 0, preload: null }
           }),
-          styles$30.set(type, resource$31),
+          styles$52.set(type, resource$53),
           preloadPropsMap.has(type) ||
             preloadStylesheet(
               currentProps,
@@ -2612,9 +2694,9 @@ function getResource(type, currentProps, pendingProps) {
                 hrefLang: pendingProps.hrefLang,
                 referrerPolicy: pendingProps.referrerPolicy
               },
-              resource$31.state
+              resource$53.state
             ));
-        return resource$31;
+        return resource$53;
       }
       return null;
     case "script":
@@ -2686,36 +2768,36 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$36 = hoistableRoot.querySelector(
+        var instance$58 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$36)
+        if (instance$58)
           return (
-            (resource.instance = instance$36),
-            markNodeAsHoistable(instance$36),
-            instance$36
+            (resource.instance = instance$58),
+            markNodeAsHoistable(instance$58),
+            instance$58
           );
         key = stylesheetPropsFromRawProps(props);
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$36 = (
+        instance$58 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$36);
-        var linkInstance = instance$36;
+        markNodeAsHoistable(instance$58);
+        var linkInstance = instance$58;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
         });
-        setInitialProperties(instance$36, "link", key);
+        setInitialProperties(instance$58, "link", key);
         resource.state.loading |= 4;
-        insertStylesheet(instance$36, props.precedence, hoistableRoot);
-        return (resource.instance = instance$36);
+        insertStylesheet(instance$58, props.precedence, hoistableRoot);
+        return (resource.instance = instance$58);
       case "script":
-        instance$36 = getScriptKey(props.src);
+        instance$58 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$36
+            "script[async]" + instance$58
           ))
         )
           return (
@@ -2724,7 +2806,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$36)))
+        if ((styleProps = preloadPropsMap.get(instance$58)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -3481,8 +3563,8 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "video":
     case "audio":
-      for (var i = 0; i < mediaEventTypes.length; i++)
-        listenToNonDelegatedEvent(mediaEventTypes[i], instance);
+      for (type = 0; type < mediaEventTypes.length; type++)
+        listenToNonDelegatedEvent(mediaEventTypes[type], instance);
       break;
     case "source":
       listenToNonDelegatedEvent("error", instance);
@@ -3499,6 +3581,8 @@ function prepareToHydrateHostInstance(fiber) {
     case "input":
       initWrapperState$2(instance, props);
       listenToNonDelegatedEvent("invalid", instance);
+      track(instance);
+      postMountWrapper$3(instance, props, !0);
       break;
     case "select":
       instance._wrapperState = { wasMultiple: !!props.multiple };
@@ -3506,34 +3590,21 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "textarea":
       initWrapperState(instance, props),
-        listenToNonDelegatedEvent("invalid", instance);
+        listenToNonDelegatedEvent("invalid", instance),
+        track(instance),
+        postMountWrapper(instance);
   }
-  props.hasOwnProperty("onScroll") &&
-    listenToNonDelegatedEvent("scroll", instance);
   var updatePayload = null;
-  i = props.children;
-  ("string" !== typeof i && "number" !== typeof i) ||
-    instance.textContent === "" + i ||
+  type = props.children;
+  ("string" !== typeof type && "number" !== typeof type) ||
+    instance.textContent === "" + type ||
     (!0 !== props.suppressHydrationWarning &&
       ((updatePayload = instance.textContent),
-      normalizeMarkupForTextOrAttribute(i),
+      normalizeMarkupForTextOrAttribute(type),
       normalizeMarkupForTextOrAttribute(updatePayload)),
-    (updatePayload = ["children", i]));
-  switch (type) {
-    case "input":
-      track(instance);
-      postMountWrapper$3(instance, props, !0);
-      break;
-    case "textarea":
-      track(instance);
-      postMountWrapper(instance);
-      break;
-    case "select":
-    case "option":
-      break;
-    default:
-      "function" === typeof props.onClick && (instance.onclick = noop$2);
-  }
+    (updatePayload = ["children", type]));
+  null != props.onScroll && listenToNonDelegatedEvent("scroll", instance);
+  null != props.onClick && (instance.onclick = noop$2);
   instance = updatePayload;
   fiber.updateQueue = instance;
   return null !== instance ? !0 : !1;
@@ -5015,10 +5086,10 @@ createFunctionComponentUpdateQueue = function () {
 function use(usable) {
   if (null !== usable && "object" === typeof usable) {
     if ("function" === typeof usable.then) {
-      var index$78 = thenableIndexCounter;
+      var index$100 = thenableIndexCounter;
       thenableIndexCounter += 1;
       null === thenableState && (thenableState = []);
-      usable = trackUsedThenable(thenableState, usable, index$78);
+      usable = trackUsedThenable(thenableState, usable, index$100);
       null === currentlyRenderingFiber$1.alternate &&
         (null === workInProgressHook
           ? null === currentlyRenderingFiber$1.memoizedState
@@ -5510,16 +5581,16 @@ function refreshCache(fiber, seedKey, seedValue) {
       case 3:
         var lane = requestUpdateLane(provider);
         fiber = createUpdate(lane);
-        var root$84 = enqueueUpdate(provider, fiber, lane);
-        if (null !== root$84) {
+        var root$106 = enqueueUpdate(provider, fiber, lane);
+        if (null !== root$106) {
           var eventTime = requestEventTime();
-          scheduleUpdateOnFiber(root$84, provider, lane, eventTime);
-          entangleTransitions(root$84, provider, lane);
+          scheduleUpdateOnFiber(root$106, provider, lane, eventTime);
+          entangleTransitions(root$106, provider, lane);
         }
         provider = createCache();
         null !== seedKey &&
           void 0 !== seedKey &&
-          null !== root$84 &&
+          null !== root$106 &&
           provider.data.set(seedKey, seedValue);
         fiber.payload = { cache: provider };
         return;
@@ -5728,15 +5799,15 @@ var HooksDispatcherOnMount = {
       getServerSnapshot = getServerSnapshot();
     } else {
       getServerSnapshot = getSnapshot();
-      var root$80 = workInProgressRoot;
-      if (null === root$80) throw Error(formatProdErrorMessage(349));
-      includesBlockingLane(root$80, renderLanes$1) ||
+      var root$102 = workInProgressRoot;
+      if (null === root$102) throw Error(formatProdErrorMessage(349));
+      includesBlockingLane(root$102, renderLanes$1) ||
         pushStoreConsistencyCheck(fiber, getSnapshot, getServerSnapshot);
     }
     hook.memoizedState = getServerSnapshot;
-    root$80 = { value: getServerSnapshot, getSnapshot: getSnapshot };
-    hook.queue = root$80;
-    mountEffect(subscribeToStore.bind(null, fiber, root$80, subscribe), [
+    root$102 = { value: getServerSnapshot, getSnapshot: getSnapshot };
+    hook.queue = root$102;
+    mountEffect(subscribeToStore.bind(null, fiber, root$102, subscribe), [
       subscribe
     ]);
     fiber.flags |= 2048;
@@ -5745,7 +5816,7 @@ var HooksDispatcherOnMount = {
       updateStoreInstance.bind(
         null,
         fiber,
-        root$80,
+        root$102,
         getServerSnapshot,
         getSnapshot
       ),
@@ -6313,10 +6384,10 @@ var markerInstanceStack = createCursor(null);
 function pushRootMarkerInstance(workInProgress) {
   if (enableTransitionTracing) {
     var transitions = workInProgressTransitions,
-      root$97 = workInProgress.stateNode;
+      root$119 = workInProgress.stateNode;
     null !== transitions &&
       transitions.forEach(function (transition) {
-        if (!root$97.incompleteTransitions.has(transition)) {
+        if (!root$119.incompleteTransitions.has(transition)) {
           var markerInstance = {
             tag: 0,
             transitions: new Set([transition]),
@@ -6324,11 +6395,11 @@ function pushRootMarkerInstance(workInProgress) {
             aborts: null,
             name: null
           };
-          root$97.incompleteTransitions.set(transition, markerInstance);
+          root$119.incompleteTransitions.set(transition, markerInstance);
         }
       });
     var markerInstances = [];
-    root$97.incompleteTransitions.forEach(function (markerInstance) {
+    root$119.incompleteTransitions.forEach(function (markerInstance) {
       markerInstances.push(markerInstance);
     });
     push(markerInstanceStack, markerInstances);
@@ -7041,14 +7112,14 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
   }
   JSCompiler_temp = current.memoizedState;
   if (null !== JSCompiler_temp) {
-    var dehydrated$104 = JSCompiler_temp.dehydrated;
-    if (null !== dehydrated$104)
+    var dehydrated$126 = JSCompiler_temp.dehydrated;
+    if (null !== dehydrated$126)
       return updateDehydratedSuspenseComponent(
         current,
         workInProgress,
         didSuspend,
         nextProps,
-        dehydrated$104,
+        dehydrated$126,
         JSCompiler_temp,
         renderLanes
       );
@@ -7058,7 +7129,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
     showFallback = nextProps.fallback;
     didSuspend = workInProgress.mode;
     JSCompiler_temp = current.child;
-    dehydrated$104 = JSCompiler_temp.sibling;
+    dehydrated$126 = JSCompiler_temp.sibling;
     var primaryChildProps = { mode: "hidden", children: nextProps.children };
     0 === (didSuspend & 1) && workInProgress.child !== JSCompiler_temp
       ? ((nextProps = workInProgress.child),
@@ -7072,8 +7143,8 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
         (workInProgress.deletions = null))
       : ((nextProps = createWorkInProgress(JSCompiler_temp, primaryChildProps)),
         (nextProps.subtreeFlags = JSCompiler_temp.subtreeFlags & 31457280));
-    null !== dehydrated$104
-      ? (showFallback = createWorkInProgress(dehydrated$104, showFallback))
+    null !== dehydrated$126
+      ? (showFallback = createWorkInProgress(dehydrated$126, showFallback))
       : ((showFallback = createFiberFromFragment(
           showFallback,
           didSuspend,
@@ -7092,10 +7163,10 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
       ? (didSuspend = mountSuspenseOffscreenState(renderLanes))
       : ((JSCompiler_temp = didSuspend.cachePool),
         null !== JSCompiler_temp
-          ? ((dehydrated$104 = CacheContext._currentValue),
+          ? ((dehydrated$126 = CacheContext._currentValue),
             (JSCompiler_temp =
-              JSCompiler_temp.parent !== dehydrated$104
-                ? { parent: dehydrated$104, pool: dehydrated$104 }
+              JSCompiler_temp.parent !== dehydrated$126
+                ? { parent: dehydrated$126, pool: dehydrated$126 }
                 : JSCompiler_temp))
           : (JSCompiler_temp = getSuspendedCache()),
         (didSuspend = {
@@ -7109,23 +7180,23 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
         ((JSCompiler_temp = enableTransitionTracing
           ? markerInstanceStack.current
           : null),
-        (dehydrated$104 = showFallback.updateQueue),
+        (dehydrated$126 = showFallback.updateQueue),
         (primaryChildProps = current.updateQueue),
-        null === dehydrated$104
+        null === dehydrated$126
           ? (showFallback.updateQueue = {
               transitions: didSuspend,
               markerInstances: JSCompiler_temp,
               retryQueue: null
             })
-          : dehydrated$104 === primaryChildProps
+          : dehydrated$126 === primaryChildProps
           ? (showFallback.updateQueue = {
               transitions: didSuspend,
               markerInstances: JSCompiler_temp,
               retryQueue:
                 null !== primaryChildProps ? primaryChildProps.retryQueue : null
             })
-          : ((dehydrated$104.transitions = didSuspend),
-            (dehydrated$104.markerInstances = JSCompiler_temp))));
+          : ((dehydrated$126.transitions = didSuspend),
+            (dehydrated$126.markerInstances = JSCompiler_temp))));
     showFallback.childLanes = current.childLanes & ~renderLanes;
     workInProgress.memoizedState = SUSPENDED_MARKER;
     return nextProps;
@@ -8100,177 +8171,62 @@ function markRef(workInProgress) {
   workInProgress.flags |= 2097664;
 }
 function updateHostComponent(current, workInProgress, type, newProps) {
-  var oldProps = current.memoizedProps;
-  if (oldProps !== newProps) {
-    current = workInProgress.stateNode;
-    var updatePayload = null;
-    switch (type) {
-      case "input":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-        type = getHostProps$2(current, oldProps);
-        newProps = getHostProps$2(current, newProps);
-        updatePayload = [];
-        break;
-      case "select":
-        type = assign({}, oldProps, { value: void 0 });
-        newProps = assign({}, newProps, { value: void 0 });
-        updatePayload = [];
-        break;
-      case "textarea":
-        type = getHostProps(current, oldProps);
-        newProps = getHostProps(current, newProps);
-        updatePayload = [];
-        break;
-      case "img":
-      case "link":
-      case "area":
-      case "base":
-      case "br":
-      case "col":
-      case "embed":
-      case "hr":
-      case "keygen":
-      case "meta":
-      case "param":
-      case "source":
-      case "track":
-      case "wbr":
-      case "menuitem":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-      default:
-        (type = oldProps),
-          "function" !== typeof type.onClick &&
-            "function" === typeof newProps.onClick &&
-            (current.onclick = noop$2);
-    }
-    var styleName;
-    oldProps = null;
-    for (JSCompiler_inline_result in type)
+  current = current.memoizedProps;
+  if (current !== newProps) {
+    type = null;
+    var propKey,
+      styleName,
+      styleUpdates = null;
+    for (propKey in current)
       if (
-        !newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        type.hasOwnProperty(JSCompiler_inline_result) &&
-        null != type[JSCompiler_inline_result]
+        !newProps.hasOwnProperty(propKey) &&
+        current.hasOwnProperty(propKey) &&
+        null != current[propKey]
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            var lastStyle = type[JSCompiler_inline_result];
+            var lastStyle = current[propKey];
             for (styleName in lastStyle)
               lastStyle.hasOwnProperty(styleName) &&
-                (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
+                (styleUpdates || (styleUpdates = {}),
+                (styleUpdates[styleName] = ""));
             break;
-          case "dangerouslySetInnerHTML":
-          case "children":
-            break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  null
-                );
+            (type = type || []).push(propKey, null);
         }
-    for (JSCompiler_inline_result in newProps) {
-      var nextProp = newProps[JSCompiler_inline_result];
-      lastStyle = null != type ? type[JSCompiler_inline_result] : void 0;
+    for (propKey in newProps) {
+      lastStyle = newProps[propKey];
+      var lastProp = null != current ? current[propKey] : void 0;
       if (
-        newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        nextProp !== lastStyle &&
-        (null != nextProp || null != lastStyle)
+        newProps.hasOwnProperty(propKey) &&
+        lastStyle !== lastProp &&
+        (null != lastStyle || null != lastProp)
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            if (null != nextProp && "object" !== typeof nextProp)
-              throw Error(formatProdErrorMessage(62));
-            if (lastStyle) {
+            if (lastProp) {
+              for (styleName in lastProp)
+                !lastProp.hasOwnProperty(styleName) ||
+                  (lastStyle && lastStyle.hasOwnProperty(styleName)) ||
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = ""));
               for (styleName in lastStyle)
-                !lastStyle.hasOwnProperty(styleName) ||
-                  (nextProp && nextProp.hasOwnProperty(styleName)) ||
-                  (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-              for (styleName in nextProp)
-                nextProp.hasOwnProperty(styleName) &&
-                  lastStyle[styleName] !== nextProp[styleName] &&
-                  (oldProps || (oldProps = {}),
-                  (oldProps[styleName] = nextProp[styleName]));
+                lastStyle.hasOwnProperty(styleName) &&
+                  lastProp[styleName] !== lastStyle[styleName] &&
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = lastStyle[styleName]));
             } else
-              oldProps ||
-                (updatePayload || (updatePayload = []),
-                updatePayload.push(JSCompiler_inline_result, oldProps)),
-                (oldProps = nextProp);
-            break;
-          case "dangerouslySetInnerHTML":
-            if (null != nextProp) {
-              if ("object" !== typeof nextProp || !("__html" in nextProp))
-                throw Error(formatProdErrorMessage(61));
-              nextProp = nextProp.__html;
-              if (null != nextProp) {
-                if (null != newProps.children)
-                  throw Error(formatProdErrorMessage(60));
-                (lastStyle ? lastStyle.__html : void 0) !== nextProp &&
-                  (updatePayload = updatePayload || []).push(
-                    JSCompiler_inline_result,
-                    nextProp
-                  );
-              }
-            }
-            break;
-          case "children":
-            ("string" !== typeof nextProp && "number" !== typeof nextProp) ||
-              (updatePayload = updatePayload || []).push(
-                JSCompiler_inline_result,
-                "" + nextProp
-              );
-            break;
-          case "onScroll":
-            null != nextProp && listenToNonDelegatedEvent("scroll", current);
-            updatePayload || lastStyle === nextProp || (updatePayload = []);
+              styleUpdates ||
+                (type || (type = []), type.push(propKey, styleUpdates)),
+                (styleUpdates = lastStyle);
             break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || lastStyle === nextProp || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  nextProp
-                );
+            (type = type || []).push(propKey, lastStyle);
         }
     }
-    oldProps && (updatePayload = updatePayload || []).push("style", oldProps);
-    var JSCompiler_inline_result = updatePayload;
-    (workInProgress.updateQueue = JSCompiler_inline_result) &&
-      markUpdate(workInProgress);
+    styleUpdates && (type = type || []).push("style", styleUpdates);
+    newProps = type;
+    (workInProgress.updateQueue = newProps) && markUpdate(workInProgress);
   }
 }
 function preloadResourceAndSuspendIfNeeded(workInProgress, resource) {
@@ -8315,14 +8271,14 @@ function cutOffTailIfNeeded(renderState, hasRenderedATailFallback) {
         break;
       case "collapsed":
         lastTailNode = renderState.tail;
-        for (var lastTailNode$136 = null; null !== lastTailNode; )
-          null !== lastTailNode.alternate && (lastTailNode$136 = lastTailNode),
+        for (var lastTailNode$158 = null; null !== lastTailNode; )
+          null !== lastTailNode.alternate && (lastTailNode$158 = lastTailNode),
             (lastTailNode = lastTailNode.sibling);
-        null === lastTailNode$136
+        null === lastTailNode$158
           ? hasRenderedATailFallback || null === renderState.tail
             ? (renderState.tail = null)
             : (renderState.tail.sibling = null)
-          : (lastTailNode$136.sibling = null);
+          : (lastTailNode$158.sibling = null);
     }
 }
 function bubbleProperties(completedWork) {
@@ -8334,53 +8290,53 @@ function bubbleProperties(completedWork) {
   if (didBailout)
     if (0 !== (completedWork.mode & 2)) {
       for (
-        var treeBaseDuration$138 = completedWork.selfBaseDuration,
-          child$139 = completedWork.child;
-        null !== child$139;
+        var treeBaseDuration$160 = completedWork.selfBaseDuration,
+          child$161 = completedWork.child;
+        null !== child$161;
 
       )
-        (newChildLanes |= child$139.lanes | child$139.childLanes),
-          (subtreeFlags |= child$139.subtreeFlags & 31457280),
-          (subtreeFlags |= child$139.flags & 31457280),
-          (treeBaseDuration$138 += child$139.treeBaseDuration),
-          (child$139 = child$139.sibling);
-      completedWork.treeBaseDuration = treeBaseDuration$138;
+        (newChildLanes |= child$161.lanes | child$161.childLanes),
+          (subtreeFlags |= child$161.subtreeFlags & 31457280),
+          (subtreeFlags |= child$161.flags & 31457280),
+          (treeBaseDuration$160 += child$161.treeBaseDuration),
+          (child$161 = child$161.sibling);
+      completedWork.treeBaseDuration = treeBaseDuration$160;
     } else
       for (
-        treeBaseDuration$138 = completedWork.child;
-        null !== treeBaseDuration$138;
+        treeBaseDuration$160 = completedWork.child;
+        null !== treeBaseDuration$160;
 
       )
         (newChildLanes |=
-          treeBaseDuration$138.lanes | treeBaseDuration$138.childLanes),
-          (subtreeFlags |= treeBaseDuration$138.subtreeFlags & 31457280),
-          (subtreeFlags |= treeBaseDuration$138.flags & 31457280),
-          (treeBaseDuration$138.return = completedWork),
-          (treeBaseDuration$138 = treeBaseDuration$138.sibling);
+          treeBaseDuration$160.lanes | treeBaseDuration$160.childLanes),
+          (subtreeFlags |= treeBaseDuration$160.subtreeFlags & 31457280),
+          (subtreeFlags |= treeBaseDuration$160.flags & 31457280),
+          (treeBaseDuration$160.return = completedWork),
+          (treeBaseDuration$160 = treeBaseDuration$160.sibling);
   else if (0 !== (completedWork.mode & 2)) {
-    treeBaseDuration$138 = completedWork.actualDuration;
-    child$139 = completedWork.selfBaseDuration;
+    treeBaseDuration$160 = completedWork.actualDuration;
+    child$161 = completedWork.selfBaseDuration;
     for (var child = completedWork.child; null !== child; )
       (newChildLanes |= child.lanes | child.childLanes),
         (subtreeFlags |= child.subtreeFlags),
         (subtreeFlags |= child.flags),
-        (treeBaseDuration$138 += child.actualDuration),
-        (child$139 += child.treeBaseDuration),
+        (treeBaseDuration$160 += child.actualDuration),
+        (child$161 += child.treeBaseDuration),
         (child = child.sibling);
-    completedWork.actualDuration = treeBaseDuration$138;
-    completedWork.treeBaseDuration = child$139;
+    completedWork.actualDuration = treeBaseDuration$160;
+    completedWork.treeBaseDuration = child$161;
   } else
     for (
-      treeBaseDuration$138 = completedWork.child;
-      null !== treeBaseDuration$138;
+      treeBaseDuration$160 = completedWork.child;
+      null !== treeBaseDuration$160;
 
     )
       (newChildLanes |=
-        treeBaseDuration$138.lanes | treeBaseDuration$138.childLanes),
-        (subtreeFlags |= treeBaseDuration$138.subtreeFlags),
-        (subtreeFlags |= treeBaseDuration$138.flags),
-        (treeBaseDuration$138.return = completedWork),
-        (treeBaseDuration$138 = treeBaseDuration$138.sibling);
+        treeBaseDuration$160.lanes | treeBaseDuration$160.childLanes),
+        (subtreeFlags |= treeBaseDuration$160.subtreeFlags),
+        (subtreeFlags |= treeBaseDuration$160.flags),
+        (treeBaseDuration$160.return = completedWork),
+        (treeBaseDuration$160 = treeBaseDuration$160.sibling);
   completedWork.subtreeFlags |= subtreeFlags;
   completedWork.childLanes = newChildLanes;
   return didBailout;
@@ -9183,8 +9139,8 @@ function safelyDetachRef(current, nearestMountedAncestor) {
             recordLayoutEffectDuration(current);
           }
         else ref(null);
-      } catch (error$172) {
-        captureCommitPhaseError(current, nearestMountedAncestor, error$172);
+      } catch (error$194) {
+        captureCommitPhaseError(current, nearestMountedAncestor, error$194);
       }
     else ref.current = null;
 }
@@ -9482,11 +9438,11 @@ function commitPassiveEffectDurations(finishedRoot, finishedWork) {
         var _finishedWork$memoize = finishedWork.memoizedProps,
           id = _finishedWork$memoize.id;
         _finishedWork$memoize = _finishedWork$memoize.onPostCommit;
-        var commitTime$174 = commitTime,
+        var commitTime$196 = commitTime,
           phase = null === finishedWork.alternate ? "mount" : "update";
         currentUpdateIsNested && (phase = "nested-update");
         "function" === typeof _finishedWork$memoize &&
-          _finishedWork$memoize(id, phase, finishedRoot, commitTime$174);
+          _finishedWork$memoize(id, phase, finishedRoot, commitTime$196);
         finishedWork = finishedWork.return;
         a: for (; null !== finishedWork; ) {
           switch (finishedWork.tag) {
@@ -9513,8 +9469,8 @@ function commitHookLayoutEffects(finishedWork, hookFlags) {
   } else
     try {
       commitHookEffectListMount(hookFlags, finishedWork);
-    } catch (error$176) {
-      captureCommitPhaseError(finishedWork, finishedWork.return, error$176);
+    } catch (error$198) {
+      captureCommitPhaseError(finishedWork, finishedWork.return, error$198);
     }
 }
 function commitClassCallbacks(finishedWork) {
@@ -9613,11 +9569,11 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
           } else
             try {
               finishedRoot.componentDidMount();
-            } catch (error$177) {
+            } catch (error$199) {
               captureCommitPhaseError(
                 finishedWork,
                 finishedWork.return,
-                error$177
+                error$199
               );
             }
         else {
@@ -9634,11 +9590,11 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
                   current,
                   finishedRoot.__reactInternalSnapshotBeforeUpdate
                 );
-            } catch (error$178) {
+            } catch (error$200) {
               captureCommitPhaseError(
                 finishedWork,
                 finishedWork.return,
-                error$178
+                error$200
               );
             }
             recordLayoutEffectDuration(finishedWork);
@@ -9649,11 +9605,11 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
                 current,
                 finishedRoot.__reactInternalSnapshotBeforeUpdate
               );
-            } catch (error$179) {
+            } catch (error$201) {
               captureCommitPhaseError(
                 finishedWork,
                 finishedWork.return,
-                error$179
+                error$201
               );
             }
         }
@@ -10352,22 +10308,22 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
           try {
             startLayoutEffectTimer(),
               commitHookEffectListUnmount(5, finishedWork, finishedWork.return);
-          } catch (error$194) {
+          } catch (error$216) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$194
+              error$216
             );
           }
           recordLayoutEffectDuration(finishedWork);
         } else
           try {
             commitHookEffectListUnmount(5, finishedWork, finishedWork.return);
-          } catch (error$195) {
+          } catch (error$217) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$195
+              error$217
             );
           }
       }
@@ -10546,11 +10502,11 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
               newProps
             );
             domElement[internalPropsKey] = newProps;
-          } catch (error$196) {
+          } catch (error$218) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$196
+              error$218
             );
           }
       break;
@@ -10586,8 +10542,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         root = finishedWork.stateNode;
         try {
           setTextContent(root, "");
-        } catch (error$197) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$197);
+        } catch (error$219) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$219);
         }
       }
       if (
@@ -10604,8 +10560,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         try {
           updateProperties(flags, maybeNodes, hoistableRoot, current, root),
             (flags[internalPropsKey] = root);
-        } catch (error$200) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$200);
+        } catch (error$222) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$222);
         }
       break;
     case 6:
@@ -10618,8 +10574,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         flags = finishedWork.memoizedProps;
         try {
           current.nodeValue = flags;
-        } catch (error$201) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$201);
+        } catch (error$223) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$223);
         }
       }
       break;
@@ -10633,8 +10589,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
       if (flags & 4 && null !== current && current.memoizedState.isDehydrated)
         try {
           retryIfBlockedOn(root.containerInfo);
-        } catch (error$202) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$202);
+        } catch (error$224) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$224);
         }
       break;
     case 4:
@@ -10664,8 +10620,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
               null !== retryQueue && suspenseCallback(new Set(retryQueue));
             }
           }
-        } catch (error$204) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$204);
+        } catch (error$226) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$226);
         }
         current = finishedWork.updateQueue;
         null !== current &&
@@ -10743,11 +10699,11 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
             if (null === current)
               try {
                 root.stateNode.nodeValue = domElement ? "" : root.memoizedProps;
-              } catch (error$184) {
+              } catch (error$206) {
                 captureCommitPhaseError(
                   finishedWork,
                   finishedWork.return,
-                  error$184
+                  error$206
                 );
               }
           } else if (
@@ -10822,21 +10778,21 @@ function commitReconciliationEffects(finishedWork) {
             insertOrAppendPlacementNode(finishedWork, before, parent$jscomp$0);
             break;
           case 5:
-            var parent$185 = JSCompiler_inline_result.stateNode;
+            var parent$207 = JSCompiler_inline_result.stateNode;
             JSCompiler_inline_result.flags & 32 &&
-              (setTextContent(parent$185, ""),
+              (setTextContent(parent$207, ""),
               (JSCompiler_inline_result.flags &= -33));
-            var before$186 = getHostSibling(finishedWork);
-            insertOrAppendPlacementNode(finishedWork, before$186, parent$185);
+            var before$208 = getHostSibling(finishedWork);
+            insertOrAppendPlacementNode(finishedWork, before$208, parent$207);
             break;
           case 3:
           case 4:
-            var parent$187 = JSCompiler_inline_result.stateNode.containerInfo,
-              before$188 = getHostSibling(finishedWork);
+            var parent$209 = JSCompiler_inline_result.stateNode.containerInfo,
+              before$210 = getHostSibling(finishedWork);
             insertOrAppendPlacementNodeIntoContainer(
               finishedWork,
-              before$188,
-              parent$187
+              before$210,
+              parent$209
             );
             break;
           default:
@@ -11028,8 +10984,8 @@ function commitHookPassiveMountEffects(finishedWork, hookFlags) {
   } else
     try {
       commitHookEffectListMount(hookFlags, finishedWork);
-    } catch (error$210) {
-      captureCommitPhaseError(finishedWork, finishedWork.return, error$210);
+    } catch (error$232) {
+      captureCommitPhaseError(finishedWork, finishedWork.return, error$232);
     }
 }
 function commitOffscreenPassiveMountEffects(current, finishedWork, instance) {
@@ -11328,9 +11284,9 @@ function recursivelyTraverseReconnectPassiveEffects(
           );
         break;
       case 22:
-        var instance$215 = finishedWork.stateNode;
+        var instance$237 = finishedWork.stateNode;
         null !== finishedWork.memoizedState
-          ? instance$215._visibility & 4
+          ? instance$237._visibility & 4
             ? recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork,
@@ -11343,7 +11299,7 @@ function recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork
               )
-            : ((instance$215._visibility |= 4),
+            : ((instance$237._visibility |= 4),
               recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork,
@@ -11351,7 +11307,7 @@ function recursivelyTraverseReconnectPassiveEffects(
                 committedTransitions,
                 includeWorkInProgressEffects
               ))
-          : ((instance$215._visibility |= 4),
+          : ((instance$237._visibility |= 4),
             recursivelyTraverseReconnectPassiveEffects(
               finishedRoot,
               finishedWork,
@@ -11364,7 +11320,7 @@ function recursivelyTraverseReconnectPassiveEffects(
           commitOffscreenPassiveMountEffects(
             finishedWork.alternate,
             finishedWork,
-            instance$215
+            instance$237
           );
         break;
       case 24:
@@ -12000,16 +11956,16 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
         exitStatus = renderRootSync(root, lanes);
         if (2 === exitStatus) {
           errorRetryLanes = lanes;
-          var errorRetryLanes$224 = getLanesToRetrySynchronouslyOnError(
+          var errorRetryLanes$246 = getLanesToRetrySynchronouslyOnError(
             root,
             errorRetryLanes
           );
-          0 !== errorRetryLanes$224 &&
-            ((lanes = errorRetryLanes$224),
+          0 !== errorRetryLanes$246 &&
+            ((lanes = errorRetryLanes$246),
             (exitStatus = recoverFromConcurrentError(
               root,
               errorRetryLanes,
-              errorRetryLanes$224
+              errorRetryLanes$246
             )));
         }
         if (1 === exitStatus)
@@ -12070,14 +12026,14 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
           if ((lanes & 8388480) === lanes) break;
           exitStatus = lanes;
           errorRetryLanes = root.eventTimes;
-          for (errorRetryLanes$224 = -1; 0 < exitStatus; ) {
+          for (errorRetryLanes$246 = -1; 0 < exitStatus; ) {
             var index$3 = 31 - clz32(exitStatus),
               lane = 1 << index$3;
             index$3 = errorRetryLanes[index$3];
-            index$3 > errorRetryLanes$224 && (errorRetryLanes$224 = index$3);
+            index$3 > errorRetryLanes$246 && (errorRetryLanes$246 = index$3);
             exitStatus &= ~lane;
           }
-          exitStatus = errorRetryLanes$224;
+          exitStatus = errorRetryLanes$246;
           exitStatus = now$1() - exitStatus;
           exitStatus =
             (120 > exitStatus
@@ -12489,8 +12445,8 @@ function renderRootSync(root, lanes) {
         }
       workLoopSync();
       break;
-    } catch (thrownValue$227) {
-      handleThrow(root, thrownValue$227);
+    } catch (thrownValue$249) {
+      handleThrow(root, thrownValue$249);
     }
   while (1);
   resetContextDependencies();
@@ -12607,8 +12563,8 @@ function renderRootConcurrent(root, lanes) {
         }
       workLoopConcurrent();
       break;
-    } catch (thrownValue$229) {
-      handleThrow(root, thrownValue$229);
+    } catch (thrownValue$251) {
+      handleThrow(root, thrownValue$251);
     }
   while (1);
   resetContextDependencies();
@@ -12783,10 +12739,10 @@ function throwAndUnwindWorkLoop(unitOfWork, thrownValue) {
                       };
                       suspenseBoundary.updateQueue = newOffscreenQueue;
                     } else {
-                      var retryQueue$92 = offscreenQueue.retryQueue;
-                      null === retryQueue$92
+                      var retryQueue$114 = offscreenQueue.retryQueue;
+                      null === retryQueue$114
                         ? (offscreenQueue.retryQueue = new Set([wakeable]))
-                        : retryQueue$92.add(wakeable);
+                        : retryQueue$114.add(wakeable);
                     }
                   }
                   break;
@@ -12997,7 +12953,7 @@ function commitRootImpl(
     var prevExecutionContext = executionContext;
     executionContext |= 4;
     ReactCurrentOwner.current = null;
-    var shouldFireAfterActiveInstanceBlur$231 = commitBeforeMutationEffects(
+    var shouldFireAfterActiveInstanceBlur$253 = commitBeforeMutationEffects(
       root,
       finishedWork
     );
@@ -13005,7 +12961,7 @@ function commitRootImpl(
     enableProfilerNestedUpdateScheduledHook &&
       (rootCommittingMutationOrLayoutEffects = root);
     commitMutationEffects(root, finishedWork, lanes);
-    shouldFireAfterActiveInstanceBlur$231 &&
+    shouldFireAfterActiveInstanceBlur$253 &&
       ((_enabled = !0),
       dispatchAfterDetachedBlur(selectionInformation.focusedElem),
       (_enabled = !1));
@@ -13099,7 +13055,7 @@ function releaseRootPooledCache(root, remainingLanes) {
 }
 function flushPassiveEffects() {
   if (null !== rootWithPendingPassiveEffects) {
-    var root$232 = rootWithPendingPassiveEffects,
+    var root$254 = rootWithPendingPassiveEffects,
       remainingLanes = pendingPassiveEffectsRemainingLanes;
     pendingPassiveEffectsRemainingLanes = 0;
     var renderPriority = lanesToEventPriority(pendingPassiveEffectsLanes);
@@ -13115,7 +13071,7 @@ function flushPassiveEffects() {
     } finally {
       (currentUpdatePriority = previousPriority),
         (ReactCurrentBatchConfig$1.transition = prevTransition),
-        releaseRootPooledCache(root$232, remainingLanes);
+        releaseRootPooledCache(root$254, remainingLanes);
     }
   }
   return !1;
@@ -14485,12 +14441,12 @@ function getPublicRootInstance(container) {
 function attemptSynchronousHydration(fiber) {
   switch (fiber.tag) {
     case 3:
-      var root$235 = fiber.stateNode;
-      if (root$235.current.memoizedState.isDehydrated) {
-        var lanes = getHighestPriorityLanes(root$235.pendingLanes);
+      var root$257 = fiber.stateNode;
+      if (root$257.current.memoizedState.isDehydrated) {
+        var lanes = getHighestPriorityLanes(root$257.pendingLanes);
         0 !== lanes &&
-          (markRootEntangled(root$235, lanes | 2),
-          ensureRootIsScheduled(root$235, now$1()),
+          (markRootEntangled(root$257, lanes | 2),
+          ensureRootIsScheduled(root$257, now$1()),
           0 === (executionContext & 6) &&
             ((workInProgressRootRenderTargetTime = now$1() + 500),
             flushSyncCallbacks()));
@@ -15062,19 +15018,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$338;
+  var JSCompiler_inline_result$jscomp$359;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1682 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1682) {
-      var element$jscomp$inline_1683 = document.createElement("div");
-      element$jscomp$inline_1683.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1682 =
-        "function" === typeof element$jscomp$inline_1683.oninput;
+    var isSupported$jscomp$inline_1700 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1700) {
+      var element$jscomp$inline_1701 = document.createElement("div");
+      element$jscomp$inline_1701.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1700 =
+        "function" === typeof element$jscomp$inline_1701.oninput;
     }
-    JSCompiler_inline_result$jscomp$338 = isSupported$jscomp$inline_1682;
-  } else JSCompiler_inline_result$jscomp$338 = !1;
+    JSCompiler_inline_result$jscomp$359 = isSupported$jscomp$inline_1700;
+  } else JSCompiler_inline_result$jscomp$359 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$338 &&
+    JSCompiler_inline_result$jscomp$359 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -15212,20 +15168,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1695 = 0;
-  i$jscomp$inline_1695 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1695++
+  var i$jscomp$inline_1713 = 0;
+  i$jscomp$inline_1713 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1713++
 ) {
-  var eventName$jscomp$inline_1696 =
-      simpleEventPluginEvents[i$jscomp$inline_1695],
-    domEventName$jscomp$inline_1697 =
-      eventName$jscomp$inline_1696.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1698 =
-      eventName$jscomp$inline_1696[0].toUpperCase() +
-      eventName$jscomp$inline_1696.slice(1);
+  var eventName$jscomp$inline_1714 =
+      simpleEventPluginEvents[i$jscomp$inline_1713],
+    domEventName$jscomp$inline_1715 =
+      eventName$jscomp$inline_1714.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1716 =
+      eventName$jscomp$inline_1714[0].toUpperCase() +
+      eventName$jscomp$inline_1714.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1697,
-    "on" + capitalizedEvent$jscomp$inline_1698
+    domEventName$jscomp$inline_1715,
+    "on" + capitalizedEvent$jscomp$inline_1716
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -16804,11 +16760,11 @@ function legacyCreateRootFromDOMContainer(
     if ("function" === typeof callback) {
       var originalCallback = callback;
       callback = function () {
-        var instance = getPublicRootInstance(root$250);
+        var instance = getPublicRootInstance(root$272);
         originalCallback.call(instance);
       };
     }
-    var root$250 = createHydrationContainer(
+    var root$272 = createHydrationContainer(
       initialChildren,
       callback,
       container,
@@ -16820,23 +16776,23 @@ function legacyCreateRootFromDOMContainer(
       noopOnRecoverableError,
       null
     );
-    container._reactRootContainer = root$250;
-    container[internalContainerInstanceKey] = root$250.current;
+    container._reactRootContainer = root$272;
+    container[internalContainerInstanceKey] = root$272.current;
     listenToAllSupportedEvents(
       8 === container.nodeType ? container.parentNode : container
     );
     flushSync$1();
-    return root$250;
+    return root$272;
   }
   clearContainer(container);
   if ("function" === typeof callback) {
-    var originalCallback$251 = callback;
+    var originalCallback$273 = callback;
     callback = function () {
-      var instance = getPublicRootInstance(root$252);
-      originalCallback$251.call(instance);
+      var instance = getPublicRootInstance(root$274);
+      originalCallback$273.call(instance);
     };
   }
-  var root$252 = createFiberRoot(
+  var root$274 = createFiberRoot(
     container,
     0,
     !1,
@@ -16848,15 +16804,15 @@ function legacyCreateRootFromDOMContainer(
     noopOnRecoverableError,
     null
   );
-  container._reactRootContainer = root$252;
-  container[internalContainerInstanceKey] = root$252.current;
+  container._reactRootContainer = root$274;
+  container[internalContainerInstanceKey] = root$274.current;
   listenToAllSupportedEvents(
     8 === container.nodeType ? container.parentNode : container
   );
   flushSync$1(function () {
-    updateContainer(initialChildren, root$252, parentComponent, callback);
+    updateContainer(initialChildren, root$274, parentComponent, callback);
   });
-  return root$252;
+  return root$274;
 }
 function legacyRenderSubtreeIntoContainer(
   parentComponent,
@@ -16915,10 +16871,10 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1851 = {
+var devToolsConfig$jscomp$inline_1869 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-846a6f78",
+  version: "18.3.0-www-classic-aa612501",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -16936,10 +16892,10 @@ var devToolsConfig$jscomp$inline_1851 = {
   } catch (err) {}
   return hook.checkDCE ? !0 : !1;
 })({
-  bundleType: devToolsConfig$jscomp$inline_1851.bundleType,
-  version: devToolsConfig$jscomp$inline_1851.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1851.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1851.rendererConfig,
+  bundleType: devToolsConfig$jscomp$inline_1869.bundleType,
+  version: devToolsConfig$jscomp$inline_1869.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1869.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1869.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -16955,14 +16911,14 @@ var devToolsConfig$jscomp$inline_1851 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1851.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1869.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-846a6f78"
+  reconcilerVersion: "18.3.0-www-classic-aa612501"
 });
 assign(Internals, {
   ReactBrowserEventEmitter: {
@@ -17189,7 +17145,7 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-classic-846a6f78";
+exports.version = "18.3.0-www-classic-aa612501";
 
           /* 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 f1a92e41c29cc..778a8d91825ea 100644
--- a/compiled/facebook-www/ReactDOM-profiling.modern.js
+++ b/compiled/facebook-www/ReactDOM-profiling.modern.js
@@ -866,149 +866,8 @@ properties.formAction = new PropertyInfoRecord(
   );
 });
 var isJavaScriptProtocol =
-  /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i;
-function setValueForProperty(node, name, value) {
-  if (
-    !(2 < name.length) ||
-    ("o" !== name[0] && "O" !== name[0]) ||
-    ("n" !== name[1] && "N" !== name[1])
-  ) {
-    var JSCompiler_inline_result = properties.hasOwnProperty(name)
-      ? properties[name]
-      : null;
-    if (null !== JSCompiler_inline_result)
-      if (JSCompiler_inline_result.mustUseProperty)
-        node[JSCompiler_inline_result.propertyName] =
-          value && "function" !== typeof value && "symbol" !== typeof value;
-      else if (
-        ((name = JSCompiler_inline_result.attributeName), null === value)
-      )
-        node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (!JSCompiler_inline_result.acceptsBooleans) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        if (JSCompiler_inline_result.removeEmptyString && "" === value)
-          node.removeAttribute(name);
-        else
-          switch (JSCompiler_inline_result.type) {
-            case 3:
-              value ? node.setAttribute(name, "") : node.removeAttribute(name);
-              break;
-            case 4:
-              !0 === value
-                ? node.setAttribute(name, "")
-                : !1 === value
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 5:
-              isNaN(value)
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 6:
-              !isNaN(value) && 1 <= value
-                ? node.setAttribute(name, value)
-                : node.removeAttribute(name);
-              break;
-            default:
-              value = enableTrustedTypesIntegration ? value : "" + value;
-              if (
-                JSCompiler_inline_result.sanitizeURL &&
-                isJavaScriptProtocol.test(value.toString())
-              )
-                throw Error(formatProdErrorMessage(323));
-              (JSCompiler_inline_result =
-                JSCompiler_inline_result.attributeNamespace)
-                ? node.setAttributeNS(JSCompiler_inline_result, name, value)
-                : node.setAttribute(name, value);
-          }
-      }
-    else if (isAttributeNameSafe(name))
-      if (null === value) node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (
-              ((JSCompiler_inline_result = name.toLowerCase().slice(0, 5)),
-              "data-" !== JSCompiler_inline_result &&
-                "aria-" !== JSCompiler_inline_result)
-            ) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        node.setAttribute(
-          name,
-          enableTrustedTypesIntegration ? value : "" + value
-        );
-      }
-  }
-}
-function setValueForPropertyOnCustomComponent(node, name, value) {
-  if (
-    enableCustomElementPropertySupport &&
-    "o" === name[0] &&
-    "n" === name[1]
-  ) {
-    var useCapture = name.endsWith("Capture"),
-      eventName = name.substr(2, useCapture ? name.length - 9 : void 0),
-      prevProps = getFiberCurrentPropsFromNode(node);
-    prevProps = null != prevProps ? prevProps[name] : null;
-    "function" === typeof prevProps &&
-      node.removeEventListener(eventName, prevProps, useCapture);
-    if ("function" === typeof value) {
-      "function" !== typeof prevProps &&
-        null !== prevProps &&
-        (name in node
-          ? (node[name] = null)
-          : node.hasAttribute(name) && node.removeAttribute(name));
-      node.addEventListener(eventName, value, useCapture);
-      return;
-    }
-  }
-  if (enableCustomElementPropertySupport && name in node) node[name] = value;
-  else if (isAttributeNameSafe(name))
-    if (null === value) node.removeAttribute(name);
-    else {
-      switch (typeof value) {
-        case "undefined":
-        case "function":
-        case "symbol":
-          node.removeAttribute(name);
-          return;
-        case "boolean":
-          if (enableCustomElementPropertySupport) {
-            if (!0 === value) {
-              node.setAttribute(name, "");
-              return;
-            }
-            node.removeAttribute(name);
-            return;
-          }
-      }
-      node.setAttribute(
-        name,
-        enableTrustedTypesIntegration ? value : "" + value
-      );
-    }
-}
-var REACT_ELEMENT_TYPE = Symbol.for("react.element"),
+    /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i,
+  REACT_ELEMENT_TYPE = Symbol.for("react.element"),
   REACT_PORTAL_TYPE = Symbol.for("react.portal"),
   REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
   REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"),
@@ -1241,24 +1100,18 @@ function getActiveElement(doc) {
     return doc.body;
   }
 }
-function getHostProps$2(element, props) {
-  var checked = props.checked;
-  return assign({}, props, {
-    defaultChecked: void 0,
-    defaultValue: void 0,
-    value: void 0,
-    checked: null != checked ? checked : element._wrapperState.initialChecked
-  });
-}
 function initWrapperState$2(element, props) {
   var defaultValue = null == props.defaultValue ? "" : props.defaultValue,
-    JSCompiler_temp_const =
+    initialChecked =
       null != props.checked ? props.checked : props.defaultChecked;
   defaultValue = getToStringValue(
     null != props.value ? props.value : defaultValue
   );
   element._wrapperState = {
-    initialChecked: JSCompiler_temp_const,
+    initialChecked:
+      "function" !== typeof initialChecked &&
+      "symbol" !== typeof initialChecked &&
+      !!initialChecked,
     initialValue: defaultValue,
     controlled:
       "checkbox" === props.type || "radio" === props.type
@@ -1266,19 +1119,16 @@ function initWrapperState$2(element, props) {
         : null != props.value
   };
 }
-function updateChecked(element, props) {
-  props = props.checked;
-  null != props && (element.checked = props);
-}
 function updateWrapper$1(element, props) {
-  updateChecked(element, props);
-  var value = getToStringValue(props.value),
-    type = props.type;
-  if (null != value)
+  var checked = props.checked;
+  null != checked && (element.checked = checked);
+  checked = getToStringValue(props.value);
+  var type = props.type;
+  if (null != checked)
     if ("number" === type) {
-      if ((0 === value && "" === element.value) || element.value != value)
-        element.value = "" + value;
-    } else element.value !== "" + value && (element.value = "" + value);
+      if ((0 === checked && "" === element.value) || element.value != checked)
+        element.value = "" + checked;
+    } else element.value !== "" + checked && (element.value = "" + checked);
   else if ("submit" === type || "reset" === type) {
     element.removeAttribute("value");
     return;
@@ -1287,7 +1137,7 @@ function updateWrapper$1(element, props) {
     ? props.hasOwnProperty("defaultValue") &&
       setDefaultValue(element, props.type, getToStringValue(props.defaultValue))
     : props.hasOwnProperty("value")
-    ? setDefaultValue(element, props.type, value)
+    ? setDefaultValue(element, props.type, checked)
     : props.hasOwnProperty("defaultValue") &&
       setDefaultValue(
         element,
@@ -1325,11 +1175,11 @@ function postMountWrapper$3(element, props, isHydrating) {
   }
   type = element.name;
   "" !== type && (element.name = "");
+  isHydrating || (element.checked = !!element._wrapperState.initialChecked);
   disableInputAttributeSyncing
-    ? (isHydrating || updateChecked(element, props),
-      props.hasOwnProperty("defaultChecked") &&
-        ((element.defaultChecked = !element.defaultChecked),
-        (element.defaultChecked = !!props.defaultChecked)))
+    ? props.hasOwnProperty("defaultChecked") &&
+      ((element.defaultChecked = !element.defaultChecked),
+      (element.defaultChecked = !!props.defaultChecked))
     : (element.defaultChecked = !!element._wrapperState.initialChecked);
   "" !== type && (element.name = type);
 }
@@ -1364,22 +1214,15 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
     null !== multiple && (multiple.selected = !0);
   }
 }
-function getHostProps(element, props) {
-  if (null != props.dangerouslySetInnerHTML)
-    throw Error(formatProdErrorMessage(91));
-  return assign({}, props, {
-    value: void 0,
-    defaultValue: void 0,
-    children: "" + element._wrapperState.initialValue
-  });
-}
 function initWrapperState(element, props) {
   var initialValue = props.value;
   null == initialValue &&
     ((props = props.defaultValue),
     null == props && (props = ""),
     (initialValue = props));
-  element._wrapperState = { initialValue: getToStringValue(initialValue) };
+  props = getToStringValue(initialValue);
+  element.defaultValue = props;
+  element._wrapperState = { initialValue: props };
 }
 function updateWrapper(element, props) {
   var value = getToStringValue(props.value),
@@ -1511,30 +1354,6 @@ Object.keys(isUnitlessNumber).forEach(function (prop) {
     isUnitlessNumber[prefix] = isUnitlessNumber[prop];
   });
 });
-function setValueForStyles(node, styles) {
-  node = node.style;
-  for (var styleName in styles)
-    if (styles.hasOwnProperty(styleName)) {
-      var value = styles[styleName],
-        isCustomProperty = 0 === styleName.indexOf("--");
-      null == value || "boolean" === typeof value || "" === value
-        ? isCustomProperty
-          ? node.setProperty(styleName, "")
-          : "float" === styleName
-          ? (node.cssFloat = "")
-          : (node[styleName] = "")
-        : isCustomProperty
-        ? node.setProperty(styleName, value)
-        : "number" !== typeof value ||
-          0 === value ||
-          (isUnitlessNumber.hasOwnProperty(styleName) &&
-            isUnitlessNumber[styleName])
-        ? "float" === styleName
-          ? (node.cssFloat = value)
-          : (node[styleName] = ("" + value).trim())
-        : (node[styleName] = value + "px");
-    }
-}
 function isCustomComponent(tagName, props) {
   if (-1 === tagName.indexOf("-")) return "string" === typeof props.is;
   switch (tagName) {
@@ -1981,8 +1800,8 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "video":
     case "audio":
-      for (var i = 0; i < mediaEventTypes.length; i++)
-        listenToNonDelegatedEvent(mediaEventTypes[i], instance);
+      for (type = 0; type < mediaEventTypes.length; type++)
+        listenToNonDelegatedEvent(mediaEventTypes[type], instance);
       break;
     case "source":
       listenToNonDelegatedEvent("error", instance);
@@ -1999,6 +1818,8 @@ function prepareToHydrateHostInstance(fiber) {
     case "input":
       initWrapperState$2(instance, props);
       listenToNonDelegatedEvent("invalid", instance);
+      track(instance);
+      postMountWrapper$3(instance, props, !0);
       break;
     case "select":
       instance._wrapperState = { wasMultiple: !!props.multiple };
@@ -2006,34 +1827,21 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "textarea":
       initWrapperState(instance, props),
-        listenToNonDelegatedEvent("invalid", instance);
+        listenToNonDelegatedEvent("invalid", instance),
+        track(instance),
+        postMountWrapper(instance);
   }
-  props.hasOwnProperty("onScroll") &&
-    listenToNonDelegatedEvent("scroll", instance);
   var updatePayload = null;
-  i = props.children;
-  ("string" !== typeof i && "number" !== typeof i) ||
-    instance.textContent === "" + i ||
+  type = props.children;
+  ("string" !== typeof type && "number" !== typeof type) ||
+    instance.textContent === "" + type ||
     (!0 !== props.suppressHydrationWarning &&
       ((updatePayload = instance.textContent),
-      normalizeMarkupForTextOrAttribute(i),
+      normalizeMarkupForTextOrAttribute(type),
       normalizeMarkupForTextOrAttribute(updatePayload)),
-    (updatePayload = ["children", i]));
-  switch (type) {
-    case "input":
-      track(instance);
-      postMountWrapper$3(instance, props, !0);
-      break;
-    case "textarea":
-      track(instance);
-      postMountWrapper(instance);
-      break;
-    case "select":
-    case "option":
-      break;
-    default:
-      "function" === typeof props.onClick && (instance.onclick = noop$1);
-  }
+    (updatePayload = ["children", type]));
+  null != props.onScroll && listenToNonDelegatedEvent("scroll", instance);
+  null != props.onClick && (instance.onclick = noop$1);
   instance = updatePayload;
   fiber.updateQueue = instance;
   return null !== instance ? !0 : !1;
@@ -6539,177 +6347,62 @@ function markRef(workInProgress) {
   workInProgress.flags |= 2097664;
 }
 function updateHostComponent(current, workInProgress, type, newProps) {
-  var oldProps = current.memoizedProps;
-  if (oldProps !== newProps) {
-    current = workInProgress.stateNode;
-    var updatePayload = null;
-    switch (type) {
-      case "input":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-        type = getHostProps$2(current, oldProps);
-        newProps = getHostProps$2(current, newProps);
-        updatePayload = [];
-        break;
-      case "select":
-        type = assign({}, oldProps, { value: void 0 });
-        newProps = assign({}, newProps, { value: void 0 });
-        updatePayload = [];
-        break;
-      case "textarea":
-        type = getHostProps(current, oldProps);
-        newProps = getHostProps(current, newProps);
-        updatePayload = [];
-        break;
-      case "img":
-      case "link":
-      case "area":
-      case "base":
-      case "br":
-      case "col":
-      case "embed":
-      case "hr":
-      case "keygen":
-      case "meta":
-      case "param":
-      case "source":
-      case "track":
-      case "wbr":
-      case "menuitem":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-      default:
-        (type = oldProps),
-          "function" !== typeof type.onClick &&
-            "function" === typeof newProps.onClick &&
-            (current.onclick = noop$1);
-    }
-    var styleName;
-    oldProps = null;
-    for (JSCompiler_inline_result in type)
+  current = current.memoizedProps;
+  if (current !== newProps) {
+    type = null;
+    var propKey,
+      styleName,
+      styleUpdates = null;
+    for (propKey in current)
       if (
-        !newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        type.hasOwnProperty(JSCompiler_inline_result) &&
-        null != type[JSCompiler_inline_result]
+        !newProps.hasOwnProperty(propKey) &&
+        current.hasOwnProperty(propKey) &&
+        null != current[propKey]
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            var lastStyle = type[JSCompiler_inline_result];
+            var lastStyle = current[propKey];
             for (styleName in lastStyle)
               lastStyle.hasOwnProperty(styleName) &&
-                (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-            break;
-          case "dangerouslySetInnerHTML":
-          case "children":
-            break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
+                (styleUpdates || (styleUpdates = {}),
+                (styleUpdates[styleName] = ""));
             break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  null
-                );
+            (type = type || []).push(propKey, null);
         }
-    for (JSCompiler_inline_result in newProps) {
-      var nextProp = newProps[JSCompiler_inline_result];
-      lastStyle = null != type ? type[JSCompiler_inline_result] : void 0;
+    for (propKey in newProps) {
+      lastStyle = newProps[propKey];
+      var lastProp = null != current ? current[propKey] : void 0;
       if (
-        newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        nextProp !== lastStyle &&
-        (null != nextProp || null != lastStyle)
+        newProps.hasOwnProperty(propKey) &&
+        lastStyle !== lastProp &&
+        (null != lastStyle || null != lastProp)
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            if (null != nextProp && "object" !== typeof nextProp)
-              throw Error(formatProdErrorMessage(62));
-            if (lastStyle) {
+            if (lastProp) {
+              for (styleName in lastProp)
+                !lastProp.hasOwnProperty(styleName) ||
+                  (lastStyle && lastStyle.hasOwnProperty(styleName)) ||
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = ""));
               for (styleName in lastStyle)
-                !lastStyle.hasOwnProperty(styleName) ||
-                  (nextProp && nextProp.hasOwnProperty(styleName)) ||
-                  (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-              for (styleName in nextProp)
-                nextProp.hasOwnProperty(styleName) &&
-                  lastStyle[styleName] !== nextProp[styleName] &&
-                  (oldProps || (oldProps = {}),
-                  (oldProps[styleName] = nextProp[styleName]));
+                lastStyle.hasOwnProperty(styleName) &&
+                  lastProp[styleName] !== lastStyle[styleName] &&
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = lastStyle[styleName]));
             } else
-              oldProps ||
-                (updatePayload || (updatePayload = []),
-                updatePayload.push(JSCompiler_inline_result, oldProps)),
-                (oldProps = nextProp);
-            break;
-          case "dangerouslySetInnerHTML":
-            if (null != nextProp) {
-              if ("object" !== typeof nextProp || !("__html" in nextProp))
-                throw Error(formatProdErrorMessage(61));
-              nextProp = nextProp.__html;
-              if (null != nextProp) {
-                if (null != newProps.children)
-                  throw Error(formatProdErrorMessage(60));
-                (lastStyle ? lastStyle.__html : void 0) !== nextProp &&
-                  (updatePayload = updatePayload || []).push(
-                    JSCompiler_inline_result,
-                    nextProp
-                  );
-              }
-            }
-            break;
-          case "children":
-            ("string" !== typeof nextProp && "number" !== typeof nextProp) ||
-              (updatePayload = updatePayload || []).push(
-                JSCompiler_inline_result,
-                "" + nextProp
-              );
-            break;
-          case "onScroll":
-            null != nextProp && listenToNonDelegatedEvent("scroll", current);
-            updatePayload || lastStyle === nextProp || (updatePayload = []);
-            break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
+              styleUpdates ||
+                (type || (type = []), type.push(propKey, styleUpdates)),
+                (styleUpdates = lastStyle);
             break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || lastStyle === nextProp || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  nextProp
-                );
+            (type = type || []).push(propKey, lastStyle);
         }
     }
-    oldProps && (updatePayload = updatePayload || []).push("style", oldProps);
-    var JSCompiler_inline_result = updatePayload;
-    (workInProgress.updateQueue = JSCompiler_inline_result) &&
-      markUpdate(workInProgress);
+    styleUpdates && (type = type || []).push("style", styleUpdates);
+    newProps = type;
+    (workInProgress.updateQueue = newProps) && markUpdate(workInProgress);
   }
 }
 function preloadResourceAndSuspendIfNeeded(workInProgress, resource) {
@@ -14076,19 +13769,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$320;
+  var JSCompiler_inline_result$jscomp$341;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1606 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1606) {
-      var element$jscomp$inline_1607 = document.createElement("div");
-      element$jscomp$inline_1607.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1606 =
-        "function" === typeof element$jscomp$inline_1607.oninput;
+    var isSupported$jscomp$inline_1627 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1627) {
+      var element$jscomp$inline_1628 = document.createElement("div");
+      element$jscomp$inline_1628.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1627 =
+        "function" === typeof element$jscomp$inline_1628.oninput;
     }
-    JSCompiler_inline_result$jscomp$320 = isSupported$jscomp$inline_1606;
-  } else JSCompiler_inline_result$jscomp$320 = !1;
+    JSCompiler_inline_result$jscomp$341 = isSupported$jscomp$inline_1627;
+  } else JSCompiler_inline_result$jscomp$341 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$320 &&
+    JSCompiler_inline_result$jscomp$341 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -14397,20 +14090,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1647 = 0;
-  i$jscomp$inline_1647 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1647++
+  var i$jscomp$inline_1668 = 0;
+  i$jscomp$inline_1668 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1668++
 ) {
-  var eventName$jscomp$inline_1648 =
-      simpleEventPluginEvents[i$jscomp$inline_1647],
-    domEventName$jscomp$inline_1649 =
-      eventName$jscomp$inline_1648.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1650 =
-      eventName$jscomp$inline_1648[0].toUpperCase() +
-      eventName$jscomp$inline_1648.slice(1);
+  var eventName$jscomp$inline_1669 =
+      simpleEventPluginEvents[i$jscomp$inline_1668],
+    domEventName$jscomp$inline_1670 =
+      eventName$jscomp$inline_1669.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1671 =
+      eventName$jscomp$inline_1669[0].toUpperCase() +
+      eventName$jscomp$inline_1669.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1649,
-    "on" + capitalizedEvent$jscomp$inline_1650
+    domEventName$jscomp$inline_1670,
+    "on" + capitalizedEvent$jscomp$inline_1671
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -15250,72 +14943,339 @@ function getOwnerDocumentFromRootContainer(rootContainerElement) {
     : rootContainerElement.ownerDocument;
 }
 function noop$1() {}
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style":
+      if (null != value && "object" !== typeof value)
+        throw Error(formatProdErrorMessage(62));
+      domElement = domElement.style;
+      for (var styleName in value)
+        value.hasOwnProperty(styleName) &&
+          ((key = value[styleName]),
+          (props = 0 === styleName.indexOf("--")),
+          null == key || "boolean" === typeof key || "" === key
+            ? props
+              ? domElement.setProperty(styleName, "")
+              : "float" === styleName
+              ? (domElement.cssFloat = "")
+              : (domElement[styleName] = "")
+            : props
+            ? domElement.setProperty(styleName, key)
+            : "number" !== typeof key ||
+              0 === key ||
+              (isUnitlessNumber.hasOwnProperty(styleName) &&
+                isUnitlessNumber[styleName])
+            ? "float" === styleName
+              ? (domElement.cssFloat = key)
+              : (domElement[styleName] = ("" + key).trim())
+            : (domElement[styleName] = key + "px"));
+      break;
+    case "dangerouslySetInnerHTML":
+      if (null != value) {
+        if ("object" !== typeof value || !("__html" in value))
+          throw Error(formatProdErrorMessage(61));
+        value = value.__html;
+        if (null != value) {
+          if (null != props.children) throw Error(formatProdErrorMessage(60));
+          disableIEWorkarounds
+            ? (domElement.innerHTML = value)
+            : setInnerHTML$1(domElement, value);
+        }
+      }
+      break;
+    case "children":
+      "string" === typeof value
+        ? "body" === tag ||
+          ("textarea" === tag && "" === value) ||
+          setTextContent(domElement, value)
+        : "number" === typeof value &&
+          "body" !== tag &&
+          setTextContent(domElement, "" + value);
+      break;
+    case "onScroll":
+      null != value && listenToNonDelegatedEvent("scroll", domElement);
+      break;
+    case "onClick":
+      null != value && (domElement.onclick = noop$1);
+      break;
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue":
+    case "defaultChecked":
+    case "innerHTML":
+      break;
+    case "autoFocus":
+      break;
+    case "innerText":
+    case "textContent":
+      if (enableCustomElementPropertySupport) break;
+    default:
+      if (!registrationNameDependencies.hasOwnProperty(key))
+        if (isCustomComponentTag)
+          a: {
+            if (
+              enableCustomElementPropertySupport &&
+              "o" === key[0] &&
+              "n" === key[1] &&
+              ((styleName = key.endsWith("Capture")),
+              (props = key.substr(2, styleName ? key.length - 9 : void 0)),
+              (tag = getFiberCurrentPropsFromNode(domElement)),
+              (tag = null != tag ? tag[key] : null),
+              "function" === typeof tag &&
+                domElement.removeEventListener(props, tag, styleName),
+              "function" === typeof value)
+            ) {
+              "function" !== typeof tag &&
+                null !== tag &&
+                (key in domElement
+                  ? (domElement[key] = null)
+                  : domElement.hasAttribute(key) &&
+                    domElement.removeAttribute(key));
+              domElement.addEventListener(props, value, styleName);
+              break a;
+            }
+            if (enableCustomElementPropertySupport && key in domElement)
+              domElement[key] = value;
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (enableCustomElementPropertySupport) {
+                      if (!0 === value) {
+                        domElement.setAttribute(key, "");
+                        break a;
+                      }
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+          }
+        else
+          a: if (
+            !(2 < key.length) ||
+            ("o" !== key[0] && "O" !== key[0]) ||
+            ("n" !== key[1] && "N" !== key[1])
+          )
+            if (
+              ((styleName = properties.hasOwnProperty(key)
+                ? properties[key]
+                : null),
+              null !== styleName)
+            )
+              if (styleName.mustUseProperty)
+                domElement[styleName.propertyName] =
+                  value &&
+                  "function" !== typeof value &&
+                  "symbol" !== typeof value;
+              else if (((key = styleName.attributeName), null === value))
+                domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (!styleName.acceptsBooleans) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                if (styleName.removeEmptyString && "" === value)
+                  domElement.removeAttribute(key);
+                else
+                  switch (styleName.type) {
+                    case 3:
+                      value
+                        ? domElement.setAttribute(key, "")
+                        : domElement.removeAttribute(key);
+                      break;
+                    case 4:
+                      !0 === value
+                        ? domElement.setAttribute(key, "")
+                        : !1 === value
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 5:
+                      isNaN(value)
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 6:
+                      !isNaN(value) && 1 <= value
+                        ? domElement.setAttribute(key, value)
+                        : domElement.removeAttribute(key);
+                      break;
+                    default:
+                      value = enableTrustedTypesIntegration
+                        ? value
+                        : "" + value;
+                      if (
+                        styleName.sanitizeURL &&
+                        isJavaScriptProtocol.test(value.toString())
+                      )
+                        throw Error(formatProdErrorMessage(323));
+                      (styleName = styleName.attributeNamespace)
+                        ? domElement.setAttributeNS(styleName, key, value)
+                        : domElement.setAttribute(key, value);
+                  }
+              }
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (
+                      ((styleName = key.toLowerCase().slice(0, 5)),
+                      "data-" !== styleName && "aria-" !== styleName)
+                    ) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+  }
+}
 function createHTMLElement(type, props, ownerDocument) {
   return "string" === typeof props.is
     ? ownerDocument.createElement(type, { is: props.is })
     : ownerDocument.createElement(type);
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
+function setInitialProperties(domElement, tag, props) {
   switch (tag) {
+    case "input":
+      initWrapperState$2(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey in props)
+        if (props.hasOwnProperty(propKey)) {
+          var propValue = props[propKey];
+          if (null != propValue)
+            switch (propKey) {
+              case "checked":
+                var node = domElement;
+                propValue =
+                  null != propValue
+                    ? propValue
+                    : node._wrapperState.initialChecked;
+                node.checked =
+                  !!propValue &&
+                  "function" !== typeof propValue &&
+                  "symbol" !== propValue;
+                break;
+              case "value":
+                break;
+              case "children":
+              case "dangerouslySetInnerHTML":
+                if (null != propValue)
+                  throw Error(formatProdErrorMessage(137, tag));
+                break;
+              default:
+                setProp(domElement, tag, propKey, propValue, !1, props);
+            }
+        }
+      track(domElement);
+      postMountWrapper$3(domElement, props, !1);
+      return;
+    case "select":
+      domElement._wrapperState = { wasMultiple: !!props.multiple };
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (propValue in props)
+        if (
+          props.hasOwnProperty(propValue) &&
+          ((propKey = props[propValue]), null != propKey)
+        )
+          switch (propValue) {
+            case "value":
+              break;
+            default:
+              setProp(domElement, tag, propValue, propKey, !1, props);
+          }
+      domElement.multiple = !!props.multiple;
+      tag = props.value;
+      null != tag
+        ? updateOptions(domElement, !!props.multiple, tag, !1)
+        : null != props.defaultValue &&
+          updateOptions(domElement, !!props.multiple, props.defaultValue, !0);
+      return;
+    case "textarea":
+      initWrapperState(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey$221 in props)
+        if (
+          props.hasOwnProperty(propKey$221) &&
+          ((propKey = props[propKey$221]), null != propKey)
+        )
+          switch (propKey$221) {
+            case "value":
+              break;
+            case "children":
+              break;
+            case "dangerouslySetInnerHTML":
+              if (null != propKey) throw Error(formatProdErrorMessage(91));
+              break;
+            default:
+              setProp(domElement, tag, propKey$221, propKey, !1, props);
+          }
+      track(domElement);
+      postMountWrapper(domElement);
+      return;
+    case "option":
+      for (var propKey$223 in props)
+        props.hasOwnProperty(propKey$223) &&
+          ((propKey = props[propKey$223]),
+          null != propKey &&
+            setProp(domElement, tag, propKey$223, propKey, !1, props));
+      null != props.value &&
+        domElement.setAttribute("value", "" + getToStringValue(props.value));
+      return;
     case "dialog":
       listenToNonDelegatedEvent("cancel", domElement);
       listenToNonDelegatedEvent("close", domElement);
-      var props = rawProps;
       break;
-    case "embed":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "iframe":
     case "object":
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "video":
     case "audio":
-      for (props = 0; props < mediaEventTypes.length; props++)
-        listenToNonDelegatedEvent(mediaEventTypes[props], domElement);
-      props = rawProps;
+      for (propKey = 0; propKey < mediaEventTypes.length; propKey++)
+        listenToNonDelegatedEvent(mediaEventTypes[propKey], domElement);
       break;
-    case "source":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
-    case "img":
-    case "link":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "image":
       listenToNonDelegatedEvent("error", domElement);
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "details":
       listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
-    case "input":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "option":
-      props = rawProps;
-      break;
-    case "select":
-      domElement._wrapperState = { wasMultiple: !!rawProps.multiple };
-      props = assign({}, rawProps, { value: void 0 });
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
       break;
+    case "embed":
+    case "source":
+    case "img":
+    case "link":
+      listenToNonDelegatedEvent("error", domElement),
+        listenToNonDelegatedEvent("load", domElement);
     case "area":
     case "base":
     case "br":
@@ -15327,163 +15287,159 @@ function setInitialProperties(domElement, tag, rawProps) {
     case "track":
     case "wbr":
     case "menuitem":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-    default:
-      props = rawProps;
-  }
-  var nextProps = props,
-    propKey;
-  for (propKey in nextProps)
-    if (nextProps.hasOwnProperty(propKey)) {
-      var nextProp = nextProps[propKey];
-      switch (propKey) {
-        case "style":
-          if (null != nextProp && "object" !== typeof nextProp)
-            throw Error(formatProdErrorMessage(62));
-          setValueForStyles(domElement, nextProp);
-          break;
-        case "dangerouslySetInnerHTML":
-          if (null != nextProp) {
-            if ("object" !== typeof nextProp || !("__html" in nextProp))
-              throw Error(formatProdErrorMessage(61));
-            nextProp = nextProp.__html;
-            if (null != nextProp) {
-              if (null != nextProps.children)
-                throw Error(formatProdErrorMessage(60));
-              disableIEWorkarounds
-                ? (domElement.innerHTML = nextProp)
-                : setInnerHTML$1(domElement, nextProp);
-            }
+      for (var propKey$225 in props)
+        if (
+          props.hasOwnProperty(propKey$225) &&
+          ((propKey = props[propKey$225]), null != propKey)
+        )
+          switch (propKey$225) {
+            case "children":
+            case "dangerouslySetInnerHTML":
+              throw Error(formatProdErrorMessage(137, tag));
+            default:
+              setProp(domElement, tag, propKey$225, propKey, !1, props);
           }
-          break;
-        case "children":
-          "string" === typeof nextProp
-            ? "body" === tag ||
-              ("textarea" === tag && "" === nextProp) ||
-              setTextContent(domElement, nextProp)
-            : "number" === typeof nextProp &&
-              "body" !== tag &&
-              setTextContent(domElement, "" + nextProp);
-          break;
-        case "onScroll":
-          null != nextProp && listenToNonDelegatedEvent("scroll", domElement);
-          break;
-        case "suppressContentEditableWarning":
-        case "suppressHydrationWarning":
-        case "defaultValue":
-        case "defaultChecked":
-        case "innerHTML":
-          break;
-        case "autoFocus":
-          break;
-        case "innerText":
-        case "textContent":
-          if (enableCustomElementPropertySupport) break;
-        default:
-          registrationNameDependencies.hasOwnProperty(propKey) ||
-            (null != nextProp &&
-              (isCustomComponentTag
-                ? setValueForPropertyOnCustomComponent(
-                    domElement,
-                    propKey,
-                    nextProp
-                  )
-                : setValueForProperty(domElement, propKey, nextProp)));
-      }
-    }
-  switch (tag) {
-    case "input":
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, !1);
-      break;
-    case "textarea":
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-    case "option":
-      null != rawProps.value &&
-        domElement.setAttribute("value", "" + getToStringValue(rawProps.value));
-      break;
-    case "select":
-      domElement.multiple = !!rawProps.multiple;
-      tag = rawProps.value;
-      null != tag
-        ? updateOptions(domElement, !!rawProps.multiple, tag, !1)
-        : null != rawProps.defaultValue &&
-          updateOptions(
-            domElement,
-            !!rawProps.multiple,
-            rawProps.defaultValue,
-            !0
-          );
-      break;
-    default:
-      "function" === typeof props.onClick && (domElement.onclick = noop$1);
+      return;
   }
+  propKey = isCustomComponent(tag, props);
+  for (node in props)
+    props.hasOwnProperty(node) &&
+      ((propValue = props[node]),
+      null != propValue &&
+        setProp(domElement, tag, node, propValue, propKey, props));
 }
 function updateProperties(
   domElement,
   updatePayload,
   tag,
-  lastRawProps,
-  nextRawProps
+  lastProps,
+  nextProps
 ) {
-  "input" === tag &&
-    "radio" === nextRawProps.type &&
-    null != nextRawProps.name &&
-    updateChecked(domElement, nextRawProps);
-  isCustomComponent(tag, lastRawProps);
-  lastRawProps = isCustomComponent(tag, nextRawProps);
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i],
-      propValue = updatePayload[i + 1];
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
-      case "dangerouslySetInnerHTML":
-        disableIEWorkarounds
-          ? (domElement.innerHTML = propValue)
-          : setInnerHTML$1(domElement, propValue);
-        break;
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
-      default:
-        lastRawProps
-          ? setValueForPropertyOnCustomComponent(domElement, propKey, propValue)
-          : setValueForProperty(domElement, propKey, propValue);
-    }
-  }
   switch (tag) {
     case "input":
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
+      "radio" === nextProps.type &&
+        null != nextProps.name &&
+        ((lastProps = nextProps.checked),
+        null != lastProps && (domElement.checked = lastProps));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) {
+        var propKey = updatePayload[lastProps],
+          propValue = updatePayload[lastProps + 1];
+        switch (propKey) {
+          case "checked":
+            propKey = domElement;
+            propValue =
+              null != propValue
+                ? propValue
+                : propKey._wrapperState.initialChecked;
+            propKey.checked =
+              !!propValue &&
+              "function" !== typeof propValue &&
+              "symbol" !== propValue;
+            break;
+          case "value":
+            break;
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propValue)
+              throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propKey, propValue, !1, nextProps);
+        }
+      }
+      updateWrapper$1(domElement, nextProps);
+      return;
     case "select":
-      (updatePayload = domElement._wrapperState.wasMultiple),
-        (domElement._wrapperState.wasMultiple = !!nextRawProps.multiple),
-        (tag = nextRawProps.value),
-        null != tag
-          ? updateOptions(domElement, !!nextRawProps.multiple, tag, !1)
-          : updatePayload !== !!nextRawProps.multiple &&
-            (null != nextRawProps.defaultValue
-              ? updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.defaultValue,
-                  !0
-                )
-              : updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.multiple ? [] : "",
-                  !1
-                ));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updatePayload = domElement._wrapperState.wasMultiple;
+      domElement._wrapperState.wasMultiple = !!nextProps.multiple;
+      tag = nextProps.value;
+      null != tag
+        ? updateOptions(domElement, !!nextProps.multiple, tag, !1)
+        : updatePayload !== !!nextProps.multiple &&
+          (null != nextProps.defaultValue
+            ? updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.defaultValue,
+                !0
+              )
+            : updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.multiple ? [] : "",
+                !1
+              ));
+      return;
+    case "textarea":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          case "children":
+            break;
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(91));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updateWrapper(domElement, nextProps);
+      return;
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      return;
   }
+  lastProps = isCustomComponent(tag, nextProps);
+  for (propValue = 0; propValue < updatePayload.length; propValue += 2)
+    setProp(
+      domElement,
+      tag,
+      updatePayload[propValue],
+      updatePayload[propValue + 1],
+      lastProps,
+      nextProps
+    );
 }
 var Dispatcher$1 = Internals.Dispatcher,
   eventsEnabled = null,
@@ -15794,14 +15750,14 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$220 = getStyleKey(href),
+          var key$242 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$220);
+            resource = as.get(key$242);
           if (resource) break;
           var state = { loading: 0, preload: null };
           if (
             (resource = resourceRoot.querySelector(
-              getStylesheetSelectorFromKey(key$220)
+              getStylesheetSelectorFromKey(key$242)
             ))
           )
             state.loading = 1;
@@ -15812,7 +15768,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             };
-            (options = preloadPropsMap.get(key$220)) &&
+            (options = preloadPropsMap.get(key$242)) &&
               adoptPreloadPropsForStylesheet(href, options);
             var link = (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -15838,15 +15794,15 @@ function preinit$1(href, options) {
             count: 1,
             state: state
           };
-          as.set(key$220, resource);
+          as.set(key$242, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$220 = getScriptKey(href)),
-            (precedence = as.get(key$220)),
+            (key$242 = getScriptKey(href)),
+            (precedence = as.get(key$242)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$220
+                "script[async]" + key$242
               )),
               precedence ||
                 ((href = {
@@ -15855,7 +15811,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$220)) &&
+                (options = preloadPropsMap.get(key$242)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -15868,13 +15824,13 @@ function preinit$1(href, options) {
                 count: 1,
                 state: null
               }),
-              as.set(key$220, precedence));
+              as.set(key$242, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$220 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$220 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$220 + '"]';
+        key$242 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$242 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$242 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -15891,7 +15847,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$220) &&
+          null === resourceRoot.querySelector(key$242) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -15924,17 +15880,17 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.precedence
       ) {
         type = getStyleKey(pendingProps.href);
-        var styles$229 = getResourcesFromRoot(currentProps).hoistableStyles,
-          resource$230 = styles$229.get(type);
-        resource$230 ||
+        var styles$251 = getResourcesFromRoot(currentProps).hoistableStyles,
+          resource$252 = styles$251.get(type);
+        resource$252 ||
           ((currentProps = currentProps.ownerDocument || currentProps),
-          (resource$230 = {
+          (resource$252 = {
             type: "stylesheet",
             instance: null,
             count: 0,
             state: { loading: 0, preload: null }
           }),
-          styles$229.set(type, resource$230),
+          styles$251.set(type, resource$252),
           preloadPropsMap.has(type) ||
             preloadStylesheet(
               currentProps,
@@ -15949,9 +15905,9 @@ function getResource(type, currentProps, pendingProps) {
                 hrefLang: pendingProps.hrefLang,
                 referrerPolicy: pendingProps.referrerPolicy
               },
-              resource$230.state
+              resource$252.state
             ));
-        return resource$230;
+        return resource$252;
       }
       return null;
     case "script":
@@ -16023,36 +15979,36 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$235 = hoistableRoot.querySelector(
+        var instance$257 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$235)
+        if (instance$257)
           return (
-            (resource.instance = instance$235),
-            markNodeAsHoistable(instance$235),
-            instance$235
+            (resource.instance = instance$257),
+            markNodeAsHoistable(instance$257),
+            instance$257
           );
         key = stylesheetPropsFromRawProps(props);
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$235 = (
+        instance$257 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$235);
-        var linkInstance = instance$235;
+        markNodeAsHoistable(instance$257);
+        var linkInstance = instance$257;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
         });
-        setInitialProperties(instance$235, "link", key);
+        setInitialProperties(instance$257, "link", key);
         resource.state.loading |= 4;
-        insertStylesheet(instance$235, props.precedence, hoistableRoot);
-        return (resource.instance = instance$235);
+        insertStylesheet(instance$257, props.precedence, hoistableRoot);
+        return (resource.instance = instance$257);
       case "script":
-        instance$235 = getScriptKey(props.src);
+        instance$257 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$235
+            "script[async]" + instance$257
           ))
         )
           return (
@@ -16061,7 +16017,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$235)))
+        if ((styleProps = preloadPropsMap.get(instance$257)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -16432,10 +16388,10 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1820 = {
+var devToolsConfig$jscomp$inline_1838 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-fa959387",
+  version: "18.3.0-www-modern-6f688848",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -16453,10 +16409,10 @@ var devToolsConfig$jscomp$inline_1820 = {
   } catch (err) {}
   return hook.checkDCE ? !0 : !1;
 })({
-  bundleType: devToolsConfig$jscomp$inline_1820.bundleType,
-  version: devToolsConfig$jscomp$inline_1820.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1820.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1820.rendererConfig,
+  bundleType: devToolsConfig$jscomp$inline_1838.bundleType,
+  version: devToolsConfig$jscomp$inline_1838.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1838.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1838.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -16473,14 +16429,14 @@ var devToolsConfig$jscomp$inline_1820 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1820.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1838.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-fa959387"
+  reconcilerVersion: "18.3.0-www-modern-6f688848"
 });
 exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
 exports.createPortal = function (children, container) {
@@ -16636,7 +16592,7 @@ exports.unstable_createEventHandle = function (type, options) {
   return eventHandle;
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-modern-fa959387";
+exports.version = "18.3.0-www-modern-6f688848";
 
           /* 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 16a5394d43e62..5d2d11a326c47 100644
--- a/compiled/facebook-www/ReactDOMTesting-dev.classic.js
+++ b/compiled/facebook-www/ReactDOMTesting-dev.classic.js
@@ -30517,7 +30517,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-336680d2";
+var ReactVersion = "18.3.0-www-classic-f4981d85";
 
 function createPortal$1(
   children,
@@ -33267,17 +33267,6 @@ function isControlled(props) {
  * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
  */
 
-function getHostProps$2(element, props) {
-  var node = element;
-  var checked = props.checked;
-  var hostProps = assign({}, props, {
-    defaultChecked: undefined,
-    defaultValue: undefined,
-    value: undefined,
-    checked: checked != null ? checked : node._wrapperState.initialChecked
-  });
-  return hostProps;
-}
 function initWrapperState$2(element, props) {
   {
     checkControlledValueProps("input", props);
@@ -33323,9 +33312,13 @@ function initWrapperState$2(element, props) {
 
   var node = element;
   var defaultValue = props.defaultValue == null ? "" : props.defaultValue;
+  var initialChecked =
+    props.checked != null ? props.checked : props.defaultChecked;
   node._wrapperState = {
     initialChecked:
-      props.checked != null ? props.checked : props.defaultChecked,
+      typeof initialChecked !== "function" &&
+      typeof initialChecked !== "symbol" &&
+      !!initialChecked,
     initialValue: getToStringValue(
       props.value != null ? props.value : defaultValue
     ),
@@ -33511,19 +33504,20 @@ function postMountWrapper$3(element, props, isHydrating) {
 
   if (name !== "") {
     node.name = "";
+  } // The checked property never gets assigned. It must be manually set.
+  // We don't want to do this when hydrating so that existing user input isn't
+  // modified
+  // TODO: I'm pretty sure this is a bug because initialValueTracking won't be
+  // correct for the hydration case then.
+
+  if (!isHydrating) {
+    node.checked = !!node._wrapperState.initialChecked;
   }
 
   if (disableInputAttributeSyncing) {
-    // When not syncing the checked attribute, the checked property
-    // never gets assigned. It must be manually set. We don't want
-    // to do this when hydrating so that existing user input isn't
-    // modified
-    if (!isHydrating) {
-      updateChecked(element, props);
-    } // Only assign the checked attribute if it is defined. This saves
+    // Only assign the checked attribute if it is defined. This saves
     // a DOM write when controlling the checked attribute isn't needed
     // (text inputs, submit/reset)
-
     if (props.hasOwnProperty("defaultChecked")) {
       node.defaultChecked = !node.defaultChecked;
       node.defaultChecked = !!props.defaultChecked;
@@ -33802,11 +33796,6 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
  * selected.
  */
 
-function getHostProps$1(element, props) {
-  return assign({}, props, {
-    value: undefined
-  });
-}
 function initWrapperState$1(element, props) {
   var node = element;
 
@@ -33891,28 +33880,6 @@ var didWarnValDefaultVal = false;
  * `defaultValue` if specified, or the children content (deprecated).
  */
 
-function getHostProps(element, props) {
-  var node = element;
-
-  if (props.dangerouslySetInnerHTML != null) {
-    throw new Error(
-      "`dangerouslySetInnerHTML` does not make sense on <textarea>."
-    );
-  } // Always set children to the same thing. In IE9, the selection range will
-  // get reset if `textContent` is mutated.  We could add a check in setTextContent
-  // to only set the value if/when the value differs from the node value (which would
-  // completely solve this IE9 bug), but Sebastian+Sophie seemed to like this
-  // solution. The value can be a boolean or object so that's why it's forced
-  // to be a string.
-
-  var hostProps = assign({}, props, {
-    value: undefined,
-    defaultValue: undefined,
-    children: toString(node._wrapperState.initialValue)
-  });
-
-  return hostProps;
-}
 function initWrapperState(element, props) {
   var node = element;
 
@@ -33978,8 +33945,11 @@ function initWrapperState(element, props) {
     initialValue = defaultValue;
   }
 
+  var stringValue = getToStringValue(initialValue);
+  node.defaultValue = stringValue; // This will be toString:ed.
+
   node._wrapperState = {
-    initialValue: getToStringValue(initialValue)
+    initialValue: stringValue
   };
 }
 function updateWrapper(element, props) {
@@ -35969,189 +35939,146 @@ function trapClickOnNonInteractiveElement(node) {
   node.onclick = noop$1;
 }
 
-function setInitialDOMProperties(
-  tag,
-  domElement,
-  nextProps,
-  isCustomComponentTag
-) {
-  for (var propKey in nextProps) {
-    if (!nextProps.hasOwnProperty(propKey)) {
-      continue;
-    }
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style": {
+      if (value != null && typeof value !== "object") {
+        throw new Error(
+          "The `style` prop expects a mapping from style properties to values, " +
+            "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
+            "using JSX."
+        );
+      }
 
-    var nextProp = nextProps[propKey];
+      {
+        if (value) {
+          // Freeze the next style object so that we can assume it won't be
+          // mutated. We have already warned for this in the past.
+          Object.freeze(value);
+        }
+      } // Relies on `updateStylesByID` not mutating `styleUpdates`.
 
-    switch (propKey) {
-      case "style": {
-        if (nextProp != null && typeof nextProp !== "object") {
+      setValueForStyles(domElement, value);
+      break;
+    }
+
+    case "dangerouslySetInnerHTML": {
+      if (value != null) {
+        if (typeof value !== "object" || !("__html" in value)) {
           throw new Error(
-            "The `style` prop expects a mapping from style properties to values, " +
-              "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
-              "using JSX."
+            "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
+              "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
+              "for more information."
           );
         }
 
-        {
-          if (nextProp) {
-            // Freeze the next style object so that we can assume it won't be
-            // mutated. We have already warned for this in the past.
-            Object.freeze(nextProp);
-          }
-        } // Relies on `updateStylesByID` not mutating `styleUpdates`.
-
-        setValueForStyles(domElement, nextProp);
-        break;
-      }
+        var nextHtml = value.__html;
 
-      case "dangerouslySetInnerHTML": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "object" || !("__html" in nextProp)) {
+        if (nextHtml != null) {
+          if (props.children != null) {
             throw new Error(
-              "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
-                "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
-                "for more information."
+              "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
             );
           }
 
-          var nextHtml = nextProp.__html;
-
-          if (nextHtml != null) {
-            if (nextProps.children != null) {
-              throw new Error(
-                "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
-              );
-            }
-
-            if (disableIEWorkarounds) {
-              domElement.innerHTML = nextHtml;
-            } else {
-              setInnerHTML$1(domElement, nextHtml);
-            }
+          if (disableIEWorkarounds) {
+            domElement.innerHTML = nextHtml;
+          } else {
+            setInnerHTML$1(domElement, nextHtml);
           }
         }
-
-        break;
       }
 
-      case "children": {
-        if (typeof nextProp === "string") {
-          // Avoid setting initial textContent when the text is empty. In IE11 setting
-          // textContent on a <textarea> will cause the placeholder to not
-          // show within the <textarea> until it has been focused and blurred again.
-          // https://github.com/facebook/react/issues/6731#issuecomment-254874553
-          var canSetTextContent =
-            tag !== "body" && (tag !== "textarea" || nextProp !== "");
+      break;
+    }
 
-          if (canSetTextContent) {
-            setTextContent(domElement, nextProp);
-          }
-        } else if (typeof nextProp === "number") {
-          var _canSetTextContent = tag !== "body";
+    case "children": {
+      if (typeof value === "string") {
+        // Avoid setting initial textContent when the text is empty. In IE11 setting
+        // textContent on a <textarea> will cause the placeholder to not
+        // show within the <textarea> until it has been focused and blurred again.
+        // https://github.com/facebook/react/issues/6731#issuecomment-254874553
+        var canSetTextContent =
+          tag !== "body" && (tag !== "textarea" || value !== "");
 
-          if (_canSetTextContent) {
-            setTextContent(domElement, "" + nextProp);
-          }
+        if (canSetTextContent) {
+          setTextContent(domElement, value);
         }
+      } else if (typeof value === "number") {
+        var _canSetTextContent = tag !== "body";
 
-        break;
+        if (_canSetTextContent) {
+          setTextContent(domElement, "" + value);
+        }
       }
 
-      case "onScroll": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "function") {
-            warnForInvalidEventListener(propKey, nextProp);
-          }
+      break;
+    }
 
-          listenToNonDelegatedEvent("scroll", domElement);
+    case "onScroll": {
+      if (value != null) {
+        if (typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
         }
 
-        break;
+        listenToNonDelegatedEvent("scroll", domElement);
       }
 
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
+      break;
+    }
 
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
+    case "onClick": {
+      // TODO: This cast may not be sound for SVG, MathML or custom elements.
+      if (value != null) {
+        if (typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
+        }
 
-      case "autoFocus": {
-        // We polyfill it separately on the client during commit.
-        // We could have excluded it in the property list instead of
-        // adding a special case here, but then it wouldn't be emitted
-        // on server rendering (but we *do* want to emit it in SSR).
-        break;
+        trapClickOnNonInteractiveElement(domElement);
       }
 
-      case "innerText": // Properties
-
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
-        }
+      break;
+    }
 
-      // eslint-disable-next-line no-fallthrough
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue": // Reserved
 
-      default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          if (nextProp != null) {
-            if (typeof nextProp !== "function") {
-              warnForInvalidEventListener(propKey, nextProp);
-            }
-          }
-        } else if (nextProp != null) {
-          if (isCustomComponentTag) {
-            setValueForPropertyOnCustomComponent(domElement, propKey, nextProp);
-          } else {
-            setValueForProperty(domElement, propKey, nextProp);
-          }
-        }
-      }
+    case "defaultChecked":
+    case "innerHTML": {
+      // Noop
+      break;
     }
-  }
-}
-
-function updateDOMProperties(
-  domElement,
-  updatePayload,
-  wasCustomComponentTag,
-  isCustomComponentTag
-) {
-  // TODO: Handle wasCustomComponentTag
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i];
-    var propValue = updatePayload[i + 1];
 
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
+    case "autoFocus": {
+      // We polyfill it separately on the client during commit.
+      // We could have excluded it in the property list instead of
+      // adding a special case here, but then it wouldn't be emitted
+      // on server rendering (but we *do* want to emit it in SSR).
+      break;
+    }
 
-      case "dangerouslySetInnerHTML":
-        if (disableIEWorkarounds) {
-          domElement.innerHTML = propValue;
-        } else {
-          setInnerHTML$1(domElement, propValue);
-        }
+    case "innerText": // Properties
 
+    case "textContent":
+      if (enableCustomElementPropertySupport) {
         break;
+      }
 
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
+    // eslint-disable-next-line no-fallthrough
 
-      default:
+    default: {
+      if (registrationNameDependencies.hasOwnProperty(key)) {
+        if (value != null && typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
+        }
+      } else {
         if (isCustomComponentTag) {
-          setValueForPropertyOnCustomComponent(domElement, propKey, propValue);
+          setValueForPropertyOnCustomComponent(domElement, key, value);
         } else {
-          setValueForProperty(domElement, propKey, propValue);
+          setValueForProperty(domElement, key, value);
         }
-
-        break;
+      }
     }
   }
 } // creates a script element that won't execute
@@ -36282,291 +36209,305 @@ function createTextNode(text, rootContainerElement) {
     text
   );
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
-
+function setInitialProperties(domElement, tag, props) {
   {
-    validatePropertiesInDevelopment(tag, rawProps);
+    validatePropertiesInDevelopment(tag, props);
   } // TODO: Make sure that we check isMounted before firing any of these events.
 
-  var props;
-
   switch (tag) {
-    case "dialog":
-      listenToNonDelegatedEvent("cancel", domElement);
-      listenToNonDelegatedEvent("close", domElement);
-      props = rawProps;
-      break;
-
-    case "embed":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
-
-    // eslint-disable-next-line no-fallthrough
+    case "input": {
+      initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the invalid event.
 
-    case "iframe":
-    case "object":
-      // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the load event.
-      listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
-      break;
+      listenToNonDelegatedEvent("invalid", domElement);
 
-    case "video":
-    case "audio":
-      // We listen to these events in case to ensure emulated bubble
-      // listeners still fire for all the media events.
-      for (var i = 0; i < mediaEventTypes.length; i++) {
-        listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
-      }
+      for (var propKey in props) {
+        if (!props.hasOwnProperty(propKey)) {
+          continue;
+        }
 
-      props = rawProps;
-      break;
+        var propValue = props[propKey];
 
-    case "source":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      } // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the error event.
+        if (propValue == null) {
+          continue;
+        }
 
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
+        switch (propKey) {
+          case "checked": {
+            var node = domElement;
+            var checked =
+              propValue != null ? propValue : node._wrapperState.initialChecked;
+            node.checked =
+              !!checked &&
+              typeof checked !== "function" &&
+              checked !== "symbol";
+            break;
+          }
 
-    case "img":
-    case "link":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-    // eslint-disable-next-line no-fallthrough
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (propValue != null) {
+              throw new Error(
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
+              );
+            }
 
-    case "image":
-      // We listen to these events in case to ensure emulated bubble
-      // listeners still fire for error and load events.
-      listenToNonDelegatedEvent("error", domElement);
-      listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
-      break;
+            break;
+          }
+          // defaultChecked and defaultValue are ignored by setProp
 
-    case "details":
-      // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the toggle event.
-      listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
+          default: {
+            setProp(domElement, tag, propKey, propValue, false, props);
+          }
+        }
+      } // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
 
-    case "input":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
+      track(domElement);
+      postMountWrapper$3(domElement, props, false);
+      return;
+    }
 
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+    case "select": {
+      initWrapperState$1(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
-      break;
-
-    case "option":
-      validateProps(domElement, rawProps);
-      props = rawProps;
-      break;
 
-    case "select":
-      initWrapperState$1(domElement, rawProps);
-      props = getHostProps$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the invalid event.
+      for (var _propKey in props) {
+        if (!props.hasOwnProperty(_propKey)) {
+          continue;
+        }
 
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
+        var _propValue = props[_propKey];
 
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the invalid event.
+        if (_propValue == null) {
+          continue;
+        }
 
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
+        switch (_propKey) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
+          // defaultValue are ignored by setProp
 
-    case "area":
-    case "base":
-    case "br":
-    case "col":
-    case "hr":
-    case "keygen":
-    case "meta":
-    case "param":
-    case "track":
-    case "wbr":
-    case "menuitem": {
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
+          default: {
+            setProp(domElement, tag, _propKey, _propValue, false, props);
+          }
+        }
       }
+
+      postMountWrapper$1(domElement, props);
+      return;
     }
-    // eslint-disable-next-line no-fallthrough
 
-    default:
-      props = rawProps;
-  }
+    case "textarea": {
+      initWrapperState(domElement, props); // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the invalid event.
 
-  setInitialDOMProperties(tag, domElement, props, isCustomComponentTag);
+      listenToNonDelegatedEvent("invalid", domElement);
 
-  switch (tag) {
-    case "input":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, false);
-      break;
+      for (var _propKey2 in props) {
+        if (!props.hasOwnProperty(_propKey2)) {
+          continue;
+        }
 
-    case "textarea":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
+        var _propValue2 = props[_propKey2];
 
-    case "option":
-      postMountWrapper$2(domElement, rawProps);
-      break;
+        if (_propValue2 == null) {
+          continue;
+        }
 
-    case "select":
-      postMountWrapper$1(domElement, rawProps);
-      break;
+        switch (_propKey2) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-    default:
-      if (typeof props.onClick === "function") {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
+          case "children": {
+            // TODO: Handled by initWrapperState above.
+            break;
+          }
+
+          case "dangerouslySetInnerHTML": {
+            if (_propValue2 != null) {
+              // TODO: Do we really need a special error message for this. It's also pretty blunt.
+              throw new Error(
+                "`dangerouslySetInnerHTML` does not make sense on <textarea>."
+              );
+            }
+
+            break;
+          }
+          // defaultValue is ignored by setProp
+
+          default: {
+            setProp(domElement, tag, _propKey2, _propValue2, false, props);
+          }
+        }
+      } // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
+
+      track(domElement);
+      postMountWrapper(domElement);
+      return;
+    }
+
+    case "option": {
+      validateProps(domElement, props);
+
+      for (var _propKey3 in props) {
+        if (!props.hasOwnProperty(_propKey3)) {
+          continue;
+        }
+
+        var _propValue3 = props[_propKey3];
+
+        if (_propValue3 == null) {
+          continue;
+        }
+
+        setProp(domElement, tag, _propKey3, _propValue3, false, props);
       }
 
-      break;
-  }
-} // Calculate the diff between the two objects.
+      postMountWrapper$2(domElement, props);
+      return;
+    }
 
-function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
-  {
-    validatePropertiesInDevelopment(tag, nextRawProps);
-  }
+    case "dialog": {
+      listenToNonDelegatedEvent("cancel", domElement);
+      listenToNonDelegatedEvent("close", domElement);
+      break;
+    }
 
-  var updatePayload = null;
-  var lastProps;
-  var nextProps;
+    case "iframe":
+    case "object": {
+      // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the load event.
+      listenToNonDelegatedEvent("load", domElement);
+      break;
+    }
 
-  switch (tag) {
-    case "input":
-      if (
-        nextRawProps.children != null ||
-        nextRawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
+    case "video":
+    case "audio": {
+      // We listen to these events in case to ensure emulated bubble
+      // listeners still fire for all the media events.
+      for (var i = 0; i < mediaEventTypes.length; i++) {
+        listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
       }
 
-      lastProps = getHostProps$2(domElement, lastRawProps);
-      nextProps = getHostProps$2(domElement, nextRawProps);
-      updatePayload = [];
       break;
+    }
 
-    case "select":
-      lastProps = getHostProps$1(domElement, lastRawProps);
-      nextProps = getHostProps$1(domElement, nextRawProps);
-      updatePayload = [];
+    case "image": {
+      // We listen to these events in case to ensure emulated bubble
+      // listeners still fire for error and load events.
+      listenToNonDelegatedEvent("error", domElement);
+      listenToNonDelegatedEvent("load", domElement);
       break;
+    }
 
-    case "textarea":
-      lastProps = getHostProps(domElement, lastRawProps);
-      nextProps = getHostProps(domElement, nextRawProps);
-      updatePayload = [];
+    case "details": {
+      // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the toggle event.
+      listenToNonDelegatedEvent("toggle", domElement);
       break;
+    }
 
+    case "embed":
+    case "source":
     case "img":
-    case "link":
+    case "link": {
+      // These are void elements that also need delegated events.
+      listenToNonDelegatedEvent("error", domElement);
+      listenToNonDelegatedEvent("load", domElement); // We fallthrough to the return of the void elements
+    }
+    // eslint-disable-next-line no-fallthrough
+
     case "area":
     case "base":
     case "br":
     case "col":
-    case "embed":
     case "hr":
     case "keygen":
     case "meta":
     case "param":
-    case "source":
     case "track":
     case "wbr":
     case "menuitem": {
-      if (
-        nextRawProps.children != null ||
-        nextRawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
+      // Void elements
+      for (var _propKey4 in props) {
+        if (!props.hasOwnProperty(_propKey4)) {
+          continue;
+        }
+
+        var _propValue4 = props[_propKey4];
+
+        if (_propValue4 == null) {
+          continue;
+        }
+
+        switch (_propKey4) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            // TODO: Can we make this a DEV warning to avoid this deny list?
+            throw new Error(
+              tag +
+                " is a void element tag and must neither have `children` nor " +
+                "use `dangerouslySetInnerHTML`."
+            );
+          }
+          // defaultChecked and defaultValue are ignored by setProp
+
+          default: {
+            // TODO: If the `is` prop is specified, this should go through the isCustomComponentTag flow.
+            setProp(domElement, tag, _propKey4, _propValue4, false, props);
+          }
+        }
       }
+
+      return;
     }
-    // eslint-disable-next-line no-fallthrough
+  }
 
-    default:
-      lastProps = lastRawProps;
-      nextProps = nextRawProps;
+  var isCustomComponentTag = isCustomComponent(tag, props);
 
-      if (
-        typeof lastProps.onClick !== "function" &&
-        typeof nextProps.onClick === "function"
-      ) {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
-      }
+  for (var _propKey5 in props) {
+    if (!props.hasOwnProperty(_propKey5)) {
+      continue;
+    }
 
-      break;
+    var _propValue5 = props[_propKey5];
+
+    if (_propValue5 == null) {
+      continue;
+    }
+
+    setProp(
+      domElement,
+      tag,
+      _propKey5,
+      _propValue5,
+      isCustomComponentTag,
+      props
+    );
+  }
+} // Calculate the diff between the two objects.
+
+function diffProperties(domElement, tag, lastProps, nextProps) {
+  {
+    validatePropertiesInDevelopment(tag, nextProps);
   }
 
+  var updatePayload = null;
   var propKey;
   var styleName;
   var styleUpdates = null;
@@ -36597,49 +36538,10 @@ function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
         break;
       }
 
-      case "dangerouslySetInnerHTML":
-      case "children": {
-        // Noop. This is handled by the clear text mechanism.
-        break;
-      }
-
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
-
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
-
-      case "autoFocus": {
-        // Noop. It doesn't work on updates anyway.
-        break;
-      }
-
-      case "innerText": // Properties
-
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
-        }
-
-      // eslint-disable-next-line no-fallthrough
-
       default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          // This is a special case. If any listener updates we need to ensure
-          // that the "current" fiber pointer gets updated so we need a commit
-          // to update this element.
-          if (!updatePayload) {
-            updatePayload = [];
-          }
-        } else {
-          // For all other deleted properties we add it to the queue. We use
-          // the allowed property list in the commit phase instead.
-          (updatePayload = updatePayload || []).push(propKey, null);
-        }
+        // For all other deleted properties we add it to the queue. We use
+        // the allowed property list in the commit phase instead.
+        (updatePayload = updatePayload || []).push(propKey, null);
       }
     }
   }
@@ -36649,237 +36551,258 @@ function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
     var lastProp = lastProps != null ? lastProps[propKey] : undefined;
 
     if (
-      !nextProps.hasOwnProperty(propKey) ||
-      nextProp === lastProp ||
-      (nextProp == null && lastProp == null)
+      nextProps.hasOwnProperty(propKey) &&
+      nextProp !== lastProp &&
+      (nextProp != null || lastProp != null)
     ) {
-      continue;
-    }
+      switch (propKey) {
+        case "style": {
+          if (lastProp) {
+            // Unset styles on `lastProp` but not on `nextProp`.
+            for (styleName in lastProp) {
+              if (
+                lastProp.hasOwnProperty(styleName) &&
+                (!nextProp || !nextProp.hasOwnProperty(styleName))
+              ) {
+                if (!styleUpdates) {
+                  styleUpdates = {};
+                }
 
-    switch (propKey) {
-      case "style": {
-        if (nextProp != null && typeof nextProp !== "object") {
-          throw new Error(
-            "The `style` prop expects a mapping from style properties to values, " +
-              "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
-              "using JSX."
-          );
-        }
+                styleUpdates[styleName] = "";
+              }
+            } // Update styles that changed since `lastProp`.
 
-        {
-          if (nextProp) {
-            // Freeze the next style object so that we can assume it won't be
-            // mutated. We have already warned for this in the past.
-            Object.freeze(nextProp);
-          }
-        }
+            for (styleName in nextProp) {
+              if (
+                nextProp.hasOwnProperty(styleName) &&
+                lastProp[styleName] !== nextProp[styleName]
+              ) {
+                if (!styleUpdates) {
+                  styleUpdates = {};
+                }
 
-        if (lastProp) {
-          // Unset styles on `lastProp` but not on `nextProp`.
-          for (styleName in lastProp) {
-            if (
-              lastProp.hasOwnProperty(styleName) &&
-              (!nextProp || !nextProp.hasOwnProperty(styleName))
-            ) {
-              if (!styleUpdates) {
-                styleUpdates = {};
+                styleUpdates[styleName] = nextProp[styleName];
               }
-
-              styleUpdates[styleName] = "";
             }
-          } // Update styles that changed since `lastProp`.
-
-          for (styleName in nextProp) {
-            if (
-              nextProp.hasOwnProperty(styleName) &&
-              lastProp[styleName] !== nextProp[styleName]
-            ) {
-              if (!styleUpdates) {
-                styleUpdates = {};
+          } else {
+            // Relies on `updateStylesByID` not mutating `styleUpdates`.
+            if (!styleUpdates) {
+              if (!updatePayload) {
+                updatePayload = [];
               }
 
-              styleUpdates[styleName] = nextProp[styleName];
-            }
-          }
-        } else {
-          // Relies on `updateStylesByID` not mutating `styleUpdates`.
-          if (!styleUpdates) {
-            if (!updatePayload) {
-              updatePayload = [];
+              updatePayload.push(propKey, styleUpdates);
             }
 
-            updatePayload.push(propKey, styleUpdates);
+            styleUpdates = nextProp;
           }
 
-          styleUpdates = nextProp;
+          break;
         }
 
-        break;
+        default: {
+          (updatePayload = updatePayload || []).push(propKey, nextProp);
+        }
       }
+    }
+  }
 
-      case "dangerouslySetInnerHTML": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "object" || !("__html" in nextProp)) {
-            throw new Error(
-              "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
-                "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
-                "for more information."
-            );
+  if (styleUpdates) {
+    {
+      validateShorthandPropertyCollisionInDev(styleUpdates, nextProps.style);
+    }
+
+    (updatePayload = updatePayload || []).push("style", styleUpdates);
+  }
+
+  return updatePayload;
+} // Apply the diff.
+
+function updateProperties(
+  domElement,
+  updatePayload,
+  tag,
+  lastProps,
+  nextProps
+) {
+  switch (tag) {
+    case "input": {
+      // Update checked *before* name.
+      // In the middle of an update, it is possible to have multiple checked.
+      // When a checked radio tries to change name, browser makes another radio's checked false.
+      if (nextProps.type === "radio" && nextProps.name != null) {
+        updateChecked(domElement, nextProps);
+      }
+
+      for (var i = 0; i < updatePayload.length; i += 2) {
+        var propKey = updatePayload[i];
+        var propValue = updatePayload[i + 1];
+
+        switch (propKey) {
+          case "checked": {
+            var node = domElement;
+            var checked =
+              propValue != null ? propValue : node._wrapperState.initialChecked;
+            node.checked =
+              !!checked &&
+              typeof checked !== "function" &&
+              checked !== "symbol";
+            break;
           }
 
-          var nextHtml = nextProp.__html;
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-          if (nextHtml != null) {
-            if (nextProps.children != null) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (propValue != null) {
               throw new Error(
-                "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
               );
             }
 
-            var lastHtml = lastProp ? lastProp.__html : undefined;
+            break;
+          }
+          // defaultChecked and defaultValue are ignored by setProp
 
-            if (lastHtml !== nextHtml) {
-              (updatePayload = updatePayload || []).push(propKey, nextHtml);
-            }
+          default: {
+            setProp(domElement, tag, propKey, propValue, false, nextProps);
           }
         }
+      } // Update the wrapper around inputs *after* updating props. This has to
+      // happen after updating the rest of props. Otherwise HTML5 input validations
+      // raise warnings and prevent the new value from being assigned.
 
-        break;
-      }
-
-      case "children": {
-        if (typeof nextProp === "string" || typeof nextProp === "number") {
-          (updatePayload = updatePayload || []).push(propKey, "" + nextProp);
-        }
+      updateWrapper$1(domElement, nextProps);
+      return;
+    }
 
-        break;
-      }
+    case "select": {
+      for (var _i = 0; _i < updatePayload.length; _i += 2) {
+        var _propKey6 = updatePayload[_i];
+        var _propValue6 = updatePayload[_i + 1];
 
-      case "onScroll": {
-        if (nextProp != null) {
-          // We eagerly listen to this even though we haven't committed yet.
-          if (typeof nextProp !== "function") {
-            warnForInvalidEventListener(propKey, nextProp);
+        switch (_propKey6) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
           }
+          // defaultValue are ignored by setProp
 
-          listenToNonDelegatedEvent("scroll", domElement);
+          default: {
+            setProp(domElement, tag, _propKey6, _propValue6, false, nextProps);
+          }
         }
+      } // <select> value update needs to occur after <option> children
+      // reconciliation
 
-        if (!updatePayload && lastProp !== nextProp) {
-          // This is a special case. If any listener updates we need to ensure
-          // that the "current" props pointer gets updated so we need a commit
-          // to update this element.
-          updatePayload = [];
-        }
+      postUpdateWrapper(domElement, nextProps);
+      return;
+    }
 
-        break;
-      }
+    case "textarea": {
+      for (var _i2 = 0; _i2 < updatePayload.length; _i2 += 2) {
+        var _propKey7 = updatePayload[_i2];
+        var _propValue7 = updatePayload[_i2 + 1];
 
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
+        switch (_propKey7) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
+          case "children": {
+            // TODO: This doesn't actually do anything if it updates.
+            break;
+          }
 
-      case "autoFocus": {
-        // Noop on updates
-        break;
-      }
+          case "dangerouslySetInnerHTML": {
+            if (_propValue7 != null) {
+              // TODO: Do we really need a special error message for this. It's also pretty blunt.
+              throw new Error(
+                "`dangerouslySetInnerHTML` does not make sense on <textarea>."
+              );
+            }
 
-      case "innerText": // Properties
+            break;
+          }
+          // defaultValue is ignored by setProp
 
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
+          default: {
+            setProp(domElement, tag, _propKey7, _propValue7, false, nextProps);
+          }
         }
+      }
 
-      // eslint-disable-next-line no-fallthrough
+      updateWrapper(domElement, nextProps);
+      return;
+    }
 
-      default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          if (nextProp != null) {
-            // We eagerly listen to this even though we haven't committed yet.
-            if (typeof nextProp !== "function") {
-              warnForInvalidEventListener(propKey, nextProp);
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem": {
+      // Void elements
+      for (var _i3 = 0; _i3 < updatePayload.length; _i3 += 2) {
+        var _propKey8 = updatePayload[_i3];
+        var _propValue8 = updatePayload[_i3 + 1];
+
+        switch (_propKey8) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (_propValue8 != null) {
+              // TODO: Can we make this a DEV warning to avoid this deny list?
+              throw new Error(
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
+              );
             }
+
+            break;
           }
+          // defaultChecked and defaultValue are ignored by setProp
 
-          if (!updatePayload && lastProp !== nextProp) {
-            // This is a special case. If any listener updates we need to ensure
-            // that the "current" props pointer gets updated so we need a commit
-            // to update this element.
-            updatePayload = [];
+          default: {
+            // TODO: If the `is` prop is specified, this should go through the isCustomComponentTag flow.
+            setProp(domElement, tag, _propKey8, _propValue8, false, nextProps);
           }
-        } else {
-          // For any other property we always add it to the queue and then we
-          // filter it out using the allowed property list during the commit.
-          (updatePayload = updatePayload || []).push(propKey, nextProp);
         }
       }
-    }
-  }
 
-  if (styleUpdates) {
-    {
-      validateShorthandPropertyCollisionInDev(styleUpdates, nextProps.style);
+      return;
     }
+  } // TODO: Handle wasCustomComponentTag. Changing "is" isn't valid.
+  // const wasCustomComponentTag = isCustomComponent(tag, lastProps);
 
-    (updatePayload = updatePayload || []).push("style", styleUpdates);
-  }
-
-  return updatePayload;
-} // Apply the diff.
-
-function updateProperties(
-  domElement,
-  updatePayload,
-  tag,
-  lastRawProps,
-  nextRawProps
-) {
-  // Update checked *before* name.
-  // In the middle of an update, it is possible to have multiple checked.
-  // When a checked radio tries to change name, browser makes another radio's checked false.
-  if (
-    tag === "input" &&
-    nextRawProps.type === "radio" &&
-    nextRawProps.name != null
-  ) {
-    updateChecked(domElement, nextRawProps);
-  }
-
-  var wasCustomComponentTag = isCustomComponent(tag, lastRawProps);
-  var isCustomComponentTag = isCustomComponent(tag, nextRawProps); // Apply the diff.
-
-  updateDOMProperties(
-    domElement,
-    updatePayload,
-    wasCustomComponentTag,
-    isCustomComponentTag
-  ); // TODO: Ensure that an update gets scheduled if any of the special props
-  // changed.
-
-  switch (tag) {
-    case "input":
-      // Update the wrapper around inputs *after* updating props. This has to
-      // happen after `updateDOMProperties`. Otherwise HTML5 input validations
-      // raise warnings and prevent the new value from being assigned.
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
+  var isCustomComponentTag = isCustomComponent(tag, nextProps); // Apply the diff.
 
-    case "select":
-      // <select> value update needs to occur after <option> children
-      // reconciliation
-      postUpdateWrapper(domElement, nextRawProps);
-      break;
+  for (var _i4 = 0; _i4 < updatePayload.length; _i4 += 2) {
+    var _propKey9 = updatePayload[_i4];
+    var _propValue9 = updatePayload[_i4 + 1];
+    setProp(
+      domElement,
+      tag,
+      _propKey9,
+      _propValue9,
+      isCustomComponentTag,
+      nextProps
+    );
   }
 }
 
@@ -36917,16 +36840,16 @@ function diffHydratedStyles(domElement, value) {
 function diffHydratedCustomComponent(
   domElement,
   tag,
-  rawProps,
+  props,
   parentNamespaceDev,
   extraAttributeNames
 ) {
-  for (var propKey in rawProps) {
-    if (!rawProps.hasOwnProperty(propKey)) {
+  for (var propKey in props) {
+    if (!props.hasOwnProperty(propKey)) {
       continue;
     }
 
-    var nextProp = rawProps[propKey];
+    var nextProp = props[propKey];
 
     if (nextProp == null) {
       continue;
@@ -36940,7 +36863,7 @@ function diffHydratedCustomComponent(
       continue;
     }
 
-    if (rawProps.suppressHydrationWarning === true) {
+    if (props.suppressHydrationWarning === true) {
       // Don't bother comparing. We're ignoring all these warnings.
       continue;
     } // Validate that the properties correspond to their expected values.
@@ -37028,16 +36951,16 @@ function diffHydratedCustomComponent(
 function diffHydratedGenericElement(
   domElement,
   tag,
-  rawProps,
+  props,
   parentNamespaceDev,
   extraAttributeNames
 ) {
-  for (var propKey in rawProps) {
-    if (!rawProps.hasOwnProperty(propKey)) {
+  for (var propKey in props) {
+    if (!props.hasOwnProperty(propKey)) {
       continue;
     }
 
-    var nextProp = rawProps[propKey];
+    var nextProp = props[propKey];
 
     if (nextProp == null) {
       continue;
@@ -37051,7 +36974,7 @@ function diffHydratedGenericElement(
       continue;
     }
 
-    if (rawProps.suppressHydrationWarning === true) {
+    if (props.suppressHydrationWarning === true) {
       // Don't bother comparing. We're ignoring all these warnings.
       continue;
     } // Validate that the properties correspond to their expected values.
@@ -37153,13 +37076,13 @@ function diffHydratedGenericElement(
 function diffHydratedProperties(
   domElement,
   tag,
-  rawProps,
+  props,
   isConcurrentMode,
   shouldWarnDev,
   parentNamespaceDev
 ) {
   {
-    validatePropertiesInDevelopment(tag, rawProps);
+    validatePropertiesInDevelopment(tag, props);
   } // TODO: Make sure that we check isMounted before firing any of these events.
 
   switch (tag) {
@@ -37208,37 +37131,46 @@ function diffHydratedProperties(
       break;
 
     case "input":
-      initWrapperState$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
-      listenToNonDelegatedEvent("invalid", domElement);
+      listenToNonDelegatedEvent("invalid", domElement); // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
+
+      track(domElement); // For input and textarea we current always set the value property at
+      // post mount to force it to diverge from attributes. However, for
+      // option and select we don't quite do the same thing and select
+      // is not resilient to the DOM state changing so we don't do that here.
+      // TODO: Consider not doing this for input and textarea.
+
+      postMountWrapper$3(domElement, props, true);
       break;
 
     case "option":
-      validateProps(domElement, rawProps);
+      validateProps(domElement, props);
       break;
 
     case "select":
-      initWrapperState$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState$1(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
       break;
 
     case "textarea":
-      initWrapperState(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-  }
+      listenToNonDelegatedEvent("invalid", domElement); // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
 
-  if (rawProps.hasOwnProperty("onScroll")) {
-    listenToNonDelegatedEvent("scroll", domElement);
+      track(domElement);
+      postMountWrapper(domElement);
+      break;
   }
 
   var updatePayload = null;
-  var children = rawProps.children; // For text content children we compare against textContent. This
+  var children = props.children; // For text content children we compare against textContent. This
   // might match additional HTML that is hidden when we read it using
   // textContent. E.g. "foo" will match "f<span>oo</span>" but that still
   // satisfies our requirement. Our requirement is not to produce perfect
@@ -37250,7 +37182,7 @@ function diffHydratedProperties(
 
   if (typeof children === "string" || typeof children === "number") {
     if (domElement.textContent !== "" + children) {
-      if (rawProps.suppressHydrationWarning !== true) {
+      if (props.suppressHydrationWarning !== true) {
         checkForUnmatchedText(
           domElement.textContent,
           children,
@@ -37265,12 +37197,21 @@ function diffHydratedProperties(
     }
   }
 
+  if (props.onScroll != null) {
+    listenToNonDelegatedEvent("scroll", domElement);
+  }
+
+  if (props.onClick != null) {
+    // TODO: This cast may not be sound for SVG, MathML or custom elements.
+    trapClickOnNonInteractiveElement(domElement);
+  }
+
   if (shouldWarnDev) {
     var extraAttributeNames = new Set();
     var attributes = domElement.attributes;
 
-    for (var _i = 0; _i < attributes.length; _i++) {
-      var name = attributes[_i].name.toLowerCase();
+    for (var _i5 = 0; _i5 < attributes.length; _i5++) {
+      var name = attributes[_i5].name.toLowerCase();
 
       switch (name) {
         // Controlled attributes are not validated
@@ -37287,15 +37228,15 @@ function diffHydratedProperties(
         default:
           // Intentionally use the original name.
           // See discussion in https://github.com/facebook/react/pull/10676.
-          extraAttributeNames.add(attributes[_i].name);
+          extraAttributeNames.add(attributes[_i5].name);
       }
     }
 
-    if (isCustomComponent(tag, rawProps)) {
+    if (isCustomComponent(tag, props)) {
       diffHydratedCustomComponent(
         domElement,
         tag,
-        rawProps,
+        props,
         parentNamespaceDev,
         extraAttributeNames
       );
@@ -37303,7 +37244,7 @@ function diffHydratedProperties(
       diffHydratedGenericElement(
         domElement,
         tag,
-        rawProps,
+        props,
         parentNamespaceDev,
         extraAttributeNames
       );
@@ -37311,45 +37252,12 @@ function diffHydratedProperties(
 
     if (
       extraAttributeNames.size > 0 &&
-      rawProps.suppressHydrationWarning !== true
+      props.suppressHydrationWarning !== true
     ) {
       warnForExtraAttributes(extraAttributeNames);
     }
   }
 
-  switch (tag) {
-    case "input":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, true);
-      break;
-
-    case "textarea":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-
-    case "select":
-    case "option":
-      // For input and textarea we current always set the value property at
-      // post mount to force it to diverge from attributes. However, for
-      // option and select we don't quite do the same thing and select
-      // is not resilient to the DOM state changing so we don't do that here.
-      // TODO: Consider not doing this for input and textarea.
-      break;
-
-    default:
-      if (typeof rawProps.onClick === "function") {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
-      }
-
-      break;
-  }
-
   return updatePayload;
 }
 function diffHydratedText(textNode, text, isConcurrentMode) {
diff --git a/compiled/facebook-www/ReactDOMTesting-dev.modern.js b/compiled/facebook-www/ReactDOMTesting-dev.modern.js
index 7c080e4528358..e6a0b5384bd05 100644
--- a/compiled/facebook-www/ReactDOMTesting-dev.modern.js
+++ b/compiled/facebook-www/ReactDOMTesting-dev.modern.js
@@ -4494,17 +4494,6 @@ function isControlled(props) {
  * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
  */
 
-function getHostProps$2(element, props) {
-  var node = element;
-  var checked = props.checked;
-  var hostProps = assign({}, props, {
-    defaultChecked: undefined,
-    defaultValue: undefined,
-    value: undefined,
-    checked: checked != null ? checked : node._wrapperState.initialChecked
-  });
-  return hostProps;
-}
 function initWrapperState$2(element, props) {
   {
     checkControlledValueProps("input", props);
@@ -4550,9 +4539,13 @@ function initWrapperState$2(element, props) {
 
   var node = element;
   var defaultValue = props.defaultValue == null ? "" : props.defaultValue;
+  var initialChecked =
+    props.checked != null ? props.checked : props.defaultChecked;
   node._wrapperState = {
     initialChecked:
-      props.checked != null ? props.checked : props.defaultChecked,
+      typeof initialChecked !== "function" &&
+      typeof initialChecked !== "symbol" &&
+      !!initialChecked,
     initialValue: getToStringValue(
       props.value != null ? props.value : defaultValue
     ),
@@ -4738,19 +4731,20 @@ function postMountWrapper$3(element, props, isHydrating) {
 
   if (name !== "") {
     node.name = "";
+  } // The checked property never gets assigned. It must be manually set.
+  // We don't want to do this when hydrating so that existing user input isn't
+  // modified
+  // TODO: I'm pretty sure this is a bug because initialValueTracking won't be
+  // correct for the hydration case then.
+
+  if (!isHydrating) {
+    node.checked = !!node._wrapperState.initialChecked;
   }
 
   if (disableInputAttributeSyncing) {
-    // When not syncing the checked attribute, the checked property
-    // never gets assigned. It must be manually set. We don't want
-    // to do this when hydrating so that existing user input isn't
-    // modified
-    if (!isHydrating) {
-      updateChecked(element, props);
-    } // Only assign the checked attribute if it is defined. This saves
+    // Only assign the checked attribute if it is defined. This saves
     // a DOM write when controlling the checked attribute isn't needed
     // (text inputs, submit/reset)
-
     if (props.hasOwnProperty("defaultChecked")) {
       node.defaultChecked = !node.defaultChecked;
       node.defaultChecked = !!props.defaultChecked;
@@ -5035,11 +5029,6 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
  * selected.
  */
 
-function getHostProps$1(element, props) {
-  return assign({}, props, {
-    value: undefined
-  });
-}
 function initWrapperState$1(element, props) {
   var node = element;
 
@@ -5124,28 +5113,6 @@ var didWarnValDefaultVal = false;
  * `defaultValue` if specified, or the children content (deprecated).
  */
 
-function getHostProps(element, props) {
-  var node = element;
-
-  if (props.dangerouslySetInnerHTML != null) {
-    throw new Error(
-      "`dangerouslySetInnerHTML` does not make sense on <textarea>."
-    );
-  } // Always set children to the same thing. In IE9, the selection range will
-  // get reset if `textContent` is mutated.  We could add a check in setTextContent
-  // to only set the value if/when the value differs from the node value (which would
-  // completely solve this IE9 bug), but Sebastian+Sophie seemed to like this
-  // solution. The value can be a boolean or object so that's why it's forced
-  // to be a string.
-
-  var hostProps = assign({}, props, {
-    value: undefined,
-    defaultValue: undefined,
-    children: toString(node._wrapperState.initialValue)
-  });
-
-  return hostProps;
-}
 function initWrapperState(element, props) {
   var node = element;
 
@@ -5193,8 +5160,11 @@ function initWrapperState(element, props) {
     initialValue = defaultValue;
   }
 
+  var stringValue = getToStringValue(initialValue);
+  node.defaultValue = stringValue; // This will be toString:ed.
+
   node._wrapperState = {
-    initialValue: getToStringValue(initialValue)
+    initialValue: stringValue
   };
 }
 function updateWrapper(element, props) {
@@ -34324,7 +34294,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-614507fb";
+var ReactVersion = "18.3.0-www-modern-43a2d9cb";
 
 function createPortal$1(
   children,
@@ -39766,189 +39736,146 @@ function trapClickOnNonInteractiveElement(node) {
   node.onclick = noop$1;
 }
 
-function setInitialDOMProperties(
-  tag,
-  domElement,
-  nextProps,
-  isCustomComponentTag
-) {
-  for (var propKey in nextProps) {
-    if (!nextProps.hasOwnProperty(propKey)) {
-      continue;
-    }
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style": {
+      if (value != null && typeof value !== "object") {
+        throw new Error(
+          "The `style` prop expects a mapping from style properties to values, " +
+            "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
+            "using JSX."
+        );
+      }
 
-    var nextProp = nextProps[propKey];
+      {
+        if (value) {
+          // Freeze the next style object so that we can assume it won't be
+          // mutated. We have already warned for this in the past.
+          Object.freeze(value);
+        }
+      } // Relies on `updateStylesByID` not mutating `styleUpdates`.
 
-    switch (propKey) {
-      case "style": {
-        if (nextProp != null && typeof nextProp !== "object") {
+      setValueForStyles(domElement, value);
+      break;
+    }
+
+    case "dangerouslySetInnerHTML": {
+      if (value != null) {
+        if (typeof value !== "object" || !("__html" in value)) {
           throw new Error(
-            "The `style` prop expects a mapping from style properties to values, " +
-              "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
-              "using JSX."
+            "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
+              "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
+              "for more information."
           );
         }
 
-        {
-          if (nextProp) {
-            // Freeze the next style object so that we can assume it won't be
-            // mutated. We have already warned for this in the past.
-            Object.freeze(nextProp);
-          }
-        } // Relies on `updateStylesByID` not mutating `styleUpdates`.
+        var nextHtml = value.__html;
 
-        setValueForStyles(domElement, nextProp);
-        break;
-      }
-
-      case "dangerouslySetInnerHTML": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "object" || !("__html" in nextProp)) {
+        if (nextHtml != null) {
+          if (props.children != null) {
             throw new Error(
-              "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
-                "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
-                "for more information."
+              "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
             );
           }
 
-          var nextHtml = nextProp.__html;
-
-          if (nextHtml != null) {
-            if (nextProps.children != null) {
-              throw new Error(
-                "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
-              );
-            }
-
-            if (disableIEWorkarounds) {
-              domElement.innerHTML = nextHtml;
-            } else {
-              setInnerHTML$1(domElement, nextHtml);
-            }
+          if (disableIEWorkarounds) {
+            domElement.innerHTML = nextHtml;
+          } else {
+            setInnerHTML$1(domElement, nextHtml);
           }
         }
-
-        break;
       }
 
-      case "children": {
-        if (typeof nextProp === "string") {
-          // Avoid setting initial textContent when the text is empty. In IE11 setting
-          // textContent on a <textarea> will cause the placeholder to not
-          // show within the <textarea> until it has been focused and blurred again.
-          // https://github.com/facebook/react/issues/6731#issuecomment-254874553
-          var canSetTextContent =
-            tag !== "body" && (tag !== "textarea" || nextProp !== "");
+      break;
+    }
 
-          if (canSetTextContent) {
-            setTextContent(domElement, nextProp);
-          }
-        } else if (typeof nextProp === "number") {
-          var _canSetTextContent = tag !== "body";
+    case "children": {
+      if (typeof value === "string") {
+        // Avoid setting initial textContent when the text is empty. In IE11 setting
+        // textContent on a <textarea> will cause the placeholder to not
+        // show within the <textarea> until it has been focused and blurred again.
+        // https://github.com/facebook/react/issues/6731#issuecomment-254874553
+        var canSetTextContent =
+          tag !== "body" && (tag !== "textarea" || value !== "");
 
-          if (_canSetTextContent) {
-            setTextContent(domElement, "" + nextProp);
-          }
+        if (canSetTextContent) {
+          setTextContent(domElement, value);
         }
+      } else if (typeof value === "number") {
+        var _canSetTextContent = tag !== "body";
 
-        break;
+        if (_canSetTextContent) {
+          setTextContent(domElement, "" + value);
+        }
       }
 
-      case "onScroll": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "function") {
-            warnForInvalidEventListener(propKey, nextProp);
-          }
+      break;
+    }
 
-          listenToNonDelegatedEvent("scroll", domElement);
+    case "onScroll": {
+      if (value != null) {
+        if (typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
         }
 
-        break;
+        listenToNonDelegatedEvent("scroll", domElement);
       }
 
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
+      break;
+    }
 
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
+    case "onClick": {
+      // TODO: This cast may not be sound for SVG, MathML or custom elements.
+      if (value != null) {
+        if (typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
+        }
 
-      case "autoFocus": {
-        // We polyfill it separately on the client during commit.
-        // We could have excluded it in the property list instead of
-        // adding a special case here, but then it wouldn't be emitted
-        // on server rendering (but we *do* want to emit it in SSR).
-        break;
+        trapClickOnNonInteractiveElement(domElement);
       }
 
-      case "innerText": // Properties
-
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
-        }
+      break;
+    }
 
-      // eslint-disable-next-line no-fallthrough
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue": // Reserved
 
-      default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          if (nextProp != null) {
-            if (typeof nextProp !== "function") {
-              warnForInvalidEventListener(propKey, nextProp);
-            }
-          }
-        } else if (nextProp != null) {
-          if (isCustomComponentTag) {
-            setValueForPropertyOnCustomComponent(domElement, propKey, nextProp);
-          } else {
-            setValueForProperty(domElement, propKey, nextProp);
-          }
-        }
-      }
+    case "defaultChecked":
+    case "innerHTML": {
+      // Noop
+      break;
     }
-  }
-}
-
-function updateDOMProperties(
-  domElement,
-  updatePayload,
-  wasCustomComponentTag,
-  isCustomComponentTag
-) {
-  // TODO: Handle wasCustomComponentTag
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i];
-    var propValue = updatePayload[i + 1];
 
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
+    case "autoFocus": {
+      // We polyfill it separately on the client during commit.
+      // We could have excluded it in the property list instead of
+      // adding a special case here, but then it wouldn't be emitted
+      // on server rendering (but we *do* want to emit it in SSR).
+      break;
+    }
 
-      case "dangerouslySetInnerHTML":
-        if (disableIEWorkarounds) {
-          domElement.innerHTML = propValue;
-        } else {
-          setInnerHTML$1(domElement, propValue);
-        }
+    case "innerText": // Properties
 
+    case "textContent":
+      if (enableCustomElementPropertySupport) {
         break;
+      }
 
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
+    // eslint-disable-next-line no-fallthrough
 
-      default:
+    default: {
+      if (registrationNameDependencies.hasOwnProperty(key)) {
+        if (value != null && typeof value !== "function") {
+          warnForInvalidEventListener(key, value);
+        }
+      } else {
         if (isCustomComponentTag) {
-          setValueForPropertyOnCustomComponent(domElement, propKey, propValue);
+          setValueForPropertyOnCustomComponent(domElement, key, value);
         } else {
-          setValueForProperty(domElement, propKey, propValue);
+          setValueForProperty(domElement, key, value);
         }
-
-        break;
+      }
     }
   }
 } // creates a script element that won't execute
@@ -40079,291 +40006,305 @@ function createTextNode(text, rootContainerElement) {
     text
   );
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
-
+function setInitialProperties(domElement, tag, props) {
   {
-    validatePropertiesInDevelopment(tag, rawProps);
+    validatePropertiesInDevelopment(tag, props);
   } // TODO: Make sure that we check isMounted before firing any of these events.
 
-  var props;
-
   switch (tag) {
-    case "dialog":
-      listenToNonDelegatedEvent("cancel", domElement);
-      listenToNonDelegatedEvent("close", domElement);
-      props = rawProps;
-      break;
-
-    case "embed":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
-
-    // eslint-disable-next-line no-fallthrough
+    case "input": {
+      initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the invalid event.
 
-    case "iframe":
-    case "object":
-      // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the load event.
-      listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
-      break;
+      listenToNonDelegatedEvent("invalid", domElement);
 
-    case "video":
-    case "audio":
-      // We listen to these events in case to ensure emulated bubble
-      // listeners still fire for all the media events.
-      for (var i = 0; i < mediaEventTypes.length; i++) {
-        listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
-      }
+      for (var propKey in props) {
+        if (!props.hasOwnProperty(propKey)) {
+          continue;
+        }
 
-      props = rawProps;
-      break;
+        var propValue = props[propKey];
 
-    case "source":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      } // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the error event.
+        if (propValue == null) {
+          continue;
+        }
 
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
+        switch (propKey) {
+          case "checked": {
+            var node = domElement;
+            var checked =
+              propValue != null ? propValue : node._wrapperState.initialChecked;
+            node.checked =
+              !!checked &&
+              typeof checked !== "function" &&
+              checked !== "symbol";
+            break;
+          }
 
-    case "img":
-    case "link":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-    // eslint-disable-next-line no-fallthrough
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (propValue != null) {
+              throw new Error(
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
+              );
+            }
 
-    case "image":
-      // We listen to these events in case to ensure emulated bubble
-      // listeners still fire for error and load events.
-      listenToNonDelegatedEvent("error", domElement);
-      listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
-      break;
+            break;
+          }
+          // defaultChecked and defaultValue are ignored by setProp
 
-    case "details":
-      // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the toggle event.
-      listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
+          default: {
+            setProp(domElement, tag, propKey, propValue, false, props);
+          }
+        }
+      } // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
 
-    case "input":
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
+      track(domElement);
+      postMountWrapper$3(domElement, props, false);
+      return;
+    }
 
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+    case "select": {
+      initWrapperState$1(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
-      break;
 
-    case "option":
-      validateProps(domElement, rawProps);
-      props = rawProps;
-      break;
+      for (var _propKey in props) {
+        if (!props.hasOwnProperty(_propKey)) {
+          continue;
+        }
 
-    case "select":
-      initWrapperState$1(domElement, rawProps);
-      props = getHostProps$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
-      // listeners still fire for the invalid event.
+        var _propValue = props[_propKey];
 
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
+        if (_propValue == null) {
+          continue;
+        }
 
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+        switch (_propKey) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
+          // defaultValue are ignored by setProp
+
+          default: {
+            setProp(domElement, tag, _propKey, _propValue, false, props);
+          }
+        }
+      }
+
+      postMountWrapper$1(domElement, props);
+      return;
+    }
+
+    case "textarea": {
+      initWrapperState(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
-      break;
 
-    case "area":
-    case "base":
-    case "br":
-    case "col":
-    case "hr":
-    case "keygen":
-    case "meta":
-    case "param":
-    case "track":
-    case "wbr":
-    case "menuitem": {
-      if (
-        rawProps.children != null ||
-        rawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
-      }
-    }
-    // eslint-disable-next-line no-fallthrough
+      for (var _propKey2 in props) {
+        if (!props.hasOwnProperty(_propKey2)) {
+          continue;
+        }
 
-    default:
-      props = rawProps;
-  }
+        var _propValue2 = props[_propKey2];
 
-  setInitialDOMProperties(tag, domElement, props, isCustomComponentTag);
+        if (_propValue2 == null) {
+          continue;
+        }
 
-  switch (tag) {
-    case "input":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, false);
-      break;
+        switch (_propKey2) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-    case "textarea":
-      // TODO: Make sure we check if this is still unmounted or do any clean
+          case "children": {
+            // TODO: Handled by initWrapperState above.
+            break;
+          }
+
+          case "dangerouslySetInnerHTML": {
+            if (_propValue2 != null) {
+              // TODO: Do we really need a special error message for this. It's also pretty blunt.
+              throw new Error(
+                "`dangerouslySetInnerHTML` does not make sense on <textarea>."
+              );
+            }
+
+            break;
+          }
+          // defaultValue is ignored by setProp
+
+          default: {
+            setProp(domElement, tag, _propKey2, _propValue2, false, props);
+          }
+        }
+      } // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
+
       track(domElement);
       postMountWrapper(domElement);
-      break;
+      return;
+    }
 
-    case "option":
-      postMountWrapper$2(domElement, rawProps);
-      break;
+    case "option": {
+      validateProps(domElement, props);
 
-    case "select":
-      postMountWrapper$1(domElement, rawProps);
-      break;
+      for (var _propKey3 in props) {
+        if (!props.hasOwnProperty(_propKey3)) {
+          continue;
+        }
 
-    default:
-      if (typeof props.onClick === "function") {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
+        var _propValue3 = props[_propKey3];
+
+        if (_propValue3 == null) {
+          continue;
+        }
+
+        setProp(domElement, tag, _propKey3, _propValue3, false, props);
       }
 
-      break;
-  }
-} // Calculate the diff between the two objects.
+      postMountWrapper$2(domElement, props);
+      return;
+    }
 
-function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
-  {
-    validatePropertiesInDevelopment(tag, nextRawProps);
-  }
+    case "dialog": {
+      listenToNonDelegatedEvent("cancel", domElement);
+      listenToNonDelegatedEvent("close", domElement);
+      break;
+    }
 
-  var updatePayload = null;
-  var lastProps;
-  var nextProps;
+    case "iframe":
+    case "object": {
+      // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the load event.
+      listenToNonDelegatedEvent("load", domElement);
+      break;
+    }
 
-  switch (tag) {
-    case "input":
-      if (
-        nextRawProps.children != null ||
-        nextRawProps.dangerouslySetInnerHTML != null
-      ) {
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
+    case "video":
+    case "audio": {
+      // We listen to these events in case to ensure emulated bubble
+      // listeners still fire for all the media events.
+      for (var i = 0; i < mediaEventTypes.length; i++) {
+        listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
       }
 
-      lastProps = getHostProps$2(domElement, lastRawProps);
-      nextProps = getHostProps$2(domElement, nextRawProps);
-      updatePayload = [];
       break;
+    }
 
-    case "select":
-      lastProps = getHostProps$1(domElement, lastRawProps);
-      nextProps = getHostProps$1(domElement, nextRawProps);
-      updatePayload = [];
+    case "image": {
+      // We listen to these events in case to ensure emulated bubble
+      // listeners still fire for error and load events.
+      listenToNonDelegatedEvent("error", domElement);
+      listenToNonDelegatedEvent("load", domElement);
       break;
+    }
 
-    case "textarea":
-      lastProps = getHostProps(domElement, lastRawProps);
-      nextProps = getHostProps(domElement, nextRawProps);
-      updatePayload = [];
+    case "details": {
+      // We listen to this event in case to ensure emulated bubble
+      // listeners still fire for the toggle event.
+      listenToNonDelegatedEvent("toggle", domElement);
       break;
+    }
 
+    case "embed":
+    case "source":
     case "img":
-    case "link":
+    case "link": {
+      // These are void elements that also need delegated events.
+      listenToNonDelegatedEvent("error", domElement);
+      listenToNonDelegatedEvent("load", domElement); // We fallthrough to the return of the void elements
+    }
+    // eslint-disable-next-line no-fallthrough
+
     case "area":
     case "base":
     case "br":
     case "col":
-    case "embed":
     case "hr":
     case "keygen":
     case "meta":
     case "param":
-    case "source":
     case "track":
     case "wbr":
     case "menuitem": {
-      if (
-        nextRawProps.children != null ||
-        nextRawProps.dangerouslySetInnerHTML != null
-      ) {
-        // TODO: Can we make this a DEV warning to avoid this deny list?
-        throw new Error(
-          tag +
-            " is a void element tag and must neither have `children` nor " +
-            "use `dangerouslySetInnerHTML`."
-        );
+      // Void elements
+      for (var _propKey4 in props) {
+        if (!props.hasOwnProperty(_propKey4)) {
+          continue;
+        }
+
+        var _propValue4 = props[_propKey4];
+
+        if (_propValue4 == null) {
+          continue;
+        }
+
+        switch (_propKey4) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            // TODO: Can we make this a DEV warning to avoid this deny list?
+            throw new Error(
+              tag +
+                " is a void element tag and must neither have `children` nor " +
+                "use `dangerouslySetInnerHTML`."
+            );
+          }
+          // defaultChecked and defaultValue are ignored by setProp
+
+          default: {
+            // TODO: If the `is` prop is specified, this should go through the isCustomComponentTag flow.
+            setProp(domElement, tag, _propKey4, _propValue4, false, props);
+          }
+        }
       }
+
+      return;
     }
-    // eslint-disable-next-line no-fallthrough
+  }
 
-    default:
-      lastProps = lastRawProps;
-      nextProps = nextRawProps;
+  var isCustomComponentTag = isCustomComponent(tag, props);
 
-      if (
-        typeof lastProps.onClick !== "function" &&
-        typeof nextProps.onClick === "function"
-      ) {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
-      }
+  for (var _propKey5 in props) {
+    if (!props.hasOwnProperty(_propKey5)) {
+      continue;
+    }
 
-      break;
+    var _propValue5 = props[_propKey5];
+
+    if (_propValue5 == null) {
+      continue;
+    }
+
+    setProp(
+      domElement,
+      tag,
+      _propKey5,
+      _propValue5,
+      isCustomComponentTag,
+      props
+    );
   }
+} // Calculate the diff between the two objects.
 
+function diffProperties(domElement, tag, lastProps, nextProps) {
+  {
+    validatePropertiesInDevelopment(tag, nextProps);
+  }
+
+  var updatePayload = null;
   var propKey;
   var styleName;
   var styleUpdates = null;
@@ -40394,49 +40335,10 @@ function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
         break;
       }
 
-      case "dangerouslySetInnerHTML":
-      case "children": {
-        // Noop. This is handled by the clear text mechanism.
-        break;
-      }
-
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
-
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
-
-      case "autoFocus": {
-        // Noop. It doesn't work on updates anyway.
-        break;
-      }
-
-      case "innerText": // Properties
-
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
-        }
-
-      // eslint-disable-next-line no-fallthrough
-
       default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          // This is a special case. If any listener updates we need to ensure
-          // that the "current" fiber pointer gets updated so we need a commit
-          // to update this element.
-          if (!updatePayload) {
-            updatePayload = [];
-          }
-        } else {
-          // For all other deleted properties we add it to the queue. We use
-          // the allowed property list in the commit phase instead.
-          (updatePayload = updatePayload || []).push(propKey, null);
-        }
+        // For all other deleted properties we add it to the queue. We use
+        // the allowed property list in the commit phase instead.
+        (updatePayload = updatePayload || []).push(propKey, null);
       }
     }
   }
@@ -40446,237 +40348,258 @@ function diffProperties(domElement, tag, lastRawProps, nextRawProps) {
     var lastProp = lastProps != null ? lastProps[propKey] : undefined;
 
     if (
-      !nextProps.hasOwnProperty(propKey) ||
-      nextProp === lastProp ||
-      (nextProp == null && lastProp == null)
+      nextProps.hasOwnProperty(propKey) &&
+      nextProp !== lastProp &&
+      (nextProp != null || lastProp != null)
     ) {
-      continue;
-    }
+      switch (propKey) {
+        case "style": {
+          if (lastProp) {
+            // Unset styles on `lastProp` but not on `nextProp`.
+            for (styleName in lastProp) {
+              if (
+                lastProp.hasOwnProperty(styleName) &&
+                (!nextProp || !nextProp.hasOwnProperty(styleName))
+              ) {
+                if (!styleUpdates) {
+                  styleUpdates = {};
+                }
 
-    switch (propKey) {
-      case "style": {
-        if (nextProp != null && typeof nextProp !== "object") {
-          throw new Error(
-            "The `style` prop expects a mapping from style properties to values, " +
-              "not a string. For example, style={{marginRight: spacing + 'em'}} when " +
-              "using JSX."
-          );
-        }
+                styleUpdates[styleName] = "";
+              }
+            } // Update styles that changed since `lastProp`.
 
-        {
-          if (nextProp) {
-            // Freeze the next style object so that we can assume it won't be
-            // mutated. We have already warned for this in the past.
-            Object.freeze(nextProp);
-          }
-        }
+            for (styleName in nextProp) {
+              if (
+                nextProp.hasOwnProperty(styleName) &&
+                lastProp[styleName] !== nextProp[styleName]
+              ) {
+                if (!styleUpdates) {
+                  styleUpdates = {};
+                }
 
-        if (lastProp) {
-          // Unset styles on `lastProp` but not on `nextProp`.
-          for (styleName in lastProp) {
-            if (
-              lastProp.hasOwnProperty(styleName) &&
-              (!nextProp || !nextProp.hasOwnProperty(styleName))
-            ) {
-              if (!styleUpdates) {
-                styleUpdates = {};
+                styleUpdates[styleName] = nextProp[styleName];
               }
-
-              styleUpdates[styleName] = "";
             }
-          } // Update styles that changed since `lastProp`.
-
-          for (styleName in nextProp) {
-            if (
-              nextProp.hasOwnProperty(styleName) &&
-              lastProp[styleName] !== nextProp[styleName]
-            ) {
-              if (!styleUpdates) {
-                styleUpdates = {};
+          } else {
+            // Relies on `updateStylesByID` not mutating `styleUpdates`.
+            if (!styleUpdates) {
+              if (!updatePayload) {
+                updatePayload = [];
               }
 
-              styleUpdates[styleName] = nextProp[styleName];
-            }
-          }
-        } else {
-          // Relies on `updateStylesByID` not mutating `styleUpdates`.
-          if (!styleUpdates) {
-            if (!updatePayload) {
-              updatePayload = [];
+              updatePayload.push(propKey, styleUpdates);
             }
 
-            updatePayload.push(propKey, styleUpdates);
+            styleUpdates = nextProp;
           }
 
-          styleUpdates = nextProp;
+          break;
         }
 
-        break;
+        default: {
+          (updatePayload = updatePayload || []).push(propKey, nextProp);
+        }
       }
+    }
+  }
 
-      case "dangerouslySetInnerHTML": {
-        if (nextProp != null) {
-          if (typeof nextProp !== "object" || !("__html" in nextProp)) {
-            throw new Error(
-              "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " +
-                "Please visit https://reactjs.org/link/dangerously-set-inner-html " +
-                "for more information."
-            );
+  if (styleUpdates) {
+    {
+      validateShorthandPropertyCollisionInDev(styleUpdates, nextProps.style);
+    }
+
+    (updatePayload = updatePayload || []).push("style", styleUpdates);
+  }
+
+  return updatePayload;
+} // Apply the diff.
+
+function updateProperties(
+  domElement,
+  updatePayload,
+  tag,
+  lastProps,
+  nextProps
+) {
+  switch (tag) {
+    case "input": {
+      // Update checked *before* name.
+      // In the middle of an update, it is possible to have multiple checked.
+      // When a checked radio tries to change name, browser makes another radio's checked false.
+      if (nextProps.type === "radio" && nextProps.name != null) {
+        updateChecked(domElement, nextProps);
+      }
+
+      for (var i = 0; i < updatePayload.length; i += 2) {
+        var propKey = updatePayload[i];
+        var propValue = updatePayload[i + 1];
+
+        switch (propKey) {
+          case "checked": {
+            var node = domElement;
+            var checked =
+              propValue != null ? propValue : node._wrapperState.initialChecked;
+            node.checked =
+              !!checked &&
+              typeof checked !== "function" &&
+              checked !== "symbol";
+            break;
           }
 
-          var nextHtml = nextProp.__html;
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-          if (nextHtml != null) {
-            if (nextProps.children != null) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (propValue != null) {
               throw new Error(
-                "Can only set one of `children` or `props.dangerouslySetInnerHTML`."
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
               );
             }
 
-            var lastHtml = lastProp ? lastProp.__html : undefined;
+            break;
+          }
+          // defaultChecked and defaultValue are ignored by setProp
 
-            if (lastHtml !== nextHtml) {
-              (updatePayload = updatePayload || []).push(propKey, nextHtml);
-            }
+          default: {
+            setProp(domElement, tag, propKey, propValue, false, nextProps);
           }
         }
+      } // Update the wrapper around inputs *after* updating props. This has to
+      // happen after updating the rest of props. Otherwise HTML5 input validations
+      // raise warnings and prevent the new value from being assigned.
 
-        break;
-      }
-
-      case "children": {
-        if (typeof nextProp === "string" || typeof nextProp === "number") {
-          (updatePayload = updatePayload || []).push(propKey, "" + nextProp);
-        }
+      updateWrapper$1(domElement, nextProps);
+      return;
+    }
 
-        break;
-      }
+    case "select": {
+      for (var _i = 0; _i < updatePayload.length; _i += 2) {
+        var _propKey6 = updatePayload[_i];
+        var _propValue6 = updatePayload[_i + 1];
 
-      case "onScroll": {
-        if (nextProp != null) {
-          // We eagerly listen to this even though we haven't committed yet.
-          if (typeof nextProp !== "function") {
-            warnForInvalidEventListener(propKey, nextProp);
+        switch (_propKey6) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
           }
+          // defaultValue are ignored by setProp
 
-          listenToNonDelegatedEvent("scroll", domElement);
+          default: {
+            setProp(domElement, tag, _propKey6, _propValue6, false, nextProps);
+          }
         }
+      } // <select> value update needs to occur after <option> children
+      // reconciliation
 
-        if (!updatePayload && lastProp !== nextProp) {
-          // This is a special case. If any listener updates we need to ensure
-          // that the "current" props pointer gets updated so we need a commit
-          // to update this element.
-          updatePayload = [];
-        }
+      postUpdateWrapper(domElement, nextProps);
+      return;
+    }
 
-        break;
-      }
+    case "textarea": {
+      for (var _i2 = 0; _i2 < updatePayload.length; _i2 += 2) {
+        var _propKey7 = updatePayload[_i2];
+        var _propValue7 = updatePayload[_i2 + 1];
 
-      case "suppressContentEditableWarning":
-      case "suppressHydrationWarning":
-      case "defaultValue": // Reserved
+        switch (_propKey7) {
+          case "value": {
+            // This is handled by updateWrapper below.
+            break;
+          }
 
-      case "defaultChecked":
-      case "innerHTML": {
-        // Noop
-        break;
-      }
+          case "children": {
+            // TODO: This doesn't actually do anything if it updates.
+            break;
+          }
 
-      case "autoFocus": {
-        // Noop on updates
-        break;
-      }
+          case "dangerouslySetInnerHTML": {
+            if (_propValue7 != null) {
+              // TODO: Do we really need a special error message for this. It's also pretty blunt.
+              throw new Error(
+                "`dangerouslySetInnerHTML` does not make sense on <textarea>."
+              );
+            }
 
-      case "innerText": // Properties
+            break;
+          }
+          // defaultValue is ignored by setProp
 
-      case "textContent":
-        if (enableCustomElementPropertySupport) {
-          break;
+          default: {
+            setProp(domElement, tag, _propKey7, _propValue7, false, nextProps);
+          }
         }
+      }
 
-      // eslint-disable-next-line no-fallthrough
+      updateWrapper(domElement, nextProps);
+      return;
+    }
 
-      default: {
-        if (registrationNameDependencies.hasOwnProperty(propKey)) {
-          if (nextProp != null) {
-            // We eagerly listen to this even though we haven't committed yet.
-            if (typeof nextProp !== "function") {
-              warnForInvalidEventListener(propKey, nextProp);
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem": {
+      // Void elements
+      for (var _i3 = 0; _i3 < updatePayload.length; _i3 += 2) {
+        var _propKey8 = updatePayload[_i3];
+        var _propValue8 = updatePayload[_i3 + 1];
+
+        switch (_propKey8) {
+          case "children":
+          case "dangerouslySetInnerHTML": {
+            if (_propValue8 != null) {
+              // TODO: Can we make this a DEV warning to avoid this deny list?
+              throw new Error(
+                tag +
+                  " is a void element tag and must neither have `children` nor " +
+                  "use `dangerouslySetInnerHTML`."
+              );
             }
+
+            break;
           }
+          // defaultChecked and defaultValue are ignored by setProp
 
-          if (!updatePayload && lastProp !== nextProp) {
-            // This is a special case. If any listener updates we need to ensure
-            // that the "current" props pointer gets updated so we need a commit
-            // to update this element.
-            updatePayload = [];
+          default: {
+            // TODO: If the `is` prop is specified, this should go through the isCustomComponentTag flow.
+            setProp(domElement, tag, _propKey8, _propValue8, false, nextProps);
           }
-        } else {
-          // For any other property we always add it to the queue and then we
-          // filter it out using the allowed property list during the commit.
-          (updatePayload = updatePayload || []).push(propKey, nextProp);
         }
       }
-    }
-  }
 
-  if (styleUpdates) {
-    {
-      validateShorthandPropertyCollisionInDev(styleUpdates, nextProps.style);
+      return;
     }
+  } // TODO: Handle wasCustomComponentTag. Changing "is" isn't valid.
+  // const wasCustomComponentTag = isCustomComponent(tag, lastProps);
 
-    (updatePayload = updatePayload || []).push("style", styleUpdates);
-  }
-
-  return updatePayload;
-} // Apply the diff.
+  var isCustomComponentTag = isCustomComponent(tag, nextProps); // Apply the diff.
 
-function updateProperties(
-  domElement,
-  updatePayload,
-  tag,
-  lastRawProps,
-  nextRawProps
-) {
-  // Update checked *before* name.
-  // In the middle of an update, it is possible to have multiple checked.
-  // When a checked radio tries to change name, browser makes another radio's checked false.
-  if (
-    tag === "input" &&
-    nextRawProps.type === "radio" &&
-    nextRawProps.name != null
-  ) {
-    updateChecked(domElement, nextRawProps);
-  }
-
-  var wasCustomComponentTag = isCustomComponent(tag, lastRawProps);
-  var isCustomComponentTag = isCustomComponent(tag, nextRawProps); // Apply the diff.
-
-  updateDOMProperties(
-    domElement,
-    updatePayload,
-    wasCustomComponentTag,
-    isCustomComponentTag
-  ); // TODO: Ensure that an update gets scheduled if any of the special props
-  // changed.
-
-  switch (tag) {
-    case "input":
-      // Update the wrapper around inputs *after* updating props. This has to
-      // happen after `updateDOMProperties`. Otherwise HTML5 input validations
-      // raise warnings and prevent the new value from being assigned.
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
-
-    case "select":
-      // <select> value update needs to occur after <option> children
-      // reconciliation
-      postUpdateWrapper(domElement, nextRawProps);
-      break;
+  for (var _i4 = 0; _i4 < updatePayload.length; _i4 += 2) {
+    var _propKey9 = updatePayload[_i4];
+    var _propValue9 = updatePayload[_i4 + 1];
+    setProp(
+      domElement,
+      tag,
+      _propKey9,
+      _propValue9,
+      isCustomComponentTag,
+      nextProps
+    );
   }
 }
 
@@ -40714,16 +40637,16 @@ function diffHydratedStyles(domElement, value) {
 function diffHydratedCustomComponent(
   domElement,
   tag,
-  rawProps,
+  props,
   parentNamespaceDev,
   extraAttributeNames
 ) {
-  for (var propKey in rawProps) {
-    if (!rawProps.hasOwnProperty(propKey)) {
+  for (var propKey in props) {
+    if (!props.hasOwnProperty(propKey)) {
       continue;
     }
 
-    var nextProp = rawProps[propKey];
+    var nextProp = props[propKey];
 
     if (nextProp == null) {
       continue;
@@ -40737,7 +40660,7 @@ function diffHydratedCustomComponent(
       continue;
     }
 
-    if (rawProps.suppressHydrationWarning === true) {
+    if (props.suppressHydrationWarning === true) {
       // Don't bother comparing. We're ignoring all these warnings.
       continue;
     } // Validate that the properties correspond to their expected values.
@@ -40825,16 +40748,16 @@ function diffHydratedCustomComponent(
 function diffHydratedGenericElement(
   domElement,
   tag,
-  rawProps,
+  props,
   parentNamespaceDev,
   extraAttributeNames
 ) {
-  for (var propKey in rawProps) {
-    if (!rawProps.hasOwnProperty(propKey)) {
+  for (var propKey in props) {
+    if (!props.hasOwnProperty(propKey)) {
       continue;
     }
 
-    var nextProp = rawProps[propKey];
+    var nextProp = props[propKey];
 
     if (nextProp == null) {
       continue;
@@ -40848,7 +40771,7 @@ function diffHydratedGenericElement(
       continue;
     }
 
-    if (rawProps.suppressHydrationWarning === true) {
+    if (props.suppressHydrationWarning === true) {
       // Don't bother comparing. We're ignoring all these warnings.
       continue;
     } // Validate that the properties correspond to their expected values.
@@ -40950,13 +40873,13 @@ function diffHydratedGenericElement(
 function diffHydratedProperties(
   domElement,
   tag,
-  rawProps,
+  props,
   isConcurrentMode,
   shouldWarnDev,
   parentNamespaceDev
 ) {
   {
-    validatePropertiesInDevelopment(tag, rawProps);
+    validatePropertiesInDevelopment(tag, props);
   } // TODO: Make sure that we check isMounted before firing any of these events.
 
   switch (tag) {
@@ -41005,37 +40928,46 @@ function diffHydratedProperties(
       break;
 
     case "input":
-      initWrapperState$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
-      listenToNonDelegatedEvent("invalid", domElement);
+      listenToNonDelegatedEvent("invalid", domElement); // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
+
+      track(domElement); // For input and textarea we current always set the value property at
+      // post mount to force it to diverge from attributes. However, for
+      // option and select we don't quite do the same thing and select
+      // is not resilient to the DOM state changing so we don't do that here.
+      // TODO: Consider not doing this for input and textarea.
+
+      postMountWrapper$3(domElement, props, true);
       break;
 
     case "option":
-      validateProps(domElement, rawProps);
+      validateProps(domElement, props);
       break;
 
     case "select":
-      initWrapperState$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState$1(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
       listenToNonDelegatedEvent("invalid", domElement);
       break;
 
     case "textarea":
-      initWrapperState(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
+      initWrapperState(domElement, props); // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
 
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-  }
+      listenToNonDelegatedEvent("invalid", domElement); // TODO: Make sure we check if this is still unmounted or do any clean
+      // up necessary since we never stop tracking anymore.
 
-  if (rawProps.hasOwnProperty("onScroll")) {
-    listenToNonDelegatedEvent("scroll", domElement);
+      track(domElement);
+      postMountWrapper(domElement);
+      break;
   }
 
   var updatePayload = null;
-  var children = rawProps.children; // For text content children we compare against textContent. This
+  var children = props.children; // For text content children we compare against textContent. This
   // might match additional HTML that is hidden when we read it using
   // textContent. E.g. "foo" will match "f<span>oo</span>" but that still
   // satisfies our requirement. Our requirement is not to produce perfect
@@ -41047,7 +40979,7 @@ function diffHydratedProperties(
 
   if (typeof children === "string" || typeof children === "number") {
     if (domElement.textContent !== "" + children) {
-      if (rawProps.suppressHydrationWarning !== true) {
+      if (props.suppressHydrationWarning !== true) {
         checkForUnmatchedText(
           domElement.textContent,
           children,
@@ -41062,12 +40994,21 @@ function diffHydratedProperties(
     }
   }
 
+  if (props.onScroll != null) {
+    listenToNonDelegatedEvent("scroll", domElement);
+  }
+
+  if (props.onClick != null) {
+    // TODO: This cast may not be sound for SVG, MathML or custom elements.
+    trapClickOnNonInteractiveElement(domElement);
+  }
+
   if (shouldWarnDev) {
     var extraAttributeNames = new Set();
     var attributes = domElement.attributes;
 
-    for (var _i = 0; _i < attributes.length; _i++) {
-      var name = attributes[_i].name.toLowerCase();
+    for (var _i5 = 0; _i5 < attributes.length; _i5++) {
+      var name = attributes[_i5].name.toLowerCase();
 
       switch (name) {
         // Controlled attributes are not validated
@@ -41084,15 +41025,15 @@ function diffHydratedProperties(
         default:
           // Intentionally use the original name.
           // See discussion in https://github.com/facebook/react/pull/10676.
-          extraAttributeNames.add(attributes[_i].name);
+          extraAttributeNames.add(attributes[_i5].name);
       }
     }
 
-    if (isCustomComponent(tag, rawProps)) {
+    if (isCustomComponent(tag, props)) {
       diffHydratedCustomComponent(
         domElement,
         tag,
-        rawProps,
+        props,
         parentNamespaceDev,
         extraAttributeNames
       );
@@ -41100,7 +41041,7 @@ function diffHydratedProperties(
       diffHydratedGenericElement(
         domElement,
         tag,
-        rawProps,
+        props,
         parentNamespaceDev,
         extraAttributeNames
       );
@@ -41108,45 +41049,12 @@ function diffHydratedProperties(
 
     if (
       extraAttributeNames.size > 0 &&
-      rawProps.suppressHydrationWarning !== true
+      props.suppressHydrationWarning !== true
     ) {
       warnForExtraAttributes(extraAttributeNames);
     }
   }
 
-  switch (tag) {
-    case "input":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, true);
-      break;
-
-    case "textarea":
-      // TODO: Make sure we check if this is still unmounted or do any clean
-      // up necessary since we never stop tracking anymore.
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-
-    case "select":
-    case "option":
-      // For input and textarea we current always set the value property at
-      // post mount to force it to diverge from attributes. However, for
-      // option and select we don't quite do the same thing and select
-      // is not resilient to the DOM state changing so we don't do that here.
-      // TODO: Consider not doing this for input and textarea.
-      break;
-
-    default:
-      if (typeof rawProps.onClick === "function") {
-        // TODO: This cast may not be sound for SVG, MathML or custom elements.
-        trapClickOnNonInteractiveElement(domElement);
-      }
-
-      break;
-  }
-
   return updatePayload;
 }
 function diffHydratedText(textNode, text, isConcurrentMode) {
diff --git a/compiled/facebook-www/ReactDOMTesting-prod.classic.js b/compiled/facebook-www/ReactDOMTesting-prod.classic.js
index c416d9afad2b6..884ef0ed03f70 100644
--- a/compiled/facebook-www/ReactDOMTesting-prod.classic.js
+++ b/compiled/facebook-www/ReactDOMTesting-prod.classic.js
@@ -1126,8 +1126,8 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "video":
     case "audio":
-      for (var i = 0; i < mediaEventTypes.length; i++)
-        listenToNonDelegatedEvent(mediaEventTypes[i], instance);
+      for (type = 0; type < mediaEventTypes.length; type++)
+        listenToNonDelegatedEvent(mediaEventTypes[type], instance);
       break;
     case "source":
       listenToNonDelegatedEvent("error", instance);
@@ -1144,6 +1144,8 @@ function prepareToHydrateHostInstance(fiber) {
     case "input":
       initWrapperState$2(instance, props);
       listenToNonDelegatedEvent("invalid", instance);
+      track(instance);
+      postMountWrapper$3(instance, props, !0);
       break;
     case "select":
       instance._wrapperState = { wasMultiple: !!props.multiple };
@@ -1151,34 +1153,21 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "textarea":
       initWrapperState(instance, props),
-        listenToNonDelegatedEvent("invalid", instance);
+        listenToNonDelegatedEvent("invalid", instance),
+        track(instance),
+        postMountWrapper(instance);
   }
-  props.hasOwnProperty("onScroll") &&
-    listenToNonDelegatedEvent("scroll", instance);
   var updatePayload = null;
-  i = props.children;
-  ("string" !== typeof i && "number" !== typeof i) ||
-    instance.textContent === "" + i ||
+  type = props.children;
+  ("string" !== typeof type && "number" !== typeof type) ||
+    instance.textContent === "" + type ||
     (!0 !== props.suppressHydrationWarning &&
       ((updatePayload = instance.textContent),
-      normalizeMarkupForTextOrAttribute(i),
+      normalizeMarkupForTextOrAttribute(type),
       normalizeMarkupForTextOrAttribute(updatePayload)),
-    (updatePayload = ["children", i]));
-  switch (type) {
-    case "input":
-      track(instance);
-      postMountWrapper$3(instance, props, !0);
-      break;
-    case "textarea":
-      track(instance);
-      postMountWrapper(instance);
-      break;
-    case "select":
-    case "option":
-      break;
-    default:
-      "function" === typeof props.onClick && (instance.onclick = noop$1);
-  }
+    (updatePayload = ["children", type]));
+  null != props.onScroll && listenToNonDelegatedEvent("scroll", instance);
+  null != props.onClick && (instance.onclick = noop$1);
   instance = updatePayload;
   fiber.updateQueue = instance;
   return null !== instance ? !0 : !1;
@@ -5669,177 +5658,62 @@ function markRef(workInProgress) {
   workInProgress.flags |= 2097664;
 }
 function updateHostComponent(current, workInProgress, type, newProps) {
-  var oldProps = current.memoizedProps;
-  if (oldProps !== newProps) {
-    current = workInProgress.stateNode;
-    var updatePayload = null;
-    switch (type) {
-      case "input":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-        type = getHostProps$2(current, oldProps);
-        newProps = getHostProps$2(current, newProps);
-        updatePayload = [];
-        break;
-      case "select":
-        type = assign({}, oldProps, { value: void 0 });
-        newProps = assign({}, newProps, { value: void 0 });
-        updatePayload = [];
-        break;
-      case "textarea":
-        type = getHostProps(current, oldProps);
-        newProps = getHostProps(current, newProps);
-        updatePayload = [];
-        break;
-      case "img":
-      case "link":
-      case "area":
-      case "base":
-      case "br":
-      case "col":
-      case "embed":
-      case "hr":
-      case "keygen":
-      case "meta":
-      case "param":
-      case "source":
-      case "track":
-      case "wbr":
-      case "menuitem":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-      default:
-        (type = oldProps),
-          "function" !== typeof type.onClick &&
-            "function" === typeof newProps.onClick &&
-            (current.onclick = noop$1);
-    }
-    var styleName;
-    oldProps = null;
-    for (JSCompiler_inline_result in type)
+  current = current.memoizedProps;
+  if (current !== newProps) {
+    type = null;
+    var propKey,
+      styleName,
+      styleUpdates = null;
+    for (propKey in current)
       if (
-        !newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        type.hasOwnProperty(JSCompiler_inline_result) &&
-        null != type[JSCompiler_inline_result]
+        !newProps.hasOwnProperty(propKey) &&
+        current.hasOwnProperty(propKey) &&
+        null != current[propKey]
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            var lastStyle = type[JSCompiler_inline_result];
+            var lastStyle = current[propKey];
             for (styleName in lastStyle)
               lastStyle.hasOwnProperty(styleName) &&
-                (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
+                (styleUpdates || (styleUpdates = {}),
+                (styleUpdates[styleName] = ""));
             break;
-          case "dangerouslySetInnerHTML":
-          case "children":
-            break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  null
-                );
+            (type = type || []).push(propKey, null);
         }
-    for (JSCompiler_inline_result in newProps) {
-      var nextProp = newProps[JSCompiler_inline_result];
-      lastStyle = null != type ? type[JSCompiler_inline_result] : void 0;
+    for (propKey in newProps) {
+      lastStyle = newProps[propKey];
+      var lastProp = null != current ? current[propKey] : void 0;
       if (
-        newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        nextProp !== lastStyle &&
-        (null != nextProp || null != lastStyle)
+        newProps.hasOwnProperty(propKey) &&
+        lastStyle !== lastProp &&
+        (null != lastStyle || null != lastProp)
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            if (null != nextProp && "object" !== typeof nextProp)
-              throw Error(formatProdErrorMessage(62));
-            if (lastStyle) {
+            if (lastProp) {
+              for (styleName in lastProp)
+                !lastProp.hasOwnProperty(styleName) ||
+                  (lastStyle && lastStyle.hasOwnProperty(styleName)) ||
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = ""));
               for (styleName in lastStyle)
-                !lastStyle.hasOwnProperty(styleName) ||
-                  (nextProp && nextProp.hasOwnProperty(styleName)) ||
-                  (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-              for (styleName in nextProp)
-                nextProp.hasOwnProperty(styleName) &&
-                  lastStyle[styleName] !== nextProp[styleName] &&
-                  (oldProps || (oldProps = {}),
-                  (oldProps[styleName] = nextProp[styleName]));
+                lastStyle.hasOwnProperty(styleName) &&
+                  lastProp[styleName] !== lastStyle[styleName] &&
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = lastStyle[styleName]));
             } else
-              oldProps ||
-                (updatePayload || (updatePayload = []),
-                updatePayload.push(JSCompiler_inline_result, oldProps)),
-                (oldProps = nextProp);
-            break;
-          case "dangerouslySetInnerHTML":
-            if (null != nextProp) {
-              if ("object" !== typeof nextProp || !("__html" in nextProp))
-                throw Error(formatProdErrorMessage(61));
-              nextProp = nextProp.__html;
-              if (null != nextProp) {
-                if (null != newProps.children)
-                  throw Error(formatProdErrorMessage(60));
-                (lastStyle ? lastStyle.__html : void 0) !== nextProp &&
-                  (updatePayload = updatePayload || []).push(
-                    JSCompiler_inline_result,
-                    nextProp
-                  );
-              }
-            }
-            break;
-          case "children":
-            ("string" !== typeof nextProp && "number" !== typeof nextProp) ||
-              (updatePayload = updatePayload || []).push(
-                JSCompiler_inline_result,
-                "" + nextProp
-              );
-            break;
-          case "onScroll":
-            null != nextProp && listenToNonDelegatedEvent("scroll", current);
-            updatePayload || lastStyle === nextProp || (updatePayload = []);
-            break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
+              styleUpdates ||
+                (type || (type = []), type.push(propKey, styleUpdates)),
+                (styleUpdates = lastStyle);
             break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || lastStyle === nextProp || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  nextProp
-                );
+            (type = type || []).push(propKey, lastStyle);
         }
     }
-    oldProps && (updatePayload = updatePayload || []).push("style", oldProps);
-    var JSCompiler_inline_result = updatePayload;
-    (workInProgress.updateQueue = JSCompiler_inline_result) &&
-      markUpdate(workInProgress);
+    styleUpdates && (type = type || []).push("style", styleUpdates);
+    newProps = type;
+    (workInProgress.updateQueue = newProps) && markUpdate(workInProgress);
   }
 }
 function preloadResourceAndSuspendIfNeeded(workInProgress, resource) {
@@ -12120,147 +11994,6 @@ properties.formAction = new PropertyInfoRecord(
 });
 var isJavaScriptProtocol =
   /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i;
-function setValueForProperty(node, name, value) {
-  if (
-    !(2 < name.length) ||
-    ("o" !== name[0] && "O" !== name[0]) ||
-    ("n" !== name[1] && "N" !== name[1])
-  ) {
-    var JSCompiler_inline_result = properties.hasOwnProperty(name)
-      ? properties[name]
-      : null;
-    if (null !== JSCompiler_inline_result)
-      if (JSCompiler_inline_result.mustUseProperty)
-        node[JSCompiler_inline_result.propertyName] =
-          value && "function" !== typeof value && "symbol" !== typeof value;
-      else if (
-        ((name = JSCompiler_inline_result.attributeName), null === value)
-      )
-        node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (!JSCompiler_inline_result.acceptsBooleans) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        if (JSCompiler_inline_result.removeEmptyString && "" === value)
-          node.removeAttribute(name);
-        else
-          switch (JSCompiler_inline_result.type) {
-            case 3:
-              value ? node.setAttribute(name, "") : node.removeAttribute(name);
-              break;
-            case 4:
-              !0 === value
-                ? node.setAttribute(name, "")
-                : !1 === value
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 5:
-              isNaN(value)
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 6:
-              !isNaN(value) && 1 <= value
-                ? node.setAttribute(name, value)
-                : node.removeAttribute(name);
-              break;
-            default:
-              value = enableTrustedTypesIntegration ? value : "" + value;
-              if (
-                JSCompiler_inline_result.sanitizeURL &&
-                isJavaScriptProtocol.test(value.toString())
-              )
-                throw Error(formatProdErrorMessage(323));
-              (JSCompiler_inline_result =
-                JSCompiler_inline_result.attributeNamespace)
-                ? node.setAttributeNS(JSCompiler_inline_result, name, value)
-                : node.setAttribute(name, value);
-          }
-      }
-    else if (isAttributeNameSafe(name))
-      if (null === value) node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (
-              ((JSCompiler_inline_result = name.toLowerCase().slice(0, 5)),
-              "data-" !== JSCompiler_inline_result &&
-                "aria-" !== JSCompiler_inline_result)
-            ) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        node.setAttribute(
-          name,
-          enableTrustedTypesIntegration ? value : "" + value
-        );
-      }
-  }
-}
-function setValueForPropertyOnCustomComponent(node, name, value) {
-  if (
-    enableCustomElementPropertySupport &&
-    "o" === name[0] &&
-    "n" === name[1]
-  ) {
-    var useCapture = name.endsWith("Capture"),
-      eventName = name.substr(2, useCapture ? name.length - 9 : void 0),
-      prevProps = getFiberCurrentPropsFromNode(node);
-    prevProps = null != prevProps ? prevProps[name] : null;
-    "function" === typeof prevProps &&
-      node.removeEventListener(eventName, prevProps, useCapture);
-    if ("function" === typeof value) {
-      "function" !== typeof prevProps &&
-        null !== prevProps &&
-        (name in node
-          ? (node[name] = null)
-          : node.hasAttribute(name) && node.removeAttribute(name));
-      node.addEventListener(eventName, value, useCapture);
-      return;
-    }
-  }
-  if (enableCustomElementPropertySupport && name in node) node[name] = value;
-  else if (isAttributeNameSafe(name))
-    if (null === value) node.removeAttribute(name);
-    else {
-      switch (typeof value) {
-        case "undefined":
-        case "function":
-        case "symbol":
-          node.removeAttribute(name);
-          return;
-        case "boolean":
-          if (enableCustomElementPropertySupport) {
-            if (!0 === value) {
-              node.setAttribute(name, "");
-              return;
-            }
-            node.removeAttribute(name);
-            return;
-          }
-      }
-      node.setAttribute(
-        name,
-        enableTrustedTypesIntegration ? value : "" + value
-      );
-    }
-}
 function getToStringValue(value) {
   switch (typeof value) {
     case "boolean":
@@ -12351,24 +12084,18 @@ function getActiveElement(doc) {
     return doc.body;
   }
 }
-function getHostProps$2(element, props) {
-  var checked = props.checked;
-  return assign({}, props, {
-    defaultChecked: void 0,
-    defaultValue: void 0,
-    value: void 0,
-    checked: null != checked ? checked : element._wrapperState.initialChecked
-  });
-}
 function initWrapperState$2(element, props) {
   var defaultValue = null == props.defaultValue ? "" : props.defaultValue,
-    JSCompiler_temp_const =
+    initialChecked =
       null != props.checked ? props.checked : props.defaultChecked;
   defaultValue = getToStringValue(
     null != props.value ? props.value : defaultValue
   );
   element._wrapperState = {
-    initialChecked: JSCompiler_temp_const,
+    initialChecked:
+      "function" !== typeof initialChecked &&
+      "symbol" !== typeof initialChecked &&
+      !!initialChecked,
     initialValue: defaultValue,
     controlled:
       "checkbox" === props.type || "radio" === props.type
@@ -12376,19 +12103,16 @@ function initWrapperState$2(element, props) {
         : null != props.value
   };
 }
-function updateChecked(element, props) {
-  props = props.checked;
-  null != props && (element.checked = props);
-}
 function updateWrapper$1(element, props) {
-  updateChecked(element, props);
-  var value = getToStringValue(props.value),
-    type = props.type;
-  if (null != value)
+  var checked = props.checked;
+  null != checked && (element.checked = checked);
+  checked = getToStringValue(props.value);
+  var type = props.type;
+  if (null != checked)
     if ("number" === type) {
-      if ((0 === value && "" === element.value) || element.value != value)
-        element.value = "" + value;
-    } else element.value !== "" + value && (element.value = "" + value);
+      if ((0 === checked && "" === element.value) || element.value != checked)
+        element.value = "" + checked;
+    } else element.value !== "" + checked && (element.value = "" + checked);
   else if ("submit" === type || "reset" === type) {
     element.removeAttribute("value");
     return;
@@ -12397,7 +12121,7 @@ function updateWrapper$1(element, props) {
     ? props.hasOwnProperty("defaultValue") &&
       setDefaultValue(element, props.type, getToStringValue(props.defaultValue))
     : props.hasOwnProperty("value")
-    ? setDefaultValue(element, props.type, value)
+    ? setDefaultValue(element, props.type, checked)
     : props.hasOwnProperty("defaultValue") &&
       setDefaultValue(
         element,
@@ -12435,11 +12159,11 @@ function postMountWrapper$3(element, props, isHydrating) {
   }
   type = element.name;
   "" !== type && (element.name = "");
+  isHydrating || (element.checked = !!element._wrapperState.initialChecked);
   disableInputAttributeSyncing
-    ? (isHydrating || updateChecked(element, props),
-      props.hasOwnProperty("defaultChecked") &&
-        ((element.defaultChecked = !element.defaultChecked),
-        (element.defaultChecked = !!props.defaultChecked)))
+    ? props.hasOwnProperty("defaultChecked") &&
+      ((element.defaultChecked = !element.defaultChecked),
+      (element.defaultChecked = !!props.defaultChecked))
     : (element.defaultChecked = !!element._wrapperState.initialChecked);
   "" !== type && (element.name = type);
 }
@@ -12473,15 +12197,6 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
     null !== multiple && (multiple.selected = !0);
   }
 }
-function getHostProps(element, props) {
-  if (null != props.dangerouslySetInnerHTML)
-    throw Error(formatProdErrorMessage(91));
-  return assign({}, props, {
-    value: void 0,
-    defaultValue: void 0,
-    children: "" + element._wrapperState.initialValue
-  });
-}
 function initWrapperState(element, props) {
   var initialValue = props.value;
   if (null == initialValue) {
@@ -12498,7 +12213,9 @@ function initWrapperState(element, props) {
     null == props && (props = "");
     initialValue = props;
   }
-  element._wrapperState = { initialValue: getToStringValue(initialValue) };
+  props = getToStringValue(initialValue);
+  element.defaultValue = props;
+  element._wrapperState = { initialValue: props };
 }
 function updateWrapper(element, props) {
   var value = getToStringValue(props.value),
@@ -12630,30 +12347,6 @@ Object.keys(isUnitlessNumber).forEach(function (prop) {
     isUnitlessNumber[prefix] = isUnitlessNumber[prop];
   });
 });
-function setValueForStyles(node, styles) {
-  node = node.style;
-  for (var styleName in styles)
-    if (styles.hasOwnProperty(styleName)) {
-      var value = styles[styleName],
-        isCustomProperty = 0 === styleName.indexOf("--");
-      null == value || "boolean" === typeof value || "" === value
-        ? isCustomProperty
-          ? node.setProperty(styleName, "")
-          : "float" === styleName
-          ? (node.cssFloat = "")
-          : (node[styleName] = "")
-        : isCustomProperty
-        ? node.setProperty(styleName, value)
-        : "number" !== typeof value ||
-          0 === value ||
-          (isUnitlessNumber.hasOwnProperty(styleName) &&
-            isUnitlessNumber[styleName])
-        ? "float" === styleName
-          ? (node.cssFloat = value)
-          : (node[styleName] = ("" + value).trim())
-        : (node[styleName] = value + "px");
-    }
-}
 function isCustomComponent(tagName, props) {
   if (-1 === tagName.indexOf("-")) return "string" === typeof props.is;
   switch (tagName) {
@@ -12683,72 +12376,339 @@ function getOwnerDocumentFromRootContainer(rootContainerElement) {
     : rootContainerElement.ownerDocument;
 }
 function noop$1() {}
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style":
+      if (null != value && "object" !== typeof value)
+        throw Error(formatProdErrorMessage(62));
+      domElement = domElement.style;
+      for (var styleName in value)
+        value.hasOwnProperty(styleName) &&
+          ((key = value[styleName]),
+          (props = 0 === styleName.indexOf("--")),
+          null == key || "boolean" === typeof key || "" === key
+            ? props
+              ? domElement.setProperty(styleName, "")
+              : "float" === styleName
+              ? (domElement.cssFloat = "")
+              : (domElement[styleName] = "")
+            : props
+            ? domElement.setProperty(styleName, key)
+            : "number" !== typeof key ||
+              0 === key ||
+              (isUnitlessNumber.hasOwnProperty(styleName) &&
+                isUnitlessNumber[styleName])
+            ? "float" === styleName
+              ? (domElement.cssFloat = key)
+              : (domElement[styleName] = ("" + key).trim())
+            : (domElement[styleName] = key + "px"));
+      break;
+    case "dangerouslySetInnerHTML":
+      if (null != value) {
+        if ("object" !== typeof value || !("__html" in value))
+          throw Error(formatProdErrorMessage(61));
+        value = value.__html;
+        if (null != value) {
+          if (null != props.children) throw Error(formatProdErrorMessage(60));
+          disableIEWorkarounds
+            ? (domElement.innerHTML = value)
+            : setInnerHTML$1(domElement, value);
+        }
+      }
+      break;
+    case "children":
+      "string" === typeof value
+        ? "body" === tag ||
+          ("textarea" === tag && "" === value) ||
+          setTextContent(domElement, value)
+        : "number" === typeof value &&
+          "body" !== tag &&
+          setTextContent(domElement, "" + value);
+      break;
+    case "onScroll":
+      null != value && listenToNonDelegatedEvent("scroll", domElement);
+      break;
+    case "onClick":
+      null != value && (domElement.onclick = noop$1);
+      break;
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue":
+    case "defaultChecked":
+    case "innerHTML":
+      break;
+    case "autoFocus":
+      break;
+    case "innerText":
+    case "textContent":
+      if (enableCustomElementPropertySupport) break;
+    default:
+      if (!registrationNameDependencies.hasOwnProperty(key))
+        if (isCustomComponentTag)
+          a: {
+            if (
+              enableCustomElementPropertySupport &&
+              "o" === key[0] &&
+              "n" === key[1] &&
+              ((styleName = key.endsWith("Capture")),
+              (props = key.substr(2, styleName ? key.length - 9 : void 0)),
+              (tag = getFiberCurrentPropsFromNode(domElement)),
+              (tag = null != tag ? tag[key] : null),
+              "function" === typeof tag &&
+                domElement.removeEventListener(props, tag, styleName),
+              "function" === typeof value)
+            ) {
+              "function" !== typeof tag &&
+                null !== tag &&
+                (key in domElement
+                  ? (domElement[key] = null)
+                  : domElement.hasAttribute(key) &&
+                    domElement.removeAttribute(key));
+              domElement.addEventListener(props, value, styleName);
+              break a;
+            }
+            if (enableCustomElementPropertySupport && key in domElement)
+              domElement[key] = value;
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (enableCustomElementPropertySupport) {
+                      if (!0 === value) {
+                        domElement.setAttribute(key, "");
+                        break a;
+                      }
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+          }
+        else
+          a: if (
+            !(2 < key.length) ||
+            ("o" !== key[0] && "O" !== key[0]) ||
+            ("n" !== key[1] && "N" !== key[1])
+          )
+            if (
+              ((styleName = properties.hasOwnProperty(key)
+                ? properties[key]
+                : null),
+              null !== styleName)
+            )
+              if (styleName.mustUseProperty)
+                domElement[styleName.propertyName] =
+                  value &&
+                  "function" !== typeof value &&
+                  "symbol" !== typeof value;
+              else if (((key = styleName.attributeName), null === value))
+                domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (!styleName.acceptsBooleans) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                if (styleName.removeEmptyString && "" === value)
+                  domElement.removeAttribute(key);
+                else
+                  switch (styleName.type) {
+                    case 3:
+                      value
+                        ? domElement.setAttribute(key, "")
+                        : domElement.removeAttribute(key);
+                      break;
+                    case 4:
+                      !0 === value
+                        ? domElement.setAttribute(key, "")
+                        : !1 === value
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 5:
+                      isNaN(value)
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 6:
+                      !isNaN(value) && 1 <= value
+                        ? domElement.setAttribute(key, value)
+                        : domElement.removeAttribute(key);
+                      break;
+                    default:
+                      value = enableTrustedTypesIntegration
+                        ? value
+                        : "" + value;
+                      if (
+                        styleName.sanitizeURL &&
+                        isJavaScriptProtocol.test(value.toString())
+                      )
+                        throw Error(formatProdErrorMessage(323));
+                      (styleName = styleName.attributeNamespace)
+                        ? domElement.setAttributeNS(styleName, key, value)
+                        : domElement.setAttribute(key, value);
+                  }
+              }
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (
+                      ((styleName = key.toLowerCase().slice(0, 5)),
+                      "data-" !== styleName && "aria-" !== styleName)
+                    ) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+  }
+}
 function createHTMLElement(type, props, ownerDocument) {
   return "string" === typeof props.is
     ? ownerDocument.createElement(type, { is: props.is })
     : ownerDocument.createElement(type);
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
+function setInitialProperties(domElement, tag, props) {
   switch (tag) {
+    case "input":
+      initWrapperState$2(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey in props)
+        if (props.hasOwnProperty(propKey)) {
+          var propValue = props[propKey];
+          if (null != propValue)
+            switch (propKey) {
+              case "checked":
+                var node = domElement;
+                propValue =
+                  null != propValue
+                    ? propValue
+                    : node._wrapperState.initialChecked;
+                node.checked =
+                  !!propValue &&
+                  "function" !== typeof propValue &&
+                  "symbol" !== propValue;
+                break;
+              case "value":
+                break;
+              case "children":
+              case "dangerouslySetInnerHTML":
+                if (null != propValue)
+                  throw Error(formatProdErrorMessage(137, tag));
+                break;
+              default:
+                setProp(domElement, tag, propKey, propValue, !1, props);
+            }
+        }
+      track(domElement);
+      postMountWrapper$3(domElement, props, !1);
+      return;
+    case "select":
+      domElement._wrapperState = { wasMultiple: !!props.multiple };
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (propValue in props)
+        if (
+          props.hasOwnProperty(propValue) &&
+          ((propKey = props[propValue]), null != propKey)
+        )
+          switch (propValue) {
+            case "value":
+              break;
+            default:
+              setProp(domElement, tag, propValue, propKey, !1, props);
+          }
+      domElement.multiple = !!props.multiple;
+      tag = props.value;
+      null != tag
+        ? updateOptions(domElement, !!props.multiple, tag, !1)
+        : null != props.defaultValue &&
+          updateOptions(domElement, !!props.multiple, props.defaultValue, !0);
+      return;
+    case "textarea":
+      initWrapperState(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey$191 in props)
+        if (
+          props.hasOwnProperty(propKey$191) &&
+          ((propKey = props[propKey$191]), null != propKey)
+        )
+          switch (propKey$191) {
+            case "value":
+              break;
+            case "children":
+              break;
+            case "dangerouslySetInnerHTML":
+              if (null != propKey) throw Error(formatProdErrorMessage(91));
+              break;
+            default:
+              setProp(domElement, tag, propKey$191, propKey, !1, props);
+          }
+      track(domElement);
+      postMountWrapper(domElement);
+      return;
+    case "option":
+      for (var propKey$193 in props)
+        props.hasOwnProperty(propKey$193) &&
+          ((propKey = props[propKey$193]),
+          null != propKey &&
+            setProp(domElement, tag, propKey$193, propKey, !1, props));
+      null != props.value &&
+        domElement.setAttribute("value", "" + getToStringValue(props.value));
+      return;
     case "dialog":
       listenToNonDelegatedEvent("cancel", domElement);
       listenToNonDelegatedEvent("close", domElement);
-      var props = rawProps;
       break;
-    case "embed":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "iframe":
     case "object":
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "video":
     case "audio":
-      for (props = 0; props < mediaEventTypes.length; props++)
-        listenToNonDelegatedEvent(mediaEventTypes[props], domElement);
-      props = rawProps;
+      for (propKey = 0; propKey < mediaEventTypes.length; propKey++)
+        listenToNonDelegatedEvent(mediaEventTypes[propKey], domElement);
       break;
-    case "source":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
-    case "img":
-    case "link":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "image":
       listenToNonDelegatedEvent("error", domElement);
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "details":
       listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
-    case "input":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "option":
-      props = rawProps;
-      break;
-    case "select":
-      domElement._wrapperState = { wasMultiple: !!rawProps.multiple };
-      props = assign({}, rawProps, { value: void 0 });
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
       break;
+    case "embed":
+    case "source":
+    case "img":
+    case "link":
+      listenToNonDelegatedEvent("error", domElement),
+        listenToNonDelegatedEvent("load", domElement);
     case "area":
     case "base":
     case "br":
@@ -12760,163 +12720,159 @@ function setInitialProperties(domElement, tag, rawProps) {
     case "track":
     case "wbr":
     case "menuitem":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-    default:
-      props = rawProps;
-  }
-  var nextProps = props,
-    propKey;
-  for (propKey in nextProps)
-    if (nextProps.hasOwnProperty(propKey)) {
-      var nextProp = nextProps[propKey];
-      switch (propKey) {
-        case "style":
-          if (null != nextProp && "object" !== typeof nextProp)
-            throw Error(formatProdErrorMessage(62));
-          setValueForStyles(domElement, nextProp);
-          break;
-        case "dangerouslySetInnerHTML":
-          if (null != nextProp) {
-            if ("object" !== typeof nextProp || !("__html" in nextProp))
-              throw Error(formatProdErrorMessage(61));
-            nextProp = nextProp.__html;
-            if (null != nextProp) {
-              if (null != nextProps.children)
-                throw Error(formatProdErrorMessage(60));
-              disableIEWorkarounds
-                ? (domElement.innerHTML = nextProp)
-                : setInnerHTML$1(domElement, nextProp);
-            }
+      for (var propKey$195 in props)
+        if (
+          props.hasOwnProperty(propKey$195) &&
+          ((propKey = props[propKey$195]), null != propKey)
+        )
+          switch (propKey$195) {
+            case "children":
+            case "dangerouslySetInnerHTML":
+              throw Error(formatProdErrorMessage(137, tag));
+            default:
+              setProp(domElement, tag, propKey$195, propKey, !1, props);
           }
-          break;
-        case "children":
-          "string" === typeof nextProp
-            ? "body" === tag ||
-              ("textarea" === tag && "" === nextProp) ||
-              setTextContent(domElement, nextProp)
-            : "number" === typeof nextProp &&
-              "body" !== tag &&
-              setTextContent(domElement, "" + nextProp);
-          break;
-        case "onScroll":
-          null != nextProp && listenToNonDelegatedEvent("scroll", domElement);
-          break;
-        case "suppressContentEditableWarning":
-        case "suppressHydrationWarning":
-        case "defaultValue":
-        case "defaultChecked":
-        case "innerHTML":
-          break;
-        case "autoFocus":
-          break;
-        case "innerText":
-        case "textContent":
-          if (enableCustomElementPropertySupport) break;
-        default:
-          registrationNameDependencies.hasOwnProperty(propKey) ||
-            (null != nextProp &&
-              (isCustomComponentTag
-                ? setValueForPropertyOnCustomComponent(
-                    domElement,
-                    propKey,
-                    nextProp
-                  )
-                : setValueForProperty(domElement, propKey, nextProp)));
-      }
-    }
-  switch (tag) {
-    case "input":
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, !1);
-      break;
-    case "textarea":
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-    case "option":
-      null != rawProps.value &&
-        domElement.setAttribute("value", "" + getToStringValue(rawProps.value));
-      break;
-    case "select":
-      domElement.multiple = !!rawProps.multiple;
-      tag = rawProps.value;
-      null != tag
-        ? updateOptions(domElement, !!rawProps.multiple, tag, !1)
-        : null != rawProps.defaultValue &&
-          updateOptions(
-            domElement,
-            !!rawProps.multiple,
-            rawProps.defaultValue,
-            !0
-          );
-      break;
-    default:
-      "function" === typeof props.onClick && (domElement.onclick = noop$1);
+      return;
   }
+  propKey = isCustomComponent(tag, props);
+  for (node in props)
+    props.hasOwnProperty(node) &&
+      ((propValue = props[node]),
+      null != propValue &&
+        setProp(domElement, tag, node, propValue, propKey, props));
 }
 function updateProperties(
   domElement,
   updatePayload,
   tag,
-  lastRawProps,
-  nextRawProps
+  lastProps,
+  nextProps
 ) {
-  "input" === tag &&
-    "radio" === nextRawProps.type &&
-    null != nextRawProps.name &&
-    updateChecked(domElement, nextRawProps);
-  isCustomComponent(tag, lastRawProps);
-  lastRawProps = isCustomComponent(tag, nextRawProps);
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i],
-      propValue = updatePayload[i + 1];
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
-      case "dangerouslySetInnerHTML":
-        disableIEWorkarounds
-          ? (domElement.innerHTML = propValue)
-          : setInnerHTML$1(domElement, propValue);
-        break;
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
-      default:
-        lastRawProps
-          ? setValueForPropertyOnCustomComponent(domElement, propKey, propValue)
-          : setValueForProperty(domElement, propKey, propValue);
-    }
-  }
   switch (tag) {
     case "input":
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
+      "radio" === nextProps.type &&
+        null != nextProps.name &&
+        ((lastProps = nextProps.checked),
+        null != lastProps && (domElement.checked = lastProps));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) {
+        var propKey = updatePayload[lastProps],
+          propValue = updatePayload[lastProps + 1];
+        switch (propKey) {
+          case "checked":
+            propKey = domElement;
+            propValue =
+              null != propValue
+                ? propValue
+                : propKey._wrapperState.initialChecked;
+            propKey.checked =
+              !!propValue &&
+              "function" !== typeof propValue &&
+              "symbol" !== propValue;
+            break;
+          case "value":
+            break;
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propValue)
+              throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propKey, propValue, !1, nextProps);
+        }
+      }
+      updateWrapper$1(domElement, nextProps);
+      return;
     case "select":
-      (updatePayload = domElement._wrapperState.wasMultiple),
-        (domElement._wrapperState.wasMultiple = !!nextRawProps.multiple),
-        (tag = nextRawProps.value),
-        null != tag
-          ? updateOptions(domElement, !!nextRawProps.multiple, tag, !1)
-          : updatePayload !== !!nextRawProps.multiple &&
-            (null != nextRawProps.defaultValue
-              ? updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.defaultValue,
-                  !0
-                )
-              : updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.multiple ? [] : "",
-                  !1
-                ));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updatePayload = domElement._wrapperState.wasMultiple;
+      domElement._wrapperState.wasMultiple = !!nextProps.multiple;
+      tag = nextProps.value;
+      null != tag
+        ? updateOptions(domElement, !!nextProps.multiple, tag, !1)
+        : updatePayload !== !!nextProps.multiple &&
+          (null != nextProps.defaultValue
+            ? updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.defaultValue,
+                !0
+              )
+            : updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.multiple ? [] : "",
+                !1
+              ));
+      return;
+    case "textarea":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          case "children":
+            break;
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(91));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updateWrapper(domElement, nextProps);
+      return;
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      return;
   }
+  lastProps = isCustomComponent(tag, nextProps);
+  for (propValue = 0; propValue < updatePayload.length; propValue += 2)
+    setProp(
+      domElement,
+      tag,
+      updatePayload[propValue],
+      updatePayload[propValue + 1],
+      lastProps,
+      nextProps
+    );
 }
 var restoreTarget = null,
   restoreQueue = null;
@@ -12986,17 +12942,17 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1611 = {
+var devToolsConfig$jscomp$inline_1629 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-31f56934",
+  version: "18.3.0-www-classic-aa994cf1",
   rendererPackageName: "react-dom"
 };
-var internals$jscomp$inline_2154 = {
-  bundleType: devToolsConfig$jscomp$inline_1611.bundleType,
-  version: devToolsConfig$jscomp$inline_1611.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1611.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1611.rendererConfig,
+var internals$jscomp$inline_2189 = {
+  bundleType: devToolsConfig$jscomp$inline_1629.bundleType,
+  version: devToolsConfig$jscomp$inline_1629.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1629.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1629.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -13012,26 +12968,26 @@ var internals$jscomp$inline_2154 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1611.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1629.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-31f56934"
+  reconcilerVersion: "18.3.0-www-classic-aa994cf1"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2155 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2190 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2155.isDisabled &&
-    hook$jscomp$inline_2155.supportsFiber
+    !hook$jscomp$inline_2190.isDisabled &&
+    hook$jscomp$inline_2190.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2155.inject(
-        internals$jscomp$inline_2154
+      (rendererID = hook$jscomp$inline_2190.inject(
+        internals$jscomp$inline_2189
       )),
-        (injectedHook = hook$jscomp$inline_2155);
+        (injectedHook = hook$jscomp$inline_2190);
     } catch (err) {}
 }
 var tagToRoleMappings = {
@@ -13671,14 +13627,14 @@ function preinit(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$190 = getStyleKey(href),
+          var key$212 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$190);
+            resource = as.get(key$212);
           if (resource) break;
           var state = { loading: 0, preload: null };
           if (
             (resource = resourceRoot.querySelector(
-              getStylesheetSelectorFromKey(key$190)
+              getStylesheetSelectorFromKey(key$212)
             ))
           )
             state.loading = 1;
@@ -13689,7 +13645,7 @@ function preinit(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             };
-            (options = preloadPropsMap.get(key$190)) &&
+            (options = preloadPropsMap.get(key$212)) &&
               adoptPreloadPropsForStylesheet(href, options);
             var link = (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -13715,15 +13671,15 @@ function preinit(href, options) {
             count: 1,
             state: state
           };
-          as.set(key$190, resource);
+          as.set(key$212, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$190 = getScriptKey(href)),
-            (precedence = as.get(key$190)),
+            (key$212 = getScriptKey(href)),
+            (precedence = as.get(key$212)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$190
+                "script[async]" + key$212
               )),
               precedence ||
                 ((href = {
@@ -13732,7 +13688,7 @@ function preinit(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$190)) &&
+                (options = preloadPropsMap.get(key$212)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -13745,13 +13701,13 @@ function preinit(href, options) {
                 count: 1,
                 state: null
               }),
-              as.set(key$190, precedence));
+              as.set(key$212, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$190 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$190 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$190 + '"]';
+        key$212 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$212 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$212 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -13768,7 +13724,7 @@ function preinit(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$190) &&
+          null === resourceRoot.querySelector(key$212) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -13801,17 +13757,17 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.precedence
       ) {
         type = getStyleKey(pendingProps.href);
-        var styles$199 = getResourcesFromRoot(currentProps).hoistableStyles,
-          resource$200 = styles$199.get(type);
-        resource$200 ||
+        var styles$221 = getResourcesFromRoot(currentProps).hoistableStyles,
+          resource$222 = styles$221.get(type);
+        resource$222 ||
           ((currentProps = currentProps.ownerDocument || currentProps),
-          (resource$200 = {
+          (resource$222 = {
             type: "stylesheet",
             instance: null,
             count: 0,
             state: { loading: 0, preload: null }
           }),
-          styles$199.set(type, resource$200),
+          styles$221.set(type, resource$222),
           preloadPropsMap.has(type) ||
             preloadStylesheet(
               currentProps,
@@ -13826,9 +13782,9 @@ function getResource(type, currentProps, pendingProps) {
                 hrefLang: pendingProps.hrefLang,
                 referrerPolicy: pendingProps.referrerPolicy
               },
-              resource$200.state
+              resource$222.state
             ));
-        return resource$200;
+        return resource$222;
       }
       return null;
     case "script":
@@ -13900,36 +13856,36 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$205 = hoistableRoot.querySelector(
+        var instance$227 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$205)
+        if (instance$227)
           return (
-            (resource.instance = instance$205),
-            markNodeAsHoistable(instance$205),
-            instance$205
+            (resource.instance = instance$227),
+            markNodeAsHoistable(instance$227),
+            instance$227
           );
         key = stylesheetPropsFromRawProps(props);
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$205 = (
+        instance$227 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$205);
-        var linkInstance = instance$205;
+        markNodeAsHoistable(instance$227);
+        var linkInstance = instance$227;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
         });
-        setInitialProperties(instance$205, "link", key);
+        setInitialProperties(instance$227, "link", key);
         resource.state.loading |= 4;
-        insertStylesheet(instance$205, props.precedence, hoistableRoot);
-        return (resource.instance = instance$205);
+        insertStylesheet(instance$227, props.precedence, hoistableRoot);
+        return (resource.instance = instance$227);
       case "script":
-        instance$205 = getScriptKey(props.src);
+        instance$227 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$205
+            "script[async]" + instance$227
           ))
         )
           return (
@@ -13938,7 +13894,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$205)))
+        if ((styleProps = preloadPropsMap.get(instance$227)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -14851,19 +14807,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$326;
+  var JSCompiler_inline_result$jscomp$347;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1710 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1710) {
-      var element$jscomp$inline_1711 = document.createElement("div");
-      element$jscomp$inline_1711.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1710 =
-        "function" === typeof element$jscomp$inline_1711.oninput;
+    var isSupported$jscomp$inline_1728 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1728) {
+      var element$jscomp$inline_1729 = document.createElement("div");
+      element$jscomp$inline_1729.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1728 =
+        "function" === typeof element$jscomp$inline_1729.oninput;
     }
-    JSCompiler_inline_result$jscomp$326 = isSupported$jscomp$inline_1710;
-  } else JSCompiler_inline_result$jscomp$326 = !1;
+    JSCompiler_inline_result$jscomp$347 = isSupported$jscomp$inline_1728;
+  } else JSCompiler_inline_result$jscomp$347 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$326 &&
+    JSCompiler_inline_result$jscomp$347 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -15001,20 +14957,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1723 = 0;
-  i$jscomp$inline_1723 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1723++
+  var i$jscomp$inline_1741 = 0;
+  i$jscomp$inline_1741 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1741++
 ) {
-  var eventName$jscomp$inline_1724 =
-      simpleEventPluginEvents[i$jscomp$inline_1723],
-    domEventName$jscomp$inline_1725 =
-      eventName$jscomp$inline_1724.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1726 =
-      eventName$jscomp$inline_1724[0].toUpperCase() +
-      eventName$jscomp$inline_1724.slice(1);
+  var eventName$jscomp$inline_1742 =
+      simpleEventPluginEvents[i$jscomp$inline_1741],
+    domEventName$jscomp$inline_1743 =
+      eventName$jscomp$inline_1742.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1744 =
+      eventName$jscomp$inline_1742[0].toUpperCase() +
+      eventName$jscomp$inline_1742.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1725,
-    "on" + capitalizedEvent$jscomp$inline_1726
+    domEventName$jscomp$inline_1743,
+    "on" + capitalizedEvent$jscomp$inline_1744
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -16891,4 +16847,4 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-classic-31f56934";
+exports.version = "18.3.0-www-classic-aa994cf1";
diff --git a/compiled/facebook-www/ReactDOMTesting-prod.modern.js b/compiled/facebook-www/ReactDOMTesting-prod.modern.js
index 739bfa0372149..cb5b541a33e8f 100644
--- a/compiled/facebook-www/ReactDOMTesting-prod.modern.js
+++ b/compiled/facebook-www/ReactDOMTesting-prod.modern.js
@@ -808,149 +808,8 @@ properties.formAction = new PropertyInfoRecord(
   );
 });
 var isJavaScriptProtocol =
-  /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i;
-function setValueForProperty(node, name, value) {
-  if (
-    !(2 < name.length) ||
-    ("o" !== name[0] && "O" !== name[0]) ||
-    ("n" !== name[1] && "N" !== name[1])
-  ) {
-    var JSCompiler_inline_result = properties.hasOwnProperty(name)
-      ? properties[name]
-      : null;
-    if (null !== JSCompiler_inline_result)
-      if (JSCompiler_inline_result.mustUseProperty)
-        node[JSCompiler_inline_result.propertyName] =
-          value && "function" !== typeof value && "symbol" !== typeof value;
-      else if (
-        ((name = JSCompiler_inline_result.attributeName), null === value)
-      )
-        node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (!JSCompiler_inline_result.acceptsBooleans) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        if (JSCompiler_inline_result.removeEmptyString && "" === value)
-          node.removeAttribute(name);
-        else
-          switch (JSCompiler_inline_result.type) {
-            case 3:
-              value ? node.setAttribute(name, "") : node.removeAttribute(name);
-              break;
-            case 4:
-              !0 === value
-                ? node.setAttribute(name, "")
-                : !1 === value
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 5:
-              isNaN(value)
-                ? node.removeAttribute(name)
-                : node.setAttribute(name, value);
-              break;
-            case 6:
-              !isNaN(value) && 1 <= value
-                ? node.setAttribute(name, value)
-                : node.removeAttribute(name);
-              break;
-            default:
-              value = enableTrustedTypesIntegration ? value : "" + value;
-              if (
-                JSCompiler_inline_result.sanitizeURL &&
-                isJavaScriptProtocol.test(value.toString())
-              )
-                throw Error(formatProdErrorMessage(323));
-              (JSCompiler_inline_result =
-                JSCompiler_inline_result.attributeNamespace)
-                ? node.setAttributeNS(JSCompiler_inline_result, name, value)
-                : node.setAttribute(name, value);
-          }
-      }
-    else if (isAttributeNameSafe(name))
-      if (null === value) node.removeAttribute(name);
-      else {
-        switch (typeof value) {
-          case "undefined":
-          case "function":
-          case "symbol":
-            node.removeAttribute(name);
-            return;
-          case "boolean":
-            if (
-              ((JSCompiler_inline_result = name.toLowerCase().slice(0, 5)),
-              "data-" !== JSCompiler_inline_result &&
-                "aria-" !== JSCompiler_inline_result)
-            ) {
-              node.removeAttribute(name);
-              return;
-            }
-        }
-        node.setAttribute(
-          name,
-          enableTrustedTypesIntegration ? value : "" + value
-        );
-      }
-  }
-}
-function setValueForPropertyOnCustomComponent(node, name, value) {
-  if (
-    enableCustomElementPropertySupport &&
-    "o" === name[0] &&
-    "n" === name[1]
-  ) {
-    var useCapture = name.endsWith("Capture"),
-      eventName = name.substr(2, useCapture ? name.length - 9 : void 0),
-      prevProps = getFiberCurrentPropsFromNode(node);
-    prevProps = null != prevProps ? prevProps[name] : null;
-    "function" === typeof prevProps &&
-      node.removeEventListener(eventName, prevProps, useCapture);
-    if ("function" === typeof value) {
-      "function" !== typeof prevProps &&
-        null !== prevProps &&
-        (name in node
-          ? (node[name] = null)
-          : node.hasAttribute(name) && node.removeAttribute(name));
-      node.addEventListener(eventName, value, useCapture);
-      return;
-    }
-  }
-  if (enableCustomElementPropertySupport && name in node) node[name] = value;
-  else if (isAttributeNameSafe(name))
-    if (null === value) node.removeAttribute(name);
-    else {
-      switch (typeof value) {
-        case "undefined":
-        case "function":
-        case "symbol":
-          node.removeAttribute(name);
-          return;
-        case "boolean":
-          if (enableCustomElementPropertySupport) {
-            if (!0 === value) {
-              node.setAttribute(name, "");
-              return;
-            }
-            node.removeAttribute(name);
-            return;
-          }
-      }
-      node.setAttribute(
-        name,
-        enableTrustedTypesIntegration ? value : "" + value
-      );
-    }
-}
-var REACT_ELEMENT_TYPE = Symbol.for("react.element"),
+    /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i,
+  REACT_ELEMENT_TYPE = Symbol.for("react.element"),
   REACT_PORTAL_TYPE = Symbol.for("react.portal"),
   REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
   REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"),
@@ -1238,24 +1097,18 @@ function getActiveElement(doc) {
     return doc.body;
   }
 }
-function getHostProps$2(element, props) {
-  var checked = props.checked;
-  return assign({}, props, {
-    defaultChecked: void 0,
-    defaultValue: void 0,
-    value: void 0,
-    checked: null != checked ? checked : element._wrapperState.initialChecked
-  });
-}
 function initWrapperState$2(element, props) {
   var defaultValue = null == props.defaultValue ? "" : props.defaultValue,
-    JSCompiler_temp_const =
+    initialChecked =
       null != props.checked ? props.checked : props.defaultChecked;
   defaultValue = getToStringValue(
     null != props.value ? props.value : defaultValue
   );
   element._wrapperState = {
-    initialChecked: JSCompiler_temp_const,
+    initialChecked:
+      "function" !== typeof initialChecked &&
+      "symbol" !== typeof initialChecked &&
+      !!initialChecked,
     initialValue: defaultValue,
     controlled:
       "checkbox" === props.type || "radio" === props.type
@@ -1263,19 +1116,16 @@ function initWrapperState$2(element, props) {
         : null != props.value
   };
 }
-function updateChecked(element, props) {
-  props = props.checked;
-  null != props && (element.checked = props);
-}
 function updateWrapper$1(element, props) {
-  updateChecked(element, props);
-  var value = getToStringValue(props.value),
-    type = props.type;
-  if (null != value)
+  var checked = props.checked;
+  null != checked && (element.checked = checked);
+  checked = getToStringValue(props.value);
+  var type = props.type;
+  if (null != checked)
     if ("number" === type) {
-      if ((0 === value && "" === element.value) || element.value != value)
-        element.value = "" + value;
-    } else element.value !== "" + value && (element.value = "" + value);
+      if ((0 === checked && "" === element.value) || element.value != checked)
+        element.value = "" + checked;
+    } else element.value !== "" + checked && (element.value = "" + checked);
   else if ("submit" === type || "reset" === type) {
     element.removeAttribute("value");
     return;
@@ -1284,7 +1134,7 @@ function updateWrapper$1(element, props) {
     ? props.hasOwnProperty("defaultValue") &&
       setDefaultValue(element, props.type, getToStringValue(props.defaultValue))
     : props.hasOwnProperty("value")
-    ? setDefaultValue(element, props.type, value)
+    ? setDefaultValue(element, props.type, checked)
     : props.hasOwnProperty("defaultValue") &&
       setDefaultValue(
         element,
@@ -1322,11 +1172,11 @@ function postMountWrapper$3(element, props, isHydrating) {
   }
   type = element.name;
   "" !== type && (element.name = "");
+  isHydrating || (element.checked = !!element._wrapperState.initialChecked);
   disableInputAttributeSyncing
-    ? (isHydrating || updateChecked(element, props),
-      props.hasOwnProperty("defaultChecked") &&
-        ((element.defaultChecked = !element.defaultChecked),
-        (element.defaultChecked = !!props.defaultChecked)))
+    ? props.hasOwnProperty("defaultChecked") &&
+      ((element.defaultChecked = !element.defaultChecked),
+      (element.defaultChecked = !!props.defaultChecked))
     : (element.defaultChecked = !!element._wrapperState.initialChecked);
   "" !== type && (element.name = type);
 }
@@ -1361,22 +1211,15 @@ function updateOptions(node, multiple, propValue, setDefaultSelected) {
     null !== multiple && (multiple.selected = !0);
   }
 }
-function getHostProps(element, props) {
-  if (null != props.dangerouslySetInnerHTML)
-    throw Error(formatProdErrorMessage(91));
-  return assign({}, props, {
-    value: void 0,
-    defaultValue: void 0,
-    children: "" + element._wrapperState.initialValue
-  });
-}
 function initWrapperState(element, props) {
   var initialValue = props.value;
   null == initialValue &&
     ((props = props.defaultValue),
     null == props && (props = ""),
     (initialValue = props));
-  element._wrapperState = { initialValue: getToStringValue(initialValue) };
+  props = getToStringValue(initialValue);
+  element.defaultValue = props;
+  element._wrapperState = { initialValue: props };
 }
 function updateWrapper(element, props) {
   var value = getToStringValue(props.value),
@@ -1508,30 +1351,6 @@ Object.keys(isUnitlessNumber).forEach(function (prop) {
     isUnitlessNumber[prefix] = isUnitlessNumber[prop];
   });
 });
-function setValueForStyles(node, styles) {
-  node = node.style;
-  for (var styleName in styles)
-    if (styles.hasOwnProperty(styleName)) {
-      var value = styles[styleName],
-        isCustomProperty = 0 === styleName.indexOf("--");
-      null == value || "boolean" === typeof value || "" === value
-        ? isCustomProperty
-          ? node.setProperty(styleName, "")
-          : "float" === styleName
-          ? (node.cssFloat = "")
-          : (node[styleName] = "")
-        : isCustomProperty
-        ? node.setProperty(styleName, value)
-        : "number" !== typeof value ||
-          0 === value ||
-          (isUnitlessNumber.hasOwnProperty(styleName) &&
-            isUnitlessNumber[styleName])
-        ? "float" === styleName
-          ? (node.cssFloat = value)
-          : (node[styleName] = ("" + value).trim())
-        : (node[styleName] = value + "px");
-    }
-}
 function isCustomComponent(tagName, props) {
   if (-1 === tagName.indexOf("-")) return "string" === typeof props.is;
   switch (tagName) {
@@ -1978,8 +1797,8 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "video":
     case "audio":
-      for (var i = 0; i < mediaEventTypes.length; i++)
-        listenToNonDelegatedEvent(mediaEventTypes[i], instance);
+      for (type = 0; type < mediaEventTypes.length; type++)
+        listenToNonDelegatedEvent(mediaEventTypes[type], instance);
       break;
     case "source":
       listenToNonDelegatedEvent("error", instance);
@@ -1996,6 +1815,8 @@ function prepareToHydrateHostInstance(fiber) {
     case "input":
       initWrapperState$2(instance, props);
       listenToNonDelegatedEvent("invalid", instance);
+      track(instance);
+      postMountWrapper$3(instance, props, !0);
       break;
     case "select":
       instance._wrapperState = { wasMultiple: !!props.multiple };
@@ -2003,34 +1824,21 @@ function prepareToHydrateHostInstance(fiber) {
       break;
     case "textarea":
       initWrapperState(instance, props),
-        listenToNonDelegatedEvent("invalid", instance);
+        listenToNonDelegatedEvent("invalid", instance),
+        track(instance),
+        postMountWrapper(instance);
   }
-  props.hasOwnProperty("onScroll") &&
-    listenToNonDelegatedEvent("scroll", instance);
   var updatePayload = null;
-  i = props.children;
-  ("string" !== typeof i && "number" !== typeof i) ||
-    instance.textContent === "" + i ||
+  type = props.children;
+  ("string" !== typeof type && "number" !== typeof type) ||
+    instance.textContent === "" + type ||
     (!0 !== props.suppressHydrationWarning &&
       ((updatePayload = instance.textContent),
-      normalizeMarkupForTextOrAttribute(i),
+      normalizeMarkupForTextOrAttribute(type),
       normalizeMarkupForTextOrAttribute(updatePayload)),
-    (updatePayload = ["children", i]));
-  switch (type) {
-    case "input":
-      track(instance);
-      postMountWrapper$3(instance, props, !0);
-      break;
-    case "textarea":
-      track(instance);
-      postMountWrapper(instance);
-      break;
-    case "select":
-    case "option":
-      break;
-    default:
-      "function" === typeof props.onClick && (instance.onclick = noop$1);
-  }
+    (updatePayload = ["children", type]));
+  null != props.onScroll && listenToNonDelegatedEvent("scroll", instance);
+  null != props.onClick && (instance.onclick = noop$1);
   instance = updatePayload;
   fiber.updateQueue = instance;
   return null !== instance ? !0 : !1;
@@ -6440,177 +6248,62 @@ function markRef(workInProgress) {
   workInProgress.flags |= 2097664;
 }
 function updateHostComponent(current, workInProgress, type, newProps) {
-  var oldProps = current.memoizedProps;
-  if (oldProps !== newProps) {
-    current = workInProgress.stateNode;
-    var updatePayload = null;
-    switch (type) {
-      case "input":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-        type = getHostProps$2(current, oldProps);
-        newProps = getHostProps$2(current, newProps);
-        updatePayload = [];
-        break;
-      case "select":
-        type = assign({}, oldProps, { value: void 0 });
-        newProps = assign({}, newProps, { value: void 0 });
-        updatePayload = [];
-        break;
-      case "textarea":
-        type = getHostProps(current, oldProps);
-        newProps = getHostProps(current, newProps);
-        updatePayload = [];
-        break;
-      case "img":
-      case "link":
-      case "area":
-      case "base":
-      case "br":
-      case "col":
-      case "embed":
-      case "hr":
-      case "keygen":
-      case "meta":
-      case "param":
-      case "source":
-      case "track":
-      case "wbr":
-      case "menuitem":
-        if (
-          null != newProps.children ||
-          null != newProps.dangerouslySetInnerHTML
-        )
-          throw Error(formatProdErrorMessage(137, type));
-      default:
-        (type = oldProps),
-          "function" !== typeof type.onClick &&
-            "function" === typeof newProps.onClick &&
-            (current.onclick = noop$1);
-    }
-    var styleName;
-    oldProps = null;
-    for (JSCompiler_inline_result in type)
+  current = current.memoizedProps;
+  if (current !== newProps) {
+    type = null;
+    var propKey,
+      styleName,
+      styleUpdates = null;
+    for (propKey in current)
       if (
-        !newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        type.hasOwnProperty(JSCompiler_inline_result) &&
-        null != type[JSCompiler_inline_result]
+        !newProps.hasOwnProperty(propKey) &&
+        current.hasOwnProperty(propKey) &&
+        null != current[propKey]
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            var lastStyle = type[JSCompiler_inline_result];
+            var lastStyle = current[propKey];
             for (styleName in lastStyle)
               lastStyle.hasOwnProperty(styleName) &&
-                (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-            break;
-          case "dangerouslySetInnerHTML":
-          case "children":
+                (styleUpdates || (styleUpdates = {}),
+                (styleUpdates[styleName] = ""));
             break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  null
-                );
+            (type = type || []).push(propKey, null);
         }
-    for (JSCompiler_inline_result in newProps) {
-      var nextProp = newProps[JSCompiler_inline_result];
-      lastStyle = null != type ? type[JSCompiler_inline_result] : void 0;
+    for (propKey in newProps) {
+      lastStyle = newProps[propKey];
+      var lastProp = null != current ? current[propKey] : void 0;
       if (
-        newProps.hasOwnProperty(JSCompiler_inline_result) &&
-        nextProp !== lastStyle &&
-        (null != nextProp || null != lastStyle)
+        newProps.hasOwnProperty(propKey) &&
+        lastStyle !== lastProp &&
+        (null != lastStyle || null != lastProp)
       )
-        switch (JSCompiler_inline_result) {
+        switch (propKey) {
           case "style":
-            if (null != nextProp && "object" !== typeof nextProp)
-              throw Error(formatProdErrorMessage(62));
-            if (lastStyle) {
+            if (lastProp) {
+              for (styleName in lastProp)
+                !lastProp.hasOwnProperty(styleName) ||
+                  (lastStyle && lastStyle.hasOwnProperty(styleName)) ||
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = ""));
               for (styleName in lastStyle)
-                !lastStyle.hasOwnProperty(styleName) ||
-                  (nextProp && nextProp.hasOwnProperty(styleName)) ||
-                  (oldProps || (oldProps = {}), (oldProps[styleName] = ""));
-              for (styleName in nextProp)
-                nextProp.hasOwnProperty(styleName) &&
-                  lastStyle[styleName] !== nextProp[styleName] &&
-                  (oldProps || (oldProps = {}),
-                  (oldProps[styleName] = nextProp[styleName]));
+                lastStyle.hasOwnProperty(styleName) &&
+                  lastProp[styleName] !== lastStyle[styleName] &&
+                  (styleUpdates || (styleUpdates = {}),
+                  (styleUpdates[styleName] = lastStyle[styleName]));
             } else
-              oldProps ||
-                (updatePayload || (updatePayload = []),
-                updatePayload.push(JSCompiler_inline_result, oldProps)),
-                (oldProps = nextProp);
-            break;
-          case "dangerouslySetInnerHTML":
-            if (null != nextProp) {
-              if ("object" !== typeof nextProp || !("__html" in nextProp))
-                throw Error(formatProdErrorMessage(61));
-              nextProp = nextProp.__html;
-              if (null != nextProp) {
-                if (null != newProps.children)
-                  throw Error(formatProdErrorMessage(60));
-                (lastStyle ? lastStyle.__html : void 0) !== nextProp &&
-                  (updatePayload = updatePayload || []).push(
-                    JSCompiler_inline_result,
-                    nextProp
-                  );
-              }
-            }
+              styleUpdates ||
+                (type || (type = []), type.push(propKey, styleUpdates)),
+                (styleUpdates = lastStyle);
             break;
-          case "children":
-            ("string" !== typeof nextProp && "number" !== typeof nextProp) ||
-              (updatePayload = updatePayload || []).push(
-                JSCompiler_inline_result,
-                "" + nextProp
-              );
-            break;
-          case "onScroll":
-            null != nextProp && listenToNonDelegatedEvent("scroll", current);
-            updatePayload || lastStyle === nextProp || (updatePayload = []);
-            break;
-          case "suppressContentEditableWarning":
-          case "suppressHydrationWarning":
-          case "defaultValue":
-          case "defaultChecked":
-          case "innerHTML":
-            break;
-          case "autoFocus":
-            break;
-          case "innerText":
-          case "textContent":
-            if (enableCustomElementPropertySupport) break;
           default:
-            registrationNameDependencies.hasOwnProperty(
-              JSCompiler_inline_result
-            )
-              ? updatePayload || lastStyle === nextProp || (updatePayload = [])
-              : (updatePayload = updatePayload || []).push(
-                  JSCompiler_inline_result,
-                  nextProp
-                );
+            (type = type || []).push(propKey, lastStyle);
         }
     }
-    oldProps && (updatePayload = updatePayload || []).push("style", oldProps);
-    var JSCompiler_inline_result = updatePayload;
-    (workInProgress.updateQueue = JSCompiler_inline_result) &&
-      markUpdate(workInProgress);
+    styleUpdates && (type = type || []).push("style", styleUpdates);
+    newProps = type;
+    (workInProgress.updateQueue = newProps) && markUpdate(workInProgress);
   }
 }
 function preloadResourceAndSuspendIfNeeded(workInProgress, resource) {
@@ -13636,19 +13329,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$301;
+  var JSCompiler_inline_result$jscomp$322;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1555 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1555) {
-      var element$jscomp$inline_1556 = document.createElement("div");
-      element$jscomp$inline_1556.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1555 =
-        "function" === typeof element$jscomp$inline_1556.oninput;
+    var isSupported$jscomp$inline_1576 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1576) {
+      var element$jscomp$inline_1577 = document.createElement("div");
+      element$jscomp$inline_1577.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1576 =
+        "function" === typeof element$jscomp$inline_1577.oninput;
     }
-    JSCompiler_inline_result$jscomp$301 = isSupported$jscomp$inline_1555;
-  } else JSCompiler_inline_result$jscomp$301 = !1;
+    JSCompiler_inline_result$jscomp$322 = isSupported$jscomp$inline_1576;
+  } else JSCompiler_inline_result$jscomp$322 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$301 &&
+    JSCompiler_inline_result$jscomp$322 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -13957,20 +13650,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1596 = 0;
-  i$jscomp$inline_1596 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1596++
+  var i$jscomp$inline_1617 = 0;
+  i$jscomp$inline_1617 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1617++
 ) {
-  var eventName$jscomp$inline_1597 =
-      simpleEventPluginEvents[i$jscomp$inline_1596],
-    domEventName$jscomp$inline_1598 =
-      eventName$jscomp$inline_1597.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1599 =
-      eventName$jscomp$inline_1597[0].toUpperCase() +
-      eventName$jscomp$inline_1597.slice(1);
+  var eventName$jscomp$inline_1618 =
+      simpleEventPluginEvents[i$jscomp$inline_1617],
+    domEventName$jscomp$inline_1619 =
+      eventName$jscomp$inline_1618.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1620 =
+      eventName$jscomp$inline_1618[0].toUpperCase() +
+      eventName$jscomp$inline_1618.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1598,
-    "on" + capitalizedEvent$jscomp$inline_1599
+    domEventName$jscomp$inline_1619,
+    "on" + capitalizedEvent$jscomp$inline_1620
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -14810,72 +14503,339 @@ function getOwnerDocumentFromRootContainer(rootContainerElement) {
     : rootContainerElement.ownerDocument;
 }
 function noop$1() {}
+function setProp(domElement, tag, key, value, isCustomComponentTag, props) {
+  switch (key) {
+    case "style":
+      if (null != value && "object" !== typeof value)
+        throw Error(formatProdErrorMessage(62));
+      domElement = domElement.style;
+      for (var styleName in value)
+        value.hasOwnProperty(styleName) &&
+          ((key = value[styleName]),
+          (props = 0 === styleName.indexOf("--")),
+          null == key || "boolean" === typeof key || "" === key
+            ? props
+              ? domElement.setProperty(styleName, "")
+              : "float" === styleName
+              ? (domElement.cssFloat = "")
+              : (domElement[styleName] = "")
+            : props
+            ? domElement.setProperty(styleName, key)
+            : "number" !== typeof key ||
+              0 === key ||
+              (isUnitlessNumber.hasOwnProperty(styleName) &&
+                isUnitlessNumber[styleName])
+            ? "float" === styleName
+              ? (domElement.cssFloat = key)
+              : (domElement[styleName] = ("" + key).trim())
+            : (domElement[styleName] = key + "px"));
+      break;
+    case "dangerouslySetInnerHTML":
+      if (null != value) {
+        if ("object" !== typeof value || !("__html" in value))
+          throw Error(formatProdErrorMessage(61));
+        value = value.__html;
+        if (null != value) {
+          if (null != props.children) throw Error(formatProdErrorMessage(60));
+          disableIEWorkarounds
+            ? (domElement.innerHTML = value)
+            : setInnerHTML$1(domElement, value);
+        }
+      }
+      break;
+    case "children":
+      "string" === typeof value
+        ? "body" === tag ||
+          ("textarea" === tag && "" === value) ||
+          setTextContent(domElement, value)
+        : "number" === typeof value &&
+          "body" !== tag &&
+          setTextContent(domElement, "" + value);
+      break;
+    case "onScroll":
+      null != value && listenToNonDelegatedEvent("scroll", domElement);
+      break;
+    case "onClick":
+      null != value && (domElement.onclick = noop$1);
+      break;
+    case "suppressContentEditableWarning":
+    case "suppressHydrationWarning":
+    case "defaultValue":
+    case "defaultChecked":
+    case "innerHTML":
+      break;
+    case "autoFocus":
+      break;
+    case "innerText":
+    case "textContent":
+      if (enableCustomElementPropertySupport) break;
+    default:
+      if (!registrationNameDependencies.hasOwnProperty(key))
+        if (isCustomComponentTag)
+          a: {
+            if (
+              enableCustomElementPropertySupport &&
+              "o" === key[0] &&
+              "n" === key[1] &&
+              ((styleName = key.endsWith("Capture")),
+              (props = key.substr(2, styleName ? key.length - 9 : void 0)),
+              (tag = getFiberCurrentPropsFromNode(domElement)),
+              (tag = null != tag ? tag[key] : null),
+              "function" === typeof tag &&
+                domElement.removeEventListener(props, tag, styleName),
+              "function" === typeof value)
+            ) {
+              "function" !== typeof tag &&
+                null !== tag &&
+                (key in domElement
+                  ? (domElement[key] = null)
+                  : domElement.hasAttribute(key) &&
+                    domElement.removeAttribute(key));
+              domElement.addEventListener(props, value, styleName);
+              break a;
+            }
+            if (enableCustomElementPropertySupport && key in domElement)
+              domElement[key] = value;
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (enableCustomElementPropertySupport) {
+                      if (!0 === value) {
+                        domElement.setAttribute(key, "");
+                        break a;
+                      }
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+          }
+        else
+          a: if (
+            !(2 < key.length) ||
+            ("o" !== key[0] && "O" !== key[0]) ||
+            ("n" !== key[1] && "N" !== key[1])
+          )
+            if (
+              ((styleName = properties.hasOwnProperty(key)
+                ? properties[key]
+                : null),
+              null !== styleName)
+            )
+              if (styleName.mustUseProperty)
+                domElement[styleName.propertyName] =
+                  value &&
+                  "function" !== typeof value &&
+                  "symbol" !== typeof value;
+              else if (((key = styleName.attributeName), null === value))
+                domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (!styleName.acceptsBooleans) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                if (styleName.removeEmptyString && "" === value)
+                  domElement.removeAttribute(key);
+                else
+                  switch (styleName.type) {
+                    case 3:
+                      value
+                        ? domElement.setAttribute(key, "")
+                        : domElement.removeAttribute(key);
+                      break;
+                    case 4:
+                      !0 === value
+                        ? domElement.setAttribute(key, "")
+                        : !1 === value
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 5:
+                      isNaN(value)
+                        ? domElement.removeAttribute(key)
+                        : domElement.setAttribute(key, value);
+                      break;
+                    case 6:
+                      !isNaN(value) && 1 <= value
+                        ? domElement.setAttribute(key, value)
+                        : domElement.removeAttribute(key);
+                      break;
+                    default:
+                      value = enableTrustedTypesIntegration
+                        ? value
+                        : "" + value;
+                      if (
+                        styleName.sanitizeURL &&
+                        isJavaScriptProtocol.test(value.toString())
+                      )
+                        throw Error(formatProdErrorMessage(323));
+                      (styleName = styleName.attributeNamespace)
+                        ? domElement.setAttributeNS(styleName, key, value)
+                        : domElement.setAttribute(key, value);
+                  }
+              }
+            else if (isAttributeNameSafe(key))
+              if (null === value) domElement.removeAttribute(key);
+              else {
+                switch (typeof value) {
+                  case "undefined":
+                  case "function":
+                  case "symbol":
+                    domElement.removeAttribute(key);
+                    break a;
+                  case "boolean":
+                    if (
+                      ((styleName = key.toLowerCase().slice(0, 5)),
+                      "data-" !== styleName && "aria-" !== styleName)
+                    ) {
+                      domElement.removeAttribute(key);
+                      break a;
+                    }
+                }
+                domElement.setAttribute(
+                  key,
+                  enableTrustedTypesIntegration ? value : "" + value
+                );
+              }
+  }
+}
 function createHTMLElement(type, props, ownerDocument) {
   return "string" === typeof props.is
     ? ownerDocument.createElement(type, { is: props.is })
     : ownerDocument.createElement(type);
 }
-function setInitialProperties(domElement, tag, rawProps) {
-  var isCustomComponentTag = isCustomComponent(tag, rawProps);
+function setInitialProperties(domElement, tag, props) {
   switch (tag) {
+    case "input":
+      initWrapperState$2(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey in props)
+        if (props.hasOwnProperty(propKey)) {
+          var propValue = props[propKey];
+          if (null != propValue)
+            switch (propKey) {
+              case "checked":
+                var node = domElement;
+                propValue =
+                  null != propValue
+                    ? propValue
+                    : node._wrapperState.initialChecked;
+                node.checked =
+                  !!propValue &&
+                  "function" !== typeof propValue &&
+                  "symbol" !== propValue;
+                break;
+              case "value":
+                break;
+              case "children":
+              case "dangerouslySetInnerHTML":
+                if (null != propValue)
+                  throw Error(formatProdErrorMessage(137, tag));
+                break;
+              default:
+                setProp(domElement, tag, propKey, propValue, !1, props);
+            }
+        }
+      track(domElement);
+      postMountWrapper$3(domElement, props, !1);
+      return;
+    case "select":
+      domElement._wrapperState = { wasMultiple: !!props.multiple };
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (propValue in props)
+        if (
+          props.hasOwnProperty(propValue) &&
+          ((propKey = props[propValue]), null != propKey)
+        )
+          switch (propValue) {
+            case "value":
+              break;
+            default:
+              setProp(domElement, tag, propValue, propKey, !1, props);
+          }
+      domElement.multiple = !!props.multiple;
+      tag = props.value;
+      null != tag
+        ? updateOptions(domElement, !!props.multiple, tag, !1)
+        : null != props.defaultValue &&
+          updateOptions(domElement, !!props.multiple, props.defaultValue, !0);
+      return;
+    case "textarea":
+      initWrapperState(domElement, props);
+      listenToNonDelegatedEvent("invalid", domElement);
+      for (var propKey$201 in props)
+        if (
+          props.hasOwnProperty(propKey$201) &&
+          ((propKey = props[propKey$201]), null != propKey)
+        )
+          switch (propKey$201) {
+            case "value":
+              break;
+            case "children":
+              break;
+            case "dangerouslySetInnerHTML":
+              if (null != propKey) throw Error(formatProdErrorMessage(91));
+              break;
+            default:
+              setProp(domElement, tag, propKey$201, propKey, !1, props);
+          }
+      track(domElement);
+      postMountWrapper(domElement);
+      return;
+    case "option":
+      for (var propKey$203 in props)
+        props.hasOwnProperty(propKey$203) &&
+          ((propKey = props[propKey$203]),
+          null != propKey &&
+            setProp(domElement, tag, propKey$203, propKey, !1, props));
+      null != props.value &&
+        domElement.setAttribute("value", "" + getToStringValue(props.value));
+      return;
     case "dialog":
       listenToNonDelegatedEvent("cancel", domElement);
       listenToNonDelegatedEvent("close", domElement);
-      var props = rawProps;
       break;
-    case "embed":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "iframe":
     case "object":
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "video":
     case "audio":
-      for (props = 0; props < mediaEventTypes.length; props++)
-        listenToNonDelegatedEvent(mediaEventTypes[props], domElement);
-      props = rawProps;
+      for (propKey = 0; propKey < mediaEventTypes.length; propKey++)
+        listenToNonDelegatedEvent(mediaEventTypes[propKey], domElement);
       break;
-    case "source":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      listenToNonDelegatedEvent("error", domElement);
-      props = rawProps;
-      break;
-    case "img":
-    case "link":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
     case "image":
       listenToNonDelegatedEvent("error", domElement);
       listenToNonDelegatedEvent("load", domElement);
-      props = rawProps;
       break;
     case "details":
       listenToNonDelegatedEvent("toggle", domElement);
-      props = rawProps;
-      break;
-    case "input":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-      initWrapperState$2(domElement, rawProps);
-      props = getHostProps$2(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "option":
-      props = rawProps;
-      break;
-    case "select":
-      domElement._wrapperState = { wasMultiple: !!rawProps.multiple };
-      props = assign({}, rawProps, { value: void 0 });
-      listenToNonDelegatedEvent("invalid", domElement);
-      break;
-    case "textarea":
-      initWrapperState(domElement, rawProps);
-      props = getHostProps(domElement, rawProps);
-      listenToNonDelegatedEvent("invalid", domElement);
       break;
+    case "embed":
+    case "source":
+    case "img":
+    case "link":
+      listenToNonDelegatedEvent("error", domElement),
+        listenToNonDelegatedEvent("load", domElement);
     case "area":
     case "base":
     case "br":
@@ -14887,163 +14847,159 @@ function setInitialProperties(domElement, tag, rawProps) {
     case "track":
     case "wbr":
     case "menuitem":
-      if (null != rawProps.children || null != rawProps.dangerouslySetInnerHTML)
-        throw Error(formatProdErrorMessage(137, tag));
-    default:
-      props = rawProps;
-  }
-  var nextProps = props,
-    propKey;
-  for (propKey in nextProps)
-    if (nextProps.hasOwnProperty(propKey)) {
-      var nextProp = nextProps[propKey];
-      switch (propKey) {
-        case "style":
-          if (null != nextProp && "object" !== typeof nextProp)
-            throw Error(formatProdErrorMessage(62));
-          setValueForStyles(domElement, nextProp);
-          break;
-        case "dangerouslySetInnerHTML":
-          if (null != nextProp) {
-            if ("object" !== typeof nextProp || !("__html" in nextProp))
-              throw Error(formatProdErrorMessage(61));
-            nextProp = nextProp.__html;
-            if (null != nextProp) {
-              if (null != nextProps.children)
-                throw Error(formatProdErrorMessage(60));
-              disableIEWorkarounds
-                ? (domElement.innerHTML = nextProp)
-                : setInnerHTML$1(domElement, nextProp);
-            }
+      for (var propKey$205 in props)
+        if (
+          props.hasOwnProperty(propKey$205) &&
+          ((propKey = props[propKey$205]), null != propKey)
+        )
+          switch (propKey$205) {
+            case "children":
+            case "dangerouslySetInnerHTML":
+              throw Error(formatProdErrorMessage(137, tag));
+            default:
+              setProp(domElement, tag, propKey$205, propKey, !1, props);
           }
-          break;
-        case "children":
-          "string" === typeof nextProp
-            ? "body" === tag ||
-              ("textarea" === tag && "" === nextProp) ||
-              setTextContent(domElement, nextProp)
-            : "number" === typeof nextProp &&
-              "body" !== tag &&
-              setTextContent(domElement, "" + nextProp);
-          break;
-        case "onScroll":
-          null != nextProp && listenToNonDelegatedEvent("scroll", domElement);
-          break;
-        case "suppressContentEditableWarning":
-        case "suppressHydrationWarning":
-        case "defaultValue":
-        case "defaultChecked":
-        case "innerHTML":
-          break;
-        case "autoFocus":
-          break;
-        case "innerText":
-        case "textContent":
-          if (enableCustomElementPropertySupport) break;
-        default:
-          registrationNameDependencies.hasOwnProperty(propKey) ||
-            (null != nextProp &&
-              (isCustomComponentTag
-                ? setValueForPropertyOnCustomComponent(
-                    domElement,
-                    propKey,
-                    nextProp
-                  )
-                : setValueForProperty(domElement, propKey, nextProp)));
-      }
-    }
-  switch (tag) {
-    case "input":
-      track(domElement);
-      postMountWrapper$3(domElement, rawProps, !1);
-      break;
-    case "textarea":
-      track(domElement);
-      postMountWrapper(domElement);
-      break;
-    case "option":
-      null != rawProps.value &&
-        domElement.setAttribute("value", "" + getToStringValue(rawProps.value));
-      break;
-    case "select":
-      domElement.multiple = !!rawProps.multiple;
-      tag = rawProps.value;
-      null != tag
-        ? updateOptions(domElement, !!rawProps.multiple, tag, !1)
-        : null != rawProps.defaultValue &&
-          updateOptions(
-            domElement,
-            !!rawProps.multiple,
-            rawProps.defaultValue,
-            !0
-          );
-      break;
-    default:
-      "function" === typeof props.onClick && (domElement.onclick = noop$1);
+      return;
   }
+  propKey = isCustomComponent(tag, props);
+  for (node in props)
+    props.hasOwnProperty(node) &&
+      ((propValue = props[node]),
+      null != propValue &&
+        setProp(domElement, tag, node, propValue, propKey, props));
 }
 function updateProperties(
   domElement,
   updatePayload,
   tag,
-  lastRawProps,
-  nextRawProps
+  lastProps,
+  nextProps
 ) {
-  "input" === tag &&
-    "radio" === nextRawProps.type &&
-    null != nextRawProps.name &&
-    updateChecked(domElement, nextRawProps);
-  isCustomComponent(tag, lastRawProps);
-  lastRawProps = isCustomComponent(tag, nextRawProps);
-  for (var i = 0; i < updatePayload.length; i += 2) {
-    var propKey = updatePayload[i],
-      propValue = updatePayload[i + 1];
-    switch (propKey) {
-      case "style":
-        setValueForStyles(domElement, propValue);
-        break;
-      case "dangerouslySetInnerHTML":
-        disableIEWorkarounds
-          ? (domElement.innerHTML = propValue)
-          : setInnerHTML$1(domElement, propValue);
-        break;
-      case "children":
-        setTextContent(domElement, propValue);
-        break;
-      default:
-        lastRawProps
-          ? setValueForPropertyOnCustomComponent(domElement, propKey, propValue)
-          : setValueForProperty(domElement, propKey, propValue);
-    }
-  }
   switch (tag) {
     case "input":
-      updateWrapper$1(domElement, nextRawProps);
-      break;
-    case "textarea":
-      updateWrapper(domElement, nextRawProps);
-      break;
+      "radio" === nextProps.type &&
+        null != nextProps.name &&
+        ((lastProps = nextProps.checked),
+        null != lastProps && (domElement.checked = lastProps));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) {
+        var propKey = updatePayload[lastProps],
+          propValue = updatePayload[lastProps + 1];
+        switch (propKey) {
+          case "checked":
+            propKey = domElement;
+            propValue =
+              null != propValue
+                ? propValue
+                : propKey._wrapperState.initialChecked;
+            propKey.checked =
+              !!propValue &&
+              "function" !== typeof propValue &&
+              "symbol" !== propValue;
+            break;
+          case "value":
+            break;
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propValue)
+              throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propKey, propValue, !1, nextProps);
+        }
+      }
+      updateWrapper$1(domElement, nextProps);
+      return;
     case "select":
-      (updatePayload = domElement._wrapperState.wasMultiple),
-        (domElement._wrapperState.wasMultiple = !!nextRawProps.multiple),
-        (tag = nextRawProps.value),
-        null != tag
-          ? updateOptions(domElement, !!nextRawProps.multiple, tag, !1)
-          : updatePayload !== !!nextRawProps.multiple &&
-            (null != nextRawProps.defaultValue
-              ? updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.defaultValue,
-                  !0
-                )
-              : updateOptions(
-                  domElement,
-                  !!nextRawProps.multiple,
-                  nextRawProps.multiple ? [] : "",
-                  !1
-                ));
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updatePayload = domElement._wrapperState.wasMultiple;
+      domElement._wrapperState.wasMultiple = !!nextProps.multiple;
+      tag = nextProps.value;
+      null != tag
+        ? updateOptions(domElement, !!nextProps.multiple, tag, !1)
+        : updatePayload !== !!nextProps.multiple &&
+          (null != nextProps.defaultValue
+            ? updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.defaultValue,
+                !0
+              )
+            : updateOptions(
+                domElement,
+                !!nextProps.multiple,
+                nextProps.multiple ? [] : "",
+                !1
+              ));
+      return;
+    case "textarea":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "value":
+            break;
+          case "children":
+            break;
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(91));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      updateWrapper(domElement, nextProps);
+      return;
+    case "img":
+    case "link":
+    case "area":
+    case "base":
+    case "br":
+    case "col":
+    case "embed":
+    case "hr":
+    case "keygen":
+    case "meta":
+    case "param":
+    case "source":
+    case "track":
+    case "wbr":
+    case "menuitem":
+      for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2)
+        switch (
+          ((propValue = updatePayload[lastProps]),
+          (propKey = updatePayload[lastProps + 1]),
+          propValue)
+        ) {
+          case "children":
+          case "dangerouslySetInnerHTML":
+            if (null != propKey) throw Error(formatProdErrorMessage(137, tag));
+            break;
+          default:
+            setProp(domElement, tag, propValue, propKey, !1, nextProps);
+        }
+      return;
   }
+  lastProps = isCustomComponent(tag, nextProps);
+  for (propValue = 0; propValue < updatePayload.length; propValue += 2)
+    setProp(
+      domElement,
+      tag,
+      updatePayload[propValue],
+      updatePayload[propValue + 1],
+      lastProps,
+      nextProps
+    );
 }
 var Dispatcher$1 = Internals.Dispatcher,
   eventsEnabled = null,
@@ -15411,14 +15367,14 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$200 = getStyleKey(href),
+          var key$222 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$200);
+            resource = as.get(key$222);
           if (resource) break;
           var state = { loading: 0, preload: null };
           if (
             (resource = resourceRoot.querySelector(
-              getStylesheetSelectorFromKey(key$200)
+              getStylesheetSelectorFromKey(key$222)
             ))
           )
             state.loading = 1;
@@ -15429,7 +15385,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             };
-            (options = preloadPropsMap.get(key$200)) &&
+            (options = preloadPropsMap.get(key$222)) &&
               adoptPreloadPropsForStylesheet(href, options);
             var link = (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -15455,15 +15411,15 @@ function preinit$1(href, options) {
             count: 1,
             state: state
           };
-          as.set(key$200, resource);
+          as.set(key$222, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$200 = getScriptKey(href)),
-            (precedence = as.get(key$200)),
+            (key$222 = getScriptKey(href)),
+            (precedence = as.get(key$222)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$200
+                "script[async]" + key$222
               )),
               precedence ||
                 ((href = {
@@ -15472,7 +15428,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$200)) &&
+                (options = preloadPropsMap.get(key$222)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -15485,13 +15441,13 @@ function preinit$1(href, options) {
                 count: 1,
                 state: null
               }),
-              as.set(key$200, precedence));
+              as.set(key$222, 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$222 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$222 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$222 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -15508,7 +15464,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$200) &&
+          null === resourceRoot.querySelector(key$222) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -15541,17 +15497,17 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.precedence
       ) {
         type = getStyleKey(pendingProps.href);
-        var styles$209 = getResourcesFromRoot(currentProps).hoistableStyles,
-          resource$210 = styles$209.get(type);
-        resource$210 ||
+        var styles$231 = getResourcesFromRoot(currentProps).hoistableStyles,
+          resource$232 = styles$231.get(type);
+        resource$232 ||
           ((currentProps = currentProps.ownerDocument || currentProps),
-          (resource$210 = {
+          (resource$232 = {
             type: "stylesheet",
             instance: null,
             count: 0,
             state: { loading: 0, preload: null }
           }),
-          styles$209.set(type, resource$210),
+          styles$231.set(type, resource$232),
           preloadPropsMap.has(type) ||
             preloadStylesheet(
               currentProps,
@@ -15566,9 +15522,9 @@ function getResource(type, currentProps, pendingProps) {
                 hrefLang: pendingProps.hrefLang,
                 referrerPolicy: pendingProps.referrerPolicy
               },
-              resource$210.state
+              resource$232.state
             ));
-        return resource$210;
+        return resource$232;
       }
       return null;
     case "script":
@@ -15640,36 +15596,36 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$215 = hoistableRoot.querySelector(
+        var instance$237 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$215)
+        if (instance$237)
           return (
-            (resource.instance = instance$215),
-            markNodeAsHoistable(instance$215),
-            instance$215
+            (resource.instance = instance$237),
+            markNodeAsHoistable(instance$237),
+            instance$237
           );
         key = stylesheetPropsFromRawProps(props);
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$215 = (
+        instance$237 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$215);
-        var linkInstance = instance$215;
+        markNodeAsHoistable(instance$237);
+        var linkInstance = instance$237;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
         });
-        setInitialProperties(instance$215, "link", key);
+        setInitialProperties(instance$237, "link", key);
         resource.state.loading |= 4;
-        insertStylesheet(instance$215, props.precedence, hoistableRoot);
-        return (resource.instance = instance$215);
+        insertStylesheet(instance$237, props.precedence, hoistableRoot);
+        return (resource.instance = instance$237);
       case "script":
-        instance$215 = getScriptKey(props.src);
+        instance$237 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$215
+            "script[async]" + instance$237
           ))
         )
           return (
@@ -15678,7 +15634,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$215)))
+        if ((styleProps = preloadPropsMap.get(instance$237)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -16049,17 +16005,17 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1769 = {
+var devToolsConfig$jscomp$inline_1787 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-0ec8c3f1",
+  version: "18.3.0-www-modern-3ed4a7e4",
   rendererPackageName: "react-dom"
 };
-var internals$jscomp$inline_2166 = {
-  bundleType: devToolsConfig$jscomp$inline_1769.bundleType,
-  version: devToolsConfig$jscomp$inline_1769.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1769.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1769.rendererConfig,
+var internals$jscomp$inline_2201 = {
+  bundleType: devToolsConfig$jscomp$inline_1787.bundleType,
+  version: devToolsConfig$jscomp$inline_1787.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1787.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1787.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -16076,26 +16032,26 @@ var internals$jscomp$inline_2166 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1769.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1787.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-0ec8c3f1"
+  reconcilerVersion: "18.3.0-www-modern-3ed4a7e4"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2167 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2202 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2167.isDisabled &&
-    hook$jscomp$inline_2167.supportsFiber
+    !hook$jscomp$inline_2202.isDisabled &&
+    hook$jscomp$inline_2202.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2167.inject(
-        internals$jscomp$inline_2166
+      (rendererID = hook$jscomp$inline_2202.inject(
+        internals$jscomp$inline_2201
       )),
-        (injectedHook = hook$jscomp$inline_2167);
+        (injectedHook = hook$jscomp$inline_2202);
     } catch (err) {}
 }
 exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
@@ -16403,4 +16359,4 @@ exports.unstable_createEventHandle = function (type, options) {
   return eventHandle;
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-modern-0ec8c3f1";
+exports.version = "18.3.0-www-modern-3ed4a7e4";
diff --git a/compiled/facebook-www/ReactTestRenderer-dev.modern.js b/compiled/facebook-www/ReactTestRenderer-dev.modern.js
index cf8bb1aa969d3..3688ae07334a2 100644
--- a/compiled/facebook-www/ReactTestRenderer-dev.modern.js
+++ b/compiled/facebook-www/ReactTestRenderer-dev.modern.js
@@ -24372,7 +24372,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-0ec8c3f1";
+var ReactVersion = "18.3.0-www-modern-3ed4a7e4";
 
 // Might add PROFILE later.