[Summary view] [Print] [Text view]

   1  /**
   2   * @license React
   3   * react-dom.development.js
   4   *
   5   * Copyright (c) Facebook, Inc. and its affiliates.
   6   *
   7   * This source code is licensed under the MIT license found in the
   8   * LICENSE file in the root directory of this source tree.
   9   */
  10  (function (global, factory) {
  11    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react')) :
  12    typeof define === 'function' && define.amd ? define(['exports', 'react'], factory) :
  13    (global = global || self, factory(global.ReactDOM = {}, global.React));
  14  }(this, (function (exports, React) { 'use strict';
  15  
  16    var ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
  17  
  18    var suppressWarning = false;
  19    function setSuppressWarning(newSuppressWarning) {
  20      {
  21        suppressWarning = newSuppressWarning;
  22      }
  23    } // In DEV, calls to console.warn and console.error get replaced
  24    // by calls to these methods by a Babel plugin.
  25    //
  26    // In PROD (or in packages without access to React internals),
  27    // they are left as they are instead.
  28  
  29    function warn(format) {
  30      {
  31        if (!suppressWarning) {
  32          for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
  33            args[_key - 1] = arguments[_key];
  34          }
  35  
  36          printWarning('warn', format, args);
  37        }
  38      }
  39    }
  40    function error(format) {
  41      {
  42        if (!suppressWarning) {
  43          for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
  44            args[_key2 - 1] = arguments[_key2];
  45          }
  46  
  47          printWarning('error', format, args);
  48        }
  49      }
  50    }
  51  
  52    function printWarning(level, format, args) {
  53      // When changing this logic, you might want to also
  54      // update consoleWithStackDev.www.js as well.
  55      {
  56        var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
  57        var stack = ReactDebugCurrentFrame.getStackAddendum();
  58  
  59        if (stack !== '') {
  60          format += '%s';
  61          args = args.concat([stack]);
  62        } // eslint-disable-next-line react-internal/safe-string-coercion
  63  
  64  
  65        var argsWithFormat = args.map(function (item) {
  66          return String(item);
  67        }); // Careful: RN currently depends on this prefix
  68  
  69        argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
  70        // breaks IE9: https://github.com/facebook/react/issues/13610
  71        // eslint-disable-next-line react-internal/no-production-logging
  72  
  73        Function.prototype.apply.call(console[level], console, argsWithFormat);
  74      }
  75    }
  76  
  77    var FunctionComponent = 0;
  78    var ClassComponent = 1;
  79    var IndeterminateComponent = 2; // Before we know whether it is function or class
  80  
  81    var HostRoot = 3; // Root of a host tree. Could be nested inside another node.
  82  
  83    var HostPortal = 4; // A subtree. Could be an entry point to a different renderer.
  84  
  85    var HostComponent = 5;
  86    var HostText = 6;
  87    var Fragment = 7;
  88    var Mode = 8;
  89    var ContextConsumer = 9;
  90    var ContextProvider = 10;
  91    var ForwardRef = 11;
  92    var Profiler = 12;
  93    var SuspenseComponent = 13;
  94    var MemoComponent = 14;
  95    var SimpleMemoComponent = 15;
  96    var LazyComponent = 16;
  97    var IncompleteClassComponent = 17;
  98    var DehydratedFragment = 18;
  99    var SuspenseListComponent = 19;
 100    var ScopeComponent = 21;
 101    var OffscreenComponent = 22;
 102    var LegacyHiddenComponent = 23;
 103    var CacheComponent = 24;
 104    var TracingMarkerComponent = 25;
 105  
 106    // -----------------------------------------------------------------------------
 107  
 108    var enableClientRenderFallbackOnTextMismatch = true; // TODO: Need to review this code one more time before landing
 109    // the react-reconciler package.
 110  
 111    var enableNewReconciler = false; // Support legacy Primer support on internal FB www
 112  
 113    var enableLazyContextPropagation = false; // FB-only usage. The new API has different semantics.
 114  
 115    var enableLegacyHidden = false; // Enables unstable_avoidThisFallback feature in Fiber
 116  
 117    var enableSuspenseAvoidThisFallback = false; // Enables unstable_avoidThisFallback feature in Fizz
 118    // React DOM Chopping Block
 119    //
 120    // Similar to main Chopping Block but only flags related to React DOM. These are
 121    // grouped because we will likely batch all of them into a single major release.
 122    // -----------------------------------------------------------------------------
 123    // Disable support for comment nodes as React DOM containers. Already disabled
 124    // in open source, but www codebase still relies on it. Need to remove.
 125  
 126    var disableCommentsAsDOMContainers = true; // Disable javascript: URL strings in href for XSS protection.
 127    // and client rendering, mostly to allow JSX attributes to apply to the custom
 128    // element's object properties instead of only HTML attributes.
 129    // https://github.com/facebook/react/issues/11347
 130  
 131    var enableCustomElementPropertySupport = false; // Disables children for <textarea> elements
 132    var warnAboutStringRefs = true; // -----------------------------------------------------------------------------
 133    // Debugging and DevTools
 134    // -----------------------------------------------------------------------------
 135    // Adds user timing marks for e.g. state updates, suspense, and work loop stuff,
 136    // for an experimental timeline tool.
 137  
 138    var enableSchedulingProfiler = true; // Helps identify side effects in render-phase lifecycle hooks and setState
 139  
 140    var enableProfilerTimer = true; // Record durations for commit and passive effects phases.
 141  
 142    var enableProfilerCommitHooks = true; // Phase param passed to onRender callback differentiates between an "update" and a "cascading-update".
 143  
 144    var allNativeEvents = new Set();
 145    /**
 146     * Mapping from registration name to event name
 147     */
 148  
 149  
 150    var registrationNameDependencies = {};
 151    /**
 152     * Mapping from lowercase registration names to the properly cased version,
 153     * used to warn in the case of missing event handlers. Available
 154     * only in true.
 155     * @type {Object}
 156     */
 157  
 158    var possibleRegistrationNames =  {} ; // Trust the developer to only use possibleRegistrationNames in true
 159  
 160    function registerTwoPhaseEvent(registrationName, dependencies) {
 161      registerDirectEvent(registrationName, dependencies);
 162      registerDirectEvent(registrationName + 'Capture', dependencies);
 163    }
 164    function registerDirectEvent(registrationName, dependencies) {
 165      {
 166        if (registrationNameDependencies[registrationName]) {
 167          error('EventRegistry: More than one plugin attempted to publish the same ' + 'registration name, `%s`.', registrationName);
 168        }
 169      }
 170  
 171      registrationNameDependencies[registrationName] = dependencies;
 172  
 173      {
 174        var lowerCasedName = registrationName.toLowerCase();
 175        possibleRegistrationNames[lowerCasedName] = registrationName;
 176  
 177        if (registrationName === 'onDoubleClick') {
 178          possibleRegistrationNames.ondblclick = registrationName;
 179        }
 180      }
 181  
 182      for (var i = 0; i < dependencies.length; i++) {
 183        allNativeEvents.add(dependencies[i]);
 184      }
 185    }
 186  
 187    var canUseDOM = !!(typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined');
 188  
 189    var hasOwnProperty = Object.prototype.hasOwnProperty;
 190  
 191    /*
 192     * The `'' + value` pattern (used in in perf-sensitive code) throws for Symbol
 193     * and Temporal.* types. See https://github.com/facebook/react/pull/22064.
 194     *
 195     * The functions in this module will throw an easier-to-understand,
 196     * easier-to-debug exception with a clear errors message message explaining the
 197     * problem. (Instead of a confusing exception thrown inside the implementation
 198     * of the `value` object).
 199     */
 200    // $FlowFixMe only called in DEV, so void return is not possible.
 201    function typeName(value) {
 202      {
 203        // toStringTag is needed for namespaced types like Temporal.Instant
 204        var hasToStringTag = typeof Symbol === 'function' && Symbol.toStringTag;
 205        var type = hasToStringTag && value[Symbol.toStringTag] || value.constructor.name || 'Object';
 206        return type;
 207      }
 208    } // $FlowFixMe only called in DEV, so void return is not possible.
 209  
 210  
 211    function willCoercionThrow(value) {
 212      {
 213        try {
 214          testStringCoercion(value);
 215          return false;
 216        } catch (e) {
 217          return true;
 218        }
 219      }
 220    }
 221  
 222    function testStringCoercion(value) {
 223      // If you ended up here by following an exception call stack, here's what's
 224      // happened: you supplied an object or symbol value to React (as a prop, key,
 225      // DOM attribute, CSS property, string ref, etc.) and when React tried to
 226      // coerce it to a string using `'' + value`, an exception was thrown.
 227      //
 228      // The most common types that will cause this exception are `Symbol` instances
 229      // and Temporal objects like `Temporal.Instant`. But any object that has a
 230      // `valueOf` or `[Symbol.toPrimitive]` method that throws will also cause this
 231      // exception. (Library authors do this to prevent users from using built-in
 232      // numeric operators like `+` or comparison operators like `>=` because custom
 233      // methods are needed to perform accurate arithmetic or comparison.)
 234      //
 235      // To fix the problem, coerce this object or symbol value to a string before
 236      // passing it to React. The most reliable way is usually `String(value)`.
 237      //
 238      // To find which value is throwing, check the browser or debugger console.
 239      // Before this exception was thrown, there should be `console.error` output
 240      // that shows the type (Symbol, Temporal.PlainDate, etc.) that caused the
 241      // problem and how that type was used: key, atrribute, input value prop, etc.
 242      // In most cases, this console output also shows the component and its
 243      // ancestor components where the exception happened.
 244      //
 245      // eslint-disable-next-line react-internal/safe-string-coercion
 246      return '' + value;
 247    }
 248  
 249    function checkAttributeStringCoercion(value, attributeName) {
 250      {
 251        if (willCoercionThrow(value)) {
 252          error('The provided `%s` attribute is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', attributeName, typeName(value));
 253  
 254          return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
 255        }
 256      }
 257    }
 258    function checkKeyStringCoercion(value) {
 259      {
 260        if (willCoercionThrow(value)) {
 261          error('The provided key is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value));
 262  
 263          return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
 264        }
 265      }
 266    }
 267    function checkPropStringCoercion(value, propName) {
 268      {
 269        if (willCoercionThrow(value)) {
 270          error('The provided `%s` prop is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', propName, typeName(value));
 271  
 272          return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
 273        }
 274      }
 275    }
 276    function checkCSSPropertyStringCoercion(value, propName) {
 277      {
 278        if (willCoercionThrow(value)) {
 279          error('The provided `%s` CSS property is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', propName, typeName(value));
 280  
 281          return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
 282        }
 283      }
 284    }
 285    function checkHtmlStringCoercion(value) {
 286      {
 287        if (willCoercionThrow(value)) {
 288          error('The provided HTML markup uses a value of unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value));
 289  
 290          return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
 291        }
 292      }
 293    }
 294    function checkFormFieldValueStringCoercion(value) {
 295      {
 296        if (willCoercionThrow(value)) {
 297          error('Form field values (value, checked, defaultValue, or defaultChecked props)' + ' must be strings, not %s.' + ' This value must be coerced to a string before before using it here.', typeName(value));
 298  
 299          return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
 300        }
 301      }
 302    }
 303  
 304    // A reserved attribute.
 305    // It is handled by React separately and shouldn't be written to the DOM.
 306    var RESERVED = 0; // A simple string attribute.
 307    // Attributes that aren't in the filter are presumed to have this type.
 308  
 309    var STRING = 1; // A string attribute that accepts booleans in React. In HTML, these are called
 310    // "enumerated" attributes with "true" and "false" as possible values.
 311    // When true, it should be set to a "true" string.
 312    // When false, it should be set to a "false" string.
 313  
 314    var BOOLEANISH_STRING = 2; // A real boolean attribute.
 315    // When true, it should be present (set either to an empty string or its name).
 316    // When false, it should be omitted.
 317  
 318    var BOOLEAN = 3; // An attribute that can be used as a flag as well as with a value.
 319    // When true, it should be present (set either to an empty string or its name).
 320    // When false, it should be omitted.
 321    // For any other value, should be present with that value.
 322  
 323    var OVERLOADED_BOOLEAN = 4; // An attribute that must be numeric or parse as a numeric.
 324    // When falsy, it should be removed.
 325  
 326    var NUMERIC = 5; // An attribute that must be positive numeric or parse as a positive numeric.
 327    // When falsy, it should be removed.
 328  
 329    var POSITIVE_NUMERIC = 6;
 330  
 331    /* eslint-disable max-len */
 332    var ATTRIBUTE_NAME_START_CHAR = ":A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD";
 333    /* eslint-enable max-len */
 334  
 335    var ATTRIBUTE_NAME_CHAR = ATTRIBUTE_NAME_START_CHAR + "\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040";
 336    var VALID_ATTRIBUTE_NAME_REGEX = new RegExp('^[' + ATTRIBUTE_NAME_START_CHAR + '][' + ATTRIBUTE_NAME_CHAR + ']*$');
 337    var illegalAttributeNameCache = {};
 338    var validatedAttributeNameCache = {};
 339    function isAttributeNameSafe(attributeName) {
 340      if (hasOwnProperty.call(validatedAttributeNameCache, attributeName)) {
 341        return true;
 342      }
 343  
 344      if (hasOwnProperty.call(illegalAttributeNameCache, attributeName)) {
 345        return false;
 346      }
 347  
 348      if (VALID_ATTRIBUTE_NAME_REGEX.test(attributeName)) {
 349        validatedAttributeNameCache[attributeName] = true;
 350        return true;
 351      }
 352  
 353      illegalAttributeNameCache[attributeName] = true;
 354  
 355      {
 356        error('Invalid attribute name: `%s`', attributeName);
 357      }
 358  
 359      return false;
 360    }
 361    function shouldIgnoreAttribute(name, propertyInfo, isCustomComponentTag) {
 362      if (propertyInfo !== null) {
 363        return propertyInfo.type === RESERVED;
 364      }
 365  
 366      if (isCustomComponentTag) {
 367        return false;
 368      }
 369  
 370      if (name.length > 2 && (name[0] === 'o' || name[0] === 'O') && (name[1] === 'n' || name[1] === 'N')) {
 371        return true;
 372      }
 373  
 374      return false;
 375    }
 376    function shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag) {
 377      if (propertyInfo !== null && propertyInfo.type === RESERVED) {
 378        return false;
 379      }
 380  
 381      switch (typeof value) {
 382        case 'function': // $FlowIssue symbol is perfectly valid here
 383  
 384        case 'symbol':
 385          // eslint-disable-line
 386          return true;
 387  
 388        case 'boolean':
 389          {
 390            if (isCustomComponentTag) {
 391              return false;
 392            }
 393  
 394            if (propertyInfo !== null) {
 395              return !propertyInfo.acceptsBooleans;
 396            } else {
 397              var prefix = name.toLowerCase().slice(0, 5);
 398              return prefix !== 'data-' && prefix !== 'aria-';
 399            }
 400          }
 401  
 402        default:
 403          return false;
 404      }
 405    }
 406    function shouldRemoveAttribute(name, value, propertyInfo, isCustomComponentTag) {
 407      if (value === null || typeof value === 'undefined') {
 408        return true;
 409      }
 410  
 411      if (shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag)) {
 412        return true;
 413      }
 414  
 415      if (isCustomComponentTag) {
 416  
 417        return false;
 418      }
 419  
 420      if (propertyInfo !== null) {
 421  
 422        switch (propertyInfo.type) {
 423          case BOOLEAN:
 424            return !value;
 425  
 426          case OVERLOADED_BOOLEAN:
 427            return value === false;
 428  
 429          case NUMERIC:
 430            return isNaN(value);
 431  
 432          case POSITIVE_NUMERIC:
 433            return isNaN(value) || value < 1;
 434        }
 435      }
 436  
 437      return false;
 438    }
 439    function getPropertyInfo(name) {
 440      return properties.hasOwnProperty(name) ? properties[name] : null;
 441    }
 442  
 443    function PropertyInfoRecord(name, type, mustUseProperty, attributeName, attributeNamespace, sanitizeURL, removeEmptyString) {
 444      this.acceptsBooleans = type === BOOLEANISH_STRING || type === BOOLEAN || type === OVERLOADED_BOOLEAN;
 445      this.attributeName = attributeName;
 446      this.attributeNamespace = attributeNamespace;
 447      this.mustUseProperty = mustUseProperty;
 448      this.propertyName = name;
 449      this.type = type;
 450      this.sanitizeURL = sanitizeURL;
 451      this.removeEmptyString = removeEmptyString;
 452    } // When adding attributes to this list, be sure to also add them to
 453    // the `possibleStandardNames` module to ensure casing and incorrect
 454    // name warnings.
 455  
 456  
 457    var properties = {}; // These props are reserved by React. They shouldn't be written to the DOM.
 458  
 459    var reservedProps = ['children', 'dangerouslySetInnerHTML', // TODO: This prevents the assignment of defaultValue to regular
 460    // elements (not just inputs). Now that ReactDOMInput assigns to the
 461    // defaultValue property -- do we need this?
 462    'defaultValue', 'defaultChecked', 'innerHTML', 'suppressContentEditableWarning', 'suppressHydrationWarning', 'style'];
 463  
 464    reservedProps.forEach(function (name) {
 465      properties[name] = new PropertyInfoRecord(name, RESERVED, false, // mustUseProperty
 466      name, // attributeName
 467      null, // attributeNamespace
 468      false, // sanitizeURL
 469      false);
 470    }); // A few React string attributes have a different name.
 471    // This is a mapping from React prop names to the attribute names.
 472  
 473    [['acceptCharset', 'accept-charset'], ['className', 'class'], ['htmlFor', 'for'], ['httpEquiv', 'http-equiv']].forEach(function (_ref) {
 474      var name = _ref[0],
 475          attributeName = _ref[1];
 476      properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
 477      attributeName, // attributeName
 478      null, // attributeNamespace
 479      false, // sanitizeURL
 480      false);
 481    }); // These are "enumerated" HTML attributes that accept "true" and "false".
 482    // In React, we let users pass `true` and `false` even though technically
 483    // these aren't boolean attributes (they are coerced to strings).
 484  
 485    ['contentEditable', 'draggable', 'spellCheck', 'value'].forEach(function (name) {
 486      properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty
 487      name.toLowerCase(), // attributeName
 488      null, // attributeNamespace
 489      false, // sanitizeURL
 490      false);
 491    }); // These are "enumerated" SVG attributes that accept "true" and "false".
 492    // In React, we let users pass `true` and `false` even though technically
 493    // these aren't boolean attributes (they are coerced to strings).
 494    // Since these are SVG attributes, their attribute names are case-sensitive.
 495  
 496    ['autoReverse', 'externalResourcesRequired', 'focusable', 'preserveAlpha'].forEach(function (name) {
 497      properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty
 498      name, // attributeName
 499      null, // attributeNamespace
 500      false, // sanitizeURL
 501      false);
 502    }); // These are HTML boolean attributes.
 503  
 504    ['allowFullScreen', 'async', // Note: there is a special case that prevents it from being written to the DOM
 505    // on the client side because the browsers are inconsistent. Instead we call focus().
 506    'autoFocus', 'autoPlay', 'controls', 'default', 'defer', 'disabled', 'disablePictureInPicture', 'disableRemotePlayback', 'formNoValidate', 'hidden', 'loop', 'noModule', 'noValidate', 'open', 'playsInline', 'readOnly', 'required', 'reversed', 'scoped', 'seamless', // Microdata
 507    'itemScope'].forEach(function (name) {
 508      properties[name] = new PropertyInfoRecord(name, BOOLEAN, false, // mustUseProperty
 509      name.toLowerCase(), // attributeName
 510      null, // attributeNamespace
 511      false, // sanitizeURL
 512      false);
 513    }); // These are the few React props that we set as DOM properties
 514    // rather than attributes. These are all booleans.
 515  
 516    ['checked', // Note: `option.selected` is not updated if `select.multiple` is
 517    // disabled with `removeAttribute`. We have special logic for handling this.
 518    'multiple', 'muted', 'selected' // NOTE: if you add a camelCased prop to this list,
 519    // you'll need to set attributeName to name.toLowerCase()
 520    // instead in the assignment below.
 521    ].forEach(function (name) {
 522      properties[name] = new PropertyInfoRecord(name, BOOLEAN, true, // mustUseProperty
 523      name, // attributeName
 524      null, // attributeNamespace
 525      false, // sanitizeURL
 526      false);
 527    }); // These are HTML attributes that are "overloaded booleans": they behave like
 528    // booleans, but can also accept a string value.
 529  
 530    ['capture', 'download' // NOTE: if you add a camelCased prop to this list,
 531    // you'll need to set attributeName to name.toLowerCase()
 532    // instead in the assignment below.
 533    ].forEach(function (name) {
 534      properties[name] = new PropertyInfoRecord(name, OVERLOADED_BOOLEAN, false, // mustUseProperty
 535      name, // attributeName
 536      null, // attributeNamespace
 537      false, // sanitizeURL
 538      false);
 539    }); // These are HTML attributes that must be positive numbers.
 540  
 541    ['cols', 'rows', 'size', 'span' // NOTE: if you add a camelCased prop to this list,
 542    // you'll need to set attributeName to name.toLowerCase()
 543    // instead in the assignment below.
 544    ].forEach(function (name) {
 545      properties[name] = new PropertyInfoRecord(name, POSITIVE_NUMERIC, false, // mustUseProperty
 546      name, // attributeName
 547      null, // attributeNamespace
 548      false, // sanitizeURL
 549      false);
 550    }); // These are HTML attributes that must be numbers.
 551  
 552    ['rowSpan', 'start'].forEach(function (name) {
 553      properties[name] = new PropertyInfoRecord(name, NUMERIC, false, // mustUseProperty
 554      name.toLowerCase(), // attributeName
 555      null, // attributeNamespace
 556      false, // sanitizeURL
 557      false);
 558    });
 559    var CAMELIZE = /[\-\:]([a-z])/g;
 560  
 561    var capitalize = function (token) {
 562      return token[1].toUpperCase();
 563    }; // This is a list of all SVG attributes that need special casing, namespacing,
 564    // or boolean value assignment. Regular attributes that just accept strings
 565    // and have the same names are omitted, just like in the HTML attribute filter.
 566    // Some of these attributes can be hard to find. This list was created by
 567    // scraping the MDN documentation.
 568  
 569  
 570    ['accent-height', 'alignment-baseline', 'arabic-form', 'baseline-shift', 'cap-height', 'clip-path', 'clip-rule', 'color-interpolation', 'color-interpolation-filters', 'color-profile', 'color-rendering', 'dominant-baseline', 'enable-background', 'fill-opacity', 'fill-rule', 'flood-color', 'flood-opacity', 'font-family', 'font-size', 'font-size-adjust', 'font-stretch', 'font-style', 'font-variant', 'font-weight', 'glyph-name', 'glyph-orientation-horizontal', 'glyph-orientation-vertical', 'horiz-adv-x', 'horiz-origin-x', 'image-rendering', 'letter-spacing', 'lighting-color', 'marker-end', 'marker-mid', 'marker-start', 'overline-position', 'overline-thickness', 'paint-order', 'panose-1', 'pointer-events', 'rendering-intent', 'shape-rendering', 'stop-color', 'stop-opacity', 'strikethrough-position', 'strikethrough-thickness', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'text-anchor', 'text-decoration', 'text-rendering', 'underline-position', 'underline-thickness', 'unicode-bidi', 'unicode-range', 'units-per-em', 'v-alphabetic', 'v-hanging', 'v-ideographic', 'v-mathematical', 'vector-effect', 'vert-adv-y', 'vert-origin-x', 'vert-origin-y', 'word-spacing', 'writing-mode', 'xmlns:xlink', 'x-height' // NOTE: if you add a camelCased prop to this list,
 571    // you'll need to set attributeName to name.toLowerCase()
 572    // instead in the assignment below.
 573    ].forEach(function (attributeName) {
 574      var name = attributeName.replace(CAMELIZE, capitalize);
 575      properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
 576      attributeName, null, // attributeNamespace
 577      false, // sanitizeURL
 578      false);
 579    }); // String SVG attributes with the xlink namespace.
 580  
 581    ['xlink:actuate', 'xlink:arcrole', 'xlink:role', 'xlink:show', 'xlink:title', 'xlink:type' // NOTE: if you add a camelCased prop to this list,
 582    // you'll need to set attributeName to name.toLowerCase()
 583    // instead in the assignment below.
 584    ].forEach(function (attributeName) {
 585      var name = attributeName.replace(CAMELIZE, capitalize);
 586      properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
 587      attributeName, 'http://www.w3.org/1999/xlink', false, // sanitizeURL
 588      false);
 589    }); // String SVG attributes with the xml namespace.
 590  
 591    ['xml:base', 'xml:lang', 'xml:space' // NOTE: if you add a camelCased prop to this list,
 592    // you'll need to set attributeName to name.toLowerCase()
 593    // instead in the assignment below.
 594    ].forEach(function (attributeName) {
 595      var name = attributeName.replace(CAMELIZE, capitalize);
 596      properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
 597      attributeName, 'http://www.w3.org/XML/1998/namespace', false, // sanitizeURL
 598      false);
 599    }); // These attribute exists both in HTML and SVG.
 600    // The attribute name is case-sensitive in SVG so we can't just use
 601    // the React name like we do for attributes that exist only in HTML.
 602  
 603    ['tabIndex', 'crossOrigin'].forEach(function (attributeName) {
 604      properties[attributeName] = new PropertyInfoRecord(attributeName, STRING, false, // mustUseProperty
 605      attributeName.toLowerCase(), // attributeName
 606      null, // attributeNamespace
 607      false, // sanitizeURL
 608      false);
 609    }); // These attributes accept URLs. These must not allow javascript: URLS.
 610    // These will also need to accept Trusted Types object in the future.
 611  
 612    var xlinkHref = 'xlinkHref';
 613    properties[xlinkHref] = new PropertyInfoRecord('xlinkHref', STRING, false, // mustUseProperty
 614    'xlink:href', 'http://www.w3.org/1999/xlink', true, // sanitizeURL
 615    false);
 616    ['src', 'href', 'action', 'formAction'].forEach(function (attributeName) {
 617      properties[attributeName] = new PropertyInfoRecord(attributeName, STRING, false, // mustUseProperty
 618      attributeName.toLowerCase(), // attributeName
 619      null, // attributeNamespace
 620      true, // sanitizeURL
 621      true);
 622    });
 623  
 624    // and any newline or tab are filtered out as if they're not part of the URL.
 625    // https://url.spec.whatwg.org/#url-parsing
 626    // Tab or newline are defined as \r\n\t:
 627    // https://infra.spec.whatwg.org/#ascii-tab-or-newline
 628    // A C0 control is a code point in the range \u0000 NULL to \u001F
 629    // INFORMATION SEPARATOR ONE, inclusive:
 630    // https://infra.spec.whatwg.org/#c0-control-or-space
 631  
 632    /* eslint-disable max-len */
 633  
 634    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;
 635    var didWarn = false;
 636  
 637    function sanitizeURL(url) {
 638      {
 639        if (!didWarn && isJavaScriptProtocol.test(url)) {
 640          didWarn = true;
 641  
 642          error('A future version of React will block javascript: URLs as a security precaution. ' + 'Use event handlers instead if you can. If you need to generate unsafe HTML try ' + 'using dangerouslySetInnerHTML instead. React was passed %s.', JSON.stringify(url));
 643        }
 644      }
 645    }
 646  
 647    /**
 648     * Get the value for a property on a node. Only used in DEV for SSR validation.
 649     * The "expected" argument is used as a hint of what the expected value is.
 650     * Some properties have multiple equivalent values.
 651     */
 652    function getValueForProperty(node, name, expected, propertyInfo) {
 653      {
 654        if (propertyInfo.mustUseProperty) {
 655          var propertyName = propertyInfo.propertyName;
 656          return node[propertyName];
 657        } else {
 658          // This check protects multiple uses of `expected`, which is why the
 659          // react-internal/safe-string-coercion rule is disabled in several spots
 660          // below.
 661          {
 662            checkAttributeStringCoercion(expected, name);
 663          }
 664  
 665          if ( propertyInfo.sanitizeURL) {
 666            // If we haven't fully disabled javascript: URLs, and if
 667            // the hydration is successful of a javascript: URL, we
 668            // still want to warn on the client.
 669            // eslint-disable-next-line react-internal/safe-string-coercion
 670            sanitizeURL('' + expected);
 671          }
 672  
 673          var attributeName = propertyInfo.attributeName;
 674          var stringValue = null;
 675  
 676          if (propertyInfo.type === OVERLOADED_BOOLEAN) {
 677            if (node.hasAttribute(attributeName)) {
 678              var value = node.getAttribute(attributeName);
 679  
 680              if (value === '') {
 681                return true;
 682              }
 683  
 684              if (shouldRemoveAttribute(name, expected, propertyInfo, false)) {
 685                return value;
 686              } // eslint-disable-next-line react-internal/safe-string-coercion
 687  
 688  
 689              if (value === '' + expected) {
 690                return expected;
 691              }
 692  
 693              return value;
 694            }
 695          } else if (node.hasAttribute(attributeName)) {
 696            if (shouldRemoveAttribute(name, expected, propertyInfo, false)) {
 697              // We had an attribute but shouldn't have had one, so read it
 698              // for the error message.
 699              return node.getAttribute(attributeName);
 700            }
 701  
 702            if (propertyInfo.type === BOOLEAN) {
 703              // If this was a boolean, it doesn't matter what the value is
 704              // the fact that we have it is the same as the expected.
 705              return expected;
 706            } // Even if this property uses a namespace we use getAttribute
 707            // because we assume its namespaced name is the same as our config.
 708            // To use getAttributeNS we need the local name which we don't have
 709            // in our config atm.
 710  
 711  
 712            stringValue = node.getAttribute(attributeName);
 713          }
 714  
 715          if (shouldRemoveAttribute(name, expected, propertyInfo, false)) {
 716            return stringValue === null ? expected : stringValue; // eslint-disable-next-line react-internal/safe-string-coercion
 717          } else if (stringValue === '' + expected) {
 718            return expected;
 719          } else {
 720            return stringValue;
 721          }
 722        }
 723      }
 724    }
 725    /**
 726     * Get the value for a attribute on a node. Only used in DEV for SSR validation.
 727     * The third argument is used as a hint of what the expected value is. Some
 728     * attributes have multiple equivalent values.
 729     */
 730  
 731    function getValueForAttribute(node, name, expected, isCustomComponentTag) {
 732      {
 733        if (!isAttributeNameSafe(name)) {
 734          return;
 735        }
 736  
 737        if (!node.hasAttribute(name)) {
 738          return expected === undefined ? undefined : null;
 739        }
 740  
 741        var value = node.getAttribute(name);
 742  
 743        {
 744          checkAttributeStringCoercion(expected, name);
 745        }
 746  
 747        if (value === '' + expected) {
 748          return expected;
 749        }
 750  
 751        return value;
 752      }
 753    }
 754    /**
 755     * Sets the value for a property on a node.
 756     *
 757     * @param {DOMElement} node
 758     * @param {string} name
 759     * @param {*} value
 760     */
 761  
 762    function setValueForProperty(node, name, value, isCustomComponentTag) {
 763      var propertyInfo = getPropertyInfo(name);
 764  
 765      if (shouldIgnoreAttribute(name, propertyInfo, isCustomComponentTag)) {
 766        return;
 767      }
 768  
 769      if (shouldRemoveAttribute(name, value, propertyInfo, isCustomComponentTag)) {
 770        value = null;
 771      }
 772  
 773  
 774      if (isCustomComponentTag || propertyInfo === null) {
 775        if (isAttributeNameSafe(name)) {
 776          var _attributeName = name;
 777  
 778          if (value === null) {
 779            node.removeAttribute(_attributeName);
 780          } else {
 781            {
 782              checkAttributeStringCoercion(value, name);
 783            }
 784  
 785            node.setAttribute(_attributeName,  '' + value);
 786          }
 787        }
 788  
 789        return;
 790      }
 791  
 792      var mustUseProperty = propertyInfo.mustUseProperty;
 793  
 794      if (mustUseProperty) {
 795        var propertyName = propertyInfo.propertyName;
 796  
 797        if (value === null) {
 798          var type = propertyInfo.type;
 799          node[propertyName] = type === BOOLEAN ? false : '';
 800        } else {
 801          // Contrary to `setAttribute`, object properties are properly
 802          // `toString`ed by IE8/9.
 803          node[propertyName] = value;
 804        }
 805  
 806        return;
 807      } // The rest are treated as attributes with special cases.
 808  
 809  
 810      var attributeName = propertyInfo.attributeName,
 811          attributeNamespace = propertyInfo.attributeNamespace;
 812  
 813      if (value === null) {
 814        node.removeAttribute(attributeName);
 815      } else {
 816        var _type = propertyInfo.type;
 817        var attributeValue;
 818  
 819        if (_type === BOOLEAN || _type === OVERLOADED_BOOLEAN && value === true) {
 820          // If attribute type is boolean, we know for sure it won't be an execution sink
 821          // and we won't require Trusted Type here.
 822          attributeValue = '';
 823        } else {
 824          // `setAttribute` with objects becomes only `[object]` in IE8/9,
 825          // ('' + value) makes it output the correct toString()-value.
 826          {
 827            {
 828              checkAttributeStringCoercion(value, attributeName);
 829            }
 830  
 831            attributeValue = '' + value;
 832          }
 833  
 834          if (propertyInfo.sanitizeURL) {
 835            sanitizeURL(attributeValue.toString());
 836          }
 837        }
 838  
 839        if (attributeNamespace) {
 840          node.setAttributeNS(attributeNamespace, attributeName, attributeValue);
 841        } else {
 842          node.setAttribute(attributeName, attributeValue);
 843        }
 844      }
 845    }
 846  
 847    // ATTENTION
 848    // When adding new symbols to this file,
 849    // Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
 850    // The Symbol used to tag the ReactElement-like types.
 851    var REACT_ELEMENT_TYPE = Symbol.for('react.element');
 852    var REACT_PORTAL_TYPE = Symbol.for('react.portal');
 853    var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
 854    var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode');
 855    var REACT_PROFILER_TYPE = Symbol.for('react.profiler');
 856    var REACT_PROVIDER_TYPE = Symbol.for('react.provider');
 857    var REACT_CONTEXT_TYPE = Symbol.for('react.context');
 858    var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref');
 859    var REACT_SUSPENSE_TYPE = Symbol.for('react.suspense');
 860    var REACT_SUSPENSE_LIST_TYPE = Symbol.for('react.suspense_list');
 861    var REACT_MEMO_TYPE = Symbol.for('react.memo');
 862    var REACT_LAZY_TYPE = Symbol.for('react.lazy');
 863    var REACT_SCOPE_TYPE = Symbol.for('react.scope');
 864    var REACT_DEBUG_TRACING_MODE_TYPE = Symbol.for('react.debug_trace_mode');
 865    var REACT_OFFSCREEN_TYPE = Symbol.for('react.offscreen');
 866    var REACT_LEGACY_HIDDEN_TYPE = Symbol.for('react.legacy_hidden');
 867    var REACT_CACHE_TYPE = Symbol.for('react.cache');
 868    var REACT_TRACING_MARKER_TYPE = Symbol.for('react.tracing_marker');
 869    var MAYBE_ITERATOR_SYMBOL = Symbol.iterator;
 870    var FAUX_ITERATOR_SYMBOL = '@@iterator';
 871    function getIteratorFn(maybeIterable) {
 872      if (maybeIterable === null || typeof maybeIterable !== 'object') {
 873        return null;
 874      }
 875  
 876      var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
 877  
 878      if (typeof maybeIterator === 'function') {
 879        return maybeIterator;
 880      }
 881  
 882      return null;
 883    }
 884  
 885    var assign = Object.assign;
 886  
 887    // Helpers to patch console.logs to avoid logging during side-effect free
 888    // replaying on render function. This currently only patches the object
 889    // lazily which won't cover if the log function was extracted eagerly.
 890    // We could also eagerly patch the method.
 891    var disabledDepth = 0;
 892    var prevLog;
 893    var prevInfo;
 894    var prevWarn;
 895    var prevError;
 896    var prevGroup;
 897    var prevGroupCollapsed;
 898    var prevGroupEnd;
 899  
 900    function disabledLog() {}
 901  
 902    disabledLog.__reactDisabledLog = true;
 903    function disableLogs() {
 904      {
 905        if (disabledDepth === 0) {
 906          /* eslint-disable react-internal/no-production-logging */
 907          prevLog = console.log;
 908          prevInfo = console.info;
 909          prevWarn = console.warn;
 910          prevError = console.error;
 911          prevGroup = console.group;
 912          prevGroupCollapsed = console.groupCollapsed;
 913          prevGroupEnd = console.groupEnd; // https://github.com/facebook/react/issues/19099
 914  
 915          var props = {
 916            configurable: true,
 917            enumerable: true,
 918            value: disabledLog,
 919            writable: true
 920          }; // $FlowFixMe Flow thinks console is immutable.
 921  
 922          Object.defineProperties(console, {
 923            info: props,
 924            log: props,
 925            warn: props,
 926            error: props,
 927            group: props,
 928            groupCollapsed: props,
 929            groupEnd: props
 930          });
 931          /* eslint-enable react-internal/no-production-logging */
 932        }
 933  
 934        disabledDepth++;
 935      }
 936    }
 937    function reenableLogs() {
 938      {
 939        disabledDepth--;
 940  
 941        if (disabledDepth === 0) {
 942          /* eslint-disable react-internal/no-production-logging */
 943          var props = {
 944            configurable: true,
 945            enumerable: true,
 946            writable: true
 947          }; // $FlowFixMe Flow thinks console is immutable.
 948  
 949          Object.defineProperties(console, {
 950            log: assign({}, props, {
 951              value: prevLog
 952            }),
 953            info: assign({}, props, {
 954              value: prevInfo
 955            }),
 956            warn: assign({}, props, {
 957              value: prevWarn
 958            }),
 959            error: assign({}, props, {
 960              value: prevError
 961            }),
 962            group: assign({}, props, {
 963              value: prevGroup
 964            }),
 965            groupCollapsed: assign({}, props, {
 966              value: prevGroupCollapsed
 967            }),
 968            groupEnd: assign({}, props, {
 969              value: prevGroupEnd
 970            })
 971          });
 972          /* eslint-enable react-internal/no-production-logging */
 973        }
 974  
 975        if (disabledDepth < 0) {
 976          error('disabledDepth fell below zero. ' + 'This is a bug in React. Please file an issue.');
 977        }
 978      }
 979    }
 980  
 981    var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
 982    var prefix;
 983    function describeBuiltInComponentFrame(name, source, ownerFn) {
 984      {
 985        if (prefix === undefined) {
 986          // Extract the VM specific prefix used by each line.
 987          try {
 988            throw Error();
 989          } catch (x) {
 990            var match = x.stack.trim().match(/\n( *(at )?)/);
 991            prefix = match && match[1] || '';
 992          }
 993        } // We use the prefix to ensure our stacks line up with native stack frames.
 994  
 995  
 996        return '\n' + prefix + name;
 997      }
 998    }
 999    var reentry = false;
1000    var componentFrameCache;
1001  
1002    {
1003      var PossiblyWeakMap = typeof WeakMap === 'function' ? WeakMap : Map;
1004      componentFrameCache = new PossiblyWeakMap();
1005    }
1006  
1007    function describeNativeComponentFrame(fn, construct) {
1008      // If something asked for a stack inside a fake render, it should get ignored.
1009      if ( !fn || reentry) {
1010        return '';
1011      }
1012  
1013      {
1014        var frame = componentFrameCache.get(fn);
1015  
1016        if (frame !== undefined) {
1017          return frame;
1018        }
1019      }
1020  
1021      var control;
1022      reentry = true;
1023      var previousPrepareStackTrace = Error.prepareStackTrace; // $FlowFixMe It does accept undefined.
1024  
1025      Error.prepareStackTrace = undefined;
1026      var previousDispatcher;
1027  
1028      {
1029        previousDispatcher = ReactCurrentDispatcher.current; // Set the dispatcher in DEV because this might be call in the render function
1030        // for warnings.
1031  
1032        ReactCurrentDispatcher.current = null;
1033        disableLogs();
1034      }
1035  
1036      try {
1037        // This should throw.
1038        if (construct) {
1039          // Something should be setting the props in the constructor.
1040          var Fake = function () {
1041            throw Error();
1042          }; // $FlowFixMe
1043  
1044  
1045          Object.defineProperty(Fake.prototype, 'props', {
1046            set: function () {
1047              // We use a throwing setter instead of frozen or non-writable props
1048              // because that won't throw in a non-strict mode function.
1049              throw Error();
1050            }
1051          });
1052  
1053          if (typeof Reflect === 'object' && Reflect.construct) {
1054            // We construct a different control for this case to include any extra
1055            // frames added by the construct call.
1056            try {
1057              Reflect.construct(Fake, []);
1058            } catch (x) {
1059              control = x;
1060            }
1061  
1062            Reflect.construct(fn, [], Fake);
1063          } else {
1064            try {
1065              Fake.call();
1066            } catch (x) {
1067              control = x;
1068            }
1069  
1070            fn.call(Fake.prototype);
1071          }
1072        } else {
1073          try {
1074            throw Error();
1075          } catch (x) {
1076            control = x;
1077          }
1078  
1079          fn();
1080        }
1081      } catch (sample) {
1082        // This is inlined manually because closure doesn't do it for us.
1083        if (sample && control && typeof sample.stack === 'string') {
1084          // This extracts the first frame from the sample that isn't also in the control.
1085          // Skipping one frame that we assume is the frame that calls the two.
1086          var sampleLines = sample.stack.split('\n');
1087          var controlLines = control.stack.split('\n');
1088          var s = sampleLines.length - 1;
1089          var c = controlLines.length - 1;
1090  
1091          while (s >= 1 && c >= 0 && sampleLines[s] !== controlLines[c]) {
1092            // We expect at least one stack frame to be shared.
1093            // Typically this will be the root most one. However, stack frames may be
1094            // cut off due to maximum stack limits. In this case, one maybe cut off
1095            // earlier than the other. We assume that the sample is longer or the same
1096            // and there for cut off earlier. So we should find the root most frame in
1097            // the sample somewhere in the control.
1098            c--;
1099          }
1100  
1101          for (; s >= 1 && c >= 0; s--, c--) {
1102            // Next we find the first one that isn't the same which should be the
1103            // frame that called our sample function and the control.
1104            if (sampleLines[s] !== controlLines[c]) {
1105              // In V8, the first line is describing the message but other VMs don't.
1106              // If we're about to return the first line, and the control is also on the same
1107              // line, that's a pretty good indicator that our sample threw at same line as
1108              // the control. I.e. before we entered the sample frame. So we ignore this result.
1109              // This can happen if you passed a class to function component, or non-function.
1110              if (s !== 1 || c !== 1) {
1111                do {
1112                  s--;
1113                  c--; // We may still have similar intermediate frames from the construct call.
1114                  // The next one that isn't the same should be our match though.
1115  
1116                  if (c < 0 || sampleLines[s] !== controlLines[c]) {
1117                    // V8 adds a "new" prefix for native classes. Let's remove it to make it prettier.
1118                    var _frame = '\n' + sampleLines[s].replace(' at new ', ' at '); // If our component frame is labeled "<anonymous>"
1119                    // but we have a user-provided "displayName"
1120                    // splice it in to make the stack more readable.
1121  
1122  
1123                    if (fn.displayName && _frame.includes('<anonymous>')) {
1124                      _frame = _frame.replace('<anonymous>', fn.displayName);
1125                    }
1126  
1127                    {
1128                      if (typeof fn === 'function') {
1129                        componentFrameCache.set(fn, _frame);
1130                      }
1131                    } // Return the line we found.
1132  
1133  
1134                    return _frame;
1135                  }
1136                } while (s >= 1 && c >= 0);
1137              }
1138  
1139              break;
1140            }
1141          }
1142        }
1143      } finally {
1144        reentry = false;
1145  
1146        {
1147          ReactCurrentDispatcher.current = previousDispatcher;
1148          reenableLogs();
1149        }
1150  
1151        Error.prepareStackTrace = previousPrepareStackTrace;
1152      } // Fallback to just using the name if we couldn't make it throw.
1153  
1154  
1155      var name = fn ? fn.displayName || fn.name : '';
1156      var syntheticFrame = name ? describeBuiltInComponentFrame(name) : '';
1157  
1158      {
1159        if (typeof fn === 'function') {
1160          componentFrameCache.set(fn, syntheticFrame);
1161        }
1162      }
1163  
1164      return syntheticFrame;
1165    }
1166  
1167    function describeClassComponentFrame(ctor, source, ownerFn) {
1168      {
1169        return describeNativeComponentFrame(ctor, true);
1170      }
1171    }
1172    function describeFunctionComponentFrame(fn, source, ownerFn) {
1173      {
1174        return describeNativeComponentFrame(fn, false);
1175      }
1176    }
1177  
1178    function shouldConstruct(Component) {
1179      var prototype = Component.prototype;
1180      return !!(prototype && prototype.isReactComponent);
1181    }
1182  
1183    function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) {
1184  
1185      if (type == null) {
1186        return '';
1187      }
1188  
1189      if (typeof type === 'function') {
1190        {
1191          return describeNativeComponentFrame(type, shouldConstruct(type));
1192        }
1193      }
1194  
1195      if (typeof type === 'string') {
1196        return describeBuiltInComponentFrame(type);
1197      }
1198  
1199      switch (type) {
1200        case REACT_SUSPENSE_TYPE:
1201          return describeBuiltInComponentFrame('Suspense');
1202  
1203        case REACT_SUSPENSE_LIST_TYPE:
1204          return describeBuiltInComponentFrame('SuspenseList');
1205      }
1206  
1207      if (typeof type === 'object') {
1208        switch (type.$$typeof) {
1209          case REACT_FORWARD_REF_TYPE:
1210            return describeFunctionComponentFrame(type.render);
1211  
1212          case REACT_MEMO_TYPE:
1213            // Memo may contain any component type so we recursively resolve it.
1214            return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn);
1215  
1216          case REACT_LAZY_TYPE:
1217            {
1218              var lazyComponent = type;
1219              var payload = lazyComponent._payload;
1220              var init = lazyComponent._init;
1221  
1222              try {
1223                // Lazy may contain any component type so we recursively resolve it.
1224                return describeUnknownElementTypeFrameInDEV(init(payload), source, ownerFn);
1225              } catch (x) {}
1226            }
1227        }
1228      }
1229  
1230      return '';
1231    }
1232  
1233    function describeFiber(fiber) {
1234      var owner =  fiber._debugOwner ? fiber._debugOwner.type : null ;
1235      var source =  fiber._debugSource ;
1236  
1237      switch (fiber.tag) {
1238        case HostComponent:
1239          return describeBuiltInComponentFrame(fiber.type);
1240  
1241        case LazyComponent:
1242          return describeBuiltInComponentFrame('Lazy');
1243  
1244        case SuspenseComponent:
1245          return describeBuiltInComponentFrame('Suspense');
1246  
1247        case SuspenseListComponent:
1248          return describeBuiltInComponentFrame('SuspenseList');
1249  
1250        case FunctionComponent:
1251        case IndeterminateComponent:
1252        case SimpleMemoComponent:
1253          return describeFunctionComponentFrame(fiber.type);
1254  
1255        case ForwardRef:
1256          return describeFunctionComponentFrame(fiber.type.render);
1257  
1258        case ClassComponent:
1259          return describeClassComponentFrame(fiber.type);
1260  
1261        default:
1262          return '';
1263      }
1264    }
1265  
1266    function getStackByFiberInDevAndProd(workInProgress) {
1267      try {
1268        var info = '';
1269        var node = workInProgress;
1270  
1271        do {
1272          info += describeFiber(node);
1273          node = node.return;
1274        } while (node);
1275  
1276        return info;
1277      } catch (x) {
1278        return '\nError generating stack: ' + x.message + '\n' + x.stack;
1279      }
1280    }
1281  
1282    function getWrappedName(outerType, innerType, wrapperName) {
1283      var displayName = outerType.displayName;
1284  
1285      if (displayName) {
1286        return displayName;
1287      }
1288  
1289      var functionName = innerType.displayName || innerType.name || '';
1290      return functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName;
1291    } // Keep in sync with react-reconciler/getComponentNameFromFiber
1292  
1293  
1294    function getContextName(type) {
1295      return type.displayName || 'Context';
1296    } // Note that the reconciler package should generally prefer to use getComponentNameFromFiber() instead.
1297  
1298  
1299    function getComponentNameFromType(type) {
1300      if (type == null) {
1301        // Host root, text node or just invalid type.
1302        return null;
1303      }
1304  
1305      {
1306        if (typeof type.tag === 'number') {
1307          error('Received an unexpected object in getComponentNameFromType(). ' + 'This is likely a bug in React. Please file an issue.');
1308        }
1309      }
1310  
1311      if (typeof type === 'function') {
1312        return type.displayName || type.name || null;
1313      }
1314  
1315      if (typeof type === 'string') {
1316        return type;
1317      }
1318  
1319      switch (type) {
1320        case REACT_FRAGMENT_TYPE:
1321          return 'Fragment';
1322  
1323        case REACT_PORTAL_TYPE:
1324          return 'Portal';
1325  
1326        case REACT_PROFILER_TYPE:
1327          return 'Profiler';
1328  
1329        case REACT_STRICT_MODE_TYPE:
1330          return 'StrictMode';
1331  
1332        case REACT_SUSPENSE_TYPE:
1333          return 'Suspense';
1334  
1335        case REACT_SUSPENSE_LIST_TYPE:
1336          return 'SuspenseList';
1337  
1338      }
1339  
1340      if (typeof type === 'object') {
1341        switch (type.$$typeof) {
1342          case REACT_CONTEXT_TYPE:
1343            var context = type;
1344            return getContextName(context) + '.Consumer';
1345  
1346          case REACT_PROVIDER_TYPE:
1347            var provider = type;
1348            return getContextName(provider._context) + '.Provider';
1349  
1350          case REACT_FORWARD_REF_TYPE:
1351            return getWrappedName(type, type.render, 'ForwardRef');
1352  
1353          case REACT_MEMO_TYPE:
1354            var outerName = type.displayName || null;
1355  
1356            if (outerName !== null) {
1357              return outerName;
1358            }
1359  
1360            return getComponentNameFromType(type.type) || 'Memo';
1361  
1362          case REACT_LAZY_TYPE:
1363            {
1364              var lazyComponent = type;
1365              var payload = lazyComponent._payload;
1366              var init = lazyComponent._init;
1367  
1368              try {
1369                return getComponentNameFromType(init(payload));
1370              } catch (x) {
1371                return null;
1372              }
1373            }
1374  
1375          // eslint-disable-next-line no-fallthrough
1376        }
1377      }
1378  
1379      return null;
1380    }
1381  
1382    function getWrappedName$1(outerType, innerType, wrapperName) {
1383      var functionName = innerType.displayName || innerType.name || '';
1384      return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
1385    } // Keep in sync with shared/getComponentNameFromType
1386  
1387  
1388    function getContextName$1(type) {
1389      return type.displayName || 'Context';
1390    }
1391  
1392    function getComponentNameFromFiber(fiber) {
1393      var tag = fiber.tag,
1394          type = fiber.type;
1395  
1396      switch (tag) {
1397        case CacheComponent:
1398          return 'Cache';
1399  
1400        case ContextConsumer:
1401          var context = type;
1402          return getContextName$1(context) + '.Consumer';
1403  
1404        case ContextProvider:
1405          var provider = type;
1406          return getContextName$1(provider._context) + '.Provider';
1407  
1408        case DehydratedFragment:
1409          return 'DehydratedFragment';
1410  
1411        case ForwardRef:
1412          return getWrappedName$1(type, type.render, 'ForwardRef');
1413  
1414        case Fragment:
1415          return 'Fragment';
1416  
1417        case HostComponent:
1418          // Host component type is the display name (e.g. "div", "View")
1419          return type;
1420  
1421        case HostPortal:
1422          return 'Portal';
1423  
1424        case HostRoot:
1425          return 'Root';
1426  
1427        case HostText:
1428          return 'Text';
1429  
1430        case LazyComponent:
1431          // Name comes from the type in this case; we don't have a tag.
1432          return getComponentNameFromType(type);
1433  
1434        case Mode:
1435          if (type === REACT_STRICT_MODE_TYPE) {
1436            // Don't be less specific than shared/getComponentNameFromType
1437            return 'StrictMode';
1438          }
1439  
1440          return 'Mode';
1441  
1442        case OffscreenComponent:
1443          return 'Offscreen';
1444  
1445        case Profiler:
1446          return 'Profiler';
1447  
1448        case ScopeComponent:
1449          return 'Scope';
1450  
1451        case SuspenseComponent:
1452          return 'Suspense';
1453  
1454        case SuspenseListComponent:
1455          return 'SuspenseList';
1456  
1457        case TracingMarkerComponent:
1458          return 'TracingMarker';
1459        // The display name for this tags come from the user-provided type:
1460  
1461        case ClassComponent:
1462        case FunctionComponent:
1463        case IncompleteClassComponent:
1464        case IndeterminateComponent:
1465        case MemoComponent:
1466        case SimpleMemoComponent:
1467          if (typeof type === 'function') {
1468            return type.displayName || type.name || null;
1469          }
1470  
1471          if (typeof type === 'string') {
1472            return type;
1473          }
1474  
1475          break;
1476  
1477      }
1478  
1479      return null;
1480    }
1481  
1482    var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
1483    var current = null;
1484    var isRendering = false;
1485    function getCurrentFiberOwnerNameInDevOrNull() {
1486      {
1487        if (current === null) {
1488          return null;
1489        }
1490  
1491        var owner = current._debugOwner;
1492  
1493        if (owner !== null && typeof owner !== 'undefined') {
1494          return getComponentNameFromFiber(owner);
1495        }
1496      }
1497  
1498      return null;
1499    }
1500  
1501    function getCurrentFiberStackInDev() {
1502      {
1503        if (current === null) {
1504          return '';
1505        } // Safe because if current fiber exists, we are reconciling,
1506        // and it is guaranteed to be the work-in-progress version.
1507  
1508  
1509        return getStackByFiberInDevAndProd(current);
1510      }
1511    }
1512  
1513    function resetCurrentFiber() {
1514      {
1515        ReactDebugCurrentFrame.getCurrentStack = null;
1516        current = null;
1517        isRendering = false;
1518      }
1519    }
1520    function setCurrentFiber(fiber) {
1521      {
1522        ReactDebugCurrentFrame.getCurrentStack = fiber === null ? null : getCurrentFiberStackInDev;
1523        current = fiber;
1524        isRendering = false;
1525      }
1526    }
1527    function getCurrentFiber() {
1528      {
1529        return current;
1530      }
1531    }
1532    function setIsRendering(rendering) {
1533      {
1534        isRendering = rendering;
1535      }
1536    }
1537  
1538    // Flow does not allow string concatenation of most non-string types. To work
1539    // around this limitation, we use an opaque type that can only be obtained by
1540    // passing the value through getToStringValue first.
1541    function toString(value) {
1542      // The coercion safety check is performed in getToStringValue().
1543      // eslint-disable-next-line react-internal/safe-string-coercion
1544      return '' + value;
1545    }
1546    function getToStringValue(value) {
1547      switch (typeof value) {
1548        case 'boolean':
1549        case 'number':
1550        case 'string':
1551        case 'undefined':
1552          return value;
1553  
1554        case 'object':
1555          {
1556            checkFormFieldValueStringCoercion(value);
1557          }
1558  
1559          return value;
1560  
1561        default:
1562          // function, symbol are assigned as empty strings
1563          return '';
1564      }
1565    }
1566  
1567    var hasReadOnlyValue = {
1568      button: true,
1569      checkbox: true,
1570      image: true,
1571      hidden: true,
1572      radio: true,
1573      reset: true,
1574      submit: true
1575    };
1576    function checkControlledValueProps(tagName, props) {
1577      {
1578        if (!(hasReadOnlyValue[props.type] || props.onChange || props.onInput || props.readOnly || props.disabled || props.value == null)) {
1579          error('You provided a `value` prop to a form field without an ' + '`onChange` handler. This will render a read-only field. If ' + 'the field should be mutable use `defaultValue`. Otherwise, ' + 'set either `onChange` or `readOnly`.');
1580        }
1581  
1582        if (!(props.onChange || props.readOnly || props.disabled || props.checked == null)) {
1583          error('You provided a `checked` prop to a form field without an ' + '`onChange` handler. This will render a read-only field. If ' + 'the field should be mutable use `defaultChecked`. Otherwise, ' + 'set either `onChange` or `readOnly`.');
1584        }
1585      }
1586    }
1587  
1588    function isCheckable(elem) {
1589      var type = elem.type;
1590      var nodeName = elem.nodeName;
1591      return nodeName && nodeName.toLowerCase() === 'input' && (type === 'checkbox' || type === 'radio');
1592    }
1593  
1594    function getTracker(node) {
1595      return node._valueTracker;
1596    }
1597  
1598    function detachTracker(node) {
1599      node._valueTracker = null;
1600    }
1601  
1602    function getValueFromNode(node) {
1603      var value = '';
1604  
1605      if (!node) {
1606        return value;
1607      }
1608  
1609      if (isCheckable(node)) {
1610        value = node.checked ? 'true' : 'false';
1611      } else {
1612        value = node.value;
1613      }
1614  
1615      return value;
1616    }
1617  
1618    function trackValueOnNode(node) {
1619      var valueField = isCheckable(node) ? 'checked' : 'value';
1620      var descriptor = Object.getOwnPropertyDescriptor(node.constructor.prototype, valueField);
1621  
1622      {
1623        checkFormFieldValueStringCoercion(node[valueField]);
1624      }
1625  
1626      var currentValue = '' + node[valueField]; // if someone has already defined a value or Safari, then bail
1627      // and don't track value will cause over reporting of changes,
1628      // but it's better then a hard failure
1629      // (needed for certain tests that spyOn input values and Safari)
1630  
1631      if (node.hasOwnProperty(valueField) || typeof descriptor === 'undefined' || typeof descriptor.get !== 'function' || typeof descriptor.set !== 'function') {
1632        return;
1633      }
1634  
1635      var get = descriptor.get,
1636          set = descriptor.set;
1637      Object.defineProperty(node, valueField, {
1638        configurable: true,
1639        get: function () {
1640          return get.call(this);
1641        },
1642        set: function (value) {
1643          {
1644            checkFormFieldValueStringCoercion(value);
1645          }
1646  
1647          currentValue = '' + value;
1648          set.call(this, value);
1649        }
1650      }); // We could've passed this the first time
1651      // but it triggers a bug in IE11 and Edge 14/15.
1652      // Calling defineProperty() again should be equivalent.
1653      // https://github.com/facebook/react/issues/11768
1654  
1655      Object.defineProperty(node, valueField, {
1656        enumerable: descriptor.enumerable
1657      });
1658      var tracker = {
1659        getValue: function () {
1660          return currentValue;
1661        },
1662        setValue: function (value) {
1663          {
1664            checkFormFieldValueStringCoercion(value);
1665          }
1666  
1667          currentValue = '' + value;
1668        },
1669        stopTracking: function () {
1670          detachTracker(node);
1671          delete node[valueField];
1672        }
1673      };
1674      return tracker;
1675    }
1676  
1677    function track(node) {
1678      if (getTracker(node)) {
1679        return;
1680      } // TODO: Once it's just Fiber we can move this to node._wrapperState
1681  
1682  
1683      node._valueTracker = trackValueOnNode(node);
1684    }
1685    function updateValueIfChanged(node) {
1686      if (!node) {
1687        return false;
1688      }
1689  
1690      var tracker = getTracker(node); // if there is no tracker at this point it's unlikely
1691      // that trying again will succeed
1692  
1693      if (!tracker) {
1694        return true;
1695      }
1696  
1697      var lastValue = tracker.getValue();
1698      var nextValue = getValueFromNode(node);
1699  
1700      if (nextValue !== lastValue) {
1701        tracker.setValue(nextValue);
1702        return true;
1703      }
1704  
1705      return false;
1706    }
1707  
1708    function getActiveElement(doc) {
1709      doc = doc || (typeof document !== 'undefined' ? document : undefined);
1710  
1711      if (typeof doc === 'undefined') {
1712        return null;
1713      }
1714  
1715      try {
1716        return doc.activeElement || doc.body;
1717      } catch (e) {
1718        return doc.body;
1719      }
1720    }
1721  
1722    var didWarnValueDefaultValue = false;
1723    var didWarnCheckedDefaultChecked = false;
1724    var didWarnControlledToUncontrolled = false;
1725    var didWarnUncontrolledToControlled = false;
1726  
1727    function isControlled(props) {
1728      var usesChecked = props.type === 'checkbox' || props.type === 'radio';
1729      return usesChecked ? props.checked != null : props.value != null;
1730    }
1731    /**
1732     * Implements an <input> host component that allows setting these optional
1733     * props: `checked`, `value`, `defaultChecked`, and `defaultValue`.
1734     *
1735     * If `checked` or `value` are not supplied (or null/undefined), user actions
1736     * that affect the checked state or value will trigger updates to the element.
1737     *
1738     * If they are supplied (and not null/undefined), the rendered element will not
1739     * trigger updates to the element. Instead, the props must change in order for
1740     * the rendered element to be updated.
1741     *
1742     * The rendered element will be initialized as unchecked (or `defaultChecked`)
1743     * with an empty value (or `defaultValue`).
1744     *
1745     * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
1746     */
1747  
1748  
1749    function getHostProps(element, props) {
1750      var node = element;
1751      var checked = props.checked;
1752      var hostProps = assign({}, props, {
1753        defaultChecked: undefined,
1754        defaultValue: undefined,
1755        value: undefined,
1756        checked: checked != null ? checked : node._wrapperState.initialChecked
1757      });
1758      return hostProps;
1759    }
1760    function initWrapperState(element, props) {
1761      {
1762        checkControlledValueProps('input', props);
1763  
1764        if (props.checked !== undefined && props.defaultChecked !== undefined && !didWarnCheckedDefaultChecked) {
1765          error('%s contains an input of type %s with both checked and defaultChecked props. ' + 'Input elements must be either controlled or uncontrolled ' + '(specify either the checked prop, or the defaultChecked prop, but not ' + 'both). Decide between using a controlled or uncontrolled input ' + 'element and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components', getCurrentFiberOwnerNameInDevOrNull() || 'A component', props.type);
1766  
1767          didWarnCheckedDefaultChecked = true;
1768        }
1769  
1770        if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue) {
1771          error('%s contains an input of type %s with both value and defaultValue props. ' + 'Input elements must be either controlled or uncontrolled ' + '(specify either the value prop, or the defaultValue prop, but not ' + 'both). Decide between using a controlled or uncontrolled input ' + 'element and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components', getCurrentFiberOwnerNameInDevOrNull() || 'A component', props.type);
1772  
1773          didWarnValueDefaultValue = true;
1774        }
1775      }
1776  
1777      var node = element;
1778      var defaultValue = props.defaultValue == null ? '' : props.defaultValue;
1779      node._wrapperState = {
1780        initialChecked: props.checked != null ? props.checked : props.defaultChecked,
1781        initialValue: getToStringValue(props.value != null ? props.value : defaultValue),
1782        controlled: isControlled(props)
1783      };
1784    }
1785    function updateChecked(element, props) {
1786      var node = element;
1787      var checked = props.checked;
1788  
1789      if (checked != null) {
1790        setValueForProperty(node, 'checked', checked, false);
1791      }
1792    }
1793    function updateWrapper(element, props) {
1794      var node = element;
1795  
1796      {
1797        var controlled = isControlled(props);
1798  
1799        if (!node._wrapperState.controlled && controlled && !didWarnUncontrolledToControlled) {
1800          error('A component is changing an uncontrolled input to be controlled. ' + 'This is likely caused by the value changing from undefined to ' + 'a defined value, which should not happen. ' + 'Decide between using a controlled or uncontrolled input ' + 'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components');
1801  
1802          didWarnUncontrolledToControlled = true;
1803        }
1804  
1805        if (node._wrapperState.controlled && !controlled && !didWarnControlledToUncontrolled) {
1806          error('A component is changing a controlled input to be uncontrolled. ' + 'This is likely caused by the value changing from a defined to ' + 'undefined, which should not happen. ' + 'Decide between using a controlled or uncontrolled input ' + 'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components');
1807  
1808          didWarnControlledToUncontrolled = true;
1809        }
1810      }
1811  
1812      updateChecked(element, props);
1813      var value = getToStringValue(props.value);
1814      var type = props.type;
1815  
1816      if (value != null) {
1817        if (type === 'number') {
1818          if (value === 0 && node.value === '' || // We explicitly want to coerce to number here if possible.
1819          // eslint-disable-next-line
1820          node.value != value) {
1821            node.value = toString(value);
1822          }
1823        } else if (node.value !== toString(value)) {
1824          node.value = toString(value);
1825        }
1826      } else if (type === 'submit' || type === 'reset') {
1827        // Submit/reset inputs need the attribute removed completely to avoid
1828        // blank-text buttons.
1829        node.removeAttribute('value');
1830        return;
1831      }
1832  
1833      {
1834        // When syncing the value attribute, the value comes from a cascade of
1835        // properties:
1836        //  1. The value React property
1837        //  2. The defaultValue React property
1838        //  3. Otherwise there should be no change
1839        if (props.hasOwnProperty('value')) {
1840          setDefaultValue(node, props.type, value);
1841        } else if (props.hasOwnProperty('defaultValue')) {
1842          setDefaultValue(node, props.type, getToStringValue(props.defaultValue));
1843        }
1844      }
1845  
1846      {
1847        // When syncing the checked attribute, it only changes when it needs
1848        // to be removed, such as transitioning from a checkbox into a text input
1849        if (props.checked == null && props.defaultChecked != null) {
1850          node.defaultChecked = !!props.defaultChecked;
1851        }
1852      }
1853    }
1854    function postMountWrapper(element, props, isHydrating) {
1855      var node = element; // Do not assign value if it is already set. This prevents user text input
1856      // from being lost during SSR hydration.
1857  
1858      if (props.hasOwnProperty('value') || props.hasOwnProperty('defaultValue')) {
1859        var type = props.type;
1860        var isButton = type === 'submit' || type === 'reset'; // Avoid setting value attribute on submit/reset inputs as it overrides the
1861        // default value provided by the browser. See: #12872
1862  
1863        if (isButton && (props.value === undefined || props.value === null)) {
1864          return;
1865        }
1866  
1867        var initialValue = toString(node._wrapperState.initialValue); // Do not assign value if it is already set. This prevents user text input
1868        // from being lost during SSR hydration.
1869  
1870        if (!isHydrating) {
1871          {
1872            // When syncing the value attribute, the value property should use
1873            // the wrapperState._initialValue property. This uses:
1874            //
1875            //   1. The value React property when present
1876            //   2. The defaultValue React property when present
1877            //   3. An empty string
1878            if (initialValue !== node.value) {
1879              node.value = initialValue;
1880            }
1881          }
1882        }
1883  
1884        {
1885          // Otherwise, the value attribute is synchronized to the property,
1886          // so we assign defaultValue to the same thing as the value property
1887          // assignment step above.
1888          node.defaultValue = initialValue;
1889        }
1890      } // Normally, we'd just do `node.checked = node.checked` upon initial mount, less this bug
1891      // this is needed to work around a chrome bug where setting defaultChecked
1892      // will sometimes influence the value of checked (even after detachment).
1893      // Reference: https://bugs.chromium.org/p/chromium/issues/detail?id=608416
1894      // We need to temporarily unset name to avoid disrupting radio button groups.
1895  
1896  
1897      var name = node.name;
1898  
1899      if (name !== '') {
1900        node.name = '';
1901      }
1902  
1903      {
1904        // When syncing the checked attribute, both the checked property and
1905        // attribute are assigned at the same time using defaultChecked. This uses:
1906        //
1907        //   1. The checked React property when present
1908        //   2. The defaultChecked React property when present
1909        //   3. Otherwise, false
1910        node.defaultChecked = !node.defaultChecked;
1911        node.defaultChecked = !!node._wrapperState.initialChecked;
1912      }
1913  
1914      if (name !== '') {
1915        node.name = name;
1916      }
1917    }
1918    function restoreControlledState(element, props) {
1919      var node = element;
1920      updateWrapper(node, props);
1921      updateNamedCousins(node, props);
1922    }
1923  
1924    function updateNamedCousins(rootNode, props) {
1925      var name = props.name;
1926  
1927      if (props.type === 'radio' && name != null) {
1928        var queryRoot = rootNode;
1929  
1930        while (queryRoot.parentNode) {
1931          queryRoot = queryRoot.parentNode;
1932        } // If `rootNode.form` was non-null, then we could try `form.elements`,
1933        // but that sometimes behaves strangely in IE8. We could also try using
1934        // `form.getElementsByName`, but that will only return direct children
1935        // and won't include inputs that use the HTML5 `form=` attribute. Since
1936        // the input might not even be in a form. It might not even be in the
1937        // document. Let's just use the local `querySelectorAll` to ensure we don't
1938        // miss anything.
1939  
1940  
1941        {
1942          checkAttributeStringCoercion(name, 'name');
1943        }
1944  
1945        var group = queryRoot.querySelectorAll('input[name=' + JSON.stringify('' + name) + '][type="radio"]');
1946  
1947        for (var i = 0; i < group.length; i++) {
1948          var otherNode = group[i];
1949  
1950          if (otherNode === rootNode || otherNode.form !== rootNode.form) {
1951            continue;
1952          } // This will throw if radio buttons rendered by different copies of React
1953          // and the same name are rendered into the same form (same as #1939).
1954          // That's probably okay; we don't support it just as we don't support
1955          // mixing React radio buttons with non-React ones.
1956  
1957  
1958          var otherProps = getFiberCurrentPropsFromNode(otherNode);
1959  
1960          if (!otherProps) {
1961            throw new Error('ReactDOMInput: Mixing React and non-React radio inputs with the ' + 'same `name` is not supported.');
1962          } // We need update the tracked value on the named cousin since the value
1963          // was changed but the input saw no event or value set
1964  
1965  
1966          updateValueIfChanged(otherNode); // If this is a controlled radio button group, forcing the input that
1967          // was previously checked to update will cause it to be come re-checked
1968          // as appropriate.
1969  
1970          updateWrapper(otherNode, otherProps);
1971        }
1972      }
1973    } // In Chrome, assigning defaultValue to certain input types triggers input validation.
1974    // For number inputs, the display value loses trailing decimal points. For email inputs,
1975    // Chrome raises "The specified value <x> is not a valid email address".
1976    //
1977    // Here we check to see if the defaultValue has actually changed, avoiding these problems
1978    // when the user is inputting text
1979    //
1980    // https://github.com/facebook/react/issues/7253
1981  
1982  
1983    function setDefaultValue(node, type, value) {
1984      if ( // Focused number inputs synchronize on blur. See ChangeEventPlugin.js
1985      type !== 'number' || getActiveElement(node.ownerDocument) !== node) {
1986        if (value == null) {
1987          node.defaultValue = toString(node._wrapperState.initialValue);
1988        } else if (node.defaultValue !== toString(value)) {
1989          node.defaultValue = toString(value);
1990        }
1991      }
1992    }
1993  
1994    var didWarnSelectedSetOnOption = false;
1995    var didWarnInvalidChild = false;
1996    var didWarnInvalidInnerHTML = false;
1997    /**
1998     * Implements an <option> host component that warns when `selected` is set.
1999     */
2000  
2001    function validateProps(element, props) {
2002      {
2003        // If a value is not provided, then the children must be simple.
2004        if (props.value == null) {
2005          if (typeof props.children === 'object' && props.children !== null) {
2006            React.Children.forEach(props.children, function (child) {
2007              if (child == null) {
2008                return;
2009              }
2010  
2011              if (typeof child === 'string' || typeof child === 'number') {
2012                return;
2013              }
2014  
2015              if (!didWarnInvalidChild) {
2016                didWarnInvalidChild = true;
2017  
2018                error('Cannot infer the option value of complex children. ' + 'Pass a `value` prop or use a plain string as children to <option>.');
2019              }
2020            });
2021          } else if (props.dangerouslySetInnerHTML != null) {
2022            if (!didWarnInvalidInnerHTML) {
2023              didWarnInvalidInnerHTML = true;
2024  
2025              error('Pass a `value` prop if you set dangerouslyInnerHTML so React knows ' + 'which value should be selected.');
2026            }
2027          }
2028        } // TODO: Remove support for `selected` in <option>.
2029  
2030  
2031        if (props.selected != null && !didWarnSelectedSetOnOption) {
2032          error('Use the `defaultValue` or `value` props on <select> instead of ' + 'setting `selected` on <option>.');
2033  
2034          didWarnSelectedSetOnOption = true;
2035        }
2036      }
2037    }
2038    function postMountWrapper$1(element, props) {
2039      // value="" should make a value attribute (#6219)
2040      if (props.value != null) {
2041        element.setAttribute('value', toString(getToStringValue(props.value)));
2042      }
2043    }
2044  
2045    var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare
2046  
2047    function isArray(a) {
2048      return isArrayImpl(a);
2049    }
2050  
2051    var didWarnValueDefaultValue$1;
2052  
2053    {
2054      didWarnValueDefaultValue$1 = false;
2055    }
2056  
2057    function getDeclarationErrorAddendum() {
2058      var ownerName = getCurrentFiberOwnerNameInDevOrNull();
2059  
2060      if (ownerName) {
2061        return '\n\nCheck the render method of `' + ownerName + '`.';
2062      }
2063  
2064      return '';
2065    }
2066  
2067    var valuePropNames = ['value', 'defaultValue'];
2068    /**
2069     * Validation function for `value` and `defaultValue`.
2070     */
2071  
2072    function checkSelectPropTypes(props) {
2073      {
2074        checkControlledValueProps('select', props);
2075  
2076        for (var i = 0; i < valuePropNames.length; i++) {
2077          var propName = valuePropNames[i];
2078  
2079          if (props[propName] == null) {
2080            continue;
2081          }
2082  
2083          var propNameIsArray = isArray(props[propName]);
2084  
2085          if (props.multiple && !propNameIsArray) {
2086            error('The `%s` prop supplied to <select> must be an array if ' + '`multiple` is true.%s', propName, getDeclarationErrorAddendum());
2087          } else if (!props.multiple && propNameIsArray) {
2088            error('The `%s` prop supplied to <select> must be a scalar ' + 'value if `multiple` is false.%s', propName, getDeclarationErrorAddendum());
2089          }
2090        }
2091      }
2092    }
2093  
2094    function updateOptions(node, multiple, propValue, setDefaultSelected) {
2095      var options = node.options;
2096  
2097      if (multiple) {
2098        var selectedValues = propValue;
2099        var selectedValue = {};
2100  
2101        for (var i = 0; i < selectedValues.length; i++) {
2102          // Prefix to avoid chaos with special keys.
2103          selectedValue['$' + selectedValues[i]] = true;
2104        }
2105  
2106        for (var _i = 0; _i < options.length; _i++) {
2107          var selected = selectedValue.hasOwnProperty('$' + options[_i].value);
2108  
2109          if (options[_i].selected !== selected) {
2110            options[_i].selected = selected;
2111          }
2112  
2113          if (selected && setDefaultSelected) {
2114            options[_i].defaultSelected = true;
2115          }
2116        }
2117      } else {
2118        // Do not set `select.value` as exact behavior isn't consistent across all
2119        // browsers for all cases.
2120        var _selectedValue = toString(getToStringValue(propValue));
2121  
2122        var defaultSelected = null;
2123  
2124        for (var _i2 = 0; _i2 < options.length; _i2++) {
2125          if (options[_i2].value === _selectedValue) {
2126            options[_i2].selected = true;
2127  
2128            if (setDefaultSelected) {
2129              options[_i2].defaultSelected = true;
2130            }
2131  
2132            return;
2133          }
2134  
2135          if (defaultSelected === null && !options[_i2].disabled) {
2136            defaultSelected = options[_i2];
2137          }
2138        }
2139  
2140        if (defaultSelected !== null) {
2141          defaultSelected.selected = true;
2142        }
2143      }
2144    }
2145    /**
2146     * Implements a <select> host component that allows optionally setting the
2147     * props `value` and `defaultValue`. If `multiple` is false, the prop must be a
2148     * stringable. If `multiple` is true, the prop must be an array of stringables.
2149     *
2150     * If `value` is not supplied (or null/undefined), user actions that change the
2151     * selected option will trigger updates to the rendered options.
2152     *
2153     * If it is supplied (and not null/undefined), the rendered options will not
2154     * update in response to user actions. Instead, the `value` prop must change in
2155     * order for the rendered options to update.
2156     *
2157     * If `defaultValue` is provided, any options with the supplied values will be
2158     * selected.
2159     */
2160  
2161  
2162    function getHostProps$1(element, props) {
2163      return assign({}, props, {
2164        value: undefined
2165      });
2166    }
2167    function initWrapperState$1(element, props) {
2168      var node = element;
2169  
2170      {
2171        checkSelectPropTypes(props);
2172      }
2173  
2174      node._wrapperState = {
2175        wasMultiple: !!props.multiple
2176      };
2177  
2178      {
2179        if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue$1) {
2180          error('Select elements must be either controlled or uncontrolled ' + '(specify either the value prop, or the defaultValue prop, but not ' + 'both). Decide between using a controlled or uncontrolled select ' + 'element and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components');
2181  
2182          didWarnValueDefaultValue$1 = true;
2183        }
2184      }
2185    }
2186    function postMountWrapper$2(element, props) {
2187      var node = element;
2188      node.multiple = !!props.multiple;
2189      var value = props.value;
2190  
2191      if (value != null) {
2192        updateOptions(node, !!props.multiple, value, false);
2193      } else if (props.defaultValue != null) {
2194        updateOptions(node, !!props.multiple, props.defaultValue, true);
2195      }
2196    }
2197    function postUpdateWrapper(element, props) {
2198      var node = element;
2199      var wasMultiple = node._wrapperState.wasMultiple;
2200      node._wrapperState.wasMultiple = !!props.multiple;
2201      var value = props.value;
2202  
2203      if (value != null) {
2204        updateOptions(node, !!props.multiple, value, false);
2205      } else if (wasMultiple !== !!props.multiple) {
2206        // For simplicity, reapply `defaultValue` if `multiple` is toggled.
2207        if (props.defaultValue != null) {
2208          updateOptions(node, !!props.multiple, props.defaultValue, true);
2209        } else {
2210          // Revert the select back to its default unselected state.
2211          updateOptions(node, !!props.multiple, props.multiple ? [] : '', false);
2212        }
2213      }
2214    }
2215    function restoreControlledState$1(element, props) {
2216      var node = element;
2217      var value = props.value;
2218  
2219      if (value != null) {
2220        updateOptions(node, !!props.multiple, value, false);
2221      }
2222    }
2223  
2224    var didWarnValDefaultVal = false;
2225  
2226    /**
2227     * Implements a <textarea> host component that allows setting `value`, and
2228     * `defaultValue`. This differs from the traditional DOM API because value is
2229     * usually set as PCDATA children.
2230     *
2231     * If `value` is not supplied (or null/undefined), user actions that affect the
2232     * value will trigger updates to the element.
2233     *
2234     * If `value` is supplied (and not null/undefined), the rendered element will
2235     * not trigger updates to the element. Instead, the `value` prop must change in
2236     * order for the rendered element to be updated.
2237     *
2238     * The rendered element will be initialized with an empty value, the prop
2239     * `defaultValue` if specified, or the children content (deprecated).
2240     */
2241    function getHostProps$2(element, props) {
2242      var node = element;
2243  
2244      if (props.dangerouslySetInnerHTML != null) {
2245        throw new Error('`dangerouslySetInnerHTML` does not make sense on <textarea>.');
2246      } // Always set children to the same thing. In IE9, the selection range will
2247      // get reset if `textContent` is mutated.  We could add a check in setTextContent
2248      // to only set the value if/when the value differs from the node value (which would
2249      // completely solve this IE9 bug), but Sebastian+Sophie seemed to like this
2250      // solution. The value can be a boolean or object so that's why it's forced
2251      // to be a string.
2252  
2253  
2254      var hostProps = assign({}, props, {
2255        value: undefined,
2256        defaultValue: undefined,
2257        children: toString(node._wrapperState.initialValue)
2258      });
2259  
2260      return hostProps;
2261    }
2262    function initWrapperState$2(element, props) {
2263      var node = element;
2264  
2265      {
2266        checkControlledValueProps('textarea', props);
2267  
2268        if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValDefaultVal) {
2269          error('%s contains a textarea with both value and defaultValue props. ' + 'Textarea elements must be either controlled or uncontrolled ' + '(specify either the value prop, or the defaultValue prop, but not ' + 'both). Decide between using a controlled or uncontrolled textarea ' + 'and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components', getCurrentFiberOwnerNameInDevOrNull() || 'A component');
2270  
2271          didWarnValDefaultVal = true;
2272        }
2273      }
2274  
2275      var initialValue = props.value; // Only bother fetching default value if we're going to use it
2276  
2277      if (initialValue == null) {
2278        var children = props.children,
2279            defaultValue = props.defaultValue;
2280  
2281        if (children != null) {
2282          {
2283            error('Use the `defaultValue` or `value` props instead of setting ' + 'children on <textarea>.');
2284          }
2285  
2286          {
2287            if (defaultValue != null) {
2288              throw new Error('If you supply `defaultValue` on a <textarea>, do not pass children.');
2289            }
2290  
2291            if (isArray(children)) {
2292              if (children.length > 1) {
2293                throw new Error('<textarea> can only have at most one child.');
2294              }
2295  
2296              children = children[0];
2297            }
2298  
2299            defaultValue = children;
2300          }
2301        }
2302  
2303        if (defaultValue == null) {
2304          defaultValue = '';
2305        }
2306  
2307        initialValue = defaultValue;
2308      }
2309  
2310      node._wrapperState = {
2311        initialValue: getToStringValue(initialValue)
2312      };
2313    }
2314    function updateWrapper$1(element, props) {
2315      var node = element;
2316      var value = getToStringValue(props.value);
2317      var defaultValue = getToStringValue(props.defaultValue);
2318  
2319      if (value != null) {
2320        // Cast `value` to a string to ensure the value is set correctly. While
2321        // browsers typically do this as necessary, jsdom doesn't.
2322        var newValue = toString(value); // To avoid side effects (such as losing text selection), only set value if changed
2323  
2324        if (newValue !== node.value) {
2325          node.value = newValue;
2326        }
2327  
2328        if (props.defaultValue == null && node.defaultValue !== newValue) {
2329          node.defaultValue = newValue;
2330        }
2331      }
2332  
2333      if (defaultValue != null) {
2334        node.defaultValue = toString(defaultValue);
2335      }
2336    }
2337    function postMountWrapper$3(element, props) {
2338      var node = element; // This is in postMount because we need access to the DOM node, which is not
2339      // available until after the component has mounted.
2340  
2341      var textContent = node.textContent; // Only set node.value if textContent is equal to the expected
2342      // initial value. In IE10/IE11 there is a bug where the placeholder attribute
2343      // will populate textContent as well.
2344      // https://developer.microsoft.com/microsoft-edge/platform/issues/101525/
2345  
2346      if (textContent === node._wrapperState.initialValue) {
2347        if (textContent !== '' && textContent !== null) {
2348          node.value = textContent;
2349        }
2350      }
2351    }
2352    function restoreControlledState$2(element, props) {
2353      // DOM component is still mounted; update
2354      updateWrapper$1(element, props);
2355    }
2356  
2357    var HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
2358    var MATH_NAMESPACE = 'http://www.w3.org/1998/Math/MathML';
2359    var SVG_NAMESPACE = 'http://www.w3.org/2000/svg'; // Assumes there is no parent namespace.
2360  
2361    function getIntrinsicNamespace(type) {
2362      switch (type) {
2363        case 'svg':
2364          return SVG_NAMESPACE;
2365  
2366        case 'math':
2367          return MATH_NAMESPACE;
2368  
2369        default:
2370          return HTML_NAMESPACE;
2371      }
2372    }
2373    function getChildNamespace(parentNamespace, type) {
2374      if (parentNamespace == null || parentNamespace === HTML_NAMESPACE) {
2375        // No (or default) parent namespace: potential entry point.
2376        return getIntrinsicNamespace(type);
2377      }
2378  
2379      if (parentNamespace === SVG_NAMESPACE && type === 'foreignObject') {
2380        // We're leaving SVG.
2381        return HTML_NAMESPACE;
2382      } // By default, pass namespace below.
2383  
2384  
2385      return parentNamespace;
2386    }
2387  
2388    /* globals MSApp */
2389  
2390    /**
2391     * Create a function which has 'unsafe' privileges (required by windows8 apps)
2392     */
2393    var createMicrosoftUnsafeLocalFunction = function (func) {
2394      if (typeof MSApp !== 'undefined' && MSApp.execUnsafeLocalFunction) {
2395        return function (arg0, arg1, arg2, arg3) {
2396          MSApp.execUnsafeLocalFunction(function () {
2397            return func(arg0, arg1, arg2, arg3);
2398          });
2399        };
2400      } else {
2401        return func;
2402      }
2403    };
2404  
2405    var reusableSVGContainer;
2406    /**
2407     * Set the innerHTML property of a node
2408     *
2409     * @param {DOMElement} node
2410     * @param {string} html
2411     * @internal
2412     */
2413  
2414    var setInnerHTML = createMicrosoftUnsafeLocalFunction(function (node, html) {
2415      if (node.namespaceURI === SVG_NAMESPACE) {
2416  
2417        if (!('innerHTML' in node)) {
2418          // IE does not have innerHTML for SVG nodes, so instead we inject the
2419          // new markup in a temp node and then move the child nodes across into
2420          // the target node
2421          reusableSVGContainer = reusableSVGContainer || document.createElement('div');
2422          reusableSVGContainer.innerHTML = '<svg>' + html.valueOf().toString() + '</svg>';
2423          var svgNode = reusableSVGContainer.firstChild;
2424  
2425          while (node.firstChild) {
2426            node.removeChild(node.firstChild);
2427          }
2428  
2429          while (svgNode.firstChild) {
2430            node.appendChild(svgNode.firstChild);
2431          }
2432  
2433          return;
2434        }
2435      }
2436  
2437      node.innerHTML = html;
2438    });
2439  
2440    /**
2441     * HTML nodeType values that represent the type of the node
2442     */
2443    var ELEMENT_NODE = 1;
2444    var TEXT_NODE = 3;
2445    var COMMENT_NODE = 8;
2446    var DOCUMENT_NODE = 9;
2447    var DOCUMENT_FRAGMENT_NODE = 11;
2448  
2449    /**
2450     * Set the textContent property of a node. For text updates, it's faster
2451     * to set the `nodeValue` of the Text node directly instead of using
2452     * `.textContent` which will remove the existing node and create a new one.
2453     *
2454     * @param {DOMElement} node
2455     * @param {string} text
2456     * @internal
2457     */
2458  
2459    var setTextContent = function (node, text) {
2460      if (text) {
2461        var firstChild = node.firstChild;
2462  
2463        if (firstChild && firstChild === node.lastChild && firstChild.nodeType === TEXT_NODE) {
2464          firstChild.nodeValue = text;
2465          return;
2466        }
2467      }
2468  
2469      node.textContent = text;
2470    };
2471  
2472    // List derived from Gecko source code:
2473    // https://github.com/mozilla/gecko-dev/blob/4e638efc71/layout/style/test/property_database.js
2474    var shorthandToLonghand = {
2475      animation: ['animationDelay', 'animationDirection', 'animationDuration', 'animationFillMode', 'animationIterationCount', 'animationName', 'animationPlayState', 'animationTimingFunction'],
2476      background: ['backgroundAttachment', 'backgroundClip', 'backgroundColor', 'backgroundImage', 'backgroundOrigin', 'backgroundPositionX', 'backgroundPositionY', 'backgroundRepeat', 'backgroundSize'],
2477      backgroundPosition: ['backgroundPositionX', 'backgroundPositionY'],
2478      border: ['borderBottomColor', 'borderBottomStyle', 'borderBottomWidth', 'borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth', 'borderLeftColor', 'borderLeftStyle', 'borderLeftWidth', 'borderRightColor', 'borderRightStyle', 'borderRightWidth', 'borderTopColor', 'borderTopStyle', 'borderTopWidth'],
2479      borderBlockEnd: ['borderBlockEndColor', 'borderBlockEndStyle', 'borderBlockEndWidth'],
2480      borderBlockStart: ['borderBlockStartColor', 'borderBlockStartStyle', 'borderBlockStartWidth'],
2481      borderBottom: ['borderBottomColor', 'borderBottomStyle', 'borderBottomWidth'],
2482      borderColor: ['borderBottomColor', 'borderLeftColor', 'borderRightColor', 'borderTopColor'],
2483      borderImage: ['borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth'],
2484      borderInlineEnd: ['borderInlineEndColor', 'borderInlineEndStyle', 'borderInlineEndWidth'],
2485      borderInlineStart: ['borderInlineStartColor', 'borderInlineStartStyle', 'borderInlineStartWidth'],
2486      borderLeft: ['borderLeftColor', 'borderLeftStyle', 'borderLeftWidth'],
2487      borderRadius: ['borderBottomLeftRadius', 'borderBottomRightRadius', 'borderTopLeftRadius', 'borderTopRightRadius'],
2488      borderRight: ['borderRightColor', 'borderRightStyle', 'borderRightWidth'],
2489      borderStyle: ['borderBottomStyle', 'borderLeftStyle', 'borderRightStyle', 'borderTopStyle'],
2490      borderTop: ['borderTopColor', 'borderTopStyle', 'borderTopWidth'],
2491      borderWidth: ['borderBottomWidth', 'borderLeftWidth', 'borderRightWidth', 'borderTopWidth'],
2492      columnRule: ['columnRuleColor', 'columnRuleStyle', 'columnRuleWidth'],
2493      columns: ['columnCount', 'columnWidth'],
2494      flex: ['flexBasis', 'flexGrow', 'flexShrink'],
2495      flexFlow: ['flexDirection', 'flexWrap'],
2496      font: ['fontFamily', 'fontFeatureSettings', 'fontKerning', 'fontLanguageOverride', 'fontSize', 'fontSizeAdjust', 'fontStretch', 'fontStyle', 'fontVariant', 'fontVariantAlternates', 'fontVariantCaps', 'fontVariantEastAsian', 'fontVariantLigatures', 'fontVariantNumeric', 'fontVariantPosition', 'fontWeight', 'lineHeight'],
2497      fontVariant: ['fontVariantAlternates', 'fontVariantCaps', 'fontVariantEastAsian', 'fontVariantLigatures', 'fontVariantNumeric', 'fontVariantPosition'],
2498      gap: ['columnGap', 'rowGap'],
2499      grid: ['gridAutoColumns', 'gridAutoFlow', 'gridAutoRows', 'gridTemplateAreas', 'gridTemplateColumns', 'gridTemplateRows'],
2500      gridArea: ['gridColumnEnd', 'gridColumnStart', 'gridRowEnd', 'gridRowStart'],
2501      gridColumn: ['gridColumnEnd', 'gridColumnStart'],
2502      gridColumnGap: ['columnGap'],
2503      gridGap: ['columnGap', 'rowGap'],
2504      gridRow: ['gridRowEnd', 'gridRowStart'],
2505      gridRowGap: ['rowGap'],
2506      gridTemplate: ['gridTemplateAreas', 'gridTemplateColumns', 'gridTemplateRows'],
2507      listStyle: ['listStyleImage', 'listStylePosition', 'listStyleType'],
2508      margin: ['marginBottom', 'marginLeft', 'marginRight', 'marginTop'],
2509      marker: ['markerEnd', 'markerMid', 'markerStart'],
2510      mask: ['maskClip', 'maskComposite', 'maskImage', 'maskMode', 'maskOrigin', 'maskPositionX', 'maskPositionY', 'maskRepeat', 'maskSize'],
2511      maskPosition: ['maskPositionX', 'maskPositionY'],
2512      outline: ['outlineColor', 'outlineStyle', 'outlineWidth'],
2513      overflow: ['overflowX', 'overflowY'],
2514      padding: ['paddingBottom', 'paddingLeft', 'paddingRight', 'paddingTop'],
2515      placeContent: ['alignContent', 'justifyContent'],
2516      placeItems: ['alignItems', 'justifyItems'],
2517      placeSelf: ['alignSelf', 'justifySelf'],
2518      textDecoration: ['textDecorationColor', 'textDecorationLine', 'textDecorationStyle'],
2519      textEmphasis: ['textEmphasisColor', 'textEmphasisStyle'],
2520      transition: ['transitionDelay', 'transitionDuration', 'transitionProperty', 'transitionTimingFunction'],
2521      wordWrap: ['overflowWrap']
2522    };
2523  
2524    /**
2525     * CSS properties which accept numbers but are not in units of "px".
2526     */
2527    var isUnitlessNumber = {
2528      animationIterationCount: true,
2529      aspectRatio: true,
2530      borderImageOutset: true,
2531      borderImageSlice: true,
2532      borderImageWidth: true,
2533      boxFlex: true,
2534      boxFlexGroup: true,
2535      boxOrdinalGroup: true,
2536      columnCount: true,
2537      columns: true,
2538      flex: true,
2539      flexGrow: true,
2540      flexPositive: true,
2541      flexShrink: true,
2542      flexNegative: true,
2543      flexOrder: true,
2544      gridArea: true,
2545      gridRow: true,
2546      gridRowEnd: true,
2547      gridRowSpan: true,
2548      gridRowStart: true,
2549      gridColumn: true,
2550      gridColumnEnd: true,
2551      gridColumnSpan: true,
2552      gridColumnStart: true,
2553      fontWeight: true,
2554      lineClamp: true,
2555      lineHeight: true,
2556      opacity: true,
2557      order: true,
2558      orphans: true,
2559      tabSize: true,
2560      widows: true,
2561      zIndex: true,
2562      zoom: true,
2563      // SVG-related properties
2564      fillOpacity: true,
2565      floodOpacity: true,
2566      stopOpacity: true,
2567      strokeDasharray: true,
2568      strokeDashoffset: true,
2569      strokeMiterlimit: true,
2570      strokeOpacity: true,
2571      strokeWidth: true
2572    };
2573    /**
2574     * @param {string} prefix vendor-specific prefix, eg: Webkit
2575     * @param {string} key style name, eg: transitionDuration
2576     * @return {string} style name prefixed with `prefix`, properly camelCased, eg:
2577     * WebkitTransitionDuration
2578     */
2579  
2580    function prefixKey(prefix, key) {
2581      return prefix + key.charAt(0).toUpperCase() + key.substring(1);
2582    }
2583    /**
2584     * Support style names that may come passed in prefixed by adding permutations
2585     * of vendor prefixes.
2586     */
2587  
2588  
2589    var prefixes = ['Webkit', 'ms', 'Moz', 'O']; // Using Object.keys here, or else the vanilla for-in loop makes IE8 go into an
2590    // infinite loop, because it iterates over the newly added props too.
2591  
2592    Object.keys(isUnitlessNumber).forEach(function (prop) {
2593      prefixes.forEach(function (prefix) {
2594        isUnitlessNumber[prefixKey(prefix, prop)] = isUnitlessNumber[prop];
2595      });
2596    });
2597  
2598    /**
2599     * Convert a value into the proper css writable value. The style name `name`
2600     * should be logical (no hyphens), as specified
2601     * in `CSSProperty.isUnitlessNumber`.
2602     *
2603     * @param {string} name CSS property name such as `topMargin`.
2604     * @param {*} value CSS property value such as `10px`.
2605     * @return {string} Normalized style value with dimensions applied.
2606     */
2607  
2608    function dangerousStyleValue(name, value, isCustomProperty) {
2609      // Note that we've removed escapeTextForBrowser() calls here since the
2610      // whole string will be escaped when the attribute is injected into
2611      // the markup. If you provide unsafe user data here they can inject
2612      // arbitrary CSS which may be problematic (I couldn't repro this):
2613      // https://www.owasp.org/index.php/XSS_Filter_Evasion_Cheat_Sheet
2614      // http://www.thespanner.co.uk/2007/11/26/ultimate-xss-css-injection/
2615      // This is not an XSS hole but instead a potential CSS injection issue
2616      // which has lead to a greater discussion about how we're going to
2617      // trust URLs moving forward. See #2115901
2618      var isEmpty = value == null || typeof value === 'boolean' || value === '';
2619  
2620      if (isEmpty) {
2621        return '';
2622      }
2623  
2624      if (!isCustomProperty && typeof value === 'number' && value !== 0 && !(isUnitlessNumber.hasOwnProperty(name) && isUnitlessNumber[name])) {
2625        return value + 'px'; // Presumes implicit 'px' suffix for unitless numbers
2626      }
2627  
2628      {
2629        checkCSSPropertyStringCoercion(value, name);
2630      }
2631  
2632      return ('' + value).trim();
2633    }
2634  
2635    var uppercasePattern = /([A-Z])/g;
2636    var msPattern = /^ms-/;
2637    /**
2638     * Hyphenates a camelcased CSS property name, for example:
2639     *
2640     *   > hyphenateStyleName('backgroundColor')
2641     *   < "background-color"
2642     *   > hyphenateStyleName('MozTransition')
2643     *   < "-moz-transition"
2644     *   > hyphenateStyleName('msTransition')
2645     *   < "-ms-transition"
2646     *
2647     * As Modernizr suggests (http://modernizr.com/docs/#prefixed), an `ms` prefix
2648     * is converted to `-ms-`.
2649     */
2650  
2651    function hyphenateStyleName(name) {
2652      return name.replace(uppercasePattern, '-$1').toLowerCase().replace(msPattern, '-ms-');
2653    }
2654  
2655    var warnValidStyle = function () {};
2656  
2657    {
2658      // 'msTransform' is correct, but the other prefixes should be capitalized
2659      var badVendoredStyleNamePattern = /^(?:webkit|moz|o)[A-Z]/;
2660      var msPattern$1 = /^-ms-/;
2661      var hyphenPattern = /-(.)/g; // style values shouldn't contain a semicolon
2662  
2663      var badStyleValueWithSemicolonPattern = /;\s*$/;
2664      var warnedStyleNames = {};
2665      var warnedStyleValues = {};
2666      var warnedForNaNValue = false;
2667      var warnedForInfinityValue = false;
2668  
2669      var camelize = function (string) {
2670        return string.replace(hyphenPattern, function (_, character) {
2671          return character.toUpperCase();
2672        });
2673      };
2674  
2675      var warnHyphenatedStyleName = function (name) {
2676        if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) {
2677          return;
2678        }
2679  
2680        warnedStyleNames[name] = true;
2681  
2682        error('Unsupported style property %s. Did you mean %s?', name, // As Andi Smith suggests
2683        // (http://www.andismith.com/blog/2012/02/modernizr-prefixed/), an `-ms` prefix
2684        // is converted to lowercase `ms`.
2685        camelize(name.replace(msPattern$1, 'ms-')));
2686      };
2687  
2688      var warnBadVendoredStyleName = function (name) {
2689        if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) {
2690          return;
2691        }
2692  
2693        warnedStyleNames[name] = true;
2694  
2695        error('Unsupported vendor-prefixed style property %s. Did you mean %s?', name, name.charAt(0).toUpperCase() + name.slice(1));
2696      };
2697  
2698      var warnStyleValueWithSemicolon = function (name, value) {
2699        if (warnedStyleValues.hasOwnProperty(value) && warnedStyleValues[value]) {
2700          return;
2701        }
2702  
2703        warnedStyleValues[value] = true;
2704  
2705        error("Style property values shouldn't contain a semicolon. " + 'Try "%s: %s" instead.', name, value.replace(badStyleValueWithSemicolonPattern, ''));
2706      };
2707  
2708      var warnStyleValueIsNaN = function (name, value) {
2709        if (warnedForNaNValue) {
2710          return;
2711        }
2712  
2713        warnedForNaNValue = true;
2714  
2715        error('`NaN` is an invalid value for the `%s` css style property.', name);
2716      };
2717  
2718      var warnStyleValueIsInfinity = function (name, value) {
2719        if (warnedForInfinityValue) {
2720          return;
2721        }
2722  
2723        warnedForInfinityValue = true;
2724  
2725        error('`Infinity` is an invalid value for the `%s` css style property.', name);
2726      };
2727  
2728      warnValidStyle = function (name, value) {
2729        if (name.indexOf('-') > -1) {
2730          warnHyphenatedStyleName(name);
2731        } else if (badVendoredStyleNamePattern.test(name)) {
2732          warnBadVendoredStyleName(name);
2733        } else if (badStyleValueWithSemicolonPattern.test(value)) {
2734          warnStyleValueWithSemicolon(name, value);
2735        }
2736  
2737        if (typeof value === 'number') {
2738          if (isNaN(value)) {
2739            warnStyleValueIsNaN(name, value);
2740          } else if (!isFinite(value)) {
2741            warnStyleValueIsInfinity(name, value);
2742          }
2743        }
2744      };
2745    }
2746  
2747    var warnValidStyle$1 = warnValidStyle;
2748  
2749    /**
2750     * Operations for dealing with CSS properties.
2751     */
2752  
2753    /**
2754     * This creates a string that is expected to be equivalent to the style
2755     * attribute generated by server-side rendering. It by-passes warnings and
2756     * security checks so it's not safe to use this value for anything other than
2757     * comparison. It is only used in DEV for SSR validation.
2758     */
2759  
2760    function createDangerousStringForStyles(styles) {
2761      {
2762        var serialized = '';
2763        var delimiter = '';
2764  
2765        for (var styleName in styles) {
2766          if (!styles.hasOwnProperty(styleName)) {
2767            continue;
2768          }
2769  
2770          var styleValue = styles[styleName];
2771  
2772          if (styleValue != null) {
2773            var isCustomProperty = styleName.indexOf('--') === 0;
2774            serialized += delimiter + (isCustomProperty ? styleName : hyphenateStyleName(styleName)) + ':';
2775            serialized += dangerousStyleValue(styleName, styleValue, isCustomProperty);
2776            delimiter = ';';
2777          }
2778        }
2779  
2780        return serialized || null;
2781      }
2782    }
2783    /**
2784     * Sets the value for multiple styles on a node.  If a value is specified as
2785     * '' (empty string), the corresponding style property will be unset.
2786     *
2787     * @param {DOMElement} node
2788     * @param {object} styles
2789     */
2790  
2791    function setValueForStyles(node, styles) {
2792      var style = node.style;
2793  
2794      for (var styleName in styles) {
2795        if (!styles.hasOwnProperty(styleName)) {
2796          continue;
2797        }
2798  
2799        var isCustomProperty = styleName.indexOf('--') === 0;
2800  
2801        {
2802          if (!isCustomProperty) {
2803            warnValidStyle$1(styleName, styles[styleName]);
2804          }
2805        }
2806  
2807        var styleValue = dangerousStyleValue(styleName, styles[styleName], isCustomProperty);
2808  
2809        if (styleName === 'float') {
2810          styleName = 'cssFloat';
2811        }
2812  
2813        if (isCustomProperty) {
2814          style.setProperty(styleName, styleValue);
2815        } else {
2816          style[styleName] = styleValue;
2817        }
2818      }
2819    }
2820  
2821    function isValueEmpty(value) {
2822      return value == null || typeof value === 'boolean' || value === '';
2823    }
2824    /**
2825     * Given {color: 'red', overflow: 'hidden'} returns {
2826     *   color: 'color',
2827     *   overflowX: 'overflow',
2828     *   overflowY: 'overflow',
2829     * }. This can be read as "the overflowY property was set by the overflow
2830     * shorthand". That is, the values are the property that each was derived from.
2831     */
2832  
2833  
2834    function expandShorthandMap(styles) {
2835      var expanded = {};
2836  
2837      for (var key in styles) {
2838        var longhands = shorthandToLonghand[key] || [key];
2839  
2840        for (var i = 0; i < longhands.length; i++) {
2841          expanded[longhands[i]] = key;
2842        }
2843      }
2844  
2845      return expanded;
2846    }
2847    /**
2848     * When mixing shorthand and longhand property names, we warn during updates if
2849     * we expect an incorrect result to occur. In particular, we warn for:
2850     *
2851     * Updating a shorthand property (longhand gets overwritten):
2852     *   {font: 'foo', fontVariant: 'bar'} -> {font: 'baz', fontVariant: 'bar'}
2853     *   becomes .style.font = 'baz'
2854     * Removing a shorthand property (longhand gets lost too):
2855     *   {font: 'foo', fontVariant: 'bar'} -> {fontVariant: 'bar'}
2856     *   becomes .style.font = ''
2857     * Removing a longhand property (should revert to shorthand; doesn't):
2858     *   {font: 'foo', fontVariant: 'bar'} -> {font: 'foo'}
2859     *   becomes .style.fontVariant = ''
2860     */
2861  
2862  
2863    function validateShorthandPropertyCollisionInDev(styleUpdates, nextStyles) {
2864      {
2865        if (!nextStyles) {
2866          return;
2867        }
2868  
2869        var expandedUpdates = expandShorthandMap(styleUpdates);
2870        var expandedStyles = expandShorthandMap(nextStyles);
2871        var warnedAbout = {};
2872  
2873        for (var key in expandedUpdates) {
2874          var originalKey = expandedUpdates[key];
2875          var correctOriginalKey = expandedStyles[key];
2876  
2877          if (correctOriginalKey && originalKey !== correctOriginalKey) {
2878            var warningKey = originalKey + ',' + correctOriginalKey;
2879  
2880            if (warnedAbout[warningKey]) {
2881              continue;
2882            }
2883  
2884            warnedAbout[warningKey] = true;
2885  
2886            error('%s a style property during rerender (%s) when a ' + 'conflicting property is set (%s) can lead to styling bugs. To ' + "avoid this, don't mix shorthand and non-shorthand properties " + 'for the same value; instead, replace the shorthand with ' + 'separate values.', isValueEmpty(styleUpdates[originalKey]) ? 'Removing' : 'Updating', originalKey, correctOriginalKey);
2887          }
2888        }
2889      }
2890    }
2891  
2892    // For HTML, certain tags should omit their close tag. We keep a list for
2893    // those special-case tags.
2894    var omittedCloseTags = {
2895      area: true,
2896      base: true,
2897      br: true,
2898      col: true,
2899      embed: true,
2900      hr: true,
2901      img: true,
2902      input: true,
2903      keygen: true,
2904      link: true,
2905      meta: true,
2906      param: true,
2907      source: true,
2908      track: true,
2909      wbr: true // NOTE: menuitem's close tag should be omitted, but that causes problems.
2910  
2911    };
2912  
2913    // `omittedCloseTags` except that `menuitem` should still have its closing tag.
2914  
2915    var voidElementTags = assign({
2916      menuitem: true
2917    }, omittedCloseTags);
2918  
2919    var HTML = '__html';
2920  
2921    function assertValidProps(tag, props) {
2922      if (!props) {
2923        return;
2924      } // Note the use of `==` which checks for null or undefined.
2925  
2926  
2927      if (voidElementTags[tag]) {
2928        if (props.children != null || props.dangerouslySetInnerHTML != null) {
2929          throw new Error(tag + " is a void element tag and must neither have `children` nor " + 'use `dangerouslySetInnerHTML`.');
2930        }
2931      }
2932  
2933      if (props.dangerouslySetInnerHTML != null) {
2934        if (props.children != null) {
2935          throw new Error('Can only set one of `children` or `props.dangerouslySetInnerHTML`.');
2936        }
2937  
2938        if (typeof props.dangerouslySetInnerHTML !== 'object' || !(HTML in props.dangerouslySetInnerHTML)) {
2939          throw new Error('`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. ' + 'Please visit https://reactjs.org/link/dangerously-set-inner-html ' + 'for more information.');
2940        }
2941      }
2942  
2943      {
2944        if (!props.suppressContentEditableWarning && props.contentEditable && props.children != null) {
2945          error('A component is `contentEditable` and contains `children` managed by ' + 'React. It is now your responsibility to guarantee that none of ' + 'those nodes are unexpectedly modified or duplicated. This is ' + 'probably not intentional.');
2946        }
2947      }
2948  
2949      if (props.style != null && typeof props.style !== 'object') {
2950        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.');
2951      }
2952    }
2953  
2954    function isCustomComponent(tagName, props) {
2955      if (tagName.indexOf('-') === -1) {
2956        return typeof props.is === 'string';
2957      }
2958  
2959      switch (tagName) {
2960        // These are reserved SVG and MathML elements.
2961        // We don't mind this list too much because we expect it to never grow.
2962        // The alternative is to track the namespace in a few places which is convoluted.
2963        // https://w3c.github.io/webcomponents/spec/custom/#custom-elements-core-concepts
2964        case 'annotation-xml':
2965        case 'color-profile':
2966        case 'font-face':
2967        case 'font-face-src':
2968        case 'font-face-uri':
2969        case 'font-face-format':
2970        case 'font-face-name':
2971        case 'missing-glyph':
2972          return false;
2973  
2974        default:
2975          return true;
2976      }
2977    }
2978  
2979    // When adding attributes to the HTML or SVG allowed attribute list, be sure to
2980    // also add them to this module to ensure casing and incorrect name
2981    // warnings.
2982    var possibleStandardNames = {
2983      // HTML
2984      accept: 'accept',
2985      acceptcharset: 'acceptCharset',
2986      'accept-charset': 'acceptCharset',
2987      accesskey: 'accessKey',
2988      action: 'action',
2989      allowfullscreen: 'allowFullScreen',
2990      alt: 'alt',
2991      as: 'as',
2992      async: 'async',
2993      autocapitalize: 'autoCapitalize',
2994      autocomplete: 'autoComplete',
2995      autocorrect: 'autoCorrect',
2996      autofocus: 'autoFocus',
2997      autoplay: 'autoPlay',
2998      autosave: 'autoSave',
2999      capture: 'capture',
3000      cellpadding: 'cellPadding',
3001      cellspacing: 'cellSpacing',
3002      challenge: 'challenge',
3003      charset: 'charSet',
3004      checked: 'checked',
3005      children: 'children',
3006      cite: 'cite',
3007      class: 'className',
3008      classid: 'classID',
3009      classname: 'className',
3010      cols: 'cols',
3011      colspan: 'colSpan',
3012      content: 'content',
3013      contenteditable: 'contentEditable',
3014      contextmenu: 'contextMenu',
3015      controls: 'controls',
3016      controlslist: 'controlsList',
3017      coords: 'coords',
3018      crossorigin: 'crossOrigin',
3019      dangerouslysetinnerhtml: 'dangerouslySetInnerHTML',
3020      data: 'data',
3021      datetime: 'dateTime',
3022      default: 'default',
3023      defaultchecked: 'defaultChecked',
3024      defaultvalue: 'defaultValue',
3025      defer: 'defer',
3026      dir: 'dir',
3027      disabled: 'disabled',
3028      disablepictureinpicture: 'disablePictureInPicture',
3029      disableremoteplayback: 'disableRemotePlayback',
3030      download: 'download',
3031      draggable: 'draggable',
3032      enctype: 'encType',
3033      enterkeyhint: 'enterKeyHint',
3034      for: 'htmlFor',
3035      form: 'form',
3036      formmethod: 'formMethod',
3037      formaction: 'formAction',
3038      formenctype: 'formEncType',
3039      formnovalidate: 'formNoValidate',
3040      formtarget: 'formTarget',
3041      frameborder: 'frameBorder',
3042      headers: 'headers',
3043      height: 'height',
3044      hidden: 'hidden',
3045      high: 'high',
3046      href: 'href',
3047      hreflang: 'hrefLang',
3048      htmlfor: 'htmlFor',
3049      httpequiv: 'httpEquiv',
3050      'http-equiv': 'httpEquiv',
3051      icon: 'icon',
3052      id: 'id',
3053      imagesizes: 'imageSizes',
3054      imagesrcset: 'imageSrcSet',
3055      innerhtml: 'innerHTML',
3056      inputmode: 'inputMode',
3057      integrity: 'integrity',
3058      is: 'is',
3059      itemid: 'itemID',
3060      itemprop: 'itemProp',
3061      itemref: 'itemRef',
3062      itemscope: 'itemScope',
3063      itemtype: 'itemType',
3064      keyparams: 'keyParams',
3065      keytype: 'keyType',
3066      kind: 'kind',
3067      label: 'label',
3068      lang: 'lang',
3069      list: 'list',
3070      loop: 'loop',
3071      low: 'low',
3072      manifest: 'manifest',
3073      marginwidth: 'marginWidth',
3074      marginheight: 'marginHeight',
3075      max: 'max',
3076      maxlength: 'maxLength',
3077      media: 'media',
3078      mediagroup: 'mediaGroup',
3079      method: 'method',
3080      min: 'min',
3081      minlength: 'minLength',
3082      multiple: 'multiple',
3083      muted: 'muted',
3084      name: 'name',
3085      nomodule: 'noModule',
3086      nonce: 'nonce',
3087      novalidate: 'noValidate',
3088      open: 'open',
3089      optimum: 'optimum',
3090      pattern: 'pattern',
3091      placeholder: 'placeholder',
3092      playsinline: 'playsInline',
3093      poster: 'poster',
3094      preload: 'preload',
3095      profile: 'profile',
3096      radiogroup: 'radioGroup',
3097      readonly: 'readOnly',
3098      referrerpolicy: 'referrerPolicy',
3099      rel: 'rel',
3100      required: 'required',
3101      reversed: 'reversed',
3102      role: 'role',
3103      rows: 'rows',
3104      rowspan: 'rowSpan',
3105      sandbox: 'sandbox',
3106      scope: 'scope',
3107      scoped: 'scoped',
3108      scrolling: 'scrolling',
3109      seamless: 'seamless',
3110      selected: 'selected',
3111      shape: 'shape',
3112      size: 'size',
3113      sizes: 'sizes',
3114      span: 'span',
3115      spellcheck: 'spellCheck',
3116      src: 'src',
3117      srcdoc: 'srcDoc',
3118      srclang: 'srcLang',
3119      srcset: 'srcSet',
3120      start: 'start',
3121      step: 'step',
3122      style: 'style',
3123      summary: 'summary',
3124      tabindex: 'tabIndex',
3125      target: 'target',
3126      title: 'title',
3127      type: 'type',
3128      usemap: 'useMap',
3129      value: 'value',
3130      width: 'width',
3131      wmode: 'wmode',
3132      wrap: 'wrap',
3133      // SVG
3134      about: 'about',
3135      accentheight: 'accentHeight',
3136      'accent-height': 'accentHeight',
3137      accumulate: 'accumulate',
3138      additive: 'additive',
3139      alignmentbaseline: 'alignmentBaseline',
3140      'alignment-baseline': 'alignmentBaseline',
3141      allowreorder: 'allowReorder',
3142      alphabetic: 'alphabetic',
3143      amplitude: 'amplitude',
3144      arabicform: 'arabicForm',
3145      'arabic-form': 'arabicForm',
3146      ascent: 'ascent',
3147      attributename: 'attributeName',
3148      attributetype: 'attributeType',
3149      autoreverse: 'autoReverse',
3150      azimuth: 'azimuth',
3151      basefrequency: 'baseFrequency',
3152      baselineshift: 'baselineShift',
3153      'baseline-shift': 'baselineShift',
3154      baseprofile: 'baseProfile',
3155      bbox: 'bbox',
3156      begin: 'begin',
3157      bias: 'bias',
3158      by: 'by',
3159      calcmode: 'calcMode',
3160      capheight: 'capHeight',
3161      'cap-height': 'capHeight',
3162      clip: 'clip',
3163      clippath: 'clipPath',
3164      'clip-path': 'clipPath',
3165      clippathunits: 'clipPathUnits',
3166      cliprule: 'clipRule',
3167      'clip-rule': 'clipRule',
3168      color: 'color',
3169      colorinterpolation: 'colorInterpolation',
3170      'color-interpolation': 'colorInterpolation',
3171      colorinterpolationfilters: 'colorInterpolationFilters',
3172      'color-interpolation-filters': 'colorInterpolationFilters',
3173      colorprofile: 'colorProfile',
3174      'color-profile': 'colorProfile',
3175      colorrendering: 'colorRendering',
3176      'color-rendering': 'colorRendering',
3177      contentscripttype: 'contentScriptType',
3178      contentstyletype: 'contentStyleType',
3179      cursor: 'cursor',
3180      cx: 'cx',
3181      cy: 'cy',
3182      d: 'd',
3183      datatype: 'datatype',
3184      decelerate: 'decelerate',
3185      descent: 'descent',
3186      diffuseconstant: 'diffuseConstant',
3187      direction: 'direction',
3188      display: 'display',
3189      divisor: 'divisor',
3190      dominantbaseline: 'dominantBaseline',
3191      'dominant-baseline': 'dominantBaseline',
3192      dur: 'dur',
3193      dx: 'dx',
3194      dy: 'dy',
3195      edgemode: 'edgeMode',
3196      elevation: 'elevation',
3197      enablebackground: 'enableBackground',
3198      'enable-background': 'enableBackground',
3199      end: 'end',
3200      exponent: 'exponent',
3201      externalresourcesrequired: 'externalResourcesRequired',
3202      fill: 'fill',
3203      fillopacity: 'fillOpacity',
3204      'fill-opacity': 'fillOpacity',
3205      fillrule: 'fillRule',
3206      'fill-rule': 'fillRule',
3207      filter: 'filter',
3208      filterres: 'filterRes',
3209      filterunits: 'filterUnits',
3210      floodopacity: 'floodOpacity',
3211      'flood-opacity': 'floodOpacity',
3212      floodcolor: 'floodColor',
3213      'flood-color': 'floodColor',
3214      focusable: 'focusable',
3215      fontfamily: 'fontFamily',
3216      'font-family': 'fontFamily',
3217      fontsize: 'fontSize',
3218      'font-size': 'fontSize',
3219      fontsizeadjust: 'fontSizeAdjust',
3220      'font-size-adjust': 'fontSizeAdjust',
3221      fontstretch: 'fontStretch',
3222      'font-stretch': 'fontStretch',
3223      fontstyle: 'fontStyle',
3224      'font-style': 'fontStyle',
3225      fontvariant: 'fontVariant',
3226      'font-variant': 'fontVariant',
3227      fontweight: 'fontWeight',
3228      'font-weight': 'fontWeight',
3229      format: 'format',
3230      from: 'from',
3231      fx: 'fx',
3232      fy: 'fy',
3233      g1: 'g1',
3234      g2: 'g2',
3235      glyphname: 'glyphName',
3236      'glyph-name': 'glyphName',
3237      glyphorientationhorizontal: 'glyphOrientationHorizontal',
3238      'glyph-orientation-horizontal': 'glyphOrientationHorizontal',
3239      glyphorientationvertical: 'glyphOrientationVertical',
3240      'glyph-orientation-vertical': 'glyphOrientationVertical',
3241      glyphref: 'glyphRef',
3242      gradienttransform: 'gradientTransform',
3243      gradientunits: 'gradientUnits',
3244      hanging: 'hanging',
3245      horizadvx: 'horizAdvX',
3246      'horiz-adv-x': 'horizAdvX',
3247      horizoriginx: 'horizOriginX',
3248      'horiz-origin-x': 'horizOriginX',
3249      ideographic: 'ideographic',
3250      imagerendering: 'imageRendering',
3251      'image-rendering': 'imageRendering',
3252      in2: 'in2',
3253      in: 'in',
3254      inlist: 'inlist',
3255      intercept: 'intercept',
3256      k1: 'k1',
3257      k2: 'k2',
3258      k3: 'k3',
3259      k4: 'k4',
3260      k: 'k',
3261      kernelmatrix: 'kernelMatrix',
3262      kernelunitlength: 'kernelUnitLength',
3263      kerning: 'kerning',
3264      keypoints: 'keyPoints',
3265      keysplines: 'keySplines',
3266      keytimes: 'keyTimes',
3267      lengthadjust: 'lengthAdjust',
3268      letterspacing: 'letterSpacing',
3269      'letter-spacing': 'letterSpacing',
3270      lightingcolor: 'lightingColor',
3271      'lighting-color': 'lightingColor',
3272      limitingconeangle: 'limitingConeAngle',
3273      local: 'local',
3274      markerend: 'markerEnd',
3275      'marker-end': 'markerEnd',
3276      markerheight: 'markerHeight',
3277      markermid: 'markerMid',
3278      'marker-mid': 'markerMid',
3279      markerstart: 'markerStart',
3280      'marker-start': 'markerStart',
3281      markerunits: 'markerUnits',
3282      markerwidth: 'markerWidth',
3283      mask: 'mask',
3284      maskcontentunits: 'maskContentUnits',
3285      maskunits: 'maskUnits',
3286      mathematical: 'mathematical',
3287      mode: 'mode',
3288      numoctaves: 'numOctaves',
3289      offset: 'offset',
3290      opacity: 'opacity',
3291      operator: 'operator',
3292      order: 'order',
3293      orient: 'orient',
3294      orientation: 'orientation',
3295      origin: 'origin',
3296      overflow: 'overflow',
3297      overlineposition: 'overlinePosition',
3298      'overline-position': 'overlinePosition',
3299      overlinethickness: 'overlineThickness',
3300      'overline-thickness': 'overlineThickness',
3301      paintorder: 'paintOrder',
3302      'paint-order': 'paintOrder',
3303      panose1: 'panose1',
3304      'panose-1': 'panose1',
3305      pathlength: 'pathLength',
3306      patterncontentunits: 'patternContentUnits',
3307      patterntransform: 'patternTransform',
3308      patternunits: 'patternUnits',
3309      pointerevents: 'pointerEvents',
3310      'pointer-events': 'pointerEvents',
3311      points: 'points',
3312      pointsatx: 'pointsAtX',
3313      pointsaty: 'pointsAtY',
3314      pointsatz: 'pointsAtZ',
3315      prefix: 'prefix',
3316      preservealpha: 'preserveAlpha',
3317      preserveaspectratio: 'preserveAspectRatio',
3318      primitiveunits: 'primitiveUnits',
3319      property: 'property',
3320      r: 'r',
3321      radius: 'radius',
3322      refx: 'refX',
3323      refy: 'refY',
3324      renderingintent: 'renderingIntent',
3325      'rendering-intent': 'renderingIntent',
3326      repeatcount: 'repeatCount',
3327      repeatdur: 'repeatDur',
3328      requiredextensions: 'requiredExtensions',
3329      requiredfeatures: 'requiredFeatures',
3330      resource: 'resource',
3331      restart: 'restart',
3332      result: 'result',
3333      results: 'results',
3334      rotate: 'rotate',
3335      rx: 'rx',
3336      ry: 'ry',
3337      scale: 'scale',
3338      security: 'security',
3339      seed: 'seed',
3340      shaperendering: 'shapeRendering',
3341      'shape-rendering': 'shapeRendering',
3342      slope: 'slope',
3343      spacing: 'spacing',
3344      specularconstant: 'specularConstant',
3345      specularexponent: 'specularExponent',
3346      speed: 'speed',
3347      spreadmethod: 'spreadMethod',
3348      startoffset: 'startOffset',
3349      stddeviation: 'stdDeviation',
3350      stemh: 'stemh',
3351      stemv: 'stemv',
3352      stitchtiles: 'stitchTiles',
3353      stopcolor: 'stopColor',
3354      'stop-color': 'stopColor',
3355      stopopacity: 'stopOpacity',
3356      'stop-opacity': 'stopOpacity',
3357      strikethroughposition: 'strikethroughPosition',
3358      'strikethrough-position': 'strikethroughPosition',
3359      strikethroughthickness: 'strikethroughThickness',
3360      'strikethrough-thickness': 'strikethroughThickness',
3361      string: 'string',
3362      stroke: 'stroke',
3363      strokedasharray: 'strokeDasharray',
3364      'stroke-dasharray': 'strokeDasharray',
3365      strokedashoffset: 'strokeDashoffset',
3366      'stroke-dashoffset': 'strokeDashoffset',
3367      strokelinecap: 'strokeLinecap',
3368      'stroke-linecap': 'strokeLinecap',
3369      strokelinejoin: 'strokeLinejoin',
3370      'stroke-linejoin': 'strokeLinejoin',
3371      strokemiterlimit: 'strokeMiterlimit',
3372      'stroke-miterlimit': 'strokeMiterlimit',
3373      strokewidth: 'strokeWidth',
3374      'stroke-width': 'strokeWidth',
3375      strokeopacity: 'strokeOpacity',
3376      'stroke-opacity': 'strokeOpacity',
3377      suppresscontenteditablewarning: 'suppressContentEditableWarning',
3378      suppresshydrationwarning: 'suppressHydrationWarning',
3379      surfacescale: 'surfaceScale',
3380      systemlanguage: 'systemLanguage',
3381      tablevalues: 'tableValues',
3382      targetx: 'targetX',
3383      targety: 'targetY',
3384      textanchor: 'textAnchor',
3385      'text-anchor': 'textAnchor',
3386      textdecoration: 'textDecoration',
3387      'text-decoration': 'textDecoration',
3388      textlength: 'textLength',
3389      textrendering: 'textRendering',
3390      'text-rendering': 'textRendering',
3391      to: 'to',
3392      transform: 'transform',
3393      typeof: 'typeof',
3394      u1: 'u1',
3395      u2: 'u2',
3396      underlineposition: 'underlinePosition',
3397      'underline-position': 'underlinePosition',
3398      underlinethickness: 'underlineThickness',
3399      'underline-thickness': 'underlineThickness',
3400      unicode: 'unicode',
3401      unicodebidi: 'unicodeBidi',
3402      'unicode-bidi': 'unicodeBidi',
3403      unicoderange: 'unicodeRange',
3404      'unicode-range': 'unicodeRange',
3405      unitsperem: 'unitsPerEm',
3406      'units-per-em': 'unitsPerEm',
3407      unselectable: 'unselectable',
3408      valphabetic: 'vAlphabetic',
3409      'v-alphabetic': 'vAlphabetic',
3410      values: 'values',
3411      vectoreffect: 'vectorEffect',
3412      'vector-effect': 'vectorEffect',
3413      version: 'version',
3414      vertadvy: 'vertAdvY',
3415      'vert-adv-y': 'vertAdvY',
3416      vertoriginx: 'vertOriginX',
3417      'vert-origin-x': 'vertOriginX',
3418      vertoriginy: 'vertOriginY',
3419      'vert-origin-y': 'vertOriginY',
3420      vhanging: 'vHanging',
3421      'v-hanging': 'vHanging',
3422      videographic: 'vIdeographic',
3423      'v-ideographic': 'vIdeographic',
3424      viewbox: 'viewBox',
3425      viewtarget: 'viewTarget',
3426      visibility: 'visibility',
3427      vmathematical: 'vMathematical',
3428      'v-mathematical': 'vMathematical',
3429      vocab: 'vocab',
3430      widths: 'widths',
3431      wordspacing: 'wordSpacing',
3432      'word-spacing': 'wordSpacing',
3433      writingmode: 'writingMode',
3434      'writing-mode': 'writingMode',
3435      x1: 'x1',
3436      x2: 'x2',
3437      x: 'x',
3438      xchannelselector: 'xChannelSelector',
3439      xheight: 'xHeight',
3440      'x-height': 'xHeight',
3441      xlinkactuate: 'xlinkActuate',
3442      'xlink:actuate': 'xlinkActuate',
3443      xlinkarcrole: 'xlinkArcrole',
3444      'xlink:arcrole': 'xlinkArcrole',
3445      xlinkhref: 'xlinkHref',
3446      'xlink:href': 'xlinkHref',
3447      xlinkrole: 'xlinkRole',
3448      'xlink:role': 'xlinkRole',
3449      xlinkshow: 'xlinkShow',
3450      'xlink:show': 'xlinkShow',
3451      xlinktitle: 'xlinkTitle',
3452      'xlink:title': 'xlinkTitle',
3453      xlinktype: 'xlinkType',
3454      'xlink:type': 'xlinkType',
3455      xmlbase: 'xmlBase',
3456      'xml:base': 'xmlBase',
3457      xmllang: 'xmlLang',
3458      'xml:lang': 'xmlLang',
3459      xmlns: 'xmlns',
3460      'xml:space': 'xmlSpace',
3461      xmlnsxlink: 'xmlnsXlink',
3462      'xmlns:xlink': 'xmlnsXlink',
3463      xmlspace: 'xmlSpace',
3464      y1: 'y1',
3465      y2: 'y2',
3466      y: 'y',
3467      ychannelselector: 'yChannelSelector',
3468      z: 'z',
3469      zoomandpan: 'zoomAndPan'
3470    };
3471  
3472    var ariaProperties = {
3473      'aria-current': 0,
3474      // state
3475      'aria-description': 0,
3476      'aria-details': 0,
3477      'aria-disabled': 0,
3478      // state
3479      'aria-hidden': 0,
3480      // state
3481      'aria-invalid': 0,
3482      // state
3483      'aria-keyshortcuts': 0,
3484      'aria-label': 0,
3485      'aria-roledescription': 0,
3486      // Widget Attributes
3487      'aria-autocomplete': 0,
3488      'aria-checked': 0,
3489      'aria-expanded': 0,
3490      'aria-haspopup': 0,
3491      'aria-level': 0,
3492      'aria-modal': 0,
3493      'aria-multiline': 0,
3494      'aria-multiselectable': 0,
3495      'aria-orientation': 0,
3496      'aria-placeholder': 0,
3497      'aria-pressed': 0,
3498      'aria-readonly': 0,
3499      'aria-required': 0,
3500      'aria-selected': 0,
3501      'aria-sort': 0,
3502      'aria-valuemax': 0,
3503      'aria-valuemin': 0,
3504      'aria-valuenow': 0,
3505      'aria-valuetext': 0,
3506      // Live Region Attributes
3507      'aria-atomic': 0,
3508      'aria-busy': 0,
3509      'aria-live': 0,
3510      'aria-relevant': 0,
3511      // Drag-and-Drop Attributes
3512      'aria-dropeffect': 0,
3513      'aria-grabbed': 0,
3514      // Relationship Attributes
3515      'aria-activedescendant': 0,
3516      'aria-colcount': 0,
3517      'aria-colindex': 0,
3518      'aria-colspan': 0,
3519      'aria-controls': 0,
3520      'aria-describedby': 0,
3521      'aria-errormessage': 0,
3522      'aria-flowto': 0,
3523      'aria-labelledby': 0,
3524      'aria-owns': 0,
3525      'aria-posinset': 0,
3526      'aria-rowcount': 0,
3527      'aria-rowindex': 0,
3528      'aria-rowspan': 0,
3529      'aria-setsize': 0
3530    };
3531  
3532    var warnedProperties = {};
3533    var rARIA = new RegExp('^(aria)-[' + ATTRIBUTE_NAME_CHAR + ']*$');
3534    var rARIACamel = new RegExp('^(aria)[A-Z][' + ATTRIBUTE_NAME_CHAR + ']*$');
3535  
3536    function validateProperty(tagName, name) {
3537      {
3538        if (hasOwnProperty.call(warnedProperties, name) && warnedProperties[name]) {
3539          return true;
3540        }
3541  
3542        if (rARIACamel.test(name)) {
3543          var ariaName = 'aria-' + name.slice(4).toLowerCase();
3544          var correctName = ariaProperties.hasOwnProperty(ariaName) ? ariaName : null; // If this is an aria-* attribute, but is not listed in the known DOM
3545          // DOM properties, then it is an invalid aria-* attribute.
3546  
3547          if (correctName == null) {
3548            error('Invalid ARIA attribute `%s`. ARIA attributes follow the pattern aria-* and must be lowercase.', name);
3549  
3550            warnedProperties[name] = true;
3551            return true;
3552          } // aria-* attributes should be lowercase; suggest the lowercase version.
3553  
3554  
3555          if (name !== correctName) {
3556            error('Invalid ARIA attribute `%s`. Did you mean `%s`?', name, correctName);
3557  
3558            warnedProperties[name] = true;
3559            return true;
3560          }
3561        }
3562  
3563        if (rARIA.test(name)) {
3564          var lowerCasedName = name.toLowerCase();
3565          var standardName = ariaProperties.hasOwnProperty(lowerCasedName) ? lowerCasedName : null; // If this is an aria-* attribute, but is not listed in the known DOM
3566          // DOM properties, then it is an invalid aria-* attribute.
3567  
3568          if (standardName == null) {
3569            warnedProperties[name] = true;
3570            return false;
3571          } // aria-* attributes should be lowercase; suggest the lowercase version.
3572  
3573  
3574          if (name !== standardName) {
3575            error('Unknown ARIA attribute `%s`. Did you mean `%s`?', name, standardName);
3576  
3577            warnedProperties[name] = true;
3578            return true;
3579          }
3580        }
3581      }
3582  
3583      return true;
3584    }
3585  
3586    function warnInvalidARIAProps(type, props) {
3587      {
3588        var invalidProps = [];
3589  
3590        for (var key in props) {
3591          var isValid = validateProperty(type, key);
3592  
3593          if (!isValid) {
3594            invalidProps.push(key);
3595          }
3596        }
3597  
3598        var unknownPropString = invalidProps.map(function (prop) {
3599          return '`' + prop + '`';
3600        }).join(', ');
3601  
3602        if (invalidProps.length === 1) {
3603          error('Invalid aria prop %s on <%s> tag. ' + 'For details, see https://reactjs.org/link/invalid-aria-props', unknownPropString, type);
3604        } else if (invalidProps.length > 1) {
3605          error('Invalid aria props %s on <%s> tag. ' + 'For details, see https://reactjs.org/link/invalid-aria-props', unknownPropString, type);
3606        }
3607      }
3608    }
3609  
3610    function validateProperties(type, props) {
3611      if (isCustomComponent(type, props)) {
3612        return;
3613      }
3614  
3615      warnInvalidARIAProps(type, props);
3616    }
3617  
3618    var didWarnValueNull = false;
3619    function validateProperties$1(type, props) {
3620      {
3621        if (type !== 'input' && type !== 'textarea' && type !== 'select') {
3622          return;
3623        }
3624  
3625        if (props != null && props.value === null && !didWarnValueNull) {
3626          didWarnValueNull = true;
3627  
3628          if (type === 'select' && props.multiple) {
3629            error('`value` prop on `%s` should not be null. ' + 'Consider using an empty array when `multiple` is set to `true` ' + 'to clear the component or `undefined` for uncontrolled components.', type);
3630          } else {
3631            error('`value` prop on `%s` should not be null. ' + 'Consider using an empty string to clear the component or `undefined` ' + 'for uncontrolled components.', type);
3632          }
3633        }
3634      }
3635    }
3636  
3637    var validateProperty$1 = function () {};
3638  
3639    {
3640      var warnedProperties$1 = {};
3641      var EVENT_NAME_REGEX = /^on./;
3642      var INVALID_EVENT_NAME_REGEX = /^on[^A-Z]/;
3643      var rARIA$1 = new RegExp('^(aria)-[' + ATTRIBUTE_NAME_CHAR + ']*$');
3644      var rARIACamel$1 = new RegExp('^(aria)[A-Z][' + ATTRIBUTE_NAME_CHAR + ']*$');
3645  
3646      validateProperty$1 = function (tagName, name, value, eventRegistry) {
3647        if (hasOwnProperty.call(warnedProperties$1, name) && warnedProperties$1[name]) {
3648          return true;
3649        }
3650  
3651        var lowerCasedName = name.toLowerCase();
3652  
3653        if (lowerCasedName === 'onfocusin' || lowerCasedName === 'onfocusout') {
3654          error('React uses onFocus and onBlur instead of onFocusIn and onFocusOut. ' + 'All React events are normalized to bubble, so onFocusIn and onFocusOut ' + 'are not needed/supported by React.');
3655  
3656          warnedProperties$1[name] = true;
3657          return true;
3658        } // We can't rely on the event system being injected on the server.
3659  
3660  
3661        if (eventRegistry != null) {
3662          var registrationNameDependencies = eventRegistry.registrationNameDependencies,
3663              possibleRegistrationNames = eventRegistry.possibleRegistrationNames;
3664  
3665          if (registrationNameDependencies.hasOwnProperty(name)) {
3666            return true;
3667          }
3668  
3669          var registrationName = possibleRegistrationNames.hasOwnProperty(lowerCasedName) ? possibleRegistrationNames[lowerCasedName] : null;
3670  
3671          if (registrationName != null) {
3672            error('Invalid event handler property `%s`. Did you mean `%s`?', name, registrationName);
3673  
3674            warnedProperties$1[name] = true;
3675            return true;
3676          }
3677  
3678          if (EVENT_NAME_REGEX.test(name)) {
3679            error('Unknown event handler property `%s`. It will be ignored.', name);
3680  
3681            warnedProperties$1[name] = true;
3682            return true;
3683          }
3684        } else if (EVENT_NAME_REGEX.test(name)) {
3685          // If no event plugins have been injected, we are in a server environment.
3686          // So we can't tell if the event name is correct for sure, but we can filter
3687          // out known bad ones like `onclick`. We can't suggest a specific replacement though.
3688          if (INVALID_EVENT_NAME_REGEX.test(name)) {
3689            error('Invalid event handler property `%s`. ' + 'React events use the camelCase naming convention, for example `onClick`.', name);
3690          }
3691  
3692          warnedProperties$1[name] = true;
3693          return true;
3694        } // Let the ARIA attribute hook validate ARIA attributes
3695  
3696  
3697        if (rARIA$1.test(name) || rARIACamel$1.test(name)) {
3698          return true;
3699        }
3700  
3701        if (lowerCasedName === 'innerhtml') {
3702          error('Directly setting property `innerHTML` is not permitted. ' + 'For more information, lookup documentation on `dangerouslySetInnerHTML`.');
3703  
3704          warnedProperties$1[name] = true;
3705          return true;
3706        }
3707  
3708        if (lowerCasedName === 'aria') {
3709          error('The `aria` attribute is reserved for future use in React. ' + 'Pass individual `aria-` attributes instead.');
3710  
3711          warnedProperties$1[name] = true;
3712          return true;
3713        }
3714  
3715        if (lowerCasedName === 'is' && value !== null && value !== undefined && typeof value !== 'string') {
3716          error('Received a `%s` for a string attribute `is`. If this is expected, cast ' + 'the value to a string.', typeof value);
3717  
3718          warnedProperties$1[name] = true;
3719          return true;
3720        }
3721  
3722        if (typeof value === 'number' && isNaN(value)) {
3723          error('Received NaN for the `%s` attribute. If this is expected, cast ' + 'the value to a string.', name);
3724  
3725          warnedProperties$1[name] = true;
3726          return true;
3727        }
3728  
3729        var propertyInfo = getPropertyInfo(name);
3730        var isReserved = propertyInfo !== null && propertyInfo.type === RESERVED; // Known attributes should match the casing specified in the property config.
3731  
3732        if (possibleStandardNames.hasOwnProperty(lowerCasedName)) {
3733          var standardName = possibleStandardNames[lowerCasedName];
3734  
3735          if (standardName !== name) {
3736            error('Invalid DOM property `%s`. Did you mean `%s`?', name, standardName);
3737  
3738            warnedProperties$1[name] = true;
3739            return true;
3740          }
3741        } else if (!isReserved && name !== lowerCasedName) {
3742          // Unknown attributes should have lowercase casing since that's how they
3743          // will be cased anyway with server rendering.
3744          error('React does not recognize the `%s` prop on a DOM element. If you ' + 'intentionally want it to appear in the DOM as a custom ' + 'attribute, spell it as lowercase `%s` instead. ' + 'If you accidentally passed it from a parent component, remove ' + 'it from the DOM element.', name, lowerCasedName);
3745  
3746          warnedProperties$1[name] = true;
3747          return true;
3748        }
3749  
3750        if (typeof value === 'boolean' && shouldRemoveAttributeWithWarning(name, value, propertyInfo, false)) {
3751          if (value) {
3752            error('Received `%s` for a non-boolean attribute `%s`.\n\n' + 'If you want to write it to the DOM, pass a string instead: ' + '%s="%s" or %s={value.toString()}.', value, name, name, value, name);
3753          } else {
3754            error('Received `%s` for a non-boolean attribute `%s`.\n\n' + 'If you want to write it to the DOM, pass a string instead: ' + '%s="%s" or %s={value.toString()}.\n\n' + 'If you used to conditionally omit it with %s={condition && value}, ' + 'pass %s={condition ? value : undefined} instead.', value, name, name, value, name, name, name);
3755          }
3756  
3757          warnedProperties$1[name] = true;
3758          return true;
3759        } // Now that we've validated casing, do not validate
3760        // data types for reserved props
3761  
3762  
3763        if (isReserved) {
3764          return true;
3765        } // Warn when a known attribute is a bad type
3766  
3767  
3768        if (shouldRemoveAttributeWithWarning(name, value, propertyInfo, false)) {
3769          warnedProperties$1[name] = true;
3770          return false;
3771        } // Warn when passing the strings 'false' or 'true' into a boolean prop
3772  
3773  
3774        if ((value === 'false' || value === 'true') && propertyInfo !== null && propertyInfo.type === BOOLEAN) {
3775          error('Received the string `%s` for the boolean attribute `%s`. ' + '%s ' + 'Did you mean %s={%s}?', value, name, value === 'false' ? 'The browser will interpret it as a truthy value.' : 'Although this works, it will not work as expected if you pass the string "false".', name, value);
3776  
3777          warnedProperties$1[name] = true;
3778          return true;
3779        }
3780  
3781        return true;
3782      };
3783    }
3784  
3785    var warnUnknownProperties = function (type, props, eventRegistry) {
3786      {
3787        var unknownProps = [];
3788  
3789        for (var key in props) {
3790          var isValid = validateProperty$1(type, key, props[key], eventRegistry);
3791  
3792          if (!isValid) {
3793            unknownProps.push(key);
3794          }
3795        }
3796  
3797        var unknownPropString = unknownProps.map(function (prop) {
3798          return '`' + prop + '`';
3799        }).join(', ');
3800  
3801        if (unknownProps.length === 1) {
3802          error('Invalid value for prop %s on <%s> tag. Either remove it from the element, ' + 'or pass a string or number value to keep it in the DOM. ' + 'For details, see https://reactjs.org/link/attribute-behavior ', unknownPropString, type);
3803        } else if (unknownProps.length > 1) {
3804          error('Invalid values for props %s on <%s> tag. Either remove them from the element, ' + 'or pass a string or number value to keep them in the DOM. ' + 'For details, see https://reactjs.org/link/attribute-behavior ', unknownPropString, type);
3805        }
3806      }
3807    };
3808  
3809    function validateProperties$2(type, props, eventRegistry) {
3810      if (isCustomComponent(type, props)) {
3811        return;
3812      }
3813  
3814      warnUnknownProperties(type, props, eventRegistry);
3815    }
3816  
3817    var IS_EVENT_HANDLE_NON_MANAGED_NODE = 1;
3818    var IS_NON_DELEGATED = 1 << 1;
3819    var IS_CAPTURE_PHASE = 1 << 2;
3820    // set to LEGACY_FB_SUPPORT. LEGACY_FB_SUPPORT only gets set when
3821    // we call willDeferLaterForLegacyFBSupport, thus not bailing out
3822    // will result in endless cycles like an infinite loop.
3823    // We also don't want to defer during event replaying.
3824  
3825    var SHOULD_NOT_PROCESS_POLYFILL_EVENT_PLUGINS = IS_EVENT_HANDLE_NON_MANAGED_NODE | IS_NON_DELEGATED | IS_CAPTURE_PHASE;
3826  
3827    // This exists to avoid circular dependency between ReactDOMEventReplaying
3828    // and DOMPluginEventSystem.
3829    var currentReplayingEvent = null;
3830    function setReplayingEvent(event) {
3831      {
3832        if (currentReplayingEvent !== null) {
3833          error('Expected currently replaying event to be null. This error ' + 'is likely caused by a bug in React. Please file an issue.');
3834        }
3835      }
3836  
3837      currentReplayingEvent = event;
3838    }
3839    function resetReplayingEvent() {
3840      {
3841        if (currentReplayingEvent === null) {
3842          error('Expected currently replaying event to not be null. This error ' + 'is likely caused by a bug in React. Please file an issue.');
3843        }
3844      }
3845  
3846      currentReplayingEvent = null;
3847    }
3848    function isReplayingEvent(event) {
3849      return event === currentReplayingEvent;
3850    }
3851  
3852    /**
3853     * Gets the target node from a native browser event by accounting for
3854     * inconsistencies in browser DOM APIs.
3855     *
3856     * @param {object} nativeEvent Native browser event.
3857     * @return {DOMEventTarget} Target node.
3858     */
3859  
3860    function getEventTarget(nativeEvent) {
3861      // Fallback to nativeEvent.srcElement for IE9
3862      // https://github.com/facebook/react/issues/12506
3863      var target = nativeEvent.target || nativeEvent.srcElement || window; // Normalize SVG <use> element events #4963
3864  
3865      if (target.correspondingUseElement) {
3866        target = target.correspondingUseElement;
3867      } // Safari may fire events on text nodes (Node.TEXT_NODE is 3).
3868      // @see http://www.quirksmode.org/js/events_properties.html
3869  
3870  
3871      return target.nodeType === TEXT_NODE ? target.parentNode : target;
3872    }
3873  
3874    var restoreImpl = null;
3875    var restoreTarget = null;
3876    var restoreQueue = null;
3877  
3878    function restoreStateOfTarget(target) {
3879      // We perform this translation at the end of the event loop so that we
3880      // always receive the correct fiber here
3881      var internalInstance = getInstanceFromNode(target);
3882  
3883      if (!internalInstance) {
3884        // Unmounted
3885        return;
3886      }
3887  
3888      if (typeof restoreImpl !== 'function') {
3889        throw new Error('setRestoreImplementation() needs to be called to handle a target for controlled ' + 'events. This error is likely caused by a bug in React. Please file an issue.');
3890      }
3891  
3892      var stateNode = internalInstance.stateNode; // Guard against Fiber being unmounted.
3893  
3894      if (stateNode) {
3895        var _props = getFiberCurrentPropsFromNode(stateNode);
3896  
3897        restoreImpl(internalInstance.stateNode, internalInstance.type, _props);
3898      }
3899    }
3900  
3901    function setRestoreImplementation(impl) {
3902      restoreImpl = impl;
3903    }
3904    function enqueueStateRestore(target) {
3905      if (restoreTarget) {
3906        if (restoreQueue) {
3907          restoreQueue.push(target);
3908        } else {
3909          restoreQueue = [target];
3910        }
3911      } else {
3912        restoreTarget = target;
3913      }
3914    }
3915    function needsStateRestore() {
3916      return restoreTarget !== null || restoreQueue !== null;
3917    }
3918    function restoreStateIfNeeded() {
3919      if (!restoreTarget) {
3920        return;
3921      }
3922  
3923      var target = restoreTarget;
3924      var queuedTargets = restoreQueue;
3925      restoreTarget = null;
3926      restoreQueue = null;
3927      restoreStateOfTarget(target);
3928  
3929      if (queuedTargets) {
3930        for (var i = 0; i < queuedTargets.length; i++) {
3931          restoreStateOfTarget(queuedTargets[i]);
3932        }
3933      }
3934    }
3935  
3936    // the renderer. Such as when we're dispatching events or if third party
3937    // libraries need to call batchedUpdates. Eventually, this API will go away when
3938    // everything is batched by default. We'll then have a similar API to opt-out of
3939    // scheduled work and instead do synchronous work.
3940    // Defaults
3941  
3942    var batchedUpdatesImpl = function (fn, bookkeeping) {
3943      return fn(bookkeeping);
3944    };
3945  
3946    var flushSyncImpl = function () {};
3947  
3948    var isInsideEventHandler = false;
3949  
3950    function finishEventHandler() {
3951      // Here we wait until all updates have propagated, which is important
3952      // when using controlled components within layers:
3953      // https://github.com/facebook/react/issues/1698
3954      // Then we restore state of any controlled component.
3955      var controlledComponentsHavePendingUpdates = needsStateRestore();
3956  
3957      if (controlledComponentsHavePendingUpdates) {
3958        // If a controlled event was fired, we may need to restore the state of
3959        // the DOM node back to the controlled value. This is necessary when React
3960        // bails out of the update without touching the DOM.
3961        // TODO: Restore state in the microtask, after the discrete updates flush,
3962        // instead of early flushing them here.
3963        flushSyncImpl();
3964        restoreStateIfNeeded();
3965      }
3966    }
3967  
3968    function batchedUpdates(fn, a, b) {
3969      if (isInsideEventHandler) {
3970        // If we are currently inside another batch, we need to wait until it
3971        // fully completes before restoring state.
3972        return fn(a, b);
3973      }
3974  
3975      isInsideEventHandler = true;
3976  
3977      try {
3978        return batchedUpdatesImpl(fn, a, b);
3979      } finally {
3980        isInsideEventHandler = false;
3981        finishEventHandler();
3982      }
3983    } // TODO: Replace with flushSync
3984    function setBatchingImplementation(_batchedUpdatesImpl, _discreteUpdatesImpl, _flushSyncImpl) {
3985      batchedUpdatesImpl = _batchedUpdatesImpl;
3986      flushSyncImpl = _flushSyncImpl;
3987    }
3988  
3989    function isInteractive(tag) {
3990      return tag === 'button' || tag === 'input' || tag === 'select' || tag === 'textarea';
3991    }
3992  
3993    function shouldPreventMouseEvent(name, type, props) {
3994      switch (name) {
3995        case 'onClick':
3996        case 'onClickCapture':
3997        case 'onDoubleClick':
3998        case 'onDoubleClickCapture':
3999        case 'onMouseDown':
4000        case 'onMouseDownCapture':
4001        case 'onMouseMove':
4002        case 'onMouseMoveCapture':
4003        case 'onMouseUp':
4004        case 'onMouseUpCapture':
4005        case 'onMouseEnter':
4006          return !!(props.disabled && isInteractive(type));
4007  
4008        default:
4009          return false;
4010      }
4011    }
4012    /**
4013     * @param {object} inst The instance, which is the source of events.
4014     * @param {string} registrationName Name of listener (e.g. `onClick`).
4015     * @return {?function} The stored callback.
4016     */
4017  
4018  
4019    function getListener(inst, registrationName) {
4020      var stateNode = inst.stateNode;
4021  
4022      if (stateNode === null) {
4023        // Work in progress (ex: onload events in incremental mode).
4024        return null;
4025      }
4026  
4027      var props = getFiberCurrentPropsFromNode(stateNode);
4028  
4029      if (props === null) {
4030        // Work in progress.
4031        return null;
4032      }
4033  
4034      var listener = props[registrationName];
4035  
4036      if (shouldPreventMouseEvent(registrationName, inst.type, props)) {
4037        return null;
4038      }
4039  
4040      if (listener && typeof listener !== 'function') {
4041        throw new Error("Expected `" + registrationName + "` listener to be a function, instead got a value of `" + typeof listener + "` type.");
4042      }
4043  
4044      return listener;
4045    }
4046  
4047    var passiveBrowserEventsSupported = false; // Check if browser support events with passive listeners
4048    // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Safely_detecting_option_support
4049  
4050    if (canUseDOM) {
4051      try {
4052        var options = {}; // $FlowFixMe: Ignore Flow complaining about needing a value
4053  
4054        Object.defineProperty(options, 'passive', {
4055          get: function () {
4056            passiveBrowserEventsSupported = true;
4057          }
4058        });
4059        window.addEventListener('test', options, options);
4060        window.removeEventListener('test', options, options);
4061      } catch (e) {
4062        passiveBrowserEventsSupported = false;
4063      }
4064    }
4065  
4066    function invokeGuardedCallbackProd(name, func, context, a, b, c, d, e, f) {
4067      var funcArgs = Array.prototype.slice.call(arguments, 3);
4068  
4069      try {
4070        func.apply(context, funcArgs);
4071      } catch (error) {
4072        this.onError(error);
4073      }
4074    }
4075  
4076    var invokeGuardedCallbackImpl = invokeGuardedCallbackProd;
4077  
4078    {
4079      // In DEV mode, we swap out invokeGuardedCallback for a special version
4080      // that plays more nicely with the browser's DevTools. The idea is to preserve
4081      // "Pause on exceptions" behavior. Because React wraps all user-provided
4082      // functions in invokeGuardedCallback, and the production version of
4083      // invokeGuardedCallback uses a try-catch, all user exceptions are treated
4084      // like caught exceptions, and the DevTools won't pause unless the developer
4085      // takes the extra step of enabling pause on caught exceptions. This is
4086      // unintuitive, though, because even though React has caught the error, from
4087      // the developer's perspective, the error is uncaught.
4088      //
4089      // To preserve the expected "Pause on exceptions" behavior, we don't use a
4090      // try-catch in DEV. Instead, we synchronously dispatch a fake event to a fake
4091      // DOM node, and call the user-provided callback from inside an event handler
4092      // for that fake event. If the callback throws, the error is "captured" using
4093      // a global event handler. But because the error happens in a different
4094      // event loop context, it does not interrupt the normal program flow.
4095      // Effectively, this gives us try-catch behavior without actually using
4096      // try-catch. Neat!
4097      // Check that the browser supports the APIs we need to implement our special
4098      // DEV version of invokeGuardedCallback
4099      if (typeof window !== 'undefined' && typeof window.dispatchEvent === 'function' && typeof document !== 'undefined' && typeof document.createEvent === 'function') {
4100        var fakeNode = document.createElement('react');
4101  
4102        invokeGuardedCallbackImpl = function invokeGuardedCallbackDev(name, func, context, a, b, c, d, e, f) {
4103          // If document doesn't exist we know for sure we will crash in this method
4104          // when we call document.createEvent(). However this can cause confusing
4105          // errors: https://github.com/facebook/create-react-app/issues/3482
4106          // So we preemptively throw with a better message instead.
4107          if (typeof document === 'undefined' || document === null) {
4108            throw new Error('The `document` global was defined when React was initialized, but is not ' + 'defined anymore. This can happen in a test environment if a component ' + 'schedules an update from an asynchronous callback, but the test has already ' + 'finished running. To solve this, you can either unmount the component at ' + 'the end of your test (and ensure that any asynchronous operations get ' + 'canceled in `componentWillUnmount`), or you can change the test itself ' + 'to be asynchronous.');
4109          }
4110  
4111          var evt = document.createEvent('Event');
4112          var didCall = false; // Keeps track of whether the user-provided callback threw an error. We
4113          // set this to true at the beginning, then set it to false right after
4114          // calling the function. If the function errors, `didError` will never be
4115          // set to false. This strategy works even if the browser is flaky and
4116          // fails to call our global error handler, because it doesn't rely on
4117          // the error event at all.
4118  
4119          var didError = true; // Keeps track of the value of window.event so that we can reset it
4120          // during the callback to let user code access window.event in the
4121          // browsers that support it.
4122  
4123          var windowEvent = window.event; // Keeps track of the descriptor of window.event to restore it after event
4124          // dispatching: https://github.com/facebook/react/issues/13688
4125  
4126          var windowEventDescriptor = Object.getOwnPropertyDescriptor(window, 'event');
4127  
4128          function restoreAfterDispatch() {
4129            // We immediately remove the callback from event listeners so that
4130            // nested `invokeGuardedCallback` calls do not clash. Otherwise, a
4131            // nested call would trigger the fake event handlers of any call higher
4132            // in the stack.
4133            fakeNode.removeEventListener(evtType, callCallback, false); // We check for window.hasOwnProperty('event') to prevent the
4134            // window.event assignment in both IE <= 10 as they throw an error
4135            // "Member not found" in strict mode, and in Firefox which does not
4136            // support window.event.
4137  
4138            if (typeof window.event !== 'undefined' && window.hasOwnProperty('event')) {
4139              window.event = windowEvent;
4140            }
4141          } // Create an event handler for our fake event. We will synchronously
4142          // dispatch our fake event using `dispatchEvent`. Inside the handler, we
4143          // call the user-provided callback.
4144  
4145  
4146          var funcArgs = Array.prototype.slice.call(arguments, 3);
4147  
4148          function callCallback() {
4149            didCall = true;
4150            restoreAfterDispatch();
4151            func.apply(context, funcArgs);
4152            didError = false;
4153          } // Create a global error event handler. We use this to capture the value
4154          // that was thrown. It's possible that this error handler will fire more
4155          // than once; for example, if non-React code also calls `dispatchEvent`
4156          // and a handler for that event throws. We should be resilient to most of
4157          // those cases. Even if our error event handler fires more than once, the
4158          // last error event is always used. If the callback actually does error,
4159          // we know that the last error event is the correct one, because it's not
4160          // possible for anything else to have happened in between our callback
4161          // erroring and the code that follows the `dispatchEvent` call below. If
4162          // the callback doesn't error, but the error event was fired, we know to
4163          // ignore it because `didError` will be false, as described above.
4164  
4165  
4166          var error; // Use this to track whether the error event is ever called.
4167  
4168          var didSetError = false;
4169          var isCrossOriginError = false;
4170  
4171          function handleWindowError(event) {
4172            error = event.error;
4173            didSetError = true;
4174  
4175            if (error === null && event.colno === 0 && event.lineno === 0) {
4176              isCrossOriginError = true;
4177            }
4178  
4179            if (event.defaultPrevented) {
4180              // Some other error handler has prevented default.
4181              // Browsers silence the error report if this happens.
4182              // We'll remember this to later decide whether to log it or not.
4183              if (error != null && typeof error === 'object') {
4184                try {
4185                  error._suppressLogging = true;
4186                } catch (inner) {// Ignore.
4187                }
4188              }
4189            }
4190          } // Create a fake event type.
4191  
4192  
4193          var evtType = "react-" + (name ? name : 'invokeguardedcallback'); // Attach our event handlers
4194  
4195          window.addEventListener('error', handleWindowError);
4196          fakeNode.addEventListener(evtType, callCallback, false); // Synchronously dispatch our fake event. If the user-provided function
4197          // errors, it will trigger our global error handler.
4198  
4199          evt.initEvent(evtType, false, false);
4200          fakeNode.dispatchEvent(evt);
4201  
4202          if (windowEventDescriptor) {
4203            Object.defineProperty(window, 'event', windowEventDescriptor);
4204          }
4205  
4206          if (didCall && didError) {
4207            if (!didSetError) {
4208              // The callback errored, but the error event never fired.
4209              // eslint-disable-next-line react-internal/prod-error-codes
4210              error = new Error('An error was thrown inside one of your components, but React ' + "doesn't know what it was. This is likely due to browser " + 'flakiness. React does its best to preserve the "Pause on ' + 'exceptions" behavior of the DevTools, which requires some ' + "DEV-mode only tricks. It's possible that these don't work in " + 'your browser. Try triggering the error in production mode, ' + 'or switching to a modern browser. If you suspect that this is ' + 'actually an issue with React, please file an issue.');
4211            } else if (isCrossOriginError) {
4212              // eslint-disable-next-line react-internal/prod-error-codes
4213              error = new Error("A cross-origin error was thrown. React doesn't have access to " + 'the actual error object in development. ' + 'See https://reactjs.org/link/crossorigin-error for more information.');
4214            }
4215  
4216            this.onError(error);
4217          } // Remove our event listeners
4218  
4219  
4220          window.removeEventListener('error', handleWindowError);
4221  
4222          if (!didCall) {
4223            // Something went really wrong, and our event was not dispatched.
4224            // https://github.com/facebook/react/issues/16734
4225            // https://github.com/facebook/react/issues/16585
4226            // Fall back to the production implementation.
4227            restoreAfterDispatch();
4228            return invokeGuardedCallbackProd.apply(this, arguments);
4229          }
4230        };
4231      }
4232    }
4233  
4234    var invokeGuardedCallbackImpl$1 = invokeGuardedCallbackImpl;
4235  
4236    var hasError = false;
4237    var caughtError = null; // Used by event system to capture/rethrow the first error.
4238  
4239    var hasRethrowError = false;
4240    var rethrowError = null;
4241    var reporter = {
4242      onError: function (error) {
4243        hasError = true;
4244        caughtError = error;
4245      }
4246    };
4247    /**
4248     * Call a function while guarding against errors that happens within it.
4249     * Returns an error if it throws, otherwise null.
4250     *
4251     * In production, this is implemented using a try-catch. The reason we don't
4252     * use a try-catch directly is so that we can swap out a different
4253     * implementation in DEV mode.
4254     *
4255     * @param {String} name of the guard to use for logging or debugging
4256     * @param {Function} func The function to invoke
4257     * @param {*} context The context to use when calling the function
4258     * @param {...*} args Arguments for function
4259     */
4260  
4261    function invokeGuardedCallback(name, func, context, a, b, c, d, e, f) {
4262      hasError = false;
4263      caughtError = null;
4264      invokeGuardedCallbackImpl$1.apply(reporter, arguments);
4265    }
4266    /**
4267     * Same as invokeGuardedCallback, but instead of returning an error, it stores
4268     * it in a global so it can be rethrown by `rethrowCaughtError` later.
4269     * TODO: See if caughtError and rethrowError can be unified.
4270     *
4271     * @param {String} name of the guard to use for logging or debugging
4272     * @param {Function} func The function to invoke
4273     * @param {*} context The context to use when calling the function
4274     * @param {...*} args Arguments for function
4275     */
4276  
4277    function invokeGuardedCallbackAndCatchFirstError(name, func, context, a, b, c, d, e, f) {
4278      invokeGuardedCallback.apply(this, arguments);
4279  
4280      if (hasError) {
4281        var error = clearCaughtError();
4282  
4283        if (!hasRethrowError) {
4284          hasRethrowError = true;
4285          rethrowError = error;
4286        }
4287      }
4288    }
4289    /**
4290     * During execution of guarded functions we will capture the first error which
4291     * we will rethrow to be handled by the top level error handler.
4292     */
4293  
4294    function rethrowCaughtError() {
4295      if (hasRethrowError) {
4296        var error = rethrowError;
4297        hasRethrowError = false;
4298        rethrowError = null;
4299        throw error;
4300      }
4301    }
4302    function hasCaughtError() {
4303      return hasError;
4304    }
4305    function clearCaughtError() {
4306      if (hasError) {
4307        var error = caughtError;
4308        hasError = false;
4309        caughtError = null;
4310        return error;
4311      } else {
4312        throw new Error('clearCaughtError was called but no error was captured. This error ' + 'is likely caused by a bug in React. Please file an issue.');
4313      }
4314    }
4315  
4316    var ReactInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
4317    var _ReactInternals$Sched = ReactInternals.Scheduler,
4318        unstable_cancelCallback = _ReactInternals$Sched.unstable_cancelCallback,
4319        unstable_now = _ReactInternals$Sched.unstable_now,
4320        unstable_scheduleCallback = _ReactInternals$Sched.unstable_scheduleCallback,
4321        unstable_shouldYield = _ReactInternals$Sched.unstable_shouldYield,
4322        unstable_requestPaint = _ReactInternals$Sched.unstable_requestPaint,
4323        unstable_getFirstCallbackNode = _ReactInternals$Sched.unstable_getFirstCallbackNode,
4324        unstable_runWithPriority = _ReactInternals$Sched.unstable_runWithPriority,
4325        unstable_next = _ReactInternals$Sched.unstable_next,
4326        unstable_continueExecution = _ReactInternals$Sched.unstable_continueExecution,
4327        unstable_pauseExecution = _ReactInternals$Sched.unstable_pauseExecution,
4328        unstable_getCurrentPriorityLevel = _ReactInternals$Sched.unstable_getCurrentPriorityLevel,
4329        unstable_ImmediatePriority = _ReactInternals$Sched.unstable_ImmediatePriority,
4330        unstable_UserBlockingPriority = _ReactInternals$Sched.unstable_UserBlockingPriority,
4331        unstable_NormalPriority = _ReactInternals$Sched.unstable_NormalPriority,
4332        unstable_LowPriority = _ReactInternals$Sched.unstable_LowPriority,
4333        unstable_IdlePriority = _ReactInternals$Sched.unstable_IdlePriority,
4334        unstable_forceFrameRate = _ReactInternals$Sched.unstable_forceFrameRate,
4335        unstable_flushAllWithoutAsserting = _ReactInternals$Sched.unstable_flushAllWithoutAsserting,
4336        unstable_yieldValue = _ReactInternals$Sched.unstable_yieldValue,
4337        unstable_setDisableYieldValue = _ReactInternals$Sched.unstable_setDisableYieldValue;
4338  
4339    /**
4340     * `ReactInstanceMap` maintains a mapping from a public facing stateful
4341     * instance (key) and the internal representation (value). This allows public
4342     * methods to accept the user facing instance as an argument and map them back
4343     * to internal methods.
4344     *
4345     * Note that this module is currently shared and assumed to be stateless.
4346     * If this becomes an actual Map, that will break.
4347     */
4348    function get(key) {
4349      return key._reactInternals;
4350    }
4351    function has(key) {
4352      return key._reactInternals !== undefined;
4353    }
4354    function set(key, value) {
4355      key._reactInternals = value;
4356    }
4357  
4358    // Don't change these two values. They're used by React Dev Tools.
4359    var NoFlags =
4360    /*                      */
4361    0;
4362    var PerformedWork =
4363    /*                */
4364    1; // You can change the rest (and add more).
4365  
4366    var Placement =
4367    /*                    */
4368    2;
4369    var Update =
4370    /*                       */
4371    4;
4372    var ChildDeletion =
4373    /*                */
4374    16;
4375    var ContentReset =
4376    /*                 */
4377    32;
4378    var Callback =
4379    /*                     */
4380    64;
4381    var DidCapture =
4382    /*                   */
4383    128;
4384    var ForceClientRender =
4385    /*            */
4386    256;
4387    var Ref =
4388    /*                          */
4389    512;
4390    var Snapshot =
4391    /*                     */
4392    1024;
4393    var Passive =
4394    /*                      */
4395    2048;
4396    var Hydrating =
4397    /*                    */
4398    4096;
4399    var Visibility =
4400    /*                   */
4401    8192;
4402    var StoreConsistency =
4403    /*             */
4404    16384;
4405    var LifecycleEffectMask = Passive | Update | Callback | Ref | Snapshot | StoreConsistency; // Union of all commit flags (flags with the lifetime of a particular commit)
4406  
4407    var HostEffectMask =
4408    /*               */
4409    32767; // These are not really side effects, but we still reuse this field.
4410  
4411    var Incomplete =
4412    /*                   */
4413    32768;
4414    var ShouldCapture =
4415    /*                */
4416    65536;
4417    var ForceUpdateForLegacySuspense =
4418    /* */
4419    131072;
4420    var Forked =
4421    /*                       */
4422    1048576; // Static tags describe aspects of a fiber that are not specific to a render,
4423    // e.g. a fiber uses a passive effect (even if there are no updates on this particular render).
4424    // This enables us to defer more work in the unmount case,
4425    // since we can defer traversing the tree during layout to look for Passive effects,
4426    // and instead rely on the static flag as a signal that there may be cleanup work.
4427  
4428    var RefStatic =
4429    /*                    */
4430    2097152;
4431    var LayoutStatic =
4432    /*                 */
4433    4194304;
4434    var PassiveStatic =
4435    /*                */
4436    8388608; // These flags allow us to traverse to fibers that have effects on mount
4437    // without traversing the entire tree after every commit for
4438    // double invoking
4439  
4440    var MountLayoutDev =
4441    /*               */
4442    16777216;
4443    var MountPassiveDev =
4444    /*              */
4445    33554432; // Groups of flags that are used in the commit phase to skip over trees that
4446    // don't contain effects, by checking subtreeFlags.
4447  
4448    var BeforeMutationMask = // TODO: Remove Update flag from before mutation phase by re-landing Visibility
4449    // flag logic (see #20043)
4450    Update | Snapshot | ( 0);
4451    var MutationMask = Placement | Update | ChildDeletion | ContentReset | Ref | Hydrating | Visibility;
4452    var LayoutMask = Update | Callback | Ref | Visibility; // TODO: Split into PassiveMountMask and PassiveUnmountMask
4453  
4454    var PassiveMask = Passive | ChildDeletion; // Union of tags that don't get reset on clones.
4455    // This allows certain concepts to persist without recalculating them,
4456    // e.g. whether a subtree contains passive effects or portals.
4457  
4458    var StaticMask = LayoutStatic | PassiveStatic | RefStatic;
4459  
4460    var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
4461    function getNearestMountedFiber(fiber) {
4462      var node = fiber;
4463      var nearestMounted = fiber;
4464  
4465      if (!fiber.alternate) {
4466        // If there is no alternate, this might be a new tree that isn't inserted
4467        // yet. If it is, then it will have a pending insertion effect on it.
4468        var nextNode = node;
4469  
4470        do {
4471          node = nextNode;
4472  
4473          if ((node.flags & (Placement | Hydrating)) !== NoFlags) {
4474            // This is an insertion or in-progress hydration. The nearest possible
4475            // mounted fiber is the parent but we need to continue to figure out
4476            // if that one is still mounted.
4477            nearestMounted = node.return;
4478          }
4479  
4480          nextNode = node.return;
4481        } while (nextNode);
4482      } else {
4483        while (node.return) {
4484          node = node.return;
4485        }
4486      }
4487  
4488      if (node.tag === HostRoot) {
4489        // TODO: Check if this was a nested HostRoot when used with
4490        // renderContainerIntoSubtree.
4491        return nearestMounted;
4492      } // If we didn't hit the root, that means that we're in an disconnected tree
4493      // that has been unmounted.
4494  
4495  
4496      return null;
4497    }
4498    function getSuspenseInstanceFromFiber(fiber) {
4499      if (fiber.tag === SuspenseComponent) {
4500        var suspenseState = fiber.memoizedState;
4501  
4502        if (suspenseState === null) {
4503          var current = fiber.alternate;
4504  
4505          if (current !== null) {
4506            suspenseState = current.memoizedState;
4507          }
4508        }
4509  
4510        if (suspenseState !== null) {
4511          return suspenseState.dehydrated;
4512        }
4513      }
4514  
4515      return null;
4516    }
4517    function getContainerFromFiber(fiber) {
4518      return fiber.tag === HostRoot ? fiber.stateNode.containerInfo : null;
4519    }
4520    function isFiberMounted(fiber) {
4521      return getNearestMountedFiber(fiber) === fiber;
4522    }
4523    function isMounted(component) {
4524      {
4525        var owner = ReactCurrentOwner.current;
4526  
4527        if (owner !== null && owner.tag === ClassComponent) {
4528          var ownerFiber = owner;
4529          var instance = ownerFiber.stateNode;
4530  
4531          if (!instance._warnedAboutRefsInRender) {
4532            error('%s is accessing isMounted inside its render() function. ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', getComponentNameFromFiber(ownerFiber) || 'A component');
4533          }
4534  
4535          instance._warnedAboutRefsInRender = true;
4536        }
4537      }
4538  
4539      var fiber = get(component);
4540  
4541      if (!fiber) {
4542        return false;
4543      }
4544  
4545      return getNearestMountedFiber(fiber) === fiber;
4546    }
4547  
4548    function assertIsMounted(fiber) {
4549      if (getNearestMountedFiber(fiber) !== fiber) {
4550        throw new Error('Unable to find node on an unmounted component.');
4551      }
4552    }
4553  
4554    function findCurrentFiberUsingSlowPath(fiber) {
4555      var alternate = fiber.alternate;
4556  
4557      if (!alternate) {
4558        // If there is no alternate, then we only need to check if it is mounted.
4559        var nearestMounted = getNearestMountedFiber(fiber);
4560  
4561        if (nearestMounted === null) {
4562          throw new Error('Unable to find node on an unmounted component.');
4563        }
4564  
4565        if (nearestMounted !== fiber) {
4566          return null;
4567        }
4568  
4569        return fiber;
4570      } // If we have two possible branches, we'll walk backwards up to the root
4571      // to see what path the root points to. On the way we may hit one of the
4572      // special cases and we'll deal with them.
4573  
4574  
4575      var a = fiber;
4576      var b = alternate;
4577  
4578      while (true) {
4579        var parentA = a.return;
4580  
4581        if (parentA === null) {
4582          // We're at the root.
4583          break;
4584        }
4585  
4586        var parentB = parentA.alternate;
4587  
4588        if (parentB === null) {
4589          // There is no alternate. This is an unusual case. Currently, it only
4590          // happens when a Suspense component is hidden. An extra fragment fiber
4591          // is inserted in between the Suspense fiber and its children. Skip
4592          // over this extra fragment fiber and proceed to the next parent.
4593          var nextParent = parentA.return;
4594  
4595          if (nextParent !== null) {
4596            a = b = nextParent;
4597            continue;
4598          } // If there's no parent, we're at the root.
4599  
4600  
4601          break;
4602        } // If both copies of the parent fiber point to the same child, we can
4603        // assume that the child is current. This happens when we bailout on low
4604        // priority: the bailed out fiber's child reuses the current child.
4605  
4606  
4607        if (parentA.child === parentB.child) {
4608          var child = parentA.child;
4609  
4610          while (child) {
4611            if (child === a) {
4612              // We've determined that A is the current branch.
4613              assertIsMounted(parentA);
4614              return fiber;
4615            }
4616  
4617            if (child === b) {
4618              // We've determined that B is the current branch.
4619              assertIsMounted(parentA);
4620              return alternate;
4621            }
4622  
4623            child = child.sibling;
4624          } // We should never have an alternate for any mounting node. So the only
4625          // way this could possibly happen is if this was unmounted, if at all.
4626  
4627  
4628          throw new Error('Unable to find node on an unmounted component.');
4629        }
4630  
4631        if (a.return !== b.return) {
4632          // The return pointer of A and the return pointer of B point to different
4633          // fibers. We assume that return pointers never criss-cross, so A must
4634          // belong to the child set of A.return, and B must belong to the child
4635          // set of B.return.
4636          a = parentA;
4637          b = parentB;
4638        } else {
4639          // The return pointers point to the same fiber. We'll have to use the
4640          // default, slow path: scan the child sets of each parent alternate to see
4641          // which child belongs to which set.
4642          //
4643          // Search parent A's child set
4644          var didFindChild = false;
4645          var _child = parentA.child;
4646  
4647          while (_child) {
4648            if (_child === a) {
4649              didFindChild = true;
4650              a = parentA;
4651              b = parentB;
4652              break;
4653            }
4654  
4655            if (_child === b) {
4656              didFindChild = true;
4657              b = parentA;
4658              a = parentB;
4659              break;
4660            }
4661  
4662            _child = _child.sibling;
4663          }
4664  
4665          if (!didFindChild) {
4666            // Search parent B's child set
4667            _child = parentB.child;
4668  
4669            while (_child) {
4670              if (_child === a) {
4671                didFindChild = true;
4672                a = parentB;
4673                b = parentA;
4674                break;
4675              }
4676  
4677              if (_child === b) {
4678                didFindChild = true;
4679                b = parentB;
4680                a = parentA;
4681                break;
4682              }
4683  
4684              _child = _child.sibling;
4685            }
4686  
4687            if (!didFindChild) {
4688              throw new Error('Child was not found in either parent set. This indicates a bug ' + 'in React related to the return pointer. Please file an issue.');
4689            }
4690          }
4691        }
4692  
4693        if (a.alternate !== b) {
4694          throw new Error("Return fibers should always be each others' alternates. " + 'This error is likely caused by a bug in React. Please file an issue.');
4695        }
4696      } // If the root is not a host container, we're in a disconnected tree. I.e.
4697      // unmounted.
4698  
4699  
4700      if (a.tag !== HostRoot) {
4701        throw new Error('Unable to find node on an unmounted component.');
4702      }
4703  
4704      if (a.stateNode.current === a) {
4705        // We've determined that A is the current branch.
4706        return fiber;
4707      } // Otherwise B has to be current branch.
4708  
4709  
4710      return alternate;
4711    }
4712    function findCurrentHostFiber(parent) {
4713      var currentParent = findCurrentFiberUsingSlowPath(parent);
4714      return currentParent !== null ? findCurrentHostFiberImpl(currentParent) : null;
4715    }
4716  
4717    function findCurrentHostFiberImpl(node) {
4718      // Next we'll drill down this component to find the first HostComponent/Text.
4719      if (node.tag === HostComponent || node.tag === HostText) {
4720        return node;
4721      }
4722  
4723      var child = node.child;
4724  
4725      while (child !== null) {
4726        var match = findCurrentHostFiberImpl(child);
4727  
4728        if (match !== null) {
4729          return match;
4730        }
4731  
4732        child = child.sibling;
4733      }
4734  
4735      return null;
4736    }
4737  
4738    function findCurrentHostFiberWithNoPortals(parent) {
4739      var currentParent = findCurrentFiberUsingSlowPath(parent);
4740      return currentParent !== null ? findCurrentHostFiberWithNoPortalsImpl(currentParent) : null;
4741    }
4742  
4743    function findCurrentHostFiberWithNoPortalsImpl(node) {
4744      // Next we'll drill down this component to find the first HostComponent/Text.
4745      if (node.tag === HostComponent || node.tag === HostText) {
4746        return node;
4747      }
4748  
4749      var child = node.child;
4750  
4751      while (child !== null) {
4752        if (child.tag !== HostPortal) {
4753          var match = findCurrentHostFiberWithNoPortalsImpl(child);
4754  
4755          if (match !== null) {
4756            return match;
4757          }
4758        }
4759  
4760        child = child.sibling;
4761      }
4762  
4763      return null;
4764    }
4765  
4766    // This module only exists as an ESM wrapper around the external CommonJS
4767    var scheduleCallback = unstable_scheduleCallback;
4768    var cancelCallback = unstable_cancelCallback;
4769    var shouldYield = unstable_shouldYield;
4770    var requestPaint = unstable_requestPaint;
4771    var now = unstable_now;
4772    var getCurrentPriorityLevel = unstable_getCurrentPriorityLevel;
4773    var ImmediatePriority = unstable_ImmediatePriority;
4774    var UserBlockingPriority = unstable_UserBlockingPriority;
4775    var NormalPriority = unstable_NormalPriority;
4776    var LowPriority = unstable_LowPriority;
4777    var IdlePriority = unstable_IdlePriority;
4778    // this doesn't actually exist on the scheduler, but it *does*
4779    // on scheduler/unstable_mock, which we'll need for internal testing
4780    var unstable_yieldValue$1 = unstable_yieldValue;
4781    var unstable_setDisableYieldValue$1 = unstable_setDisableYieldValue;
4782  
4783    var rendererID = null;
4784    var injectedHook = null;
4785    var injectedProfilingHooks = null;
4786    var hasLoggedError = false;
4787    var isDevToolsPresent = typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined';
4788    function injectInternals(internals) {
4789      if (typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined') {
4790        // No DevTools
4791        return false;
4792      }
4793  
4794      var hook = __REACT_DEVTOOLS_GLOBAL_HOOK__;
4795  
4796      if (hook.isDisabled) {
4797        // This isn't a real property on the hook, but it can be set to opt out
4798        // of DevTools integration and associated warnings and logs.
4799        // https://github.com/facebook/react/issues/3877
4800        return true;
4801      }
4802  
4803      if (!hook.supportsFiber) {
4804        {
4805          error('The installed version of React DevTools is too old and will not work ' + 'with the current version of React. Please update React DevTools. ' + 'https://reactjs.org/link/react-devtools');
4806        } // DevTools exists, even though it doesn't support Fiber.
4807  
4808  
4809        return true;
4810      }
4811  
4812      try {
4813        if (enableSchedulingProfiler) {
4814          // Conditionally inject these hooks only if Timeline profiler is supported by this build.
4815          // This gives DevTools a way to feature detect that isn't tied to version number
4816          // (since profiling and timeline are controlled by different feature flags).
4817          internals = assign({}, internals, {
4818            getLaneLabelMap: getLaneLabelMap,
4819            injectProfilingHooks: injectProfilingHooks
4820          });
4821        }
4822  
4823        rendererID = hook.inject(internals); // We have successfully injected, so now it is safe to set up hooks.
4824  
4825        injectedHook = hook;
4826      } catch (err) {
4827        // Catch all errors because it is unsafe to throw during initialization.
4828        {
4829          error('React instrumentation encountered an error: %s.', err);
4830        }
4831      }
4832  
4833      if (hook.checkDCE) {
4834        // This is the real DevTools.
4835        return true;
4836      } else {
4837        // This is likely a hook installed by Fast Refresh runtime.
4838        return false;
4839      }
4840    }
4841    function onScheduleRoot(root, children) {
4842      {
4843        if (injectedHook && typeof injectedHook.onScheduleFiberRoot === 'function') {
4844          try {
4845            injectedHook.onScheduleFiberRoot(rendererID, root, children);
4846          } catch (err) {
4847            if ( !hasLoggedError) {
4848              hasLoggedError = true;
4849  
4850              error('React instrumentation encountered an error: %s', err);
4851            }
4852          }
4853        }
4854      }
4855    }
4856    function onCommitRoot(root, eventPriority) {
4857      if (injectedHook && typeof injectedHook.onCommitFiberRoot === 'function') {
4858        try {
4859          var didError = (root.current.flags & DidCapture) === DidCapture;
4860  
4861          if (enableProfilerTimer) {
4862            var schedulerPriority;
4863  
4864            switch (eventPriority) {
4865              case DiscreteEventPriority:
4866                schedulerPriority = ImmediatePriority;
4867                break;
4868  
4869              case ContinuousEventPriority:
4870                schedulerPriority = UserBlockingPriority;
4871                break;
4872  
4873              case DefaultEventPriority:
4874                schedulerPriority = NormalPriority;
4875                break;
4876  
4877              case IdleEventPriority:
4878                schedulerPriority = IdlePriority;
4879                break;
4880  
4881              default:
4882                schedulerPriority = NormalPriority;
4883                break;
4884            }
4885  
4886            injectedHook.onCommitFiberRoot(rendererID, root, schedulerPriority, didError);
4887          } else {
4888            injectedHook.onCommitFiberRoot(rendererID, root, undefined, didError);
4889          }
4890        } catch (err) {
4891          {
4892            if (!hasLoggedError) {
4893              hasLoggedError = true;
4894  
4895              error('React instrumentation encountered an error: %s', err);
4896            }
4897          }
4898        }
4899      }
4900    }
4901    function onPostCommitRoot(root) {
4902      if (injectedHook && typeof injectedHook.onPostCommitFiberRoot === 'function') {
4903        try {
4904          injectedHook.onPostCommitFiberRoot(rendererID, root);
4905        } catch (err) {
4906          {
4907            if (!hasLoggedError) {
4908              hasLoggedError = true;
4909  
4910              error('React instrumentation encountered an error: %s', err);
4911            }
4912          }
4913        }
4914      }
4915    }
4916    function onCommitUnmount(fiber) {
4917      if (injectedHook && typeof injectedHook.onCommitFiberUnmount === 'function') {
4918        try {
4919          injectedHook.onCommitFiberUnmount(rendererID, fiber);
4920        } catch (err) {
4921          {
4922            if (!hasLoggedError) {
4923              hasLoggedError = true;
4924  
4925              error('React instrumentation encountered an error: %s', err);
4926            }
4927          }
4928        }
4929      }
4930    }
4931    function setIsStrictModeForDevtools(newIsStrictMode) {
4932      {
4933        if (typeof unstable_yieldValue$1 === 'function') {
4934          // We're in a test because Scheduler.unstable_yieldValue only exists
4935          // in SchedulerMock. To reduce the noise in strict mode tests,
4936          // suppress warnings and disable scheduler yielding during the double render
4937          unstable_setDisableYieldValue$1(newIsStrictMode);
4938          setSuppressWarning(newIsStrictMode);
4939        }
4940  
4941        if (injectedHook && typeof injectedHook.setStrictMode === 'function') {
4942          try {
4943            injectedHook.setStrictMode(rendererID, newIsStrictMode);
4944          } catch (err) {
4945            {
4946              if (!hasLoggedError) {
4947                hasLoggedError = true;
4948  
4949                error('React instrumentation encountered an error: %s', err);
4950              }
4951            }
4952          }
4953        }
4954      }
4955    } // Profiler API hooks
4956  
4957    function injectProfilingHooks(profilingHooks) {
4958      injectedProfilingHooks = profilingHooks;
4959    }
4960  
4961    function getLaneLabelMap() {
4962      {
4963        var map = new Map();
4964        var lane = 1;
4965  
4966        for (var index = 0; index < TotalLanes; index++) {
4967          var label = getLabelForLane(lane);
4968          map.set(lane, label);
4969          lane *= 2;
4970        }
4971  
4972        return map;
4973      }
4974    }
4975  
4976    function markCommitStarted(lanes) {
4977      {
4978        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markCommitStarted === 'function') {
4979          injectedProfilingHooks.markCommitStarted(lanes);
4980        }
4981      }
4982    }
4983    function markCommitStopped() {
4984      {
4985        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markCommitStopped === 'function') {
4986          injectedProfilingHooks.markCommitStopped();
4987        }
4988      }
4989    }
4990    function markComponentRenderStarted(fiber) {
4991      {
4992        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentRenderStarted === 'function') {
4993          injectedProfilingHooks.markComponentRenderStarted(fiber);
4994        }
4995      }
4996    }
4997    function markComponentRenderStopped() {
4998      {
4999        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentRenderStopped === 'function') {
5000          injectedProfilingHooks.markComponentRenderStopped();
5001        }
5002      }
5003    }
5004    function markComponentPassiveEffectMountStarted(fiber) {
5005      {
5006        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectMountStarted === 'function') {
5007          injectedProfilingHooks.markComponentPassiveEffectMountStarted(fiber);
5008        }
5009      }
5010    }
5011    function markComponentPassiveEffectMountStopped() {
5012      {
5013        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectMountStopped === 'function') {
5014          injectedProfilingHooks.markComponentPassiveEffectMountStopped();
5015        }
5016      }
5017    }
5018    function markComponentPassiveEffectUnmountStarted(fiber) {
5019      {
5020        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectUnmountStarted === 'function') {
5021          injectedProfilingHooks.markComponentPassiveEffectUnmountStarted(fiber);
5022        }
5023      }
5024    }
5025    function markComponentPassiveEffectUnmountStopped() {
5026      {
5027        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectUnmountStopped === 'function') {
5028          injectedProfilingHooks.markComponentPassiveEffectUnmountStopped();
5029        }
5030      }
5031    }
5032    function markComponentLayoutEffectMountStarted(fiber) {
5033      {
5034        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectMountStarted === 'function') {
5035          injectedProfilingHooks.markComponentLayoutEffectMountStarted(fiber);
5036        }
5037      }
5038    }
5039    function markComponentLayoutEffectMountStopped() {
5040      {
5041        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectMountStopped === 'function') {
5042          injectedProfilingHooks.markComponentLayoutEffectMountStopped();
5043        }
5044      }
5045    }
5046    function markComponentLayoutEffectUnmountStarted(fiber) {
5047      {
5048        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectUnmountStarted === 'function') {
5049          injectedProfilingHooks.markComponentLayoutEffectUnmountStarted(fiber);
5050        }
5051      }
5052    }
5053    function markComponentLayoutEffectUnmountStopped() {
5054      {
5055        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectUnmountStopped === 'function') {
5056          injectedProfilingHooks.markComponentLayoutEffectUnmountStopped();
5057        }
5058      }
5059    }
5060    function markComponentErrored(fiber, thrownValue, lanes) {
5061      {
5062        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentErrored === 'function') {
5063          injectedProfilingHooks.markComponentErrored(fiber, thrownValue, lanes);
5064        }
5065      }
5066    }
5067    function markComponentSuspended(fiber, wakeable, lanes) {
5068      {
5069        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentSuspended === 'function') {
5070          injectedProfilingHooks.markComponentSuspended(fiber, wakeable, lanes);
5071        }
5072      }
5073    }
5074    function markLayoutEffectsStarted(lanes) {
5075      {
5076        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markLayoutEffectsStarted === 'function') {
5077          injectedProfilingHooks.markLayoutEffectsStarted(lanes);
5078        }
5079      }
5080    }
5081    function markLayoutEffectsStopped() {
5082      {
5083        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markLayoutEffectsStopped === 'function') {
5084          injectedProfilingHooks.markLayoutEffectsStopped();
5085        }
5086      }
5087    }
5088    function markPassiveEffectsStarted(lanes) {
5089      {
5090        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markPassiveEffectsStarted === 'function') {
5091          injectedProfilingHooks.markPassiveEffectsStarted(lanes);
5092        }
5093      }
5094    }
5095    function markPassiveEffectsStopped() {
5096      {
5097        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markPassiveEffectsStopped === 'function') {
5098          injectedProfilingHooks.markPassiveEffectsStopped();
5099        }
5100      }
5101    }
5102    function markRenderStarted(lanes) {
5103      {
5104        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderStarted === 'function') {
5105          injectedProfilingHooks.markRenderStarted(lanes);
5106        }
5107      }
5108    }
5109    function markRenderYielded() {
5110      {
5111        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderYielded === 'function') {
5112          injectedProfilingHooks.markRenderYielded();
5113        }
5114      }
5115    }
5116    function markRenderStopped() {
5117      {
5118        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderStopped === 'function') {
5119          injectedProfilingHooks.markRenderStopped();
5120        }
5121      }
5122    }
5123    function markRenderScheduled(lane) {
5124      {
5125        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderScheduled === 'function') {
5126          injectedProfilingHooks.markRenderScheduled(lane);
5127        }
5128      }
5129    }
5130    function markForceUpdateScheduled(fiber, lane) {
5131      {
5132        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markForceUpdateScheduled === 'function') {
5133          injectedProfilingHooks.markForceUpdateScheduled(fiber, lane);
5134        }
5135      }
5136    }
5137    function markStateUpdateScheduled(fiber, lane) {
5138      {
5139        if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markStateUpdateScheduled === 'function') {
5140          injectedProfilingHooks.markStateUpdateScheduled(fiber, lane);
5141        }
5142      }
5143    }
5144  
5145    var NoMode =
5146    /*                         */
5147    0; // TODO: Remove ConcurrentMode by reading from the root tag instead
5148  
5149    var ConcurrentMode =
5150    /*                 */
5151    1;
5152    var ProfileMode =
5153    /*                    */
5154    2;
5155    var StrictLegacyMode =
5156    /*               */
5157    8;
5158    var StrictEffectsMode =
5159    /*              */
5160    16;
5161  
5162    // TODO: This is pretty well supported by browsers. Maybe we can drop it.
5163    var clz32 = Math.clz32 ? Math.clz32 : clz32Fallback; // Count leading zeros.
5164    // Based on:
5165    // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/clz32
5166  
5167    var log = Math.log;
5168    var LN2 = Math.LN2;
5169  
5170    function clz32Fallback(x) {
5171      var asUint = x >>> 0;
5172  
5173      if (asUint === 0) {
5174        return 32;
5175      }
5176  
5177      return 31 - (log(asUint) / LN2 | 0) | 0;
5178    }
5179  
5180    // If those values are changed that package should be rebuilt and redeployed.
5181  
5182    var TotalLanes = 31;
5183    var NoLanes =
5184    /*                        */
5185    0;
5186    var NoLane =
5187    /*                          */
5188    0;
5189    var SyncLane =
5190    /*                        */
5191    1;
5192    var InputContinuousHydrationLane =
5193    /*    */
5194    2;
5195    var InputContinuousLane =
5196    /*             */
5197    4;
5198    var DefaultHydrationLane =
5199    /*            */
5200    8;
5201    var DefaultLane =
5202    /*                     */
5203    16;
5204    var TransitionHydrationLane =
5205    /*                */
5206    32;
5207    var TransitionLanes =
5208    /*                       */
5209    4194240;
5210    var TransitionLane1 =
5211    /*                        */
5212    64;
5213    var TransitionLane2 =
5214    /*                        */
5215    128;
5216    var TransitionLane3 =
5217    /*                        */
5218    256;
5219    var TransitionLane4 =
5220    /*                        */
5221    512;
5222    var TransitionLane5 =
5223    /*                        */
5224    1024;
5225    var TransitionLane6 =
5226    /*                        */
5227    2048;
5228    var TransitionLane7 =
5229    /*                        */
5230    4096;
5231    var TransitionLane8 =
5232    /*                        */
5233    8192;
5234    var TransitionLane9 =
5235    /*                        */
5236    16384;
5237    var TransitionLane10 =
5238    /*                       */
5239    32768;
5240    var TransitionLane11 =
5241    /*                       */
5242    65536;
5243    var TransitionLane12 =
5244    /*                       */
5245    131072;
5246    var TransitionLane13 =
5247    /*                       */
5248    262144;
5249    var TransitionLane14 =
5250    /*                       */
5251    524288;
5252    var TransitionLane15 =
5253    /*                       */
5254    1048576;
5255    var TransitionLane16 =
5256    /*                       */
5257    2097152;
5258    var RetryLanes =
5259    /*                            */
5260    130023424;
5261    var RetryLane1 =
5262    /*                             */
5263    4194304;
5264    var RetryLane2 =
5265    /*                             */
5266    8388608;
5267    var RetryLane3 =
5268    /*                             */
5269    16777216;
5270    var RetryLane4 =
5271    /*                             */
5272    33554432;
5273    var RetryLane5 =
5274    /*                             */
5275    67108864;
5276    var SomeRetryLane = RetryLane1;
5277    var SelectiveHydrationLane =
5278    /*          */
5279    134217728;
5280    var NonIdleLanes =
5281    /*                          */
5282    268435455;
5283    var IdleHydrationLane =
5284    /*               */
5285    268435456;
5286    var IdleLane =
5287    /*                        */
5288    536870912;
5289    var OffscreenLane =
5290    /*                   */
5291    1073741824; // This function is used for the experimental timeline (react-devtools-timeline)
5292    // It should be kept in sync with the Lanes values above.
5293  
5294    function getLabelForLane(lane) {
5295      {
5296        if (lane & SyncLane) {
5297          return 'Sync';
5298        }
5299  
5300        if (lane & InputContinuousHydrationLane) {
5301          return 'InputContinuousHydration';
5302        }
5303  
5304        if (lane & InputContinuousLane) {
5305          return 'InputContinuous';
5306        }
5307  
5308        if (lane & DefaultHydrationLane) {
5309          return 'DefaultHydration';
5310        }
5311  
5312        if (lane & DefaultLane) {
5313          return 'Default';
5314        }
5315  
5316        if (lane & TransitionHydrationLane) {
5317          return 'TransitionHydration';
5318        }
5319  
5320        if (lane & TransitionLanes) {
5321          return 'Transition';
5322        }
5323  
5324        if (lane & RetryLanes) {
5325          return 'Retry';
5326        }
5327  
5328        if (lane & SelectiveHydrationLane) {
5329          return 'SelectiveHydration';
5330        }
5331  
5332        if (lane & IdleHydrationLane) {
5333          return 'IdleHydration';
5334        }
5335  
5336        if (lane & IdleLane) {
5337          return 'Idle';
5338        }
5339  
5340        if (lane & OffscreenLane) {
5341          return 'Offscreen';
5342        }
5343      }
5344    }
5345    var NoTimestamp = -1;
5346    var nextTransitionLane = TransitionLane1;
5347    var nextRetryLane = RetryLane1;
5348  
5349    function getHighestPriorityLanes(lanes) {
5350      switch (getHighestPriorityLane(lanes)) {
5351        case SyncLane:
5352          return SyncLane;
5353  
5354        case InputContinuousHydrationLane:
5355          return InputContinuousHydrationLane;
5356  
5357        case InputContinuousLane:
5358          return InputContinuousLane;
5359  
5360        case DefaultHydrationLane:
5361          return DefaultHydrationLane;
5362  
5363        case DefaultLane:
5364          return DefaultLane;
5365  
5366        case TransitionHydrationLane:
5367          return TransitionHydrationLane;
5368  
5369        case TransitionLane1:
5370        case TransitionLane2:
5371        case TransitionLane3:
5372        case TransitionLane4:
5373        case TransitionLane5:
5374        case TransitionLane6:
5375        case TransitionLane7:
5376        case TransitionLane8:
5377        case TransitionLane9:
5378        case TransitionLane10:
5379        case TransitionLane11:
5380        case TransitionLane12:
5381        case TransitionLane13:
5382        case TransitionLane14:
5383        case TransitionLane15:
5384        case TransitionLane16:
5385          return lanes & TransitionLanes;
5386  
5387        case RetryLane1:
5388        case RetryLane2:
5389        case RetryLane3:
5390        case RetryLane4:
5391        case RetryLane5:
5392          return lanes & RetryLanes;
5393  
5394        case SelectiveHydrationLane:
5395          return SelectiveHydrationLane;
5396  
5397        case IdleHydrationLane:
5398          return IdleHydrationLane;
5399  
5400        case IdleLane:
5401          return IdleLane;
5402  
5403        case OffscreenLane:
5404          return OffscreenLane;
5405  
5406        default:
5407          {
5408            error('Should have found matching lanes. This is a bug in React.');
5409          } // This shouldn't be reachable, but as a fallback, return the entire bitmask.
5410  
5411  
5412          return lanes;
5413      }
5414    }
5415  
5416    function getNextLanes(root, wipLanes) {
5417      // Early bailout if there's no pending work left.
5418      var pendingLanes = root.pendingLanes;
5419  
5420      if (pendingLanes === NoLanes) {
5421        return NoLanes;
5422      }
5423  
5424      var nextLanes = NoLanes;
5425      var suspendedLanes = root.suspendedLanes;
5426      var pingedLanes = root.pingedLanes; // Do not work on any idle work until all the non-idle work has finished,
5427      // even if the work is suspended.
5428  
5429      var nonIdlePendingLanes = pendingLanes & NonIdleLanes;
5430  
5431      if (nonIdlePendingLanes !== NoLanes) {
5432        var nonIdleUnblockedLanes = nonIdlePendingLanes & ~suspendedLanes;
5433  
5434        if (nonIdleUnblockedLanes !== NoLanes) {
5435          nextLanes = getHighestPriorityLanes(nonIdleUnblockedLanes);
5436        } else {
5437          var nonIdlePingedLanes = nonIdlePendingLanes & pingedLanes;
5438  
5439          if (nonIdlePingedLanes !== NoLanes) {
5440            nextLanes = getHighestPriorityLanes(nonIdlePingedLanes);
5441          }
5442        }
5443      } else {
5444        // The only remaining work is Idle.
5445        var unblockedLanes = pendingLanes & ~suspendedLanes;
5446  
5447        if (unblockedLanes !== NoLanes) {
5448          nextLanes = getHighestPriorityLanes(unblockedLanes);
5449        } else {
5450          if (pingedLanes !== NoLanes) {
5451            nextLanes = getHighestPriorityLanes(pingedLanes);
5452          }
5453        }
5454      }
5455  
5456      if (nextLanes === NoLanes) {
5457        // This should only be reachable if we're suspended
5458        // TODO: Consider warning in this path if a fallback timer is not scheduled.
5459        return NoLanes;
5460      } // If we're already in the middle of a render, switching lanes will interrupt
5461      // it and we'll lose our progress. We should only do this if the new lanes are
5462      // higher priority.
5463  
5464  
5465      if (wipLanes !== NoLanes && wipLanes !== nextLanes && // If we already suspended with a delay, then interrupting is fine. Don't
5466      // bother waiting until the root is complete.
5467      (wipLanes & suspendedLanes) === NoLanes) {
5468        var nextLane = getHighestPriorityLane(nextLanes);
5469        var wipLane = getHighestPriorityLane(wipLanes);
5470  
5471        if ( // Tests whether the next lane is equal or lower priority than the wip
5472        // one. This works because the bits decrease in priority as you go left.
5473        nextLane >= wipLane || // Default priority updates should not interrupt transition updates. The
5474        // only difference between default updates and transition updates is that
5475        // default updates do not support refresh transitions.
5476        nextLane === DefaultLane && (wipLane & TransitionLanes) !== NoLanes) {
5477          // Keep working on the existing in-progress tree. Do not interrupt.
5478          return wipLanes;
5479        }
5480      }
5481  
5482      if ((nextLanes & InputContinuousLane) !== NoLanes) {
5483        // When updates are sync by default, we entangle continuous priority updates
5484        // and default updates, so they render in the same batch. The only reason
5485        // they use separate lanes is because continuous updates should interrupt
5486        // transitions, but default updates should not.
5487        nextLanes |= pendingLanes & DefaultLane;
5488      } // Check for entangled lanes and add them to the batch.
5489      //
5490      // A lane is said to be entangled with another when it's not allowed to render
5491      // in a batch that does not also include the other lane. Typically we do this
5492      // when multiple updates have the same source, and we only want to respond to
5493      // the most recent event from that source.
5494      //
5495      // Note that we apply entanglements *after* checking for partial work above.
5496      // This means that if a lane is entangled during an interleaved event while
5497      // it's already rendering, we won't interrupt it. This is intentional, since
5498      // entanglement is usually "best effort": we'll try our best to render the
5499      // lanes in the same batch, but it's not worth throwing out partially
5500      // completed work in order to do it.
5501      // TODO: Reconsider this. The counter-argument is that the partial work
5502      // represents an intermediate state, which we don't want to show to the user.
5503      // And by spending extra time finishing it, we're increasing the amount of
5504      // time it takes to show the final state, which is what they are actually
5505      // waiting for.
5506      //
5507      // For those exceptions where entanglement is semantically important, like
5508      // useMutableSource, we should ensure that there is no partial work at the
5509      // time we apply the entanglement.
5510  
5511  
5512      var entangledLanes = root.entangledLanes;
5513  
5514      if (entangledLanes !== NoLanes) {
5515        var entanglements = root.entanglements;
5516        var lanes = nextLanes & entangledLanes;
5517  
5518        while (lanes > 0) {
5519          var index = pickArbitraryLaneIndex(lanes);
5520          var lane = 1 << index;
5521          nextLanes |= entanglements[index];
5522          lanes &= ~lane;
5523        }
5524      }
5525  
5526      return nextLanes;
5527    }
5528    function getMostRecentEventTime(root, lanes) {
5529      var eventTimes = root.eventTimes;
5530      var mostRecentEventTime = NoTimestamp;
5531  
5532      while (lanes > 0) {
5533        var index = pickArbitraryLaneIndex(lanes);
5534        var lane = 1 << index;
5535        var eventTime = eventTimes[index];
5536  
5537        if (eventTime > mostRecentEventTime) {
5538          mostRecentEventTime = eventTime;
5539        }
5540  
5541        lanes &= ~lane;
5542      }
5543  
5544      return mostRecentEventTime;
5545    }
5546  
5547    function computeExpirationTime(lane, currentTime) {
5548      switch (lane) {
5549        case SyncLane:
5550        case InputContinuousHydrationLane:
5551        case InputContinuousLane:
5552          // User interactions should expire slightly more quickly.
5553          //
5554          // NOTE: This is set to the corresponding constant as in Scheduler.js.
5555          // When we made it larger, a product metric in www regressed, suggesting
5556          // there's a user interaction that's being starved by a series of
5557          // synchronous updates. If that theory is correct, the proper solution is
5558          // to fix the starvation. However, this scenario supports the idea that
5559          // expiration times are an important safeguard when starvation
5560          // does happen.
5561          return currentTime + 250;
5562  
5563        case DefaultHydrationLane:
5564        case DefaultLane:
5565        case TransitionHydrationLane:
5566        case TransitionLane1:
5567        case TransitionLane2:
5568        case TransitionLane3:
5569        case TransitionLane4:
5570        case TransitionLane5:
5571        case TransitionLane6:
5572        case TransitionLane7:
5573        case TransitionLane8:
5574        case TransitionLane9:
5575        case TransitionLane10:
5576        case TransitionLane11:
5577        case TransitionLane12:
5578        case TransitionLane13:
5579        case TransitionLane14:
5580        case TransitionLane15:
5581        case TransitionLane16:
5582          return currentTime + 5000;
5583  
5584        case RetryLane1:
5585        case RetryLane2:
5586        case RetryLane3:
5587        case RetryLane4:
5588        case RetryLane5:
5589          // TODO: Retries should be allowed to expire if they are CPU bound for
5590          // too long, but when I made this change it caused a spike in browser
5591          // crashes. There must be some other underlying bug; not super urgent but
5592          // ideally should figure out why and fix it. Unfortunately we don't have
5593          // a repro for the crashes, only detected via production metrics.
5594          return NoTimestamp;
5595  
5596        case SelectiveHydrationLane:
5597        case IdleHydrationLane:
5598        case IdleLane:
5599        case OffscreenLane:
5600          // Anything idle priority or lower should never expire.
5601          return NoTimestamp;
5602  
5603        default:
5604          {
5605            error('Should have found matching lanes. This is a bug in React.');
5606          }
5607  
5608          return NoTimestamp;
5609      }
5610    }
5611  
5612    function markStarvedLanesAsExpired(root, currentTime) {
5613      // TODO: This gets called every time we yield. We can optimize by storing
5614      // the earliest expiration time on the root. Then use that to quickly bail out
5615      // of this function.
5616      var pendingLanes = root.pendingLanes;
5617      var suspendedLanes = root.suspendedLanes;
5618      var pingedLanes = root.pingedLanes;
5619      var expirationTimes = root.expirationTimes; // Iterate through the pending lanes and check if we've reached their
5620      // expiration time. If so, we'll assume the update is being starved and mark
5621      // it as expired to force it to finish.
5622  
5623      var lanes = pendingLanes;
5624  
5625      while (lanes > 0) {
5626        var index = pickArbitraryLaneIndex(lanes);
5627        var lane = 1 << index;
5628        var expirationTime = expirationTimes[index];
5629  
5630        if (expirationTime === NoTimestamp) {
5631          // Found a pending lane with no expiration time. If it's not suspended, or
5632          // if it's pinged, assume it's CPU-bound. Compute a new expiration time
5633          // using the current time.
5634          if ((lane & suspendedLanes) === NoLanes || (lane & pingedLanes) !== NoLanes) {
5635            // Assumes timestamps are monotonically increasing.
5636            expirationTimes[index] = computeExpirationTime(lane, currentTime);
5637          }
5638        } else if (expirationTime <= currentTime) {
5639          // This lane expired
5640          root.expiredLanes |= lane;
5641        }
5642  
5643        lanes &= ~lane;
5644      }
5645    } // This returns the highest priority pending lanes regardless of whether they
5646    // are suspended.
5647  
5648    function getHighestPriorityPendingLanes(root) {
5649      return getHighestPriorityLanes(root.pendingLanes);
5650    }
5651    function getLanesToRetrySynchronouslyOnError(root) {
5652      var everythingButOffscreen = root.pendingLanes & ~OffscreenLane;
5653  
5654      if (everythingButOffscreen !== NoLanes) {
5655        return everythingButOffscreen;
5656      }
5657  
5658      if (everythingButOffscreen & OffscreenLane) {
5659        return OffscreenLane;
5660      }
5661  
5662      return NoLanes;
5663    }
5664    function includesSyncLane(lanes) {
5665      return (lanes & SyncLane) !== NoLanes;
5666    }
5667    function includesNonIdleWork(lanes) {
5668      return (lanes & NonIdleLanes) !== NoLanes;
5669    }
5670    function includesOnlyRetries(lanes) {
5671      return (lanes & RetryLanes) === lanes;
5672    }
5673    function includesOnlyNonUrgentLanes(lanes) {
5674      var UrgentLanes = SyncLane | InputContinuousLane | DefaultLane;
5675      return (lanes & UrgentLanes) === NoLanes;
5676    }
5677    function includesOnlyTransitions(lanes) {
5678      return (lanes & TransitionLanes) === lanes;
5679    }
5680    function includesBlockingLane(root, lanes) {
5681  
5682      var SyncDefaultLanes = InputContinuousHydrationLane | InputContinuousLane | DefaultHydrationLane | DefaultLane;
5683      return (lanes & SyncDefaultLanes) !== NoLanes;
5684    }
5685    function includesExpiredLane(root, lanes) {
5686      // This is a separate check from includesBlockingLane because a lane can
5687      // expire after a render has already started.
5688      return (lanes & root.expiredLanes) !== NoLanes;
5689    }
5690    function isTransitionLane(lane) {
5691      return (lane & TransitionLanes) !== NoLanes;
5692    }
5693    function claimNextTransitionLane() {
5694      // Cycle through the lanes, assigning each new transition to the next lane.
5695      // In most cases, this means every transition gets its own lane, until we
5696      // run out of lanes and cycle back to the beginning.
5697      var lane = nextTransitionLane;
5698      nextTransitionLane <<= 1;
5699  
5700      if ((nextTransitionLane & TransitionLanes) === NoLanes) {
5701        nextTransitionLane = TransitionLane1;
5702      }
5703  
5704      return lane;
5705    }
5706    function claimNextRetryLane() {
5707      var lane = nextRetryLane;
5708      nextRetryLane <<= 1;
5709  
5710      if ((nextRetryLane & RetryLanes) === NoLanes) {
5711        nextRetryLane = RetryLane1;
5712      }
5713  
5714      return lane;
5715    }
5716    function getHighestPriorityLane(lanes) {
5717      return lanes & -lanes;
5718    }
5719    function pickArbitraryLane(lanes) {
5720      // This wrapper function gets inlined. Only exists so to communicate that it
5721      // doesn't matter which bit is selected; you can pick any bit without
5722      // affecting the algorithms where its used. Here I'm using
5723      // getHighestPriorityLane because it requires the fewest operations.
5724      return getHighestPriorityLane(lanes);
5725    }
5726  
5727    function pickArbitraryLaneIndex(lanes) {
5728      return 31 - clz32(lanes);
5729    }
5730  
5731    function laneToIndex(lane) {
5732      return pickArbitraryLaneIndex(lane);
5733    }
5734  
5735    function includesSomeLane(a, b) {
5736      return (a & b) !== NoLanes;
5737    }
5738    function isSubsetOfLanes(set, subset) {
5739      return (set & subset) === subset;
5740    }
5741    function mergeLanes(a, b) {
5742      return a | b;
5743    }
5744    function removeLanes(set, subset) {
5745      return set & ~subset;
5746    }
5747    function intersectLanes(a, b) {
5748      return a & b;
5749    } // Seems redundant, but it changes the type from a single lane (used for
5750    // updates) to a group of lanes (used for flushing work).
5751  
5752    function laneToLanes(lane) {
5753      return lane;
5754    }
5755    function higherPriorityLane(a, b) {
5756      // This works because the bit ranges decrease in priority as you go left.
5757      return a !== NoLane && a < b ? a : b;
5758    }
5759    function createLaneMap(initial) {
5760      // Intentionally pushing one by one.
5761      // https://v8.dev/blog/elements-kinds#avoid-creating-holes
5762      var laneMap = [];
5763  
5764      for (var i = 0; i < TotalLanes; i++) {
5765        laneMap.push(initial);
5766      }
5767  
5768      return laneMap;
5769    }
5770    function markRootUpdated(root, updateLane, eventTime) {
5771      root.pendingLanes |= updateLane; // If there are any suspended transitions, it's possible this new update
5772      // could unblock them. Clear the suspended lanes so that we can try rendering
5773      // them again.
5774      //
5775      // TODO: We really only need to unsuspend only lanes that are in the
5776      // `subtreeLanes` of the updated fiber, or the update lanes of the return
5777      // path. This would exclude suspended updates in an unrelated sibling tree,
5778      // since there's no way for this update to unblock it.
5779      //
5780      // We don't do this if the incoming update is idle, because we never process
5781      // idle updates until after all the regular updates have finished; there's no
5782      // way it could unblock a transition.
5783  
5784      if (updateLane !== IdleLane) {
5785        root.suspendedLanes = NoLanes;
5786        root.pingedLanes = NoLanes;
5787      }
5788  
5789      var eventTimes = root.eventTimes;
5790      var index = laneToIndex(updateLane); // We can always overwrite an existing timestamp because we prefer the most
5791      // recent event, and we assume time is monotonically increasing.
5792  
5793      eventTimes[index] = eventTime;
5794    }
5795    function markRootSuspended(root, suspendedLanes) {
5796      root.suspendedLanes |= suspendedLanes;
5797      root.pingedLanes &= ~suspendedLanes; // The suspended lanes are no longer CPU-bound. Clear their expiration times.
5798  
5799      var expirationTimes = root.expirationTimes;
5800      var lanes = suspendedLanes;
5801  
5802      while (lanes > 0) {
5803        var index = pickArbitraryLaneIndex(lanes);
5804        var lane = 1 << index;
5805        expirationTimes[index] = NoTimestamp;
5806        lanes &= ~lane;
5807      }
5808    }
5809    function markRootPinged(root, pingedLanes, eventTime) {
5810      root.pingedLanes |= root.suspendedLanes & pingedLanes;
5811    }
5812    function markRootFinished(root, remainingLanes) {
5813      var noLongerPendingLanes = root.pendingLanes & ~remainingLanes;
5814      root.pendingLanes = remainingLanes; // Let's try everything again
5815  
5816      root.suspendedLanes = NoLanes;
5817      root.pingedLanes = NoLanes;
5818      root.expiredLanes &= remainingLanes;
5819      root.mutableReadLanes &= remainingLanes;
5820      root.entangledLanes &= remainingLanes;
5821      var entanglements = root.entanglements;
5822      var eventTimes = root.eventTimes;
5823      var expirationTimes = root.expirationTimes; // Clear the lanes that no longer have pending work
5824  
5825      var lanes = noLongerPendingLanes;
5826  
5827      while (lanes > 0) {
5828        var index = pickArbitraryLaneIndex(lanes);
5829        var lane = 1 << index;
5830        entanglements[index] = NoLanes;
5831        eventTimes[index] = NoTimestamp;
5832        expirationTimes[index] = NoTimestamp;
5833        lanes &= ~lane;
5834      }
5835    }
5836    function markRootEntangled(root, entangledLanes) {
5837      // In addition to entangling each of the given lanes with each other, we also
5838      // have to consider _transitive_ entanglements. For each lane that is already
5839      // entangled with *any* of the given lanes, that lane is now transitively
5840      // entangled with *all* the given lanes.
5841      //
5842      // Translated: If C is entangled with A, then entangling A with B also
5843      // entangles C with B.
5844      //
5845      // If this is hard to grasp, it might help to intentionally break this
5846      // function and look at the tests that fail in ReactTransition-test.js. Try
5847      // commenting out one of the conditions below.
5848      var rootEntangledLanes = root.entangledLanes |= entangledLanes;
5849      var entanglements = root.entanglements;
5850      var lanes = rootEntangledLanes;
5851  
5852      while (lanes) {
5853        var index = pickArbitraryLaneIndex(lanes);
5854        var lane = 1 << index;
5855  
5856        if ( // Is this one of the newly entangled lanes?
5857        lane & entangledLanes | // Is this lane transitively entangled with the newly entangled lanes?
5858        entanglements[index] & entangledLanes) {
5859          entanglements[index] |= entangledLanes;
5860        }
5861  
5862        lanes &= ~lane;
5863      }
5864    }
5865    function getBumpedLaneForHydration(root, renderLanes) {
5866      var renderLane = getHighestPriorityLane(renderLanes);
5867      var lane;
5868  
5869      switch (renderLane) {
5870        case InputContinuousLane:
5871          lane = InputContinuousHydrationLane;
5872          break;
5873  
5874        case DefaultLane:
5875          lane = DefaultHydrationLane;
5876          break;
5877  
5878        case TransitionLane1:
5879        case TransitionLane2:
5880        case TransitionLane3:
5881        case TransitionLane4:
5882        case TransitionLane5:
5883        case TransitionLane6:
5884        case TransitionLane7:
5885        case TransitionLane8:
5886        case TransitionLane9:
5887        case TransitionLane10:
5888        case TransitionLane11:
5889        case TransitionLane12:
5890        case TransitionLane13:
5891        case TransitionLane14:
5892        case TransitionLane15:
5893        case TransitionLane16:
5894        case RetryLane1:
5895        case RetryLane2:
5896        case RetryLane3:
5897        case RetryLane4:
5898        case RetryLane5:
5899          lane = TransitionHydrationLane;
5900          break;
5901  
5902        case IdleLane:
5903          lane = IdleHydrationLane;
5904          break;
5905  
5906        default:
5907          // Everything else is already either a hydration lane, or shouldn't
5908          // be retried at a hydration lane.
5909          lane = NoLane;
5910          break;
5911      } // Check if the lane we chose is suspended. If so, that indicates that we
5912      // already attempted and failed to hydrate at that level. Also check if we're
5913      // already rendering that lane, which is rare but could happen.
5914  
5915  
5916      if ((lane & (root.suspendedLanes | renderLanes)) !== NoLane) {
5917        // Give up trying to hydrate and fall back to client render.
5918        return NoLane;
5919      }
5920  
5921      return lane;
5922    }
5923    function addFiberToLanesMap(root, fiber, lanes) {
5924  
5925      if (!isDevToolsPresent) {
5926        return;
5927      }
5928  
5929      var pendingUpdatersLaneMap = root.pendingUpdatersLaneMap;
5930  
5931      while (lanes > 0) {
5932        var index = laneToIndex(lanes);
5933        var lane = 1 << index;
5934        var updaters = pendingUpdatersLaneMap[index];
5935        updaters.add(fiber);
5936        lanes &= ~lane;
5937      }
5938    }
5939    function movePendingFibersToMemoized(root, lanes) {
5940  
5941      if (!isDevToolsPresent) {
5942        return;
5943      }
5944  
5945      var pendingUpdatersLaneMap = root.pendingUpdatersLaneMap;
5946      var memoizedUpdaters = root.memoizedUpdaters;
5947  
5948      while (lanes > 0) {
5949        var index = laneToIndex(lanes);
5950        var lane = 1 << index;
5951        var updaters = pendingUpdatersLaneMap[index];
5952  
5953        if (updaters.size > 0) {
5954          updaters.forEach(function (fiber) {
5955            var alternate = fiber.alternate;
5956  
5957            if (alternate === null || !memoizedUpdaters.has(alternate)) {
5958              memoizedUpdaters.add(fiber);
5959            }
5960          });
5961          updaters.clear();
5962        }
5963  
5964        lanes &= ~lane;
5965      }
5966    }
5967    function getTransitionsForLanes(root, lanes) {
5968      {
5969        return null;
5970      }
5971    }
5972  
5973    var DiscreteEventPriority = SyncLane;
5974    var ContinuousEventPriority = InputContinuousLane;
5975    var DefaultEventPriority = DefaultLane;
5976    var IdleEventPriority = IdleLane;
5977    var currentUpdatePriority = NoLane;
5978    function getCurrentUpdatePriority() {
5979      return currentUpdatePriority;
5980    }
5981    function setCurrentUpdatePriority(newPriority) {
5982      currentUpdatePriority = newPriority;
5983    }
5984    function runWithPriority(priority, fn) {
5985      var previousPriority = currentUpdatePriority;
5986  
5987      try {
5988        currentUpdatePriority = priority;
5989        return fn();
5990      } finally {
5991        currentUpdatePriority = previousPriority;
5992      }
5993    }
5994    function higherEventPriority(a, b) {
5995      return a !== 0 && a < b ? a : b;
5996    }
5997    function lowerEventPriority(a, b) {
5998      return a === 0 || a > b ? a : b;
5999    }
6000    function isHigherEventPriority(a, b) {
6001      return a !== 0 && a < b;
6002    }
6003    function lanesToEventPriority(lanes) {
6004      var lane = getHighestPriorityLane(lanes);
6005  
6006      if (!isHigherEventPriority(DiscreteEventPriority, lane)) {
6007        return DiscreteEventPriority;
6008      }
6009  
6010      if (!isHigherEventPriority(ContinuousEventPriority, lane)) {
6011        return ContinuousEventPriority;
6012      }
6013  
6014      if (includesNonIdleWork(lane)) {
6015        return DefaultEventPriority;
6016      }
6017  
6018      return IdleEventPriority;
6019    }
6020  
6021    // This is imported by the event replaying implementation in React DOM. It's
6022    // in a separate file to break a circular dependency between the renderer and
6023    // the reconciler.
6024    function isRootDehydrated(root) {
6025      var currentState = root.current.memoizedState;
6026      return currentState.isDehydrated;
6027    }
6028  
6029    var _attemptSynchronousHydration;
6030  
6031    function setAttemptSynchronousHydration(fn) {
6032      _attemptSynchronousHydration = fn;
6033    }
6034    function attemptSynchronousHydration(fiber) {
6035      _attemptSynchronousHydration(fiber);
6036    }
6037    var attemptContinuousHydration;
6038    function setAttemptContinuousHydration(fn) {
6039      attemptContinuousHydration = fn;
6040    }
6041    var attemptHydrationAtCurrentPriority;
6042    function setAttemptHydrationAtCurrentPriority(fn) {
6043      attemptHydrationAtCurrentPriority = fn;
6044    }
6045    var getCurrentUpdatePriority$1;
6046    function setGetCurrentUpdatePriority(fn) {
6047      getCurrentUpdatePriority$1 = fn;
6048    }
6049    var attemptHydrationAtPriority;
6050    function setAttemptHydrationAtPriority(fn) {
6051      attemptHydrationAtPriority = fn;
6052    } // TODO: Upgrade this definition once we're on a newer version of Flow that
6053    // has this definition built-in.
6054  
6055    var hasScheduledReplayAttempt = false; // The queue of discrete events to be replayed.
6056  
6057    var queuedDiscreteEvents = []; // Indicates if any continuous event targets are non-null for early bailout.
6058    // if the last target was dehydrated.
6059  
6060    var queuedFocus = null;
6061    var queuedDrag = null;
6062    var queuedMouse = null; // For pointer events there can be one latest event per pointerId.
6063  
6064    var queuedPointers = new Map();
6065    var queuedPointerCaptures = new Map(); // We could consider replaying selectionchange and touchmoves too.
6066  
6067    var queuedExplicitHydrationTargets = [];
6068    var discreteReplayableEvents = ['mousedown', 'mouseup', 'touchcancel', 'touchend', 'touchstart', 'auxclick', 'dblclick', 'pointercancel', 'pointerdown', 'pointerup', 'dragend', 'dragstart', 'drop', 'compositionend', 'compositionstart', 'keydown', 'keypress', 'keyup', 'input', 'textInput', // Intentionally camelCase
6069    'copy', 'cut', 'paste', 'click', 'change', 'contextmenu', 'reset', 'submit'];
6070    function isDiscreteEventThatRequiresHydration(eventType) {
6071      return discreteReplayableEvents.indexOf(eventType) > -1;
6072    }
6073  
6074    function createQueuedReplayableEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent) {
6075      return {
6076        blockedOn: blockedOn,
6077        domEventName: domEventName,
6078        eventSystemFlags: eventSystemFlags,
6079        nativeEvent: nativeEvent,
6080        targetContainers: [targetContainer]
6081      };
6082    }
6083  
6084    function clearIfContinuousEvent(domEventName, nativeEvent) {
6085      switch (domEventName) {
6086        case 'focusin':
6087        case 'focusout':
6088          queuedFocus = null;
6089          break;
6090  
6091        case 'dragenter':
6092        case 'dragleave':
6093          queuedDrag = null;
6094          break;
6095  
6096        case 'mouseover':
6097        case 'mouseout':
6098          queuedMouse = null;
6099          break;
6100  
6101        case 'pointerover':
6102        case 'pointerout':
6103          {
6104            var pointerId = nativeEvent.pointerId;
6105            queuedPointers.delete(pointerId);
6106            break;
6107          }
6108  
6109        case 'gotpointercapture':
6110        case 'lostpointercapture':
6111          {
6112            var _pointerId = nativeEvent.pointerId;
6113            queuedPointerCaptures.delete(_pointerId);
6114            break;
6115          }
6116      }
6117    }
6118  
6119    function accumulateOrCreateContinuousQueuedReplayableEvent(existingQueuedEvent, blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent) {
6120      if (existingQueuedEvent === null || existingQueuedEvent.nativeEvent !== nativeEvent) {
6121        var queuedEvent = createQueuedReplayableEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent);
6122  
6123        if (blockedOn !== null) {
6124          var _fiber2 = getInstanceFromNode(blockedOn);
6125  
6126          if (_fiber2 !== null) {
6127            // Attempt to increase the priority of this target.
6128            attemptContinuousHydration(_fiber2);
6129          }
6130        }
6131  
6132        return queuedEvent;
6133      } // If we have already queued this exact event, then it's because
6134      // the different event systems have different DOM event listeners.
6135      // We can accumulate the flags, and the targetContainers, and
6136      // store a single event to be replayed.
6137  
6138  
6139      existingQueuedEvent.eventSystemFlags |= eventSystemFlags;
6140      var targetContainers = existingQueuedEvent.targetContainers;
6141  
6142      if (targetContainer !== null && targetContainers.indexOf(targetContainer) === -1) {
6143        targetContainers.push(targetContainer);
6144      }
6145  
6146      return existingQueuedEvent;
6147    }
6148  
6149    function queueIfContinuousEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent) {
6150      // These set relatedTarget to null because the replayed event will be treated as if we
6151      // moved from outside the window (no target) onto the target once it hydrates.
6152      // Instead of mutating we could clone the event.
6153      switch (domEventName) {
6154        case 'focusin':
6155          {
6156            var focusEvent = nativeEvent;
6157            queuedFocus = accumulateOrCreateContinuousQueuedReplayableEvent(queuedFocus, blockedOn, domEventName, eventSystemFlags, targetContainer, focusEvent);
6158            return true;
6159          }
6160  
6161        case 'dragenter':
6162          {
6163            var dragEvent = nativeEvent;
6164            queuedDrag = accumulateOrCreateContinuousQueuedReplayableEvent(queuedDrag, blockedOn, domEventName, eventSystemFlags, targetContainer, dragEvent);
6165            return true;
6166          }
6167  
6168        case 'mouseover':
6169          {
6170            var mouseEvent = nativeEvent;
6171            queuedMouse = accumulateOrCreateContinuousQueuedReplayableEvent(queuedMouse, blockedOn, domEventName, eventSystemFlags, targetContainer, mouseEvent);
6172            return true;
6173          }
6174  
6175        case 'pointerover':
6176          {
6177            var pointerEvent = nativeEvent;
6178            var pointerId = pointerEvent.pointerId;
6179            queuedPointers.set(pointerId, accumulateOrCreateContinuousQueuedReplayableEvent(queuedPointers.get(pointerId) || null, blockedOn, domEventName, eventSystemFlags, targetContainer, pointerEvent));
6180            return true;
6181          }
6182  
6183        case 'gotpointercapture':
6184          {
6185            var _pointerEvent = nativeEvent;
6186            var _pointerId2 = _pointerEvent.pointerId;
6187            queuedPointerCaptures.set(_pointerId2, accumulateOrCreateContinuousQueuedReplayableEvent(queuedPointerCaptures.get(_pointerId2) || null, blockedOn, domEventName, eventSystemFlags, targetContainer, _pointerEvent));
6188            return true;
6189          }
6190      }
6191  
6192      return false;
6193    } // Check if this target is unblocked. Returns true if it's unblocked.
6194  
6195    function attemptExplicitHydrationTarget(queuedTarget) {
6196      // TODO: This function shares a lot of logic with findInstanceBlockingEvent.
6197      // Try to unify them. It's a bit tricky since it would require two return
6198      // values.
6199      var targetInst = getClosestInstanceFromNode(queuedTarget.target);
6200  
6201      if (targetInst !== null) {
6202        var nearestMounted = getNearestMountedFiber(targetInst);
6203  
6204        if (nearestMounted !== null) {
6205          var tag = nearestMounted.tag;
6206  
6207          if (tag === SuspenseComponent) {
6208            var instance = getSuspenseInstanceFromFiber(nearestMounted);
6209  
6210            if (instance !== null) {
6211              // We're blocked on hydrating this boundary.
6212              // Increase its priority.
6213              queuedTarget.blockedOn = instance;
6214              attemptHydrationAtPriority(queuedTarget.priority, function () {
6215                attemptHydrationAtCurrentPriority(nearestMounted);
6216              });
6217              return;
6218            }
6219          } else if (tag === HostRoot) {
6220            var root = nearestMounted.stateNode;
6221  
6222            if (isRootDehydrated(root)) {
6223              queuedTarget.blockedOn = getContainerFromFiber(nearestMounted); // We don't currently have a way to increase the priority of
6224              // a root other than sync.
6225  
6226              return;
6227            }
6228          }
6229        }
6230      }
6231  
6232      queuedTarget.blockedOn = null;
6233    }
6234  
6235    function queueExplicitHydrationTarget(target) {
6236      // TODO: This will read the priority if it's dispatched by the React
6237      // event system but not native events. Should read window.event.type, like
6238      // we do for updates (getCurrentEventPriority).
6239      var updatePriority = getCurrentUpdatePriority$1();
6240      var queuedTarget = {
6241        blockedOn: null,
6242        target: target,
6243        priority: updatePriority
6244      };
6245      var i = 0;
6246  
6247      for (; i < queuedExplicitHydrationTargets.length; i++) {
6248        // Stop once we hit the first target with lower priority than
6249        if (!isHigherEventPriority(updatePriority, queuedExplicitHydrationTargets[i].priority)) {
6250          break;
6251        }
6252      }
6253  
6254      queuedExplicitHydrationTargets.splice(i, 0, queuedTarget);
6255  
6256      if (i === 0) {
6257        attemptExplicitHydrationTarget(queuedTarget);
6258      }
6259    }
6260  
6261    function attemptReplayContinuousQueuedEvent(queuedEvent) {
6262      if (queuedEvent.blockedOn !== null) {
6263        return false;
6264      }
6265  
6266      var targetContainers = queuedEvent.targetContainers;
6267  
6268      while (targetContainers.length > 0) {
6269        var targetContainer = targetContainers[0];
6270        var nextBlockedOn = findInstanceBlockingEvent(queuedEvent.domEventName, queuedEvent.eventSystemFlags, targetContainer, queuedEvent.nativeEvent);
6271  
6272        if (nextBlockedOn === null) {
6273          {
6274            var nativeEvent = queuedEvent.nativeEvent;
6275            var nativeEventClone = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
6276            setReplayingEvent(nativeEventClone);
6277            nativeEvent.target.dispatchEvent(nativeEventClone);
6278            resetReplayingEvent();
6279          }
6280        } else {
6281          // We're still blocked. Try again later.
6282          var _fiber3 = getInstanceFromNode(nextBlockedOn);
6283  
6284          if (_fiber3 !== null) {
6285            attemptContinuousHydration(_fiber3);
6286          }
6287  
6288          queuedEvent.blockedOn = nextBlockedOn;
6289          return false;
6290        } // This target container was successfully dispatched. Try the next.
6291  
6292  
6293        targetContainers.shift();
6294      }
6295  
6296      return true;
6297    }
6298  
6299    function attemptReplayContinuousQueuedEventInMap(queuedEvent, key, map) {
6300      if (attemptReplayContinuousQueuedEvent(queuedEvent)) {
6301        map.delete(key);
6302      }
6303    }
6304  
6305    function replayUnblockedEvents() {
6306      hasScheduledReplayAttempt = false;
6307  
6308  
6309      if (queuedFocus !== null && attemptReplayContinuousQueuedEvent(queuedFocus)) {
6310        queuedFocus = null;
6311      }
6312  
6313      if (queuedDrag !== null && attemptReplayContinuousQueuedEvent(queuedDrag)) {
6314        queuedDrag = null;
6315      }
6316  
6317      if (queuedMouse !== null && attemptReplayContinuousQueuedEvent(queuedMouse)) {
6318        queuedMouse = null;
6319      }
6320  
6321      queuedPointers.forEach(attemptReplayContinuousQueuedEventInMap);
6322      queuedPointerCaptures.forEach(attemptReplayContinuousQueuedEventInMap);
6323    }
6324  
6325    function scheduleCallbackIfUnblocked(queuedEvent, unblocked) {
6326      if (queuedEvent.blockedOn === unblocked) {
6327        queuedEvent.blockedOn = null;
6328  
6329        if (!hasScheduledReplayAttempt) {
6330          hasScheduledReplayAttempt = true; // Schedule a callback to attempt replaying as many events as are
6331          // now unblocked. This first might not actually be unblocked yet.
6332          // We could check it early to avoid scheduling an unnecessary callback.
6333  
6334          unstable_scheduleCallback(unstable_NormalPriority, replayUnblockedEvents);
6335        }
6336      }
6337    }
6338  
6339    function retryIfBlockedOn(unblocked) {
6340      // Mark anything that was blocked on this as no longer blocked
6341      // and eligible for a replay.
6342      if (queuedDiscreteEvents.length > 0) {
6343        scheduleCallbackIfUnblocked(queuedDiscreteEvents[0], unblocked); // This is a exponential search for each boundary that commits. I think it's
6344        // worth it because we expect very few discrete events to queue up and once
6345        // we are actually fully unblocked it will be fast to replay them.
6346  
6347        for (var i = 1; i < queuedDiscreteEvents.length; i++) {
6348          var queuedEvent = queuedDiscreteEvents[i];
6349  
6350          if (queuedEvent.blockedOn === unblocked) {
6351            queuedEvent.blockedOn = null;
6352          }
6353        }
6354      }
6355  
6356      if (queuedFocus !== null) {
6357        scheduleCallbackIfUnblocked(queuedFocus, unblocked);
6358      }
6359  
6360      if (queuedDrag !== null) {
6361        scheduleCallbackIfUnblocked(queuedDrag, unblocked);
6362      }
6363  
6364      if (queuedMouse !== null) {
6365        scheduleCallbackIfUnblocked(queuedMouse, unblocked);
6366      }
6367  
6368      var unblock = function (queuedEvent) {
6369        return scheduleCallbackIfUnblocked(queuedEvent, unblocked);
6370      };
6371  
6372      queuedPointers.forEach(unblock);
6373      queuedPointerCaptures.forEach(unblock);
6374  
6375      for (var _i = 0; _i < queuedExplicitHydrationTargets.length; _i++) {
6376        var queuedTarget = queuedExplicitHydrationTargets[_i];
6377  
6378        if (queuedTarget.blockedOn === unblocked) {
6379          queuedTarget.blockedOn = null;
6380        }
6381      }
6382  
6383      while (queuedExplicitHydrationTargets.length > 0) {
6384        var nextExplicitTarget = queuedExplicitHydrationTargets[0];
6385  
6386        if (nextExplicitTarget.blockedOn !== null) {
6387          // We're still blocked.
6388          break;
6389        } else {
6390          attemptExplicitHydrationTarget(nextExplicitTarget);
6391  
6392          if (nextExplicitTarget.blockedOn === null) {
6393            // We're unblocked.
6394            queuedExplicitHydrationTargets.shift();
6395          }
6396        }
6397      }
6398    }
6399  
6400    var ReactCurrentBatchConfig = ReactSharedInternals.ReactCurrentBatchConfig; // TODO: can we stop exporting these?
6401  
6402    var _enabled = true; // This is exported in FB builds for use by legacy FB layer infra.
6403    // We'd like to remove this but it's not clear if this is safe.
6404  
6405    function setEnabled(enabled) {
6406      _enabled = !!enabled;
6407    }
6408    function isEnabled() {
6409      return _enabled;
6410    }
6411    function createEventListenerWrapperWithPriority(targetContainer, domEventName, eventSystemFlags) {
6412      var eventPriority = getEventPriority(domEventName);
6413      var listenerWrapper;
6414  
6415      switch (eventPriority) {
6416        case DiscreteEventPriority:
6417          listenerWrapper = dispatchDiscreteEvent;
6418          break;
6419  
6420        case ContinuousEventPriority:
6421          listenerWrapper = dispatchContinuousEvent;
6422          break;
6423  
6424        case DefaultEventPriority:
6425        default:
6426          listenerWrapper = dispatchEvent;
6427          break;
6428      }
6429  
6430      return listenerWrapper.bind(null, domEventName, eventSystemFlags, targetContainer);
6431    }
6432  
6433    function dispatchDiscreteEvent(domEventName, eventSystemFlags, container, nativeEvent) {
6434      var previousPriority = getCurrentUpdatePriority();
6435      var prevTransition = ReactCurrentBatchConfig.transition;
6436      ReactCurrentBatchConfig.transition = null;
6437  
6438      try {
6439        setCurrentUpdatePriority(DiscreteEventPriority);
6440        dispatchEvent(domEventName, eventSystemFlags, container, nativeEvent);
6441      } finally {
6442        setCurrentUpdatePriority(previousPriority);
6443        ReactCurrentBatchConfig.transition = prevTransition;
6444      }
6445    }
6446  
6447    function dispatchContinuousEvent(domEventName, eventSystemFlags, container, nativeEvent) {
6448      var previousPriority = getCurrentUpdatePriority();
6449      var prevTransition = ReactCurrentBatchConfig.transition;
6450      ReactCurrentBatchConfig.transition = null;
6451  
6452      try {
6453        setCurrentUpdatePriority(ContinuousEventPriority);
6454        dispatchEvent(domEventName, eventSystemFlags, container, nativeEvent);
6455      } finally {
6456        setCurrentUpdatePriority(previousPriority);
6457        ReactCurrentBatchConfig.transition = prevTransition;
6458      }
6459    }
6460  
6461    function dispatchEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent) {
6462      if (!_enabled) {
6463        return;
6464      }
6465  
6466      {
6467        dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay(domEventName, eventSystemFlags, targetContainer, nativeEvent);
6468      }
6469    }
6470  
6471    function dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay(domEventName, eventSystemFlags, targetContainer, nativeEvent) {
6472      var blockedOn = findInstanceBlockingEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent);
6473  
6474      if (blockedOn === null) {
6475        dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, return_targetInst, targetContainer);
6476        clearIfContinuousEvent(domEventName, nativeEvent);
6477        return;
6478      }
6479  
6480      if (queueIfContinuousEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent)) {
6481        nativeEvent.stopPropagation();
6482        return;
6483      } // We need to clear only if we didn't queue because
6484      // queueing is accumulative.
6485  
6486  
6487      clearIfContinuousEvent(domEventName, nativeEvent);
6488  
6489      if (eventSystemFlags & IS_CAPTURE_PHASE && isDiscreteEventThatRequiresHydration(domEventName)) {
6490        while (blockedOn !== null) {
6491          var fiber = getInstanceFromNode(blockedOn);
6492  
6493          if (fiber !== null) {
6494            attemptSynchronousHydration(fiber);
6495          }
6496  
6497          var nextBlockedOn = findInstanceBlockingEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent);
6498  
6499          if (nextBlockedOn === null) {
6500            dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, return_targetInst, targetContainer);
6501          }
6502  
6503          if (nextBlockedOn === blockedOn) {
6504            break;
6505          }
6506  
6507          blockedOn = nextBlockedOn;
6508        }
6509  
6510        if (blockedOn !== null) {
6511          nativeEvent.stopPropagation();
6512        }
6513  
6514        return;
6515      } // This is not replayable so we'll invoke it but without a target,
6516      // in case the event system needs to trace it.
6517  
6518  
6519      dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, null, targetContainer);
6520    }
6521  
6522    var return_targetInst = null; // Returns a SuspenseInstance or Container if it's blocked.
6523    // The return_targetInst field above is conceptually part of the return value.
6524  
6525    function findInstanceBlockingEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent) {
6526      // TODO: Warn if _enabled is false.
6527      return_targetInst = null;
6528      var nativeEventTarget = getEventTarget(nativeEvent);
6529      var targetInst = getClosestInstanceFromNode(nativeEventTarget);
6530  
6531      if (targetInst !== null) {
6532        var nearestMounted = getNearestMountedFiber(targetInst);
6533  
6534        if (nearestMounted === null) {
6535          // This tree has been unmounted already. Dispatch without a target.
6536          targetInst = null;
6537        } else {
6538          var tag = nearestMounted.tag;
6539  
6540          if (tag === SuspenseComponent) {
6541            var instance = getSuspenseInstanceFromFiber(nearestMounted);
6542  
6543            if (instance !== null) {
6544              // Queue the event to be replayed later. Abort dispatching since we
6545              // don't want this event dispatched twice through the event system.
6546              // TODO: If this is the first discrete event in the queue. Schedule an increased
6547              // priority for this boundary.
6548              return instance;
6549            } // This shouldn't happen, something went wrong but to avoid blocking
6550            // the whole system, dispatch the event without a target.
6551            // TODO: Warn.
6552  
6553  
6554            targetInst = null;
6555          } else if (tag === HostRoot) {
6556            var root = nearestMounted.stateNode;
6557  
6558            if (isRootDehydrated(root)) {
6559              // If this happens during a replay something went wrong and it might block
6560              // the whole system.
6561              return getContainerFromFiber(nearestMounted);
6562            }
6563  
6564            targetInst = null;
6565          } else if (nearestMounted !== targetInst) {
6566            // If we get an event (ex: img onload) before committing that
6567            // component's mount, ignore it for now (that is, treat it as if it was an
6568            // event on a non-React tree). We might also consider queueing events and
6569            // dispatching them after the mount.
6570            targetInst = null;
6571          }
6572        }
6573      }
6574  
6575      return_targetInst = targetInst; // We're not blocked on anything.
6576  
6577      return null;
6578    }
6579    function getEventPriority(domEventName) {
6580      switch (domEventName) {
6581        // Used by SimpleEventPlugin:
6582        case 'cancel':
6583        case 'click':
6584        case 'close':
6585        case 'contextmenu':
6586        case 'copy':
6587        case 'cut':
6588        case 'auxclick':
6589        case 'dblclick':
6590        case 'dragend':
6591        case 'dragstart':
6592        case 'drop':
6593        case 'focusin':
6594        case 'focusout':
6595        case 'input':
6596        case 'invalid':
6597        case 'keydown':
6598        case 'keypress':
6599        case 'keyup':
6600        case 'mousedown':
6601        case 'mouseup':
6602        case 'paste':
6603        case 'pause':
6604        case 'play':
6605        case 'pointercancel':
6606        case 'pointerdown':
6607        case 'pointerup':
6608        case 'ratechange':
6609        case 'reset':
6610        case 'resize':
6611        case 'seeked':
6612        case 'submit':
6613        case 'touchcancel':
6614        case 'touchend':
6615        case 'touchstart':
6616        case 'volumechange': // Used by polyfills:
6617        // eslint-disable-next-line no-fallthrough
6618  
6619        case 'change':
6620        case 'selectionchange':
6621        case 'textInput':
6622        case 'compositionstart':
6623        case 'compositionend':
6624        case 'compositionupdate': // Only enableCreateEventHandleAPI:
6625        // eslint-disable-next-line no-fallthrough
6626  
6627        case 'beforeblur':
6628        case 'afterblur': // Not used by React but could be by user code:
6629        // eslint-disable-next-line no-fallthrough
6630  
6631        case 'beforeinput':
6632        case 'blur':
6633        case 'fullscreenchange':
6634        case 'focus':
6635        case 'hashchange':
6636        case 'popstate':
6637        case 'select':
6638        case 'selectstart':
6639          return DiscreteEventPriority;
6640  
6641        case 'drag':
6642        case 'dragenter':
6643        case 'dragexit':
6644        case 'dragleave':
6645        case 'dragover':
6646        case 'mousemove':
6647        case 'mouseout':
6648        case 'mouseover':
6649        case 'pointermove':
6650        case 'pointerout':
6651        case 'pointerover':
6652        case 'scroll':
6653        case 'toggle':
6654        case 'touchmove':
6655        case 'wheel': // Not used by React but could be by user code:
6656        // eslint-disable-next-line no-fallthrough
6657  
6658        case 'mouseenter':
6659        case 'mouseleave':
6660        case 'pointerenter':
6661        case 'pointerleave':
6662          return ContinuousEventPriority;
6663  
6664        case 'message':
6665          {
6666            // We might be in the Scheduler callback.
6667            // Eventually this mechanism will be replaced by a check
6668            // of the current priority on the native scheduler.
6669            var schedulerPriority = getCurrentPriorityLevel();
6670  
6671            switch (schedulerPriority) {
6672              case ImmediatePriority:
6673                return DiscreteEventPriority;
6674  
6675              case UserBlockingPriority:
6676                return ContinuousEventPriority;
6677  
6678              case NormalPriority:
6679              case LowPriority:
6680                // TODO: Handle LowSchedulerPriority, somehow. Maybe the same lane as hydration.
6681                return DefaultEventPriority;
6682  
6683              case IdlePriority:
6684                return IdleEventPriority;
6685  
6686              default:
6687                return DefaultEventPriority;
6688            }
6689          }
6690  
6691        default:
6692          return DefaultEventPriority;
6693      }
6694    }
6695  
6696    function addEventBubbleListener(target, eventType, listener) {
6697      target.addEventListener(eventType, listener, false);
6698      return listener;
6699    }
6700    function addEventCaptureListener(target, eventType, listener) {
6701      target.addEventListener(eventType, listener, true);
6702      return listener;
6703    }
6704    function addEventCaptureListenerWithPassiveFlag(target, eventType, listener, passive) {
6705      target.addEventListener(eventType, listener, {
6706        capture: true,
6707        passive: passive
6708      });
6709      return listener;
6710    }
6711    function addEventBubbleListenerWithPassiveFlag(target, eventType, listener, passive) {
6712      target.addEventListener(eventType, listener, {
6713        passive: passive
6714      });
6715      return listener;
6716    }
6717  
6718    /**
6719     * These variables store information about text content of a target node,
6720     * allowing comparison of content before and after a given event.
6721     *
6722     * Identify the node where selection currently begins, then observe
6723     * both its text content and its current position in the DOM. Since the
6724     * browser may natively replace the target node during composition, we can
6725     * use its position to find its replacement.
6726     *
6727     *
6728     */
6729    var root = null;
6730    var startText = null;
6731    var fallbackText = null;
6732    function initialize(nativeEventTarget) {
6733      root = nativeEventTarget;
6734      startText = getText();
6735      return true;
6736    }
6737    function reset() {
6738      root = null;
6739      startText = null;
6740      fallbackText = null;
6741    }
6742    function getData() {
6743      if (fallbackText) {
6744        return fallbackText;
6745      }
6746  
6747      var start;
6748      var startValue = startText;
6749      var startLength = startValue.length;
6750      var end;
6751      var endValue = getText();
6752      var endLength = endValue.length;
6753  
6754      for (start = 0; start < startLength; start++) {
6755        if (startValue[start] !== endValue[start]) {
6756          break;
6757        }
6758      }
6759  
6760      var minEnd = startLength - start;
6761  
6762      for (end = 1; end <= minEnd; end++) {
6763        if (startValue[startLength - end] !== endValue[endLength - end]) {
6764          break;
6765        }
6766      }
6767  
6768      var sliceTail = end > 1 ? 1 - end : undefined;
6769      fallbackText = endValue.slice(start, sliceTail);
6770      return fallbackText;
6771    }
6772    function getText() {
6773      if ('value' in root) {
6774        return root.value;
6775      }
6776  
6777      return root.textContent;
6778    }
6779  
6780    /**
6781     * `charCode` represents the actual "character code" and is safe to use with
6782     * `String.fromCharCode`. As such, only keys that correspond to printable
6783     * characters produce a valid `charCode`, the only exception to this is Enter.
6784     * The Tab-key is considered non-printable and does not have a `charCode`,
6785     * presumably because it does not produce a tab-character in browsers.
6786     *
6787     * @param {object} nativeEvent Native browser event.
6788     * @return {number} Normalized `charCode` property.
6789     */
6790    function getEventCharCode(nativeEvent) {
6791      var charCode;
6792      var keyCode = nativeEvent.keyCode;
6793  
6794      if ('charCode' in nativeEvent) {
6795        charCode = nativeEvent.charCode; // FF does not set `charCode` for the Enter-key, check against `keyCode`.
6796  
6797        if (charCode === 0 && keyCode === 13) {
6798          charCode = 13;
6799        }
6800      } else {
6801        // IE8 does not implement `charCode`, but `keyCode` has the correct value.
6802        charCode = keyCode;
6803      } // IE and Edge (on Windows) and Chrome / Safari (on Windows and Linux)
6804      // report Enter as charCode 10 when ctrl is pressed.
6805  
6806  
6807      if (charCode === 10) {
6808        charCode = 13;
6809      } // Some non-printable keys are reported in `charCode`/`keyCode`, discard them.
6810      // Must not discard the (non-)printable Enter-key.
6811  
6812  
6813      if (charCode >= 32 || charCode === 13) {
6814        return charCode;
6815      }
6816  
6817      return 0;
6818    }
6819  
6820    function functionThatReturnsTrue() {
6821      return true;
6822    }
6823  
6824    function functionThatReturnsFalse() {
6825      return false;
6826    } // This is intentionally a factory so that we have different returned constructors.
6827    // If we had a single constructor, it would be megamorphic and engines would deopt.
6828  
6829  
6830    function createSyntheticEvent(Interface) {
6831      /**
6832       * Synthetic events are dispatched by event plugins, typically in response to a
6833       * top-level event delegation handler.
6834       *
6835       * These systems should generally use pooling to reduce the frequency of garbage
6836       * collection. The system should check `isPersistent` to determine whether the
6837       * event should be released into the pool after being dispatched. Users that
6838       * need a persisted event should invoke `persist`.
6839       *
6840       * Synthetic events (and subclasses) implement the DOM Level 3 Events API by
6841       * normalizing browser quirks. Subclasses do not necessarily have to implement a
6842       * DOM interface; custom application-specific events can also subclass this.
6843       */
6844      function SyntheticBaseEvent(reactName, reactEventType, targetInst, nativeEvent, nativeEventTarget) {
6845        this._reactName = reactName;
6846        this._targetInst = targetInst;
6847        this.type = reactEventType;
6848        this.nativeEvent = nativeEvent;
6849        this.target = nativeEventTarget;
6850        this.currentTarget = null;
6851  
6852        for (var _propName in Interface) {
6853          if (!Interface.hasOwnProperty(_propName)) {
6854            continue;
6855          }
6856  
6857          var normalize = Interface[_propName];
6858  
6859          if (normalize) {
6860            this[_propName] = normalize(nativeEvent);
6861          } else {
6862            this[_propName] = nativeEvent[_propName];
6863          }
6864        }
6865  
6866        var defaultPrevented = nativeEvent.defaultPrevented != null ? nativeEvent.defaultPrevented : nativeEvent.returnValue === false;
6867  
6868        if (defaultPrevented) {
6869          this.isDefaultPrevented = functionThatReturnsTrue;
6870        } else {
6871          this.isDefaultPrevented = functionThatReturnsFalse;
6872        }
6873  
6874        this.isPropagationStopped = functionThatReturnsFalse;
6875        return this;
6876      }
6877  
6878      assign(SyntheticBaseEvent.prototype, {
6879        preventDefault: function () {
6880          this.defaultPrevented = true;
6881          var event = this.nativeEvent;
6882  
6883          if (!event) {
6884            return;
6885          }
6886  
6887          if (event.preventDefault) {
6888            event.preventDefault(); // $FlowFixMe - flow is not aware of `unknown` in IE
6889          } else if (typeof event.returnValue !== 'unknown') {
6890            event.returnValue = false;
6891          }
6892  
6893          this.isDefaultPrevented = functionThatReturnsTrue;
6894        },
6895        stopPropagation: function () {
6896          var event = this.nativeEvent;
6897  
6898          if (!event) {
6899            return;
6900          }
6901  
6902          if (event.stopPropagation) {
6903            event.stopPropagation(); // $FlowFixMe - flow is not aware of `unknown` in IE
6904          } else if (typeof event.cancelBubble !== 'unknown') {
6905            // The ChangeEventPlugin registers a "propertychange" event for
6906            // IE. This event does not support bubbling or cancelling, and
6907            // any references to cancelBubble throw "Member not found".  A
6908            // typeof check of "unknown" circumvents this issue (and is also
6909            // IE specific).
6910            event.cancelBubble = true;
6911          }
6912  
6913          this.isPropagationStopped = functionThatReturnsTrue;
6914        },
6915  
6916        /**
6917         * We release all dispatched `SyntheticEvent`s after each event loop, adding
6918         * them back into the pool. This allows a way to hold onto a reference that
6919         * won't be added back into the pool.
6920         */
6921        persist: function () {// Modern event system doesn't use pooling.
6922        },
6923  
6924        /**
6925         * Checks if this event should be released back into the pool.
6926         *
6927         * @return {boolean} True if this should not be released, false otherwise.
6928         */
6929        isPersistent: functionThatReturnsTrue
6930      });
6931      return SyntheticBaseEvent;
6932    }
6933    /**
6934     * @interface Event
6935     * @see http://www.w3.org/TR/DOM-Level-3-Events/
6936     */
6937  
6938  
6939    var EventInterface = {
6940      eventPhase: 0,
6941      bubbles: 0,
6942      cancelable: 0,
6943      timeStamp: function (event) {
6944        return event.timeStamp || Date.now();
6945      },
6946      defaultPrevented: 0,
6947      isTrusted: 0
6948    };
6949    var SyntheticEvent = createSyntheticEvent(EventInterface);
6950  
6951    var UIEventInterface = assign({}, EventInterface, {
6952      view: 0,
6953      detail: 0
6954    });
6955  
6956    var SyntheticUIEvent = createSyntheticEvent(UIEventInterface);
6957    var lastMovementX;
6958    var lastMovementY;
6959    var lastMouseEvent;
6960  
6961    function updateMouseMovementPolyfillState(event) {
6962      if (event !== lastMouseEvent) {
6963        if (lastMouseEvent && event.type === 'mousemove') {
6964          lastMovementX = event.screenX - lastMouseEvent.screenX;
6965          lastMovementY = event.screenY - lastMouseEvent.screenY;
6966        } else {
6967          lastMovementX = 0;
6968          lastMovementY = 0;
6969        }
6970  
6971        lastMouseEvent = event;
6972      }
6973    }
6974    /**
6975     * @interface MouseEvent
6976     * @see http://www.w3.org/TR/DOM-Level-3-Events/
6977     */
6978  
6979  
6980    var MouseEventInterface = assign({}, UIEventInterface, {
6981      screenX: 0,
6982      screenY: 0,
6983      clientX: 0,
6984      clientY: 0,
6985      pageX: 0,
6986      pageY: 0,
6987      ctrlKey: 0,
6988      shiftKey: 0,
6989      altKey: 0,
6990      metaKey: 0,
6991      getModifierState: getEventModifierState,
6992      button: 0,
6993      buttons: 0,
6994      relatedTarget: function (event) {
6995        if (event.relatedTarget === undefined) return event.fromElement === event.srcElement ? event.toElement : event.fromElement;
6996        return event.relatedTarget;
6997      },
6998      movementX: function (event) {
6999        if ('movementX' in event) {
7000          return event.movementX;
7001        }
7002  
7003        updateMouseMovementPolyfillState(event);
7004        return lastMovementX;
7005      },
7006      movementY: function (event) {
7007        if ('movementY' in event) {
7008          return event.movementY;
7009        } // Don't need to call updateMouseMovementPolyfillState() here
7010        // because it's guaranteed to have already run when movementX
7011        // was copied.
7012  
7013  
7014        return lastMovementY;
7015      }
7016    });
7017  
7018    var SyntheticMouseEvent = createSyntheticEvent(MouseEventInterface);
7019    /**
7020     * @interface DragEvent
7021     * @see http://www.w3.org/TR/DOM-Level-3-Events/
7022     */
7023  
7024    var DragEventInterface = assign({}, MouseEventInterface, {
7025      dataTransfer: 0
7026    });
7027  
7028    var SyntheticDragEvent = createSyntheticEvent(DragEventInterface);
7029    /**
7030     * @interface FocusEvent
7031     * @see http://www.w3.org/TR/DOM-Level-3-Events/
7032     */
7033  
7034    var FocusEventInterface = assign({}, UIEventInterface, {
7035      relatedTarget: 0
7036    });
7037  
7038    var SyntheticFocusEvent = createSyntheticEvent(FocusEventInterface);
7039    /**
7040     * @interface Event
7041     * @see http://www.w3.org/TR/css3-animations/#AnimationEvent-interface
7042     * @see https://developer.mozilla.org/en-US/docs/Web/API/AnimationEvent
7043     */
7044  
7045    var AnimationEventInterface = assign({}, EventInterface, {
7046      animationName: 0,
7047      elapsedTime: 0,
7048      pseudoElement: 0
7049    });
7050  
7051    var SyntheticAnimationEvent = createSyntheticEvent(AnimationEventInterface);
7052    /**
7053     * @interface Event
7054     * @see http://www.w3.org/TR/clipboard-apis/
7055     */
7056  
7057    var ClipboardEventInterface = assign({}, EventInterface, {
7058      clipboardData: function (event) {
7059        return 'clipboardData' in event ? event.clipboardData : window.clipboardData;
7060      }
7061    });
7062  
7063    var SyntheticClipboardEvent = createSyntheticEvent(ClipboardEventInterface);
7064    /**
7065     * @interface Event
7066     * @see http://www.w3.org/TR/DOM-Level-3-Events/#events-compositionevents
7067     */
7068  
7069    var CompositionEventInterface = assign({}, EventInterface, {
7070      data: 0
7071    });
7072  
7073    var SyntheticCompositionEvent = createSyntheticEvent(CompositionEventInterface);
7074    /**
7075     * @interface Event
7076     * @see http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105
7077     *      /#events-inputevents
7078     */
7079    // Happens to share the same list for now.
7080  
7081    var SyntheticInputEvent = SyntheticCompositionEvent;
7082    /**
7083     * Normalization of deprecated HTML5 `key` values
7084     * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names
7085     */
7086  
7087    var normalizeKey = {
7088      Esc: 'Escape',
7089      Spacebar: ' ',
7090      Left: 'ArrowLeft',
7091      Up: 'ArrowUp',
7092      Right: 'ArrowRight',
7093      Down: 'ArrowDown',
7094      Del: 'Delete',
7095      Win: 'OS',
7096      Menu: 'ContextMenu',
7097      Apps: 'ContextMenu',
7098      Scroll: 'ScrollLock',
7099      MozPrintableKey: 'Unidentified'
7100    };
7101    /**
7102     * Translation from legacy `keyCode` to HTML5 `key`
7103     * Only special keys supported, all others depend on keyboard layout or browser
7104     * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names
7105     */
7106  
7107    var translateToKey = {
7108      '8': 'Backspace',
7109      '9': 'Tab',
7110      '12': 'Clear',
7111      '13': 'Enter',
7112      '16': 'Shift',
7113      '17': 'Control',
7114      '18': 'Alt',
7115      '19': 'Pause',
7116      '20': 'CapsLock',
7117      '27': 'Escape',
7118      '32': ' ',
7119      '33': 'PageUp',
7120      '34': 'PageDown',
7121      '35': 'End',
7122      '36': 'Home',
7123      '37': 'ArrowLeft',
7124      '38': 'ArrowUp',
7125      '39': 'ArrowRight',
7126      '40': 'ArrowDown',
7127      '45': 'Insert',
7128      '46': 'Delete',
7129      '112': 'F1',
7130      '113': 'F2',
7131      '114': 'F3',
7132      '115': 'F4',
7133      '116': 'F5',
7134      '117': 'F6',
7135      '118': 'F7',
7136      '119': 'F8',
7137      '120': 'F9',
7138      '121': 'F10',
7139      '122': 'F11',
7140      '123': 'F12',
7141      '144': 'NumLock',
7142      '145': 'ScrollLock',
7143      '224': 'Meta'
7144    };
7145    /**
7146     * @param {object} nativeEvent Native browser event.
7147     * @return {string} Normalized `key` property.
7148     */
7149  
7150    function getEventKey(nativeEvent) {
7151      if (nativeEvent.key) {
7152        // Normalize inconsistent values reported by browsers due to
7153        // implementations of a working draft specification.
7154        // FireFox implements `key` but returns `MozPrintableKey` for all
7155        // printable characters (normalized to `Unidentified`), ignore it.
7156        var key = normalizeKey[nativeEvent.key] || nativeEvent.key;
7157  
7158        if (key !== 'Unidentified') {
7159          return key;
7160        }
7161      } // Browser does not implement `key`, polyfill as much of it as we can.
7162  
7163  
7164      if (nativeEvent.type === 'keypress') {
7165        var charCode = getEventCharCode(nativeEvent); // The enter-key is technically both printable and non-printable and can
7166        // thus be captured by `keypress`, no other non-printable key should.
7167  
7168        return charCode === 13 ? 'Enter' : String.fromCharCode(charCode);
7169      }
7170  
7171      if (nativeEvent.type === 'keydown' || nativeEvent.type === 'keyup') {
7172        // While user keyboard layout determines the actual meaning of each
7173        // `keyCode` value, almost all function keys have a universal value.
7174        return translateToKey[nativeEvent.keyCode] || 'Unidentified';
7175      }
7176  
7177      return '';
7178    }
7179    /**
7180     * Translation from modifier key to the associated property in the event.
7181     * @see http://www.w3.org/TR/DOM-Level-3-Events/#keys-Modifiers
7182     */
7183  
7184  
7185    var modifierKeyToProp = {
7186      Alt: 'altKey',
7187      Control: 'ctrlKey',
7188      Meta: 'metaKey',
7189      Shift: 'shiftKey'
7190    }; // Older browsers (Safari <= 10, iOS Safari <= 10.2) do not support
7191    // getModifierState. If getModifierState is not supported, we map it to a set of
7192    // modifier keys exposed by the event. In this case, Lock-keys are not supported.
7193  
7194    function modifierStateGetter(keyArg) {
7195      var syntheticEvent = this;
7196      var nativeEvent = syntheticEvent.nativeEvent;
7197  
7198      if (nativeEvent.getModifierState) {
7199        return nativeEvent.getModifierState(keyArg);
7200      }
7201  
7202      var keyProp = modifierKeyToProp[keyArg];
7203      return keyProp ? !!nativeEvent[keyProp] : false;
7204    }
7205  
7206    function getEventModifierState(nativeEvent) {
7207      return modifierStateGetter;
7208    }
7209    /**
7210     * @interface KeyboardEvent
7211     * @see http://www.w3.org/TR/DOM-Level-3-Events/
7212     */
7213  
7214  
7215    var KeyboardEventInterface = assign({}, UIEventInterface, {
7216      key: getEventKey,
7217      code: 0,
7218      location: 0,
7219      ctrlKey: 0,
7220      shiftKey: 0,
7221      altKey: 0,
7222      metaKey: 0,
7223      repeat: 0,
7224      locale: 0,
7225      getModifierState: getEventModifierState,
7226      // Legacy Interface
7227      charCode: function (event) {
7228        // `charCode` is the result of a KeyPress event and represents the value of
7229        // the actual printable character.
7230        // KeyPress is deprecated, but its replacement is not yet final and not
7231        // implemented in any major browser. Only KeyPress has charCode.
7232        if (event.type === 'keypress') {
7233          return getEventCharCode(event);
7234        }
7235  
7236        return 0;
7237      },
7238      keyCode: function (event) {
7239        // `keyCode` is the result of a KeyDown/Up event and represents the value of
7240        // physical keyboard key.
7241        // The actual meaning of the value depends on the users' keyboard layout
7242        // which cannot be detected. Assuming that it is a US keyboard layout
7243        // provides a surprisingly accurate mapping for US and European users.
7244        // Due to this, it is left to the user to implement at this time.
7245        if (event.type === 'keydown' || event.type === 'keyup') {
7246          return event.keyCode;
7247        }
7248  
7249        return 0;
7250      },
7251      which: function (event) {
7252        // `which` is an alias for either `keyCode` or `charCode` depending on the
7253        // type of the event.
7254        if (event.type === 'keypress') {
7255          return getEventCharCode(event);
7256        }
7257  
7258        if (event.type === 'keydown' || event.type === 'keyup') {
7259          return event.keyCode;
7260        }
7261  
7262        return 0;
7263      }
7264    });
7265  
7266    var SyntheticKeyboardEvent = createSyntheticEvent(KeyboardEventInterface);
7267    /**
7268     * @interface PointerEvent
7269     * @see http://www.w3.org/TR/pointerevents/
7270     */
7271  
7272    var PointerEventInterface = assign({}, MouseEventInterface, {
7273      pointerId: 0,
7274      width: 0,
7275      height: 0,
7276      pressure: 0,
7277      tangentialPressure: 0,
7278      tiltX: 0,
7279      tiltY: 0,
7280      twist: 0,
7281      pointerType: 0,
7282      isPrimary: 0
7283    });
7284  
7285    var SyntheticPointerEvent = createSyntheticEvent(PointerEventInterface);
7286    /**
7287     * @interface TouchEvent
7288     * @see http://www.w3.org/TR/touch-events/
7289     */
7290  
7291    var TouchEventInterface = assign({}, UIEventInterface, {
7292      touches: 0,
7293      targetTouches: 0,
7294      changedTouches: 0,
7295      altKey: 0,
7296      metaKey: 0,
7297      ctrlKey: 0,
7298      shiftKey: 0,
7299      getModifierState: getEventModifierState
7300    });
7301  
7302    var SyntheticTouchEvent = createSyntheticEvent(TouchEventInterface);
7303    /**
7304     * @interface Event
7305     * @see http://www.w3.org/TR/2009/WD-css3-transitions-20090320/#transition-events-
7306     * @see https://developer.mozilla.org/en-US/docs/Web/API/TransitionEvent
7307     */
7308  
7309    var TransitionEventInterface = assign({}, EventInterface, {
7310      propertyName: 0,
7311      elapsedTime: 0,
7312      pseudoElement: 0
7313    });
7314  
7315    var SyntheticTransitionEvent = createSyntheticEvent(TransitionEventInterface);
7316    /**
7317     * @interface WheelEvent
7318     * @see http://www.w3.org/TR/DOM-Level-3-Events/
7319     */
7320  
7321    var WheelEventInterface = assign({}, MouseEventInterface, {
7322      deltaX: function (event) {
7323        return 'deltaX' in event ? event.deltaX : // Fallback to `wheelDeltaX` for Webkit and normalize (right is positive).
7324        'wheelDeltaX' in event ? -event.wheelDeltaX : 0;
7325      },
7326      deltaY: function (event) {
7327        return 'deltaY' in event ? event.deltaY : // Fallback to `wheelDeltaY` for Webkit and normalize (down is positive).
7328        'wheelDeltaY' in event ? -event.wheelDeltaY : // Fallback to `wheelDelta` for IE<9 and normalize (down is positive).
7329        'wheelDelta' in event ? -event.wheelDelta : 0;
7330      },
7331      deltaZ: 0,
7332      // Browsers without "deltaMode" is reporting in raw wheel delta where one
7333      // notch on the scroll is always +/- 120, roughly equivalent to pixels.
7334      // A good approximation of DOM_DELTA_LINE (1) is 5% of viewport size or
7335      // ~40 pixels, for DOM_DELTA_SCREEN (2) it is 87.5% of viewport size.
7336      deltaMode: 0
7337    });
7338  
7339    var SyntheticWheelEvent = createSyntheticEvent(WheelEventInterface);
7340  
7341    var END_KEYCODES = [9, 13, 27, 32]; // Tab, Return, Esc, Space
7342  
7343    var START_KEYCODE = 229;
7344    var canUseCompositionEvent = canUseDOM && 'CompositionEvent' in window;
7345    var documentMode = null;
7346  
7347    if (canUseDOM && 'documentMode' in document) {
7348      documentMode = document.documentMode;
7349    } // Webkit offers a very useful `textInput` event that can be used to
7350    // directly represent `beforeInput`. The IE `textinput` event is not as
7351    // useful, so we don't use it.
7352  
7353  
7354    var canUseTextInputEvent = canUseDOM && 'TextEvent' in window && !documentMode; // In IE9+, we have access to composition events, but the data supplied
7355    // by the native compositionend event may be incorrect. Japanese ideographic
7356    // spaces, for instance (\u3000) are not recorded correctly.
7357  
7358    var useFallbackCompositionData = canUseDOM && (!canUseCompositionEvent || documentMode && documentMode > 8 && documentMode <= 11);
7359    var SPACEBAR_CODE = 32;
7360    var SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE);
7361  
7362    function registerEvents() {
7363      registerTwoPhaseEvent('onBeforeInput', ['compositionend', 'keypress', 'textInput', 'paste']);
7364      registerTwoPhaseEvent('onCompositionEnd', ['compositionend', 'focusout', 'keydown', 'keypress', 'keyup', 'mousedown']);
7365      registerTwoPhaseEvent('onCompositionStart', ['compositionstart', 'focusout', 'keydown', 'keypress', 'keyup', 'mousedown']);
7366      registerTwoPhaseEvent('onCompositionUpdate', ['compositionupdate', 'focusout', 'keydown', 'keypress', 'keyup', 'mousedown']);
7367    } // Track whether we've ever handled a keypress on the space key.
7368  
7369  
7370    var hasSpaceKeypress = false;
7371    /**
7372     * Return whether a native keypress event is assumed to be a command.
7373     * This is required because Firefox fires `keypress` events for key commands
7374     * (cut, copy, select-all, etc.) even though no character is inserted.
7375     */
7376  
7377    function isKeypressCommand(nativeEvent) {
7378      return (nativeEvent.ctrlKey || nativeEvent.altKey || nativeEvent.metaKey) && // ctrlKey && altKey is equivalent to AltGr, and is not a command.
7379      !(nativeEvent.ctrlKey && nativeEvent.altKey);
7380    }
7381    /**
7382     * Translate native top level events into event types.
7383     */
7384  
7385  
7386    function getCompositionEventType(domEventName) {
7387      switch (domEventName) {
7388        case 'compositionstart':
7389          return 'onCompositionStart';
7390  
7391        case 'compositionend':
7392          return 'onCompositionEnd';
7393  
7394        case 'compositionupdate':
7395          return 'onCompositionUpdate';
7396      }
7397    }
7398    /**
7399     * Does our fallback best-guess model think this event signifies that
7400     * composition has begun?
7401     */
7402  
7403  
7404    function isFallbackCompositionStart(domEventName, nativeEvent) {
7405      return domEventName === 'keydown' && nativeEvent.keyCode === START_KEYCODE;
7406    }
7407    /**
7408     * Does our fallback mode think that this event is the end of composition?
7409     */
7410  
7411  
7412    function isFallbackCompositionEnd(domEventName, nativeEvent) {
7413      switch (domEventName) {
7414        case 'keyup':
7415          // Command keys insert or clear IME input.
7416          return END_KEYCODES.indexOf(nativeEvent.keyCode) !== -1;
7417  
7418        case 'keydown':
7419          // Expect IME keyCode on each keydown. If we get any other
7420          // code we must have exited earlier.
7421          return nativeEvent.keyCode !== START_KEYCODE;
7422  
7423        case 'keypress':
7424        case 'mousedown':
7425        case 'focusout':
7426          // Events are not possible without cancelling IME.
7427          return true;
7428  
7429        default:
7430          return false;
7431      }
7432    }
7433    /**
7434     * Google Input Tools provides composition data via a CustomEvent,
7435     * with the `data` property populated in the `detail` object. If this
7436     * is available on the event object, use it. If not, this is a plain
7437     * composition event and we have nothing special to extract.
7438     *
7439     * @param {object} nativeEvent
7440     * @return {?string}
7441     */
7442  
7443  
7444    function getDataFromCustomEvent(nativeEvent) {
7445      var detail = nativeEvent.detail;
7446  
7447      if (typeof detail === 'object' && 'data' in detail) {
7448        return detail.data;
7449      }
7450  
7451      return null;
7452    }
7453    /**
7454     * Check if a composition event was triggered by Korean IME.
7455     * Our fallback mode does not work well with IE's Korean IME,
7456     * so just use native composition events when Korean IME is used.
7457     * Although CompositionEvent.locale property is deprecated,
7458     * it is available in IE, where our fallback mode is enabled.
7459     *
7460     * @param {object} nativeEvent
7461     * @return {boolean}
7462     */
7463  
7464  
7465    function isUsingKoreanIME(nativeEvent) {
7466      return nativeEvent.locale === 'ko';
7467    } // Track the current IME composition status, if any.
7468  
7469  
7470    var isComposing = false;
7471    /**
7472     * @return {?object} A SyntheticCompositionEvent.
7473     */
7474  
7475    function extractCompositionEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget) {
7476      var eventType;
7477      var fallbackData;
7478  
7479      if (canUseCompositionEvent) {
7480        eventType = getCompositionEventType(domEventName);
7481      } else if (!isComposing) {
7482        if (isFallbackCompositionStart(domEventName, nativeEvent)) {
7483          eventType = 'onCompositionStart';
7484        }
7485      } else if (isFallbackCompositionEnd(domEventName, nativeEvent)) {
7486        eventType = 'onCompositionEnd';
7487      }
7488  
7489      if (!eventType) {
7490        return null;
7491      }
7492  
7493      if (useFallbackCompositionData && !isUsingKoreanIME(nativeEvent)) {
7494        // The current composition is stored statically and must not be
7495        // overwritten while composition continues.
7496        if (!isComposing && eventType === 'onCompositionStart') {
7497          isComposing = initialize(nativeEventTarget);
7498        } else if (eventType === 'onCompositionEnd') {
7499          if (isComposing) {
7500            fallbackData = getData();
7501          }
7502        }
7503      }
7504  
7505      var listeners = accumulateTwoPhaseListeners(targetInst, eventType);
7506  
7507      if (listeners.length > 0) {
7508        var event = new SyntheticCompositionEvent(eventType, domEventName, null, nativeEvent, nativeEventTarget);
7509        dispatchQueue.push({
7510          event: event,
7511          listeners: listeners
7512        });
7513  
7514        if (fallbackData) {
7515          // Inject data generated from fallback path into the synthetic event.
7516          // This matches the property of native CompositionEventInterface.
7517          event.data = fallbackData;
7518        } else {
7519          var customData = getDataFromCustomEvent(nativeEvent);
7520  
7521          if (customData !== null) {
7522            event.data = customData;
7523          }
7524        }
7525      }
7526    }
7527  
7528    function getNativeBeforeInputChars(domEventName, nativeEvent) {
7529      switch (domEventName) {
7530        case 'compositionend':
7531          return getDataFromCustomEvent(nativeEvent);
7532  
7533        case 'keypress':
7534          /**
7535           * If native `textInput` events are available, our goal is to make
7536           * use of them. However, there is a special case: the spacebar key.
7537           * In Webkit, preventing default on a spacebar `textInput` event
7538           * cancels character insertion, but it *also* causes the browser
7539           * to fall back to its default spacebar behavior of scrolling the
7540           * page.
7541           *
7542           * Tracking at:
7543           * https://code.google.com/p/chromium/issues/detail?id=355103
7544           *
7545           * To avoid this issue, use the keypress event as if no `textInput`
7546           * event is available.
7547           */
7548          var which = nativeEvent.which;
7549  
7550          if (which !== SPACEBAR_CODE) {
7551            return null;
7552          }
7553  
7554          hasSpaceKeypress = true;
7555          return SPACEBAR_CHAR;
7556  
7557        case 'textInput':
7558          // Record the characters to be added to the DOM.
7559          var chars = nativeEvent.data; // If it's a spacebar character, assume that we have already handled
7560          // it at the keypress level and bail immediately. Android Chrome
7561          // doesn't give us keycodes, so we need to ignore it.
7562  
7563          if (chars === SPACEBAR_CHAR && hasSpaceKeypress) {
7564            return null;
7565          }
7566  
7567          return chars;
7568  
7569        default:
7570          // For other native event types, do nothing.
7571          return null;
7572      }
7573    }
7574    /**
7575     * For browsers that do not provide the `textInput` event, extract the
7576     * appropriate string to use for SyntheticInputEvent.
7577     */
7578  
7579  
7580    function getFallbackBeforeInputChars(domEventName, nativeEvent) {
7581      // If we are currently composing (IME) and using a fallback to do so,
7582      // try to extract the composed characters from the fallback object.
7583      // If composition event is available, we extract a string only at
7584      // compositionevent, otherwise extract it at fallback events.
7585      if (isComposing) {
7586        if (domEventName === 'compositionend' || !canUseCompositionEvent && isFallbackCompositionEnd(domEventName, nativeEvent)) {
7587          var chars = getData();
7588          reset();
7589          isComposing = false;
7590          return chars;
7591        }
7592  
7593        return null;
7594      }
7595  
7596      switch (domEventName) {
7597        case 'paste':
7598          // If a paste event occurs after a keypress, throw out the input
7599          // chars. Paste events should not lead to BeforeInput events.
7600          return null;
7601  
7602        case 'keypress':
7603          /**
7604           * As of v27, Firefox may fire keypress events even when no character
7605           * will be inserted. A few possibilities:
7606           *
7607           * - `which` is `0`. Arrow keys, Esc key, etc.
7608           *
7609           * - `which` is the pressed key code, but no char is available.
7610           *   Ex: 'AltGr + d` in Polish. There is no modified character for
7611           *   this key combination and no character is inserted into the
7612           *   document, but FF fires the keypress for char code `100` anyway.
7613           *   No `input` event will occur.
7614           *
7615           * - `which` is the pressed key code, but a command combination is
7616           *   being used. Ex: `Cmd+C`. No character is inserted, and no
7617           *   `input` event will occur.
7618           */
7619          if (!isKeypressCommand(nativeEvent)) {
7620            // IE fires the `keypress` event when a user types an emoji via
7621            // Touch keyboard of Windows.  In such a case, the `char` property
7622            // holds an emoji character like `\uD83D\uDE0A`.  Because its length
7623            // is 2, the property `which` does not represent an emoji correctly.
7624            // In such a case, we directly return the `char` property instead of
7625            // using `which`.
7626            if (nativeEvent.char && nativeEvent.char.length > 1) {
7627              return nativeEvent.char;
7628            } else if (nativeEvent.which) {
7629              return String.fromCharCode(nativeEvent.which);
7630            }
7631          }
7632  
7633          return null;
7634  
7635        case 'compositionend':
7636          return useFallbackCompositionData && !isUsingKoreanIME(nativeEvent) ? null : nativeEvent.data;
7637  
7638        default:
7639          return null;
7640      }
7641    }
7642    /**
7643     * Extract a SyntheticInputEvent for `beforeInput`, based on either native
7644     * `textInput` or fallback behavior.
7645     *
7646     * @return {?object} A SyntheticInputEvent.
7647     */
7648  
7649  
7650    function extractBeforeInputEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget) {
7651      var chars;
7652  
7653      if (canUseTextInputEvent) {
7654        chars = getNativeBeforeInputChars(domEventName, nativeEvent);
7655      } else {
7656        chars = getFallbackBeforeInputChars(domEventName, nativeEvent);
7657      } // If no characters are being inserted, no BeforeInput event should
7658      // be fired.
7659  
7660  
7661      if (!chars) {
7662        return null;
7663      }
7664  
7665      var listeners = accumulateTwoPhaseListeners(targetInst, 'onBeforeInput');
7666  
7667      if (listeners.length > 0) {
7668        var event = new SyntheticInputEvent('onBeforeInput', 'beforeinput', null, nativeEvent, nativeEventTarget);
7669        dispatchQueue.push({
7670          event: event,
7671          listeners: listeners
7672        });
7673        event.data = chars;
7674      }
7675    }
7676    /**
7677     * Create an `onBeforeInput` event to match
7678     * http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105/#events-inputevents.
7679     *
7680     * This event plugin is based on the native `textInput` event
7681     * available in Chrome, Safari, Opera, and IE. This event fires after
7682     * `onKeyPress` and `onCompositionEnd`, but before `onInput`.
7683     *
7684     * `beforeInput` is spec'd but not implemented in any browsers, and
7685     * the `input` event does not provide any useful information about what has
7686     * actually been added, contrary to the spec. Thus, `textInput` is the best
7687     * available event to identify the characters that have actually been inserted
7688     * into the target node.
7689     *
7690     * This plugin is also responsible for emitting `composition` events, thus
7691     * allowing us to share composition fallback code for both `beforeInput` and
7692     * `composition` event types.
7693     */
7694  
7695  
7696    function extractEvents(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
7697      extractCompositionEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
7698      extractBeforeInputEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
7699    }
7700  
7701    /**
7702     * @see http://www.whatwg.org/specs/web-apps/current-work/multipage/the-input-element.html#input-type-attr-summary
7703     */
7704    var supportedInputTypes = {
7705      color: true,
7706      date: true,
7707      datetime: true,
7708      'datetime-local': true,
7709      email: true,
7710      month: true,
7711      number: true,
7712      password: true,
7713      range: true,
7714      search: true,
7715      tel: true,
7716      text: true,
7717      time: true,
7718      url: true,
7719      week: true
7720    };
7721  
7722    function isTextInputElement(elem) {
7723      var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase();
7724  
7725      if (nodeName === 'input') {
7726        return !!supportedInputTypes[elem.type];
7727      }
7728  
7729      if (nodeName === 'textarea') {
7730        return true;
7731      }
7732  
7733      return false;
7734    }
7735  
7736    /**
7737     * Checks if an event is supported in the current execution environment.
7738     *
7739     * NOTE: This will not work correctly for non-generic events such as `change`,
7740     * `reset`, `load`, `error`, and `select`.
7741     *
7742     * Borrows from Modernizr.
7743     *
7744     * @param {string} eventNameSuffix Event name, e.g. "click".
7745     * @return {boolean} True if the event is supported.
7746     * @internal
7747     * @license Modernizr 3.0.0pre (Custom Build) | MIT
7748     */
7749  
7750    function isEventSupported(eventNameSuffix) {
7751      if (!canUseDOM) {
7752        return false;
7753      }
7754  
7755      var eventName = 'on' + eventNameSuffix;
7756      var isSupported = (eventName in document);
7757  
7758      if (!isSupported) {
7759        var element = document.createElement('div');
7760        element.setAttribute(eventName, 'return;');
7761        isSupported = typeof element[eventName] === 'function';
7762      }
7763  
7764      return isSupported;
7765    }
7766  
7767    function registerEvents$1() {
7768      registerTwoPhaseEvent('onChange', ['change', 'click', 'focusin', 'focusout', 'input', 'keydown', 'keyup', 'selectionchange']);
7769    }
7770  
7771    function createAndAccumulateChangeEvent(dispatchQueue, inst, nativeEvent, target) {
7772      // Flag this event loop as needing state restore.
7773      enqueueStateRestore(target);
7774      var listeners = accumulateTwoPhaseListeners(inst, 'onChange');
7775  
7776      if (listeners.length > 0) {
7777        var event = new SyntheticEvent('onChange', 'change', null, nativeEvent, target);
7778        dispatchQueue.push({
7779          event: event,
7780          listeners: listeners
7781        });
7782      }
7783    }
7784    /**
7785     * For IE shims
7786     */
7787  
7788  
7789    var activeElement = null;
7790    var activeElementInst = null;
7791    /**
7792     * SECTION: handle `change` event
7793     */
7794  
7795    function shouldUseChangeEvent(elem) {
7796      var nodeName = elem.nodeName && elem.nodeName.toLowerCase();
7797      return nodeName === 'select' || nodeName === 'input' && elem.type === 'file';
7798    }
7799  
7800    function manualDispatchChangeEvent(nativeEvent) {
7801      var dispatchQueue = [];
7802      createAndAccumulateChangeEvent(dispatchQueue, activeElementInst, nativeEvent, getEventTarget(nativeEvent)); // If change and propertychange bubbled, we'd just bind to it like all the
7803      // other events and have it go through ReactBrowserEventEmitter. Since it
7804      // doesn't, we manually listen for the events and so we have to enqueue and
7805      // process the abstract event manually.
7806      //
7807      // Batching is necessary here in order to ensure that all event handlers run
7808      // before the next rerender (including event handlers attached to ancestor
7809      // elements instead of directly on the input). Without this, controlled
7810      // components don't work properly in conjunction with event bubbling because
7811      // the component is rerendered and the value reverted before all the event
7812      // handlers can run. See https://github.com/facebook/react/issues/708.
7813  
7814      batchedUpdates(runEventInBatch, dispatchQueue);
7815    }
7816  
7817    function runEventInBatch(dispatchQueue) {
7818      processDispatchQueue(dispatchQueue, 0);
7819    }
7820  
7821    function getInstIfValueChanged(targetInst) {
7822      var targetNode = getNodeFromInstance(targetInst);
7823  
7824      if (updateValueIfChanged(targetNode)) {
7825        return targetInst;
7826      }
7827    }
7828  
7829    function getTargetInstForChangeEvent(domEventName, targetInst) {
7830      if (domEventName === 'change') {
7831        return targetInst;
7832      }
7833    }
7834    /**
7835     * SECTION: handle `input` event
7836     */
7837  
7838  
7839    var isInputEventSupported = false;
7840  
7841    if (canUseDOM) {
7842      // IE9 claims to support the input event but fails to trigger it when
7843      // deleting text, so we ignore its input events.
7844      isInputEventSupported = isEventSupported('input') && (!document.documentMode || document.documentMode > 9);
7845    }
7846    /**
7847     * (For IE <=9) Starts tracking propertychange events on the passed-in element
7848     * and override the value property so that we can distinguish user events from
7849     * value changes in JS.
7850     */
7851  
7852  
7853    function startWatchingForValueChange(target, targetInst) {
7854      activeElement = target;
7855      activeElementInst = targetInst;
7856      activeElement.attachEvent('onpropertychange', handlePropertyChange);
7857    }
7858    /**
7859     * (For IE <=9) Removes the event listeners from the currently-tracked element,
7860     * if any exists.
7861     */
7862  
7863  
7864    function stopWatchingForValueChange() {
7865      if (!activeElement) {
7866        return;
7867      }
7868  
7869      activeElement.detachEvent('onpropertychange', handlePropertyChange);
7870      activeElement = null;
7871      activeElementInst = null;
7872    }
7873    /**
7874     * (For IE <=9) Handles a propertychange event, sending a `change` event if
7875     * the value of the active element has changed.
7876     */
7877  
7878  
7879    function handlePropertyChange(nativeEvent) {
7880      if (nativeEvent.propertyName !== 'value') {
7881        return;
7882      }
7883  
7884      if (getInstIfValueChanged(activeElementInst)) {
7885        manualDispatchChangeEvent(nativeEvent);
7886      }
7887    }
7888  
7889    function handleEventsForInputEventPolyfill(domEventName, target, targetInst) {
7890      if (domEventName === 'focusin') {
7891        // In IE9, propertychange fires for most input events but is buggy and
7892        // doesn't fire when text is deleted, but conveniently, selectionchange
7893        // appears to fire in all of the remaining cases so we catch those and
7894        // forward the event if the value has changed
7895        // In either case, we don't want to call the event handler if the value
7896        // is changed from JS so we redefine a setter for `.value` that updates
7897        // our activeElementValue variable, allowing us to ignore those changes
7898        //
7899        // stopWatching() should be a noop here but we call it just in case we
7900        // missed a blur event somehow.
7901        stopWatchingForValueChange();
7902        startWatchingForValueChange(target, targetInst);
7903      } else if (domEventName === 'focusout') {
7904        stopWatchingForValueChange();
7905      }
7906    } // For IE8 and IE9.
7907  
7908  
7909    function getTargetInstForInputEventPolyfill(domEventName, targetInst) {
7910      if (domEventName === 'selectionchange' || domEventName === 'keyup' || domEventName === 'keydown') {
7911        // On the selectionchange event, the target is just document which isn't
7912        // helpful for us so just check activeElement instead.
7913        //
7914        // 99% of the time, keydown and keyup aren't necessary. IE8 fails to fire
7915        // propertychange on the first input event after setting `value` from a
7916        // script and fires only keydown, keypress, keyup. Catching keyup usually
7917        // gets it and catching keydown lets us fire an event for the first
7918        // keystroke if user does a key repeat (it'll be a little delayed: right
7919        // before the second keystroke). Other input methods (e.g., paste) seem to
7920        // fire selectionchange normally.
7921        return getInstIfValueChanged(activeElementInst);
7922      }
7923    }
7924    /**
7925     * SECTION: handle `click` event
7926     */
7927  
7928  
7929    function shouldUseClickEvent(elem) {
7930      // Use the `click` event to detect changes to checkbox and radio inputs.
7931      // This approach works across all browsers, whereas `change` does not fire
7932      // until `blur` in IE8.
7933      var nodeName = elem.nodeName;
7934      return nodeName && nodeName.toLowerCase() === 'input' && (elem.type === 'checkbox' || elem.type === 'radio');
7935    }
7936  
7937    function getTargetInstForClickEvent(domEventName, targetInst) {
7938      if (domEventName === 'click') {
7939        return getInstIfValueChanged(targetInst);
7940      }
7941    }
7942  
7943    function getTargetInstForInputOrChangeEvent(domEventName, targetInst) {
7944      if (domEventName === 'input' || domEventName === 'change') {
7945        return getInstIfValueChanged(targetInst);
7946      }
7947    }
7948  
7949    function handleControlledInputBlur(node) {
7950      var state = node._wrapperState;
7951  
7952      if (!state || !state.controlled || node.type !== 'number') {
7953        return;
7954      }
7955  
7956      {
7957        // If controlled, assign the value attribute to the current value on blur
7958        setDefaultValue(node, 'number', node.value);
7959      }
7960    }
7961    /**
7962     * This plugin creates an `onChange` event that normalizes change events
7963     * across form elements. This event fires at a time when it's possible to
7964     * change the element's value without seeing a flicker.
7965     *
7966     * Supported elements are:
7967     * - input (see `isTextInputElement`)
7968     * - textarea
7969     * - select
7970     */
7971  
7972  
7973    function extractEvents$1(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
7974      var targetNode = targetInst ? getNodeFromInstance(targetInst) : window;
7975      var getTargetInstFunc, handleEventFunc;
7976  
7977      if (shouldUseChangeEvent(targetNode)) {
7978        getTargetInstFunc = getTargetInstForChangeEvent;
7979      } else if (isTextInputElement(targetNode)) {
7980        if (isInputEventSupported) {
7981          getTargetInstFunc = getTargetInstForInputOrChangeEvent;
7982        } else {
7983          getTargetInstFunc = getTargetInstForInputEventPolyfill;
7984          handleEventFunc = handleEventsForInputEventPolyfill;
7985        }
7986      } else if (shouldUseClickEvent(targetNode)) {
7987        getTargetInstFunc = getTargetInstForClickEvent;
7988      }
7989  
7990      if (getTargetInstFunc) {
7991        var inst = getTargetInstFunc(domEventName, targetInst);
7992  
7993        if (inst) {
7994          createAndAccumulateChangeEvent(dispatchQueue, inst, nativeEvent, nativeEventTarget);
7995          return;
7996        }
7997      }
7998  
7999      if (handleEventFunc) {
8000        handleEventFunc(domEventName, targetNode, targetInst);
8001      } // When blurring, set the value attribute for number inputs
8002  
8003  
8004      if (domEventName === 'focusout') {
8005        handleControlledInputBlur(targetNode);
8006      }
8007    }
8008  
8009    function registerEvents$2() {
8010      registerDirectEvent('onMouseEnter', ['mouseout', 'mouseover']);
8011      registerDirectEvent('onMouseLeave', ['mouseout', 'mouseover']);
8012      registerDirectEvent('onPointerEnter', ['pointerout', 'pointerover']);
8013      registerDirectEvent('onPointerLeave', ['pointerout', 'pointerover']);
8014    }
8015    /**
8016     * For almost every interaction we care about, there will be both a top-level
8017     * `mouseover` and `mouseout` event that occurs. Only use `mouseout` so that
8018     * we do not extract duplicate events. However, moving the mouse into the
8019     * browser from outside will not fire a `mouseout` event. In this case, we use
8020     * the `mouseover` top-level event.
8021     */
8022  
8023  
8024    function extractEvents$2(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
8025      var isOverEvent = domEventName === 'mouseover' || domEventName === 'pointerover';
8026      var isOutEvent = domEventName === 'mouseout' || domEventName === 'pointerout';
8027  
8028      if (isOverEvent && !isReplayingEvent(nativeEvent)) {
8029        // If this is an over event with a target, we might have already dispatched
8030        // the event in the out event of the other target. If this is replayed,
8031        // then it's because we couldn't dispatch against this target previously
8032        // so we have to do it now instead.
8033        var related = nativeEvent.relatedTarget || nativeEvent.fromElement;
8034  
8035        if (related) {
8036          // If the related node is managed by React, we can assume that we have
8037          // already dispatched the corresponding events during its mouseout.
8038          if (getClosestInstanceFromNode(related) || isContainerMarkedAsRoot(related)) {
8039            return;
8040          }
8041        }
8042      }
8043  
8044      if (!isOutEvent && !isOverEvent) {
8045        // Must not be a mouse or pointer in or out - ignoring.
8046        return;
8047      }
8048  
8049      var win; // TODO: why is this nullable in the types but we read from it?
8050  
8051      if (nativeEventTarget.window === nativeEventTarget) {
8052        // `nativeEventTarget` is probably a window object.
8053        win = nativeEventTarget;
8054      } else {
8055        // TODO: Figure out why `ownerDocument` is sometimes undefined in IE8.
8056        var doc = nativeEventTarget.ownerDocument;
8057  
8058        if (doc) {
8059          win = doc.defaultView || doc.parentWindow;
8060        } else {
8061          win = window;
8062        }
8063      }
8064  
8065      var from;
8066      var to;
8067  
8068      if (isOutEvent) {
8069        var _related = nativeEvent.relatedTarget || nativeEvent.toElement;
8070  
8071        from = targetInst;
8072        to = _related ? getClosestInstanceFromNode(_related) : null;
8073  
8074        if (to !== null) {
8075          var nearestMounted = getNearestMountedFiber(to);
8076  
8077          if (to !== nearestMounted || to.tag !== HostComponent && to.tag !== HostText) {
8078            to = null;
8079          }
8080        }
8081      } else {
8082        // Moving to a node from outside the window.
8083        from = null;
8084        to = targetInst;
8085      }
8086  
8087      if (from === to) {
8088        // Nothing pertains to our managed components.
8089        return;
8090      }
8091  
8092      var SyntheticEventCtor = SyntheticMouseEvent;
8093      var leaveEventType = 'onMouseLeave';
8094      var enterEventType = 'onMouseEnter';
8095      var eventTypePrefix = 'mouse';
8096  
8097      if (domEventName === 'pointerout' || domEventName === 'pointerover') {
8098        SyntheticEventCtor = SyntheticPointerEvent;
8099        leaveEventType = 'onPointerLeave';
8100        enterEventType = 'onPointerEnter';
8101        eventTypePrefix = 'pointer';
8102      }
8103  
8104      var fromNode = from == null ? win : getNodeFromInstance(from);
8105      var toNode = to == null ? win : getNodeFromInstance(to);
8106      var leave = new SyntheticEventCtor(leaveEventType, eventTypePrefix + 'leave', from, nativeEvent, nativeEventTarget);
8107      leave.target = fromNode;
8108      leave.relatedTarget = toNode;
8109      var enter = null; // We should only process this nativeEvent if we are processing
8110      // the first ancestor. Next time, we will ignore the event.
8111  
8112      var nativeTargetInst = getClosestInstanceFromNode(nativeEventTarget);
8113  
8114      if (nativeTargetInst === targetInst) {
8115        var enterEvent = new SyntheticEventCtor(enterEventType, eventTypePrefix + 'enter', to, nativeEvent, nativeEventTarget);
8116        enterEvent.target = toNode;
8117        enterEvent.relatedTarget = fromNode;
8118        enter = enterEvent;
8119      }
8120  
8121      accumulateEnterLeaveTwoPhaseListeners(dispatchQueue, leave, enter, from, to);
8122    }
8123  
8124    /**
8125     * inlined Object.is polyfill to avoid requiring consumers ship their own
8126     * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
8127     */
8128    function is(x, y) {
8129      return x === y && (x !== 0 || 1 / x === 1 / y) || x !== x && y !== y // eslint-disable-line no-self-compare
8130      ;
8131    }
8132  
8133    var objectIs = typeof Object.is === 'function' ? Object.is : is;
8134  
8135    /**
8136     * Performs equality by iterating through keys on an object and returning false
8137     * when any key has values which are not strictly equal between the arguments.
8138     * Returns true when the values of all keys are strictly equal.
8139     */
8140  
8141    function shallowEqual(objA, objB) {
8142      if (objectIs(objA, objB)) {
8143        return true;
8144      }
8145  
8146      if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) {
8147        return false;
8148      }
8149  
8150      var keysA = Object.keys(objA);
8151      var keysB = Object.keys(objB);
8152  
8153      if (keysA.length !== keysB.length) {
8154        return false;
8155      } // Test for A's keys different from B.
8156  
8157  
8158      for (var i = 0; i < keysA.length; i++) {
8159        var currentKey = keysA[i];
8160  
8161        if (!hasOwnProperty.call(objB, currentKey) || !objectIs(objA[currentKey], objB[currentKey])) {
8162          return false;
8163        }
8164      }
8165  
8166      return true;
8167    }
8168  
8169    /**
8170     * Given any node return the first leaf node without children.
8171     *
8172     * @param {DOMElement|DOMTextNode} node
8173     * @return {DOMElement|DOMTextNode}
8174     */
8175  
8176    function getLeafNode(node) {
8177      while (node && node.firstChild) {
8178        node = node.firstChild;
8179      }
8180  
8181      return node;
8182    }
8183    /**
8184     * Get the next sibling within a container. This will walk up the
8185     * DOM if a node's siblings have been exhausted.
8186     *
8187     * @param {DOMElement|DOMTextNode} node
8188     * @return {?DOMElement|DOMTextNode}
8189     */
8190  
8191  
8192    function getSiblingNode(node) {
8193      while (node) {
8194        if (node.nextSibling) {
8195          return node.nextSibling;
8196        }
8197  
8198        node = node.parentNode;
8199      }
8200    }
8201    /**
8202     * Get object describing the nodes which contain characters at offset.
8203     *
8204     * @param {DOMElement|DOMTextNode} root
8205     * @param {number} offset
8206     * @return {?object}
8207     */
8208  
8209  
8210    function getNodeForCharacterOffset(root, offset) {
8211      var node = getLeafNode(root);
8212      var nodeStart = 0;
8213      var nodeEnd = 0;
8214  
8215      while (node) {
8216        if (node.nodeType === TEXT_NODE) {
8217          nodeEnd = nodeStart + node.textContent.length;
8218  
8219          if (nodeStart <= offset && nodeEnd >= offset) {
8220            return {
8221              node: node,
8222              offset: offset - nodeStart
8223            };
8224          }
8225  
8226          nodeStart = nodeEnd;
8227        }
8228  
8229        node = getLeafNode(getSiblingNode(node));
8230      }
8231    }
8232  
8233    /**
8234     * @param {DOMElement} outerNode
8235     * @return {?object}
8236     */
8237  
8238    function getOffsets(outerNode) {
8239      var ownerDocument = outerNode.ownerDocument;
8240      var win = ownerDocument && ownerDocument.defaultView || window;
8241      var selection = win.getSelection && win.getSelection();
8242  
8243      if (!selection || selection.rangeCount === 0) {
8244        return null;
8245      }
8246  
8247      var anchorNode = selection.anchorNode,
8248          anchorOffset = selection.anchorOffset,
8249          focusNode = selection.focusNode,
8250          focusOffset = selection.focusOffset; // In Firefox, anchorNode and focusNode can be "anonymous divs", e.g. the
8251      // up/down buttons on an <input type="number">. Anonymous divs do not seem to
8252      // expose properties, triggering a "Permission denied error" if any of its
8253      // properties are accessed. The only seemingly possible way to avoid erroring
8254      // is to access a property that typically works for non-anonymous divs and
8255      // catch any error that may otherwise arise. See
8256      // https://bugzilla.mozilla.org/show_bug.cgi?id=208427
8257  
8258      try {
8259        /* eslint-disable no-unused-expressions */
8260        anchorNode.nodeType;
8261        focusNode.nodeType;
8262        /* eslint-enable no-unused-expressions */
8263      } catch (e) {
8264        return null;
8265      }
8266  
8267      return getModernOffsetsFromPoints(outerNode, anchorNode, anchorOffset, focusNode, focusOffset);
8268    }
8269    /**
8270     * Returns {start, end} where `start` is the character/codepoint index of
8271     * (anchorNode, anchorOffset) within the textContent of `outerNode`, and
8272     * `end` is the index of (focusNode, focusOffset).
8273     *
8274     * Returns null if you pass in garbage input but we should probably just crash.
8275     *
8276     * Exported only for testing.
8277     */
8278  
8279    function getModernOffsetsFromPoints(outerNode, anchorNode, anchorOffset, focusNode, focusOffset) {
8280      var length = 0;
8281      var start = -1;
8282      var end = -1;
8283      var indexWithinAnchor = 0;
8284      var indexWithinFocus = 0;
8285      var node = outerNode;
8286      var parentNode = null;
8287  
8288      outer: while (true) {
8289        var next = null;
8290  
8291        while (true) {
8292          if (node === anchorNode && (anchorOffset === 0 || node.nodeType === TEXT_NODE)) {
8293            start = length + anchorOffset;
8294          }
8295  
8296          if (node === focusNode && (focusOffset === 0 || node.nodeType === TEXT_NODE)) {
8297            end = length + focusOffset;
8298          }
8299  
8300          if (node.nodeType === TEXT_NODE) {
8301            length += node.nodeValue.length;
8302          }
8303  
8304          if ((next = node.firstChild) === null) {
8305            break;
8306          } // Moving from `node` to its first child `next`.
8307  
8308  
8309          parentNode = node;
8310          node = next;
8311        }
8312  
8313        while (true) {
8314          if (node === outerNode) {
8315            // If `outerNode` has children, this is always the second time visiting
8316            // it. If it has no children, this is still the first loop, and the only
8317            // valid selection is anchorNode and focusNode both equal to this node
8318            // and both offsets 0, in which case we will have handled above.
8319            break outer;
8320          }
8321  
8322          if (parentNode === anchorNode && ++indexWithinAnchor === anchorOffset) {
8323            start = length;
8324          }
8325  
8326          if (parentNode === focusNode && ++indexWithinFocus === focusOffset) {
8327            end = length;
8328          }
8329  
8330          if ((next = node.nextSibling) !== null) {
8331            break;
8332          }
8333  
8334          node = parentNode;
8335          parentNode = node.parentNode;
8336        } // Moving from `node` to its next sibling `next`.
8337  
8338  
8339        node = next;
8340      }
8341  
8342      if (start === -1 || end === -1) {
8343        // This should never happen. (Would happen if the anchor/focus nodes aren't
8344        // actually inside the passed-in node.)
8345        return null;
8346      }
8347  
8348      return {
8349        start: start,
8350        end: end
8351      };
8352    }
8353    /**
8354     * In modern non-IE browsers, we can support both forward and backward
8355     * selections.
8356     *
8357     * Note: IE10+ supports the Selection object, but it does not support
8358     * the `extend` method, which means that even in modern IE, it's not possible
8359     * to programmatically create a backward selection. Thus, for all IE
8360     * versions, we use the old IE API to create our selections.
8361     *
8362     * @param {DOMElement|DOMTextNode} node
8363     * @param {object} offsets
8364     */
8365  
8366    function setOffsets(node, offsets) {
8367      var doc = node.ownerDocument || document;
8368      var win = doc && doc.defaultView || window; // Edge fails with "Object expected" in some scenarios.
8369      // (For instance: TinyMCE editor used in a list component that supports pasting to add more,
8370      // fails when pasting 100+ items)
8371  
8372      if (!win.getSelection) {
8373        return;
8374      }
8375  
8376      var selection = win.getSelection();
8377      var length = node.textContent.length;
8378      var start = Math.min(offsets.start, length);
8379      var end = offsets.end === undefined ? start : Math.min(offsets.end, length); // IE 11 uses modern selection, but doesn't support the extend method.
8380      // Flip backward selections, so we can set with a single range.
8381  
8382      if (!selection.extend && start > end) {
8383        var temp = end;
8384        end = start;
8385        start = temp;
8386      }
8387  
8388      var startMarker = getNodeForCharacterOffset(node, start);
8389      var endMarker = getNodeForCharacterOffset(node, end);
8390  
8391      if (startMarker && endMarker) {
8392        if (selection.rangeCount === 1 && selection.anchorNode === startMarker.node && selection.anchorOffset === startMarker.offset && selection.focusNode === endMarker.node && selection.focusOffset === endMarker.offset) {
8393          return;
8394        }
8395  
8396        var range = doc.createRange();
8397        range.setStart(startMarker.node, startMarker.offset);
8398        selection.removeAllRanges();
8399  
8400        if (start > end) {
8401          selection.addRange(range);
8402          selection.extend(endMarker.node, endMarker.offset);
8403        } else {
8404          range.setEnd(endMarker.node, endMarker.offset);
8405          selection.addRange(range);
8406        }
8407      }
8408    }
8409  
8410    function isTextNode(node) {
8411      return node && node.nodeType === TEXT_NODE;
8412    }
8413  
8414    function containsNode(outerNode, innerNode) {
8415      if (!outerNode || !innerNode) {
8416        return false;
8417      } else if (outerNode === innerNode) {
8418        return true;
8419      } else if (isTextNode(outerNode)) {
8420        return false;
8421      } else if (isTextNode(innerNode)) {
8422        return containsNode(outerNode, innerNode.parentNode);
8423      } else if ('contains' in outerNode) {
8424        return outerNode.contains(innerNode);
8425      } else if (outerNode.compareDocumentPosition) {
8426        return !!(outerNode.compareDocumentPosition(innerNode) & 16);
8427      } else {
8428        return false;
8429      }
8430    }
8431  
8432    function isInDocument(node) {
8433      return node && node.ownerDocument && containsNode(node.ownerDocument.documentElement, node);
8434    }
8435  
8436    function isSameOriginFrame(iframe) {
8437      try {
8438        // Accessing the contentDocument of a HTMLIframeElement can cause the browser
8439        // to throw, e.g. if it has a cross-origin src attribute.
8440        // Safari will show an error in the console when the access results in "Blocked a frame with origin". e.g:
8441        // iframe.contentDocument.defaultView;
8442        // A safety way is to access one of the cross origin properties: Window or Location
8443        // Which might result in "SecurityError" DOM Exception and it is compatible to Safari.
8444        // https://html.spec.whatwg.org/multipage/browsers.html#integration-with-idl
8445        return typeof iframe.contentWindow.location.href === 'string';
8446      } catch (err) {
8447        return false;
8448      }
8449    }
8450  
8451    function getActiveElementDeep() {
8452      var win = window;
8453      var element = getActiveElement();
8454  
8455      while (element instanceof win.HTMLIFrameElement) {
8456        if (isSameOriginFrame(element)) {
8457          win = element.contentWindow;
8458        } else {
8459          return element;
8460        }
8461  
8462        element = getActiveElement(win.document);
8463      }
8464  
8465      return element;
8466    }
8467    /**
8468     * @ReactInputSelection: React input selection module. Based on Selection.js,
8469     * but modified to be suitable for react and has a couple of bug fixes (doesn't
8470     * assume buttons have range selections allowed).
8471     * Input selection module for React.
8472     */
8473  
8474    /**
8475     * @hasSelectionCapabilities: we get the element types that support selection
8476     * from https://html.spec.whatwg.org/#do-not-apply, looking at `selectionStart`
8477     * and `selectionEnd` rows.
8478     */
8479  
8480  
8481    function hasSelectionCapabilities(elem) {
8482      var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase();
8483      return nodeName && (nodeName === 'input' && (elem.type === 'text' || elem.type === 'search' || elem.type === 'tel' || elem.type === 'url' || elem.type === 'password') || nodeName === 'textarea' || elem.contentEditable === 'true');
8484    }
8485    function getSelectionInformation() {
8486      var focusedElem = getActiveElementDeep();
8487      return {
8488        focusedElem: focusedElem,
8489        selectionRange: hasSelectionCapabilities(focusedElem) ? getSelection(focusedElem) : null
8490      };
8491    }
8492    /**
8493     * @restoreSelection: If any selection information was potentially lost,
8494     * restore it. This is useful when performing operations that could remove dom
8495     * nodes and place them back in, resulting in focus being lost.
8496     */
8497  
8498    function restoreSelection(priorSelectionInformation) {
8499      var curFocusedElem = getActiveElementDeep();
8500      var priorFocusedElem = priorSelectionInformation.focusedElem;
8501      var priorSelectionRange = priorSelectionInformation.selectionRange;
8502  
8503      if (curFocusedElem !== priorFocusedElem && isInDocument(priorFocusedElem)) {
8504        if (priorSelectionRange !== null && hasSelectionCapabilities(priorFocusedElem)) {
8505          setSelection(priorFocusedElem, priorSelectionRange);
8506        } // Focusing a node can change the scroll position, which is undesirable
8507  
8508  
8509        var ancestors = [];
8510        var ancestor = priorFocusedElem;
8511  
8512        while (ancestor = ancestor.parentNode) {
8513          if (ancestor.nodeType === ELEMENT_NODE) {
8514            ancestors.push({
8515              element: ancestor,
8516              left: ancestor.scrollLeft,
8517              top: ancestor.scrollTop
8518            });
8519          }
8520        }
8521  
8522        if (typeof priorFocusedElem.focus === 'function') {
8523          priorFocusedElem.focus();
8524        }
8525  
8526        for (var i = 0; i < ancestors.length; i++) {
8527          var info = ancestors[i];
8528          info.element.scrollLeft = info.left;
8529          info.element.scrollTop = info.top;
8530        }
8531      }
8532    }
8533    /**
8534     * @getSelection: Gets the selection bounds of a focused textarea, input or
8535     * contentEditable node.
8536     * -@input: Look up selection bounds of this input
8537     * -@return {start: selectionStart, end: selectionEnd}
8538     */
8539  
8540    function getSelection(input) {
8541      var selection;
8542  
8543      if ('selectionStart' in input) {
8544        // Modern browser with input or textarea.
8545        selection = {
8546          start: input.selectionStart,
8547          end: input.selectionEnd
8548        };
8549      } else {
8550        // Content editable or old IE textarea.
8551        selection = getOffsets(input);
8552      }
8553  
8554      return selection || {
8555        start: 0,
8556        end: 0
8557      };
8558    }
8559    /**
8560     * @setSelection: Sets the selection bounds of a textarea or input and focuses
8561     * the input.
8562     * -@input     Set selection bounds of this input or textarea
8563     * -@offsets   Object of same form that is returned from get*
8564     */
8565  
8566    function setSelection(input, offsets) {
8567      var start = offsets.start;
8568      var end = offsets.end;
8569  
8570      if (end === undefined) {
8571        end = start;
8572      }
8573  
8574      if ('selectionStart' in input) {
8575        input.selectionStart = start;
8576        input.selectionEnd = Math.min(end, input.value.length);
8577      } else {
8578        setOffsets(input, offsets);
8579      }
8580    }
8581  
8582    var skipSelectionChangeEvent = canUseDOM && 'documentMode' in document && document.documentMode <= 11;
8583  
8584    function registerEvents$3() {
8585      registerTwoPhaseEvent('onSelect', ['focusout', 'contextmenu', 'dragend', 'focusin', 'keydown', 'keyup', 'mousedown', 'mouseup', 'selectionchange']);
8586    }
8587  
8588    var activeElement$1 = null;
8589    var activeElementInst$1 = null;
8590    var lastSelection = null;
8591    var mouseDown = false;
8592    /**
8593     * Get an object which is a unique representation of the current selection.
8594     *
8595     * The return value will not be consistent across nodes or browsers, but
8596     * two identical selections on the same node will return identical objects.
8597     */
8598  
8599    function getSelection$1(node) {
8600      if ('selectionStart' in node && hasSelectionCapabilities(node)) {
8601        return {
8602          start: node.selectionStart,
8603          end: node.selectionEnd
8604        };
8605      } else {
8606        var win = node.ownerDocument && node.ownerDocument.defaultView || window;
8607        var selection = win.getSelection();
8608        return {
8609          anchorNode: selection.anchorNode,
8610          anchorOffset: selection.anchorOffset,
8611          focusNode: selection.focusNode,
8612          focusOffset: selection.focusOffset
8613        };
8614      }
8615    }
8616    /**
8617     * Get document associated with the event target.
8618     */
8619  
8620  
8621    function getEventTargetDocument(eventTarget) {
8622      return eventTarget.window === eventTarget ? eventTarget.document : eventTarget.nodeType === DOCUMENT_NODE ? eventTarget : eventTarget.ownerDocument;
8623    }
8624    /**
8625     * Poll selection to see whether it's changed.
8626     *
8627     * @param {object} nativeEvent
8628     * @param {object} nativeEventTarget
8629     * @return {?SyntheticEvent}
8630     */
8631  
8632  
8633    function constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget) {
8634      // Ensure we have the right element, and that the user is not dragging a
8635      // selection (this matches native `select` event behavior). In HTML5, select
8636      // fires only on input and textarea thus if there's no focused element we
8637      // won't dispatch.
8638      var doc = getEventTargetDocument(nativeEventTarget);
8639  
8640      if (mouseDown || activeElement$1 == null || activeElement$1 !== getActiveElement(doc)) {
8641        return;
8642      } // Only fire when selection has actually changed.
8643  
8644  
8645      var currentSelection = getSelection$1(activeElement$1);
8646  
8647      if (!lastSelection || !shallowEqual(lastSelection, currentSelection)) {
8648        lastSelection = currentSelection;
8649        var listeners = accumulateTwoPhaseListeners(activeElementInst$1, 'onSelect');
8650  
8651        if (listeners.length > 0) {
8652          var event = new SyntheticEvent('onSelect', 'select', null, nativeEvent, nativeEventTarget);
8653          dispatchQueue.push({
8654            event: event,
8655            listeners: listeners
8656          });
8657          event.target = activeElement$1;
8658        }
8659      }
8660    }
8661    /**
8662     * This plugin creates an `onSelect` event that normalizes select events
8663     * across form elements.
8664     *
8665     * Supported elements are:
8666     * - input (see `isTextInputElement`)
8667     * - textarea
8668     * - contentEditable
8669     *
8670     * This differs from native browser implementations in the following ways:
8671     * - Fires on contentEditable fields as well as inputs.
8672     * - Fires for collapsed selection.
8673     * - Fires after user input.
8674     */
8675  
8676  
8677    function extractEvents$3(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
8678      var targetNode = targetInst ? getNodeFromInstance(targetInst) : window;
8679  
8680      switch (domEventName) {
8681        // Track the input node that has focus.
8682        case 'focusin':
8683          if (isTextInputElement(targetNode) || targetNode.contentEditable === 'true') {
8684            activeElement$1 = targetNode;
8685            activeElementInst$1 = targetInst;
8686            lastSelection = null;
8687          }
8688  
8689          break;
8690  
8691        case 'focusout':
8692          activeElement$1 = null;
8693          activeElementInst$1 = null;
8694          lastSelection = null;
8695          break;
8696        // Don't fire the event while the user is dragging. This matches the
8697        // semantics of the native select event.
8698  
8699        case 'mousedown':
8700          mouseDown = true;
8701          break;
8702  
8703        case 'contextmenu':
8704        case 'mouseup':
8705        case 'dragend':
8706          mouseDown = false;
8707          constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget);
8708          break;
8709        // Chrome and IE fire non-standard event when selection is changed (and
8710        // sometimes when it hasn't). IE's event fires out of order with respect
8711        // to key and input events on deletion, so we discard it.
8712        //
8713        // Firefox doesn't support selectionchange, so check selection status
8714        // after each key entry. The selection changes after keydown and before
8715        // keyup, but we check on keydown as well in the case of holding down a
8716        // key, when multiple keydown events are fired but only one keyup is.
8717        // This is also our approach for IE handling, for the reason above.
8718  
8719        case 'selectionchange':
8720          if (skipSelectionChangeEvent) {
8721            break;
8722          }
8723  
8724        // falls through
8725  
8726        case 'keydown':
8727        case 'keyup':
8728          constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget);
8729      }
8730    }
8731  
8732    /**
8733     * Generate a mapping of standard vendor prefixes using the defined style property and event name.
8734     *
8735     * @param {string} styleProp
8736     * @param {string} eventName
8737     * @returns {object}
8738     */
8739  
8740    function makePrefixMap(styleProp, eventName) {
8741      var prefixes = {};
8742      prefixes[styleProp.toLowerCase()] = eventName.toLowerCase();
8743      prefixes['Webkit' + styleProp] = 'webkit' + eventName;
8744      prefixes['Moz' + styleProp] = 'moz' + eventName;
8745      return prefixes;
8746    }
8747    /**
8748     * A list of event names to a configurable list of vendor prefixes.
8749     */
8750  
8751  
8752    var vendorPrefixes = {
8753      animationend: makePrefixMap('Animation', 'AnimationEnd'),
8754      animationiteration: makePrefixMap('Animation', 'AnimationIteration'),
8755      animationstart: makePrefixMap('Animation', 'AnimationStart'),
8756      transitionend: makePrefixMap('Transition', 'TransitionEnd')
8757    };
8758    /**
8759     * Event names that have already been detected and prefixed (if applicable).
8760     */
8761  
8762    var prefixedEventNames = {};
8763    /**
8764     * Element to check for prefixes on.
8765     */
8766  
8767    var style = {};
8768    /**
8769     * Bootstrap if a DOM exists.
8770     */
8771  
8772    if (canUseDOM) {
8773      style = document.createElement('div').style; // On some platforms, in particular some releases of Android 4.x,
8774      // the un-prefixed "animation" and "transition" properties are defined on the
8775      // style object but the events that fire will still be prefixed, so we need
8776      // to check if the un-prefixed events are usable, and if not remove them from the map.
8777  
8778      if (!('AnimationEvent' in window)) {
8779        delete vendorPrefixes.animationend.animation;
8780        delete vendorPrefixes.animationiteration.animation;
8781        delete vendorPrefixes.animationstart.animation;
8782      } // Same as above
8783  
8784  
8785      if (!('TransitionEvent' in window)) {
8786        delete vendorPrefixes.transitionend.transition;
8787      }
8788    }
8789    /**
8790     * Attempts to determine the correct vendor prefixed event name.
8791     *
8792     * @param {string} eventName
8793     * @returns {string}
8794     */
8795  
8796  
8797    function getVendorPrefixedEventName(eventName) {
8798      if (prefixedEventNames[eventName]) {
8799        return prefixedEventNames[eventName];
8800      } else if (!vendorPrefixes[eventName]) {
8801        return eventName;
8802      }
8803  
8804      var prefixMap = vendorPrefixes[eventName];
8805  
8806      for (var styleProp in prefixMap) {
8807        if (prefixMap.hasOwnProperty(styleProp) && styleProp in style) {
8808          return prefixedEventNames[eventName] = prefixMap[styleProp];
8809        }
8810      }
8811  
8812      return eventName;
8813    }
8814  
8815    var ANIMATION_END = getVendorPrefixedEventName('animationend');
8816    var ANIMATION_ITERATION = getVendorPrefixedEventName('animationiteration');
8817    var ANIMATION_START = getVendorPrefixedEventName('animationstart');
8818    var TRANSITION_END = getVendorPrefixedEventName('transitionend');
8819  
8820    var topLevelEventsToReactNames = new Map(); // NOTE: Capitalization is important in this list!
8821    //
8822    // E.g. it needs "pointerDown", not "pointerdown".
8823    // This is because we derive both React name ("onPointerDown")
8824    // and DOM name ("pointerdown") from the same list.
8825    //
8826    // Exceptions that don't match this convention are listed separately.
8827    //
8828    // prettier-ignore
8829  
8830    var simpleEventPluginEvents = ['abort', 'auxClick', 'cancel', 'canPlay', 'canPlayThrough', 'click', 'close', 'contextMenu', 'copy', 'cut', 'drag', 'dragEnd', 'dragEnter', 'dragExit', 'dragLeave', 'dragOver', 'dragStart', 'drop', 'durationChange', 'emptied', 'encrypted', 'ended', 'error', 'gotPointerCapture', 'input', 'invalid', 'keyDown', 'keyPress', 'keyUp', 'load', 'loadedData', 'loadedMetadata', 'loadStart', 'lostPointerCapture', 'mouseDown', 'mouseMove', 'mouseOut', 'mouseOver', 'mouseUp', 'paste', 'pause', 'play', 'playing', 'pointerCancel', 'pointerDown', 'pointerMove', 'pointerOut', 'pointerOver', 'pointerUp', 'progress', 'rateChange', 'reset', 'resize', 'seeked', 'seeking', 'stalled', 'submit', 'suspend', 'timeUpdate', 'touchCancel', 'touchEnd', 'touchStart', 'volumeChange', 'scroll', 'toggle', 'touchMove', 'waiting', 'wheel'];
8831  
8832    function registerSimpleEvent(domEventName, reactName) {
8833      topLevelEventsToReactNames.set(domEventName, reactName);
8834      registerTwoPhaseEvent(reactName, [domEventName]);
8835    }
8836  
8837    function registerSimpleEvents() {
8838      for (var i = 0; i < simpleEventPluginEvents.length; i++) {
8839        var eventName = simpleEventPluginEvents[i];
8840        var domEventName = eventName.toLowerCase();
8841        var capitalizedEvent = eventName[0].toUpperCase() + eventName.slice(1);
8842        registerSimpleEvent(domEventName, 'on' + capitalizedEvent);
8843      } // Special cases where event names don't match.
8844  
8845  
8846      registerSimpleEvent(ANIMATION_END, 'onAnimationEnd');
8847      registerSimpleEvent(ANIMATION_ITERATION, 'onAnimationIteration');
8848      registerSimpleEvent(ANIMATION_START, 'onAnimationStart');
8849      registerSimpleEvent('dblclick', 'onDoubleClick');
8850      registerSimpleEvent('focusin', 'onFocus');
8851      registerSimpleEvent('focusout', 'onBlur');
8852      registerSimpleEvent(TRANSITION_END, 'onTransitionEnd');
8853    }
8854  
8855    function extractEvents$4(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
8856      var reactName = topLevelEventsToReactNames.get(domEventName);
8857  
8858      if (reactName === undefined) {
8859        return;
8860      }
8861  
8862      var SyntheticEventCtor = SyntheticEvent;
8863      var reactEventType = domEventName;
8864  
8865      switch (domEventName) {
8866        case 'keypress':
8867          // Firefox creates a keypress event for function keys too. This removes
8868          // the unwanted keypress events. Enter is however both printable and
8869          // non-printable. One would expect Tab to be as well (but it isn't).
8870          if (getEventCharCode(nativeEvent) === 0) {
8871            return;
8872          }
8873  
8874        /* falls through */
8875  
8876        case 'keydown':
8877        case 'keyup':
8878          SyntheticEventCtor = SyntheticKeyboardEvent;
8879          break;
8880  
8881        case 'focusin':
8882          reactEventType = 'focus';
8883          SyntheticEventCtor = SyntheticFocusEvent;
8884          break;
8885  
8886        case 'focusout':
8887          reactEventType = 'blur';
8888          SyntheticEventCtor = SyntheticFocusEvent;
8889          break;
8890  
8891        case 'beforeblur':
8892        case 'afterblur':
8893          SyntheticEventCtor = SyntheticFocusEvent;
8894          break;
8895  
8896        case 'click':
8897          // Firefox creates a click event on right mouse clicks. This removes the
8898          // unwanted click events.
8899          if (nativeEvent.button === 2) {
8900            return;
8901          }
8902  
8903        /* falls through */
8904  
8905        case 'auxclick':
8906        case 'dblclick':
8907        case 'mousedown':
8908        case 'mousemove':
8909        case 'mouseup': // TODO: Disabled elements should not respond to mouse events
8910  
8911        /* falls through */
8912  
8913        case 'mouseout':
8914        case 'mouseover':
8915        case 'contextmenu':
8916          SyntheticEventCtor = SyntheticMouseEvent;
8917          break;
8918  
8919        case 'drag':
8920        case 'dragend':
8921        case 'dragenter':
8922        case 'dragexit':
8923        case 'dragleave':
8924        case 'dragover':
8925        case 'dragstart':
8926        case 'drop':
8927          SyntheticEventCtor = SyntheticDragEvent;
8928          break;
8929  
8930        case 'touchcancel':
8931        case 'touchend':
8932        case 'touchmove':
8933        case 'touchstart':
8934          SyntheticEventCtor = SyntheticTouchEvent;
8935          break;
8936  
8937        case ANIMATION_END:
8938        case ANIMATION_ITERATION:
8939        case ANIMATION_START:
8940          SyntheticEventCtor = SyntheticAnimationEvent;
8941          break;
8942  
8943        case TRANSITION_END:
8944          SyntheticEventCtor = SyntheticTransitionEvent;
8945          break;
8946  
8947        case 'scroll':
8948          SyntheticEventCtor = SyntheticUIEvent;
8949          break;
8950  
8951        case 'wheel':
8952          SyntheticEventCtor = SyntheticWheelEvent;
8953          break;
8954  
8955        case 'copy':
8956        case 'cut':
8957        case 'paste':
8958          SyntheticEventCtor = SyntheticClipboardEvent;
8959          break;
8960  
8961        case 'gotpointercapture':
8962        case 'lostpointercapture':
8963        case 'pointercancel':
8964        case 'pointerdown':
8965        case 'pointermove':
8966        case 'pointerout':
8967        case 'pointerover':
8968        case 'pointerup':
8969          SyntheticEventCtor = SyntheticPointerEvent;
8970          break;
8971      }
8972  
8973      var inCapturePhase = (eventSystemFlags & IS_CAPTURE_PHASE) !== 0;
8974  
8975      {
8976        // Some events don't bubble in the browser.
8977        // In the past, React has always bubbled them, but this can be surprising.
8978        // We're going to try aligning closer to the browser behavior by not bubbling
8979        // them in React either. We'll start by not bubbling onScroll, and then expand.
8980        var accumulateTargetOnly = !inCapturePhase && // TODO: ideally, we'd eventually add all events from
8981        // nonDelegatedEvents list in DOMPluginEventSystem.
8982        // Then we can remove this special list.
8983        // This is a breaking change that can wait until React 18.
8984        domEventName === 'scroll';
8985  
8986        var _listeners = accumulateSinglePhaseListeners(targetInst, reactName, nativeEvent.type, inCapturePhase, accumulateTargetOnly);
8987  
8988        if (_listeners.length > 0) {
8989          // Intentionally create event lazily.
8990          var _event = new SyntheticEventCtor(reactName, reactEventType, null, nativeEvent, nativeEventTarget);
8991  
8992          dispatchQueue.push({
8993            event: _event,
8994            listeners: _listeners
8995          });
8996        }
8997      }
8998    }
8999  
9000    // TODO: remove top-level side effect.
9001    registerSimpleEvents();
9002    registerEvents$2();
9003    registerEvents$1();
9004    registerEvents$3();
9005    registerEvents();
9006  
9007    function extractEvents$5(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
9008      // TODO: we should remove the concept of a "SimpleEventPlugin".
9009      // This is the basic functionality of the event system. All
9010      // the other plugins are essentially polyfills. So the plugin
9011      // should probably be inlined somewhere and have its logic
9012      // be core the to event system. This would potentially allow
9013      // us to ship builds of React without the polyfilled plugins below.
9014      extractEvents$4(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags);
9015      var shouldProcessPolyfillPlugins = (eventSystemFlags & SHOULD_NOT_PROCESS_POLYFILL_EVENT_PLUGINS) === 0; // We don't process these events unless we are in the
9016      // event's native "bubble" phase, which means that we're
9017      // not in the capture phase. That's because we emulate
9018      // the capture phase here still. This is a trade-off,
9019      // because in an ideal world we would not emulate and use
9020      // the phases properly, like we do with the SimpleEvent
9021      // plugin. However, the plugins below either expect
9022      // emulation (EnterLeave) or use state localized to that
9023      // plugin (BeforeInput, Change, Select). The state in
9024      // these modules complicates things, as you'll essentially
9025      // get the case where the capture phase event might change
9026      // state, only for the following bubble event to come in
9027      // later and not trigger anything as the state now
9028      // invalidates the heuristics of the event plugin. We
9029      // could alter all these plugins to work in such ways, but
9030      // that might cause other unknown side-effects that we
9031      // can't foresee right now.
9032  
9033      if (shouldProcessPolyfillPlugins) {
9034        extractEvents$2(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
9035        extractEvents$1(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
9036        extractEvents$3(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
9037        extractEvents(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
9038      }
9039    } // List of events that need to be individually attached to media elements.
9040  
9041  
9042    var mediaEventTypes = ['abort', 'canplay', 'canplaythrough', 'durationchange', 'emptied', 'encrypted', 'ended', 'error', 'loadeddata', 'loadedmetadata', 'loadstart', 'pause', 'play', 'playing', 'progress', 'ratechange', 'resize', 'seeked', 'seeking', 'stalled', 'suspend', 'timeupdate', 'volumechange', 'waiting']; // We should not delegate these events to the container, but rather
9043    // set them on the actual target element itself. This is primarily
9044    // because these events do not consistently bubble in the DOM.
9045  
9046    var nonDelegatedEvents = new Set(['cancel', 'close', 'invalid', 'load', 'scroll', 'toggle'].concat(mediaEventTypes));
9047  
9048    function executeDispatch(event, listener, currentTarget) {
9049      var type = event.type || 'unknown-event';
9050      event.currentTarget = currentTarget;
9051      invokeGuardedCallbackAndCatchFirstError(type, listener, undefined, event);
9052      event.currentTarget = null;
9053    }
9054  
9055    function processDispatchQueueItemsInOrder(event, dispatchListeners, inCapturePhase) {
9056      var previousInstance;
9057  
9058      if (inCapturePhase) {
9059        for (var i = dispatchListeners.length - 1; i >= 0; i--) {
9060          var _dispatchListeners$i = dispatchListeners[i],
9061              instance = _dispatchListeners$i.instance,
9062              currentTarget = _dispatchListeners$i.currentTarget,
9063              listener = _dispatchListeners$i.listener;
9064  
9065          if (instance !== previousInstance && event.isPropagationStopped()) {
9066            return;
9067          }
9068  
9069          executeDispatch(event, listener, currentTarget);
9070          previousInstance = instance;
9071        }
9072      } else {
9073        for (var _i = 0; _i < dispatchListeners.length; _i++) {
9074          var _dispatchListeners$_i = dispatchListeners[_i],
9075              _instance = _dispatchListeners$_i.instance,
9076              _currentTarget = _dispatchListeners$_i.currentTarget,
9077              _listener = _dispatchListeners$_i.listener;
9078  
9079          if (_instance !== previousInstance && event.isPropagationStopped()) {
9080            return;
9081          }
9082  
9083          executeDispatch(event, _listener, _currentTarget);
9084          previousInstance = _instance;
9085        }
9086      }
9087    }
9088  
9089    function processDispatchQueue(dispatchQueue, eventSystemFlags) {
9090      var inCapturePhase = (eventSystemFlags & IS_CAPTURE_PHASE) !== 0;
9091  
9092      for (var i = 0; i < dispatchQueue.length; i++) {
9093        var _dispatchQueue$i = dispatchQueue[i],
9094            event = _dispatchQueue$i.event,
9095            listeners = _dispatchQueue$i.listeners;
9096        processDispatchQueueItemsInOrder(event, listeners, inCapturePhase); //  event system doesn't use pooling.
9097      } // This would be a good time to rethrow if any of the event handlers threw.
9098  
9099  
9100      rethrowCaughtError();
9101    }
9102  
9103    function dispatchEventsForPlugins(domEventName, eventSystemFlags, nativeEvent, targetInst, targetContainer) {
9104      var nativeEventTarget = getEventTarget(nativeEvent);
9105      var dispatchQueue = [];
9106      extractEvents$5(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags);
9107      processDispatchQueue(dispatchQueue, eventSystemFlags);
9108    }
9109  
9110    function listenToNonDelegatedEvent(domEventName, targetElement) {
9111      {
9112        if (!nonDelegatedEvents.has(domEventName)) {
9113          error('Did not expect a listenToNonDelegatedEvent() call for "%s". ' + 'This is a bug in React. Please file an issue.', domEventName);
9114        }
9115      }
9116  
9117      var isCapturePhaseListener = false;
9118      var listenerSet = getEventListenerSet(targetElement);
9119      var listenerSetKey = getListenerSetKey(domEventName, isCapturePhaseListener);
9120  
9121      if (!listenerSet.has(listenerSetKey)) {
9122        addTrappedEventListener(targetElement, domEventName, IS_NON_DELEGATED, isCapturePhaseListener);
9123        listenerSet.add(listenerSetKey);
9124      }
9125    }
9126    function listenToNativeEvent(domEventName, isCapturePhaseListener, target) {
9127      {
9128        if (nonDelegatedEvents.has(domEventName) && !isCapturePhaseListener) {
9129          error('Did not expect a listenToNativeEvent() call for "%s" in the bubble phase. ' + 'This is a bug in React. Please file an issue.', domEventName);
9130        }
9131      }
9132  
9133      var eventSystemFlags = 0;
9134  
9135      if (isCapturePhaseListener) {
9136        eventSystemFlags |= IS_CAPTURE_PHASE;
9137      }
9138  
9139      addTrappedEventListener(target, domEventName, eventSystemFlags, isCapturePhaseListener);
9140    } // This is only used by createEventHandle when the
9141    var listeningMarker = '_reactListening' + Math.random().toString(36).slice(2);
9142    function listenToAllSupportedEvents(rootContainerElement) {
9143      if (!rootContainerElement[listeningMarker]) {
9144        rootContainerElement[listeningMarker] = true;
9145        allNativeEvents.forEach(function (domEventName) {
9146          // We handle selectionchange separately because it
9147          // doesn't bubble and needs to be on the document.
9148          if (domEventName !== 'selectionchange') {
9149            if (!nonDelegatedEvents.has(domEventName)) {
9150              listenToNativeEvent(domEventName, false, rootContainerElement);
9151            }
9152  
9153            listenToNativeEvent(domEventName, true, rootContainerElement);
9154          }
9155        });
9156        var ownerDocument = rootContainerElement.nodeType === DOCUMENT_NODE ? rootContainerElement : rootContainerElement.ownerDocument;
9157  
9158        if (ownerDocument !== null) {
9159          // The selectionchange event also needs deduplication
9160          // but it is attached to the document.
9161          if (!ownerDocument[listeningMarker]) {
9162            ownerDocument[listeningMarker] = true;
9163            listenToNativeEvent('selectionchange', false, ownerDocument);
9164          }
9165        }
9166      }
9167    }
9168  
9169    function addTrappedEventListener(targetContainer, domEventName, eventSystemFlags, isCapturePhaseListener, isDeferredListenerForLegacyFBSupport) {
9170      var listener = createEventListenerWrapperWithPriority(targetContainer, domEventName, eventSystemFlags); // If passive option is not supported, then the event will be
9171      // active and not passive.
9172  
9173      var isPassiveListener = undefined;
9174  
9175      if (passiveBrowserEventsSupported) {
9176        // Browsers introduced an intervention, making these events
9177        // passive by default on document. React doesn't bind them
9178        // to document anymore, but changing this now would undo
9179        // the performance wins from the change. So we emulate
9180        // the existing behavior manually on the roots now.
9181        // https://github.com/facebook/react/issues/19651
9182        if (domEventName === 'touchstart' || domEventName === 'touchmove' || domEventName === 'wheel') {
9183          isPassiveListener = true;
9184        }
9185      }
9186  
9187      targetContainer =  targetContainer;
9188      var unsubscribeListener; // When legacyFBSupport is enabled, it's for when we
9189  
9190  
9191      if (isCapturePhaseListener) {
9192        if (isPassiveListener !== undefined) {
9193          unsubscribeListener = addEventCaptureListenerWithPassiveFlag(targetContainer, domEventName, listener, isPassiveListener);
9194        } else {
9195          unsubscribeListener = addEventCaptureListener(targetContainer, domEventName, listener);
9196        }
9197      } else {
9198        if (isPassiveListener !== undefined) {
9199          unsubscribeListener = addEventBubbleListenerWithPassiveFlag(targetContainer, domEventName, listener, isPassiveListener);
9200        } else {
9201          unsubscribeListener = addEventBubbleListener(targetContainer, domEventName, listener);
9202        }
9203      }
9204    }
9205  
9206    function isMatchingRootContainer(grandContainer, targetContainer) {
9207      return grandContainer === targetContainer || grandContainer.nodeType === COMMENT_NODE && grandContainer.parentNode === targetContainer;
9208    }
9209  
9210    function dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, targetInst, targetContainer) {
9211      var ancestorInst = targetInst;
9212  
9213      if ((eventSystemFlags & IS_EVENT_HANDLE_NON_MANAGED_NODE) === 0 && (eventSystemFlags & IS_NON_DELEGATED) === 0) {
9214        var targetContainerNode = targetContainer; // If we are using the legacy FB support flag, we
9215  
9216        if (targetInst !== null) {
9217          // The below logic attempts to work out if we need to change
9218          // the target fiber to a different ancestor. We had similar logic
9219          // in the legacy event system, except the big difference between
9220          // systems is that the modern event system now has an event listener
9221          // attached to each React Root and React Portal Root. Together,
9222          // the DOM nodes representing these roots are the "rootContainer".
9223          // To figure out which ancestor instance we should use, we traverse
9224          // up the fiber tree from the target instance and attempt to find
9225          // root boundaries that match that of our current "rootContainer".
9226          // If we find that "rootContainer", we find the parent fiber
9227          // sub-tree for that root and make that our ancestor instance.
9228          var node = targetInst;
9229  
9230          mainLoop: while (true) {
9231            if (node === null) {
9232              return;
9233            }
9234  
9235            var nodeTag = node.tag;
9236  
9237            if (nodeTag === HostRoot || nodeTag === HostPortal) {
9238              var container = node.stateNode.containerInfo;
9239  
9240              if (isMatchingRootContainer(container, targetContainerNode)) {
9241                break;
9242              }
9243  
9244              if (nodeTag === HostPortal) {
9245                // The target is a portal, but it's not the rootContainer we're looking for.
9246                // Normally portals handle their own events all the way down to the root.
9247                // So we should be able to stop now. However, we don't know if this portal
9248                // was part of *our* root.
9249                var grandNode = node.return;
9250  
9251                while (grandNode !== null) {
9252                  var grandTag = grandNode.tag;
9253  
9254                  if (grandTag === HostRoot || grandTag === HostPortal) {
9255                    var grandContainer = grandNode.stateNode.containerInfo;
9256  
9257                    if (isMatchingRootContainer(grandContainer, targetContainerNode)) {
9258                      // This is the rootContainer we're looking for and we found it as
9259                      // a parent of the Portal. That means we can ignore it because the
9260                      // Portal will bubble through to us.
9261                      return;
9262                    }
9263                  }
9264  
9265                  grandNode = grandNode.return;
9266                }
9267              } // Now we need to find it's corresponding host fiber in the other
9268              // tree. To do this we can use getClosestInstanceFromNode, but we
9269              // need to validate that the fiber is a host instance, otherwise
9270              // we need to traverse up through the DOM till we find the correct
9271              // node that is from the other tree.
9272  
9273  
9274              while (container !== null) {
9275                var parentNode = getClosestInstanceFromNode(container);
9276  
9277                if (parentNode === null) {
9278                  return;
9279                }
9280  
9281                var parentTag = parentNode.tag;
9282  
9283                if (parentTag === HostComponent || parentTag === HostText) {
9284                  node = ancestorInst = parentNode;
9285                  continue mainLoop;
9286                }
9287  
9288                container = container.parentNode;
9289              }
9290            }
9291  
9292            node = node.return;
9293          }
9294        }
9295      }
9296  
9297      batchedUpdates(function () {
9298        return dispatchEventsForPlugins(domEventName, eventSystemFlags, nativeEvent, ancestorInst);
9299      });
9300    }
9301  
9302    function createDispatchListener(instance, listener, currentTarget) {
9303      return {
9304        instance: instance,
9305        listener: listener,
9306        currentTarget: currentTarget
9307      };
9308    }
9309  
9310    function accumulateSinglePhaseListeners(targetFiber, reactName, nativeEventType, inCapturePhase, accumulateTargetOnly, nativeEvent) {
9311      var captureName = reactName !== null ? reactName + 'Capture' : null;
9312      var reactEventName = inCapturePhase ? captureName : reactName;
9313      var listeners = [];
9314      var instance = targetFiber;
9315      var lastHostComponent = null; // Accumulate all instances and listeners via the target -> root path.
9316  
9317      while (instance !== null) {
9318        var _instance2 = instance,
9319            stateNode = _instance2.stateNode,
9320            tag = _instance2.tag; // Handle listeners that are on HostComponents (i.e. <div>)
9321  
9322        if (tag === HostComponent && stateNode !== null) {
9323          lastHostComponent = stateNode; // createEventHandle listeners
9324  
9325  
9326          if (reactEventName !== null) {
9327            var listener = getListener(instance, reactEventName);
9328  
9329            if (listener != null) {
9330              listeners.push(createDispatchListener(instance, listener, lastHostComponent));
9331            }
9332          }
9333        } // If we are only accumulating events for the target, then we don't
9334        // continue to propagate through the React fiber tree to find other
9335        // listeners.
9336  
9337  
9338        if (accumulateTargetOnly) {
9339          break;
9340        } // If we are processing the onBeforeBlur event, then we need to take
9341  
9342        instance = instance.return;
9343      }
9344  
9345      return listeners;
9346    } // We should only use this function for:
9347    // - BeforeInputEventPlugin
9348    // - ChangeEventPlugin
9349    // - SelectEventPlugin
9350    // This is because we only process these plugins
9351    // in the bubble phase, so we need to accumulate two
9352    // phase event listeners (via emulation).
9353  
9354    function accumulateTwoPhaseListeners(targetFiber, reactName) {
9355      var captureName = reactName + 'Capture';
9356      var listeners = [];
9357      var instance = targetFiber; // Accumulate all instances and listeners via the target -> root path.
9358  
9359      while (instance !== null) {
9360        var _instance3 = instance,
9361            stateNode = _instance3.stateNode,
9362            tag = _instance3.tag; // Handle listeners that are on HostComponents (i.e. <div>)
9363  
9364        if (tag === HostComponent && stateNode !== null) {
9365          var currentTarget = stateNode;
9366          var captureListener = getListener(instance, captureName);
9367  
9368          if (captureListener != null) {
9369            listeners.unshift(createDispatchListener(instance, captureListener, currentTarget));
9370          }
9371  
9372          var bubbleListener = getListener(instance, reactName);
9373  
9374          if (bubbleListener != null) {
9375            listeners.push(createDispatchListener(instance, bubbleListener, currentTarget));
9376          }
9377        }
9378  
9379        instance = instance.return;
9380      }
9381  
9382      return listeners;
9383    }
9384  
9385    function getParent(inst) {
9386      if (inst === null) {
9387        return null;
9388      }
9389  
9390      do {
9391        inst = inst.return; // TODO: If this is a HostRoot we might want to bail out.
9392        // That is depending on if we want nested subtrees (layers) to bubble
9393        // events to their parent. We could also go through parentNode on the
9394        // host node but that wouldn't work for React Native and doesn't let us
9395        // do the portal feature.
9396      } while (inst && inst.tag !== HostComponent);
9397  
9398      if (inst) {
9399        return inst;
9400      }
9401  
9402      return null;
9403    }
9404    /**
9405     * Return the lowest common ancestor of A and B, or null if they are in
9406     * different trees.
9407     */
9408  
9409  
9410    function getLowestCommonAncestor(instA, instB) {
9411      var nodeA = instA;
9412      var nodeB = instB;
9413      var depthA = 0;
9414  
9415      for (var tempA = nodeA; tempA; tempA = getParent(tempA)) {
9416        depthA++;
9417      }
9418  
9419      var depthB = 0;
9420  
9421      for (var tempB = nodeB; tempB; tempB = getParent(tempB)) {
9422        depthB++;
9423      } // If A is deeper, crawl up.
9424  
9425  
9426      while (depthA - depthB > 0) {
9427        nodeA = getParent(nodeA);
9428        depthA--;
9429      } // If B is deeper, crawl up.
9430  
9431  
9432      while (depthB - depthA > 0) {
9433        nodeB = getParent(nodeB);
9434        depthB--;
9435      } // Walk in lockstep until we find a match.
9436  
9437  
9438      var depth = depthA;
9439  
9440      while (depth--) {
9441        if (nodeA === nodeB || nodeB !== null && nodeA === nodeB.alternate) {
9442          return nodeA;
9443        }
9444  
9445        nodeA = getParent(nodeA);
9446        nodeB = getParent(nodeB);
9447      }
9448  
9449      return null;
9450    }
9451  
9452    function accumulateEnterLeaveListenersForEvent(dispatchQueue, event, target, common, inCapturePhase) {
9453      var registrationName = event._reactName;
9454      var listeners = [];
9455      var instance = target;
9456  
9457      while (instance !== null) {
9458        if (instance === common) {
9459          break;
9460        }
9461  
9462        var _instance4 = instance,
9463            alternate = _instance4.alternate,
9464            stateNode = _instance4.stateNode,
9465            tag = _instance4.tag;
9466  
9467        if (alternate !== null && alternate === common) {
9468          break;
9469        }
9470  
9471        if (tag === HostComponent && stateNode !== null) {
9472          var currentTarget = stateNode;
9473  
9474          if (inCapturePhase) {
9475            var captureListener = getListener(instance, registrationName);
9476  
9477            if (captureListener != null) {
9478              listeners.unshift(createDispatchListener(instance, captureListener, currentTarget));
9479            }
9480          } else if (!inCapturePhase) {
9481            var bubbleListener = getListener(instance, registrationName);
9482  
9483            if (bubbleListener != null) {
9484              listeners.push(createDispatchListener(instance, bubbleListener, currentTarget));
9485            }
9486          }
9487        }
9488  
9489        instance = instance.return;
9490      }
9491  
9492      if (listeners.length !== 0) {
9493        dispatchQueue.push({
9494          event: event,
9495          listeners: listeners
9496        });
9497      }
9498    } // We should only use this function for:
9499    // - EnterLeaveEventPlugin
9500    // This is because we only process this plugin
9501    // in the bubble phase, so we need to accumulate two
9502    // phase event listeners.
9503  
9504  
9505    function accumulateEnterLeaveTwoPhaseListeners(dispatchQueue, leaveEvent, enterEvent, from, to) {
9506      var common = from && to ? getLowestCommonAncestor(from, to) : null;
9507  
9508      if (from !== null) {
9509        accumulateEnterLeaveListenersForEvent(dispatchQueue, leaveEvent, from, common, false);
9510      }
9511  
9512      if (to !== null && enterEvent !== null) {
9513        accumulateEnterLeaveListenersForEvent(dispatchQueue, enterEvent, to, common, true);
9514      }
9515    }
9516    function getListenerSetKey(domEventName, capture) {
9517      return domEventName + "__" + (capture ? 'capture' : 'bubble');
9518    }
9519  
9520    var didWarnInvalidHydration = false;
9521    var DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML';
9522    var SUPPRESS_CONTENT_EDITABLE_WARNING = 'suppressContentEditableWarning';
9523    var SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';
9524    var AUTOFOCUS = 'autoFocus';
9525    var CHILDREN = 'children';
9526    var STYLE = 'style';
9527    var HTML$1 = '__html';
9528    var warnedUnknownTags;
9529    var validatePropertiesInDevelopment;
9530    var warnForPropDifference;
9531    var warnForExtraAttributes;
9532    var warnForInvalidEventListener;
9533    var canDiffStyleForHydrationWarning;
9534    var normalizeHTML;
9535  
9536    {
9537      warnedUnknownTags = {
9538        // There are working polyfills for <dialog>. Let people use it.
9539        dialog: true,
9540        // Electron ships a custom <webview> tag to display external web content in
9541        // an isolated frame and process.
9542        // This tag is not present in non Electron environments such as JSDom which
9543        // is often used for testing purposes.
9544        // @see https://electronjs.org/docs/api/webview-tag
9545        webview: true
9546      };
9547  
9548      validatePropertiesInDevelopment = function (type, props) {
9549        validateProperties(type, props);
9550        validateProperties$1(type, props);
9551        validateProperties$2(type, props, {
9552          registrationNameDependencies: registrationNameDependencies,
9553          possibleRegistrationNames: possibleRegistrationNames
9554        });
9555      }; // IE 11 parses & normalizes the style attribute as opposed to other
9556      // browsers. It adds spaces and sorts the properties in some
9557      // non-alphabetical order. Handling that would require sorting CSS
9558      // properties in the client & server versions or applying
9559      // `expectedStyle` to a temporary DOM node to read its `style` attribute
9560      // normalized. Since it only affects IE, we're skipping style warnings
9561      // in that browser completely in favor of doing all that work.
9562      // See https://github.com/facebook/react/issues/11807
9563  
9564  
9565      canDiffStyleForHydrationWarning = canUseDOM && !document.documentMode;
9566  
9567      warnForPropDifference = function (propName, serverValue, clientValue) {
9568        if (didWarnInvalidHydration) {
9569          return;
9570        }
9571  
9572        var normalizedClientValue = normalizeMarkupForTextOrAttribute(clientValue);
9573        var normalizedServerValue = normalizeMarkupForTextOrAttribute(serverValue);
9574  
9575        if (normalizedServerValue === normalizedClientValue) {
9576          return;
9577        }
9578  
9579        didWarnInvalidHydration = true;
9580  
9581        error('Prop `%s` did not match. Server: %s Client: %s', propName, JSON.stringify(normalizedServerValue), JSON.stringify(normalizedClientValue));
9582      };
9583  
9584      warnForExtraAttributes = function (attributeNames) {
9585        if (didWarnInvalidHydration) {
9586          return;
9587        }
9588  
9589        didWarnInvalidHydration = true;
9590        var names = [];
9591        attributeNames.forEach(function (name) {
9592          names.push(name);
9593        });
9594  
9595        error('Extra attributes from the server: %s', names);
9596      };
9597  
9598      warnForInvalidEventListener = function (registrationName, listener) {
9599        if (listener === false) {
9600          error('Expected `%s` listener to be a function, instead got `false`.\n\n' + 'If you used to conditionally omit it with %s={condition && value}, ' + 'pass %s={condition ? value : undefined} instead.', registrationName, registrationName, registrationName);
9601        } else {
9602          error('Expected `%s` listener to be a function, instead got a value of `%s` type.', registrationName, typeof listener);
9603        }
9604      }; // Parse the HTML and read it back to normalize the HTML string so that it
9605      // can be used for comparison.
9606  
9607  
9608      normalizeHTML = function (parent, html) {
9609        // We could have created a separate document here to avoid
9610        // re-initializing custom elements if they exist. But this breaks
9611        // how <noscript> is being handled. So we use the same document.
9612        // See the discussion in https://github.com/facebook/react/pull/11157.
9613        var testElement = parent.namespaceURI === HTML_NAMESPACE ? parent.ownerDocument.createElement(parent.tagName) : parent.ownerDocument.createElementNS(parent.namespaceURI, parent.tagName);
9614        testElement.innerHTML = html;
9615        return testElement.innerHTML;
9616      };
9617    } // HTML parsing normalizes CR and CRLF to LF.
9618    // It also can turn \u0000 into \uFFFD inside attributes.
9619    // https://www.w3.org/TR/html5/single-page.html#preprocessing-the-input-stream
9620    // If we have a mismatch, it might be caused by that.
9621    // We will still patch up in this case but not fire the warning.
9622  
9623  
9624    var NORMALIZE_NEWLINES_REGEX = /\r\n?/g;
9625    var NORMALIZE_NULL_AND_REPLACEMENT_REGEX = /\u0000|\uFFFD/g;
9626  
9627    function normalizeMarkupForTextOrAttribute(markup) {
9628      {
9629        checkHtmlStringCoercion(markup);
9630      }
9631  
9632      var markupString = typeof markup === 'string' ? markup : '' + markup;
9633      return markupString.replace(NORMALIZE_NEWLINES_REGEX, '\n').replace(NORMALIZE_NULL_AND_REPLACEMENT_REGEX, '');
9634    }
9635  
9636    function checkForUnmatchedText(serverText, clientText, isConcurrentMode, shouldWarnDev) {
9637      var normalizedClientText = normalizeMarkupForTextOrAttribute(clientText);
9638      var normalizedServerText = normalizeMarkupForTextOrAttribute(serverText);
9639  
9640      if (normalizedServerText === normalizedClientText) {
9641        return;
9642      }
9643  
9644      if (shouldWarnDev) {
9645        {
9646          if (!didWarnInvalidHydration) {
9647            didWarnInvalidHydration = true;
9648  
9649            error('Text content did not match. Server: "%s" Client: "%s"', normalizedServerText, normalizedClientText);
9650          }
9651        }
9652      }
9653  
9654      if (isConcurrentMode && enableClientRenderFallbackOnTextMismatch) {
9655        // In concurrent roots, we throw when there's a text mismatch and revert to
9656        // client rendering, up to the nearest Suspense boundary.
9657        throw new Error('Text content does not match server-rendered HTML.');
9658      }
9659    }
9660  
9661    function getOwnerDocumentFromRootContainer(rootContainerElement) {
9662      return rootContainerElement.nodeType === DOCUMENT_NODE ? rootContainerElement : rootContainerElement.ownerDocument;
9663    }
9664  
9665    function noop() {}
9666  
9667    function trapClickOnNonInteractiveElement(node) {
9668      // Mobile Safari does not fire properly bubble click events on
9669      // non-interactive elements, which means delegated click listeners do not
9670      // fire. The workaround for this bug involves attaching an empty click
9671      // listener on the target node.
9672      // https://www.quirksmode.org/blog/archives/2010/09/click_event_del.html
9673      // Just set it using the onclick property so that we don't have to manage any
9674      // bookkeeping for it. Not sure if we need to clear it when the listener is
9675      // removed.
9676      // TODO: Only do this for the relevant Safaris maybe?
9677      node.onclick = noop;
9678    }
9679  
9680    function setInitialDOMProperties(tag, domElement, rootContainerElement, nextProps, isCustomComponentTag) {
9681      for (var propKey in nextProps) {
9682        if (!nextProps.hasOwnProperty(propKey)) {
9683          continue;
9684        }
9685  
9686        var nextProp = nextProps[propKey];
9687  
9688        if (propKey === STYLE) {
9689          {
9690            if (nextProp) {
9691              // Freeze the next style object so that we can assume it won't be
9692              // mutated. We have already warned for this in the past.
9693              Object.freeze(nextProp);
9694            }
9695          } // Relies on `updateStylesByID` not mutating `styleUpdates`.
9696  
9697  
9698          setValueForStyles(domElement, nextProp);
9699        } else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
9700          var nextHtml = nextProp ? nextProp[HTML$1] : undefined;
9701  
9702          if (nextHtml != null) {
9703            setInnerHTML(domElement, nextHtml);
9704          }
9705        } else if (propKey === CHILDREN) {
9706          if (typeof nextProp === 'string') {
9707            // Avoid setting initial textContent when the text is empty. In IE11 setting
9708            // textContent on a <textarea> will cause the placeholder to not
9709            // show within the <textarea> until it has been focused and blurred again.
9710            // https://github.com/facebook/react/issues/6731#issuecomment-254874553
9711            var canSetTextContent = tag !== 'textarea' || nextProp !== '';
9712  
9713            if (canSetTextContent) {
9714              setTextContent(domElement, nextProp);
9715            }
9716          } else if (typeof nextProp === 'number') {
9717            setTextContent(domElement, '' + nextProp);
9718          }
9719        } else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING) ; else if (propKey === AUTOFOCUS) ; else if (registrationNameDependencies.hasOwnProperty(propKey)) {
9720          if (nextProp != null) {
9721            if ( typeof nextProp !== 'function') {
9722              warnForInvalidEventListener(propKey, nextProp);
9723            }
9724  
9725            if (propKey === 'onScroll') {
9726              listenToNonDelegatedEvent('scroll', domElement);
9727            }
9728          }
9729        } else if (nextProp != null) {
9730          setValueForProperty(domElement, propKey, nextProp, isCustomComponentTag);
9731        }
9732      }
9733    }
9734  
9735    function updateDOMProperties(domElement, updatePayload, wasCustomComponentTag, isCustomComponentTag) {
9736      // TODO: Handle wasCustomComponentTag
9737      for (var i = 0; i < updatePayload.length; i += 2) {
9738        var propKey = updatePayload[i];
9739        var propValue = updatePayload[i + 1];
9740  
9741        if (propKey === STYLE) {
9742          setValueForStyles(domElement, propValue);
9743        } else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
9744          setInnerHTML(domElement, propValue);
9745        } else if (propKey === CHILDREN) {
9746          setTextContent(domElement, propValue);
9747        } else {
9748          setValueForProperty(domElement, propKey, propValue, isCustomComponentTag);
9749        }
9750      }
9751    }
9752  
9753    function createElement(type, props, rootContainerElement, parentNamespace) {
9754      var isCustomComponentTag; // We create tags in the namespace of their parent container, except HTML
9755      // tags get no namespace.
9756  
9757      var ownerDocument = getOwnerDocumentFromRootContainer(rootContainerElement);
9758      var domElement;
9759      var namespaceURI = parentNamespace;
9760  
9761      if (namespaceURI === HTML_NAMESPACE) {
9762        namespaceURI = getIntrinsicNamespace(type);
9763      }
9764  
9765      if (namespaceURI === HTML_NAMESPACE) {
9766        {
9767          isCustomComponentTag = isCustomComponent(type, props); // Should this check be gated by parent namespace? Not sure we want to
9768          // allow <SVG> or <mATH>.
9769  
9770          if (!isCustomComponentTag && type !== type.toLowerCase()) {
9771            error('<%s /> is using incorrect casing. ' + 'Use PascalCase for React components, ' + 'or lowercase for HTML elements.', type);
9772          }
9773        }
9774  
9775        if (type === 'script') {
9776          // Create the script via .innerHTML so its "parser-inserted" flag is
9777          // set to true and it does not execute
9778          var div = ownerDocument.createElement('div');
9779  
9780          div.innerHTML = '<script><' + '/script>'; // eslint-disable-line
9781          // This is guaranteed to yield a script element.
9782  
9783          var firstChild = div.firstChild;
9784          domElement = div.removeChild(firstChild);
9785        } else if (typeof props.is === 'string') {
9786          // $FlowIssue `createElement` should be updated for Web Components
9787          domElement = ownerDocument.createElement(type, {
9788            is: props.is
9789          });
9790        } else {
9791          // Separate else branch instead of using `props.is || undefined` above because of a Firefox bug.
9792          // See discussion in https://github.com/facebook/react/pull/6896
9793          // and discussion in https://bugzilla.mozilla.org/show_bug.cgi?id=1276240
9794          domElement = ownerDocument.createElement(type); // Normally attributes are assigned in `setInitialDOMProperties`, however the `multiple` and `size`
9795          // attributes on `select`s needs to be added before `option`s are inserted.
9796          // This prevents:
9797          // - a bug where the `select` does not scroll to the correct option because singular
9798          //  `select` elements automatically pick the first item #13222
9799          // - a bug where the `select` set the first item as selected despite the `size` attribute #14239
9800          // See https://github.com/facebook/react/issues/13222
9801          // and https://github.com/facebook/react/issues/14239
9802  
9803          if (type === 'select') {
9804            var node = domElement;
9805  
9806            if (props.multiple) {
9807              node.multiple = true;
9808            } else if (props.size) {
9809              // Setting a size greater than 1 causes a select to behave like `multiple=true`, where
9810              // it is possible that no option is selected.
9811              //
9812              // This is only necessary when a select in "single selection mode".
9813              node.size = props.size;
9814            }
9815          }
9816        }
9817      } else {
9818        domElement = ownerDocument.createElementNS(namespaceURI, type);
9819      }
9820  
9821      {
9822        if (namespaceURI === HTML_NAMESPACE) {
9823          if (!isCustomComponentTag && Object.prototype.toString.call(domElement) === '[object HTMLUnknownElement]' && !hasOwnProperty.call(warnedUnknownTags, type)) {
9824            warnedUnknownTags[type] = true;
9825  
9826            error('The tag <%s> is unrecognized in this browser. ' + 'If you meant to render a React component, start its name with ' + 'an uppercase letter.', type);
9827          }
9828        }
9829      }
9830  
9831      return domElement;
9832    }
9833    function createTextNode(text, rootContainerElement) {
9834      return getOwnerDocumentFromRootContainer(rootContainerElement).createTextNode(text);
9835    }
9836    function setInitialProperties(domElement, tag, rawProps, rootContainerElement) {
9837      var isCustomComponentTag = isCustomComponent(tag, rawProps);
9838  
9839      {
9840        validatePropertiesInDevelopment(tag, rawProps);
9841      } // TODO: Make sure that we check isMounted before firing any of these events.
9842  
9843  
9844      var props;
9845  
9846      switch (tag) {
9847        case 'dialog':
9848          listenToNonDelegatedEvent('cancel', domElement);
9849          listenToNonDelegatedEvent('close', domElement);
9850          props = rawProps;
9851          break;
9852  
9853        case 'iframe':
9854        case 'object':
9855        case 'embed':
9856          // We listen to this event in case to ensure emulated bubble
9857          // listeners still fire for the load event.
9858          listenToNonDelegatedEvent('load', domElement);
9859          props = rawProps;
9860          break;
9861  
9862        case 'video':
9863        case 'audio':
9864          // We listen to these events in case to ensure emulated bubble
9865          // listeners still fire for all the media events.
9866          for (var i = 0; i < mediaEventTypes.length; i++) {
9867            listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
9868          }
9869  
9870          props = rawProps;
9871          break;
9872  
9873        case 'source':
9874          // We listen to this event in case to ensure emulated bubble
9875          // listeners still fire for the error event.
9876          listenToNonDelegatedEvent('error', domElement);
9877          props = rawProps;
9878          break;
9879  
9880        case 'img':
9881        case 'image':
9882        case 'link':
9883          // We listen to these events in case to ensure emulated bubble
9884          // listeners still fire for error and load events.
9885          listenToNonDelegatedEvent('error', domElement);
9886          listenToNonDelegatedEvent('load', domElement);
9887          props = rawProps;
9888          break;
9889  
9890        case 'details':
9891          // We listen to this event in case to ensure emulated bubble
9892          // listeners still fire for the toggle event.
9893          listenToNonDelegatedEvent('toggle', domElement);
9894          props = rawProps;
9895          break;
9896  
9897        case 'input':
9898          initWrapperState(domElement, rawProps);
9899          props = getHostProps(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
9900          // listeners still fire for the invalid event.
9901  
9902          listenToNonDelegatedEvent('invalid', domElement);
9903          break;
9904  
9905        case 'option':
9906          validateProps(domElement, rawProps);
9907          props = rawProps;
9908          break;
9909  
9910        case 'select':
9911          initWrapperState$1(domElement, rawProps);
9912          props = getHostProps$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
9913          // listeners still fire for the invalid event.
9914  
9915          listenToNonDelegatedEvent('invalid', domElement);
9916          break;
9917  
9918        case 'textarea':
9919          initWrapperState$2(domElement, rawProps);
9920          props = getHostProps$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
9921          // listeners still fire for the invalid event.
9922  
9923          listenToNonDelegatedEvent('invalid', domElement);
9924          break;
9925  
9926        default:
9927          props = rawProps;
9928      }
9929  
9930      assertValidProps(tag, props);
9931      setInitialDOMProperties(tag, domElement, rootContainerElement, props, isCustomComponentTag);
9932  
9933      switch (tag) {
9934        case 'input':
9935          // TODO: Make sure we check if this is still unmounted or do any clean
9936          // up necessary since we never stop tracking anymore.
9937          track(domElement);
9938          postMountWrapper(domElement, rawProps, false);
9939          break;
9940  
9941        case 'textarea':
9942          // TODO: Make sure we check if this is still unmounted or do any clean
9943          // up necessary since we never stop tracking anymore.
9944          track(domElement);
9945          postMountWrapper$3(domElement);
9946          break;
9947  
9948        case 'option':
9949          postMountWrapper$1(domElement, rawProps);
9950          break;
9951  
9952        case 'select':
9953          postMountWrapper$2(domElement, rawProps);
9954          break;
9955  
9956        default:
9957          if (typeof props.onClick === 'function') {
9958            // TODO: This cast may not be sound for SVG, MathML or custom elements.
9959            trapClickOnNonInteractiveElement(domElement);
9960          }
9961  
9962          break;
9963      }
9964    } // Calculate the diff between the two objects.
9965  
9966    function diffProperties(domElement, tag, lastRawProps, nextRawProps, rootContainerElement) {
9967      {
9968        validatePropertiesInDevelopment(tag, nextRawProps);
9969      }
9970  
9971      var updatePayload = null;
9972      var lastProps;
9973      var nextProps;
9974  
9975      switch (tag) {
9976        case 'input':
9977          lastProps = getHostProps(domElement, lastRawProps);
9978          nextProps = getHostProps(domElement, nextRawProps);
9979          updatePayload = [];
9980          break;
9981  
9982        case 'select':
9983          lastProps = getHostProps$1(domElement, lastRawProps);
9984          nextProps = getHostProps$1(domElement, nextRawProps);
9985          updatePayload = [];
9986          break;
9987  
9988        case 'textarea':
9989          lastProps = getHostProps$2(domElement, lastRawProps);
9990          nextProps = getHostProps$2(domElement, nextRawProps);
9991          updatePayload = [];
9992          break;
9993  
9994        default:
9995          lastProps = lastRawProps;
9996          nextProps = nextRawProps;
9997  
9998          if (typeof lastProps.onClick !== 'function' && typeof nextProps.onClick === 'function') {
9999            // TODO: This cast may not be sound for SVG, MathML or custom elements.
10000            trapClickOnNonInteractiveElement(domElement);
10001          }
10002  
10003          break;
10004      }
10005  
10006      assertValidProps(tag, nextProps);
10007      var propKey;
10008      var styleName;
10009      var styleUpdates = null;
10010  
10011      for (propKey in lastProps) {
10012        if (nextProps.hasOwnProperty(propKey) || !lastProps.hasOwnProperty(propKey) || lastProps[propKey] == null) {
10013          continue;
10014        }
10015  
10016        if (propKey === STYLE) {
10017          var lastStyle = lastProps[propKey];
10018  
10019          for (styleName in lastStyle) {
10020            if (lastStyle.hasOwnProperty(styleName)) {
10021              if (!styleUpdates) {
10022                styleUpdates = {};
10023              }
10024  
10025              styleUpdates[styleName] = '';
10026            }
10027          }
10028        } else if (propKey === DANGEROUSLY_SET_INNER_HTML || propKey === CHILDREN) ; else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING) ; else if (propKey === AUTOFOCUS) ; else if (registrationNameDependencies.hasOwnProperty(propKey)) {
10029          // This is a special case. If any listener updates we need to ensure
10030          // that the "current" fiber pointer gets updated so we need a commit
10031          // to update this element.
10032          if (!updatePayload) {
10033            updatePayload = [];
10034          }
10035        } else {
10036          // For all other deleted properties we add it to the queue. We use
10037          // the allowed property list in the commit phase instead.
10038          (updatePayload = updatePayload || []).push(propKey, null);
10039        }
10040      }
10041  
10042      for (propKey in nextProps) {
10043        var nextProp = nextProps[propKey];
10044        var lastProp = lastProps != null ? lastProps[propKey] : undefined;
10045  
10046        if (!nextProps.hasOwnProperty(propKey) || nextProp === lastProp || nextProp == null && lastProp == null) {
10047          continue;
10048        }
10049  
10050        if (propKey === STYLE) {
10051          {
10052            if (nextProp) {
10053              // Freeze the next style object so that we can assume it won't be
10054              // mutated. We have already warned for this in the past.
10055              Object.freeze(nextProp);
10056            }
10057          }
10058  
10059          if (lastProp) {
10060            // Unset styles on `lastProp` but not on `nextProp`.
10061            for (styleName in lastProp) {
10062              if (lastProp.hasOwnProperty(styleName) && (!nextProp || !nextProp.hasOwnProperty(styleName))) {
10063                if (!styleUpdates) {
10064                  styleUpdates = {};
10065                }
10066  
10067                styleUpdates[styleName] = '';
10068              }
10069            } // Update styles that changed since `lastProp`.
10070  
10071  
10072            for (styleName in nextProp) {
10073              if (nextProp.hasOwnProperty(styleName) && lastProp[styleName] !== nextProp[styleName]) {
10074                if (!styleUpdates) {
10075                  styleUpdates = {};
10076                }
10077  
10078                styleUpdates[styleName] = nextProp[styleName];
10079              }
10080            }
10081          } else {
10082            // Relies on `updateStylesByID` not mutating `styleUpdates`.
10083            if (!styleUpdates) {
10084              if (!updatePayload) {
10085                updatePayload = [];
10086              }
10087  
10088              updatePayload.push(propKey, styleUpdates);
10089            }
10090  
10091            styleUpdates = nextProp;
10092          }
10093        } else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
10094          var nextHtml = nextProp ? nextProp[HTML$1] : undefined;
10095          var lastHtml = lastProp ? lastProp[HTML$1] : undefined;
10096  
10097          if (nextHtml != null) {
10098            if (lastHtml !== nextHtml) {
10099              (updatePayload = updatePayload || []).push(propKey, nextHtml);
10100            }
10101          }
10102        } else if (propKey === CHILDREN) {
10103          if (typeof nextProp === 'string' || typeof nextProp === 'number') {
10104            (updatePayload = updatePayload || []).push(propKey, '' + nextProp);
10105          }
10106        } else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING) ; else if (registrationNameDependencies.hasOwnProperty(propKey)) {
10107          if (nextProp != null) {
10108            // We eagerly listen to this even though we haven't committed yet.
10109            if ( typeof nextProp !== 'function') {
10110              warnForInvalidEventListener(propKey, nextProp);
10111            }
10112  
10113            if (propKey === 'onScroll') {
10114              listenToNonDelegatedEvent('scroll', domElement);
10115            }
10116          }
10117  
10118          if (!updatePayload && lastProp !== nextProp) {
10119            // This is a special case. If any listener updates we need to ensure
10120            // that the "current" props pointer gets updated so we need a commit
10121            // to update this element.
10122            updatePayload = [];
10123          }
10124        } else {
10125          // For any other property we always add it to the queue and then we
10126          // filter it out using the allowed property list during the commit.
10127          (updatePayload = updatePayload || []).push(propKey, nextProp);
10128        }
10129      }
10130  
10131      if (styleUpdates) {
10132        {
10133          validateShorthandPropertyCollisionInDev(styleUpdates, nextProps[STYLE]);
10134        }
10135  
10136        (updatePayload = updatePayload || []).push(STYLE, styleUpdates);
10137      }
10138  
10139      return updatePayload;
10140    } // Apply the diff.
10141  
10142    function updateProperties(domElement, updatePayload, tag, lastRawProps, nextRawProps) {
10143      // Update checked *before* name.
10144      // In the middle of an update, it is possible to have multiple checked.
10145      // When a checked radio tries to change name, browser makes another radio's checked false.
10146      if (tag === 'input' && nextRawProps.type === 'radio' && nextRawProps.name != null) {
10147        updateChecked(domElement, nextRawProps);
10148      }
10149  
10150      var wasCustomComponentTag = isCustomComponent(tag, lastRawProps);
10151      var isCustomComponentTag = isCustomComponent(tag, nextRawProps); // Apply the diff.
10152  
10153      updateDOMProperties(domElement, updatePayload, wasCustomComponentTag, isCustomComponentTag); // TODO: Ensure that an update gets scheduled if any of the special props
10154      // changed.
10155  
10156      switch (tag) {
10157        case 'input':
10158          // Update the wrapper around inputs *after* updating props. This has to
10159          // happen after `updateDOMProperties`. Otherwise HTML5 input validations
10160          // raise warnings and prevent the new value from being assigned.
10161          updateWrapper(domElement, nextRawProps);
10162          break;
10163  
10164        case 'textarea':
10165          updateWrapper$1(domElement, nextRawProps);
10166          break;
10167  
10168        case 'select':
10169          // <select> value update needs to occur after <option> children
10170          // reconciliation
10171          postUpdateWrapper(domElement, nextRawProps);
10172          break;
10173      }
10174    }
10175  
10176    function getPossibleStandardName(propName) {
10177      {
10178        var lowerCasedName = propName.toLowerCase();
10179  
10180        if (!possibleStandardNames.hasOwnProperty(lowerCasedName)) {
10181          return null;
10182        }
10183  
10184        return possibleStandardNames[lowerCasedName] || null;
10185      }
10186    }
10187  
10188    function diffHydratedProperties(domElement, tag, rawProps, parentNamespace, rootContainerElement, isConcurrentMode, shouldWarnDev) {
10189      var isCustomComponentTag;
10190      var extraAttributeNames;
10191  
10192      {
10193        isCustomComponentTag = isCustomComponent(tag, rawProps);
10194        validatePropertiesInDevelopment(tag, rawProps);
10195      } // TODO: Make sure that we check isMounted before firing any of these events.
10196  
10197  
10198      switch (tag) {
10199        case 'dialog':
10200          listenToNonDelegatedEvent('cancel', domElement);
10201          listenToNonDelegatedEvent('close', domElement);
10202          break;
10203  
10204        case 'iframe':
10205        case 'object':
10206        case 'embed':
10207          // We listen to this event in case to ensure emulated bubble
10208          // listeners still fire for the load event.
10209          listenToNonDelegatedEvent('load', domElement);
10210          break;
10211  
10212        case 'video':
10213        case 'audio':
10214          // We listen to these events in case to ensure emulated bubble
10215          // listeners still fire for all the media events.
10216          for (var i = 0; i < mediaEventTypes.length; i++) {
10217            listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
10218          }
10219  
10220          break;
10221  
10222        case 'source':
10223          // We listen to this event in case to ensure emulated bubble
10224          // listeners still fire for the error event.
10225          listenToNonDelegatedEvent('error', domElement);
10226          break;
10227  
10228        case 'img':
10229        case 'image':
10230        case 'link':
10231          // We listen to these events in case to ensure emulated bubble
10232          // listeners still fire for error and load events.
10233          listenToNonDelegatedEvent('error', domElement);
10234          listenToNonDelegatedEvent('load', domElement);
10235          break;
10236  
10237        case 'details':
10238          // We listen to this event in case to ensure emulated bubble
10239          // listeners still fire for the toggle event.
10240          listenToNonDelegatedEvent('toggle', domElement);
10241          break;
10242  
10243        case 'input':
10244          initWrapperState(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
10245          // listeners still fire for the invalid event.
10246  
10247          listenToNonDelegatedEvent('invalid', domElement);
10248          break;
10249  
10250        case 'option':
10251          validateProps(domElement, rawProps);
10252          break;
10253  
10254        case 'select':
10255          initWrapperState$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
10256          // listeners still fire for the invalid event.
10257  
10258          listenToNonDelegatedEvent('invalid', domElement);
10259          break;
10260  
10261        case 'textarea':
10262          initWrapperState$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
10263          // listeners still fire for the invalid event.
10264  
10265          listenToNonDelegatedEvent('invalid', domElement);
10266          break;
10267      }
10268  
10269      assertValidProps(tag, rawProps);
10270  
10271      {
10272        extraAttributeNames = new Set();
10273        var attributes = domElement.attributes;
10274  
10275        for (var _i = 0; _i < attributes.length; _i++) {
10276          var name = attributes[_i].name.toLowerCase();
10277  
10278          switch (name) {
10279            // Controlled attributes are not validated
10280            // TODO: Only ignore them on controlled tags.
10281            case 'value':
10282              break;
10283  
10284            case 'checked':
10285              break;
10286  
10287            case 'selected':
10288              break;
10289  
10290            default:
10291              // Intentionally use the original name.
10292              // See discussion in https://github.com/facebook/react/pull/10676.
10293              extraAttributeNames.add(attributes[_i].name);
10294          }
10295        }
10296      }
10297  
10298      var updatePayload = null;
10299  
10300      for (var propKey in rawProps) {
10301        if (!rawProps.hasOwnProperty(propKey)) {
10302          continue;
10303        }
10304  
10305        var nextProp = rawProps[propKey];
10306  
10307        if (propKey === CHILDREN) {
10308          // For text content children we compare against textContent. This
10309          // might match additional HTML that is hidden when we read it using
10310          // textContent. E.g. "foo" will match "f<span>oo</span>" but that still
10311          // satisfies our requirement. Our requirement is not to produce perfect
10312          // HTML and attributes. Ideally we should preserve structure but it's
10313          // ok not to if the visible content is still enough to indicate what
10314          // even listeners these nodes might be wired up to.
10315          // TODO: Warn if there is more than a single textNode as a child.
10316          // TODO: Should we use domElement.firstChild.nodeValue to compare?
10317          if (typeof nextProp === 'string') {
10318            if (domElement.textContent !== nextProp) {
10319              if (rawProps[SUPPRESS_HYDRATION_WARNING] !== true) {
10320                checkForUnmatchedText(domElement.textContent, nextProp, isConcurrentMode, shouldWarnDev);
10321              }
10322  
10323              updatePayload = [CHILDREN, nextProp];
10324            }
10325          } else if (typeof nextProp === 'number') {
10326            if (domElement.textContent !== '' + nextProp) {
10327              if (rawProps[SUPPRESS_HYDRATION_WARNING] !== true) {
10328                checkForUnmatchedText(domElement.textContent, nextProp, isConcurrentMode, shouldWarnDev);
10329              }
10330  
10331              updatePayload = [CHILDREN, '' + nextProp];
10332            }
10333          }
10334        } else if (registrationNameDependencies.hasOwnProperty(propKey)) {
10335          if (nextProp != null) {
10336            if ( typeof nextProp !== 'function') {
10337              warnForInvalidEventListener(propKey, nextProp);
10338            }
10339  
10340            if (propKey === 'onScroll') {
10341              listenToNonDelegatedEvent('scroll', domElement);
10342            }
10343          }
10344        } else if (shouldWarnDev && true && // Convince Flow we've calculated it (it's DEV-only in this method.)
10345        typeof isCustomComponentTag === 'boolean') {
10346          // Validate that the properties correspond to their expected values.
10347          var serverValue = void 0;
10348          var propertyInfo = isCustomComponentTag && enableCustomElementPropertySupport ? null : getPropertyInfo(propKey);
10349  
10350          if (rawProps[SUPPRESS_HYDRATION_WARNING] === true) ; else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING || // Controlled attributes are not validated
10351          // TODO: Only ignore them on controlled tags.
10352          propKey === 'value' || propKey === 'checked' || propKey === 'selected') ; else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
10353            var serverHTML = domElement.innerHTML;
10354            var nextHtml = nextProp ? nextProp[HTML$1] : undefined;
10355  
10356            if (nextHtml != null) {
10357              var expectedHTML = normalizeHTML(domElement, nextHtml);
10358  
10359              if (expectedHTML !== serverHTML) {
10360                warnForPropDifference(propKey, serverHTML, expectedHTML);
10361              }
10362            }
10363          } else if (propKey === STYLE) {
10364            // $FlowFixMe - Should be inferred as not undefined.
10365            extraAttributeNames.delete(propKey);
10366  
10367            if (canDiffStyleForHydrationWarning) {
10368              var expectedStyle = createDangerousStringForStyles(nextProp);
10369              serverValue = domElement.getAttribute('style');
10370  
10371              if (expectedStyle !== serverValue) {
10372                warnForPropDifference(propKey, serverValue, expectedStyle);
10373              }
10374            }
10375          } else if (isCustomComponentTag && !enableCustomElementPropertySupport) {
10376            // $FlowFixMe - Should be inferred as not undefined.
10377            extraAttributeNames.delete(propKey.toLowerCase());
10378            serverValue = getValueForAttribute(domElement, propKey, nextProp);
10379  
10380            if (nextProp !== serverValue) {
10381              warnForPropDifference(propKey, serverValue, nextProp);
10382            }
10383          } else if (!shouldIgnoreAttribute(propKey, propertyInfo, isCustomComponentTag) && !shouldRemoveAttribute(propKey, nextProp, propertyInfo, isCustomComponentTag)) {
10384            var isMismatchDueToBadCasing = false;
10385  
10386            if (propertyInfo !== null) {
10387              // $FlowFixMe - Should be inferred as not undefined.
10388              extraAttributeNames.delete(propertyInfo.attributeName);
10389              serverValue = getValueForProperty(domElement, propKey, nextProp, propertyInfo);
10390            } else {
10391              var ownNamespace = parentNamespace;
10392  
10393              if (ownNamespace === HTML_NAMESPACE) {
10394                ownNamespace = getIntrinsicNamespace(tag);
10395              }
10396  
10397              if (ownNamespace === HTML_NAMESPACE) {
10398                // $FlowFixMe - Should be inferred as not undefined.
10399                extraAttributeNames.delete(propKey.toLowerCase());
10400              } else {
10401                var standardName = getPossibleStandardName(propKey);
10402  
10403                if (standardName !== null && standardName !== propKey) {
10404                  // If an SVG prop is supplied with bad casing, it will
10405                  // be successfully parsed from HTML, but will produce a mismatch
10406                  // (and would be incorrectly rendered on the client).
10407                  // However, we already warn about bad casing elsewhere.
10408                  // So we'll skip the misleading extra mismatch warning in this case.
10409                  isMismatchDueToBadCasing = true; // $FlowFixMe - Should be inferred as not undefined.
10410  
10411                  extraAttributeNames.delete(standardName);
10412                } // $FlowFixMe - Should be inferred as not undefined.
10413  
10414  
10415                extraAttributeNames.delete(propKey);
10416              }
10417  
10418              serverValue = getValueForAttribute(domElement, propKey, nextProp);
10419            }
10420  
10421            var dontWarnCustomElement = enableCustomElementPropertySupport  ;
10422  
10423            if (!dontWarnCustomElement && nextProp !== serverValue && !isMismatchDueToBadCasing) {
10424              warnForPropDifference(propKey, serverValue, nextProp);
10425            }
10426          }
10427        }
10428      }
10429  
10430      {
10431        if (shouldWarnDev) {
10432          if ( // $FlowFixMe - Should be inferred as not undefined.
10433          extraAttributeNames.size > 0 && rawProps[SUPPRESS_HYDRATION_WARNING] !== true) {
10434            // $FlowFixMe - Should be inferred as not undefined.
10435            warnForExtraAttributes(extraAttributeNames);
10436          }
10437        }
10438      }
10439  
10440      switch (tag) {
10441        case 'input':
10442          // TODO: Make sure we check if this is still unmounted or do any clean
10443          // up necessary since we never stop tracking anymore.
10444          track(domElement);
10445          postMountWrapper(domElement, rawProps, true);
10446          break;
10447  
10448        case 'textarea':
10449          // TODO: Make sure we check if this is still unmounted or do any clean
10450          // up necessary since we never stop tracking anymore.
10451          track(domElement);
10452          postMountWrapper$3(domElement);
10453          break;
10454  
10455        case 'select':
10456        case 'option':
10457          // For input and textarea we current always set the value property at
10458          // post mount to force it to diverge from attributes. However, for
10459          // option and select we don't quite do the same thing and select
10460          // is not resilient to the DOM state changing so we don't do that here.
10461          // TODO: Consider not doing this for input and textarea.
10462          break;
10463  
10464        default:
10465          if (typeof rawProps.onClick === 'function') {
10466            // TODO: This cast may not be sound for SVG, MathML or custom elements.
10467            trapClickOnNonInteractiveElement(domElement);
10468          }
10469  
10470          break;
10471      }
10472  
10473      return updatePayload;
10474    }
10475    function diffHydratedText(textNode, text, isConcurrentMode) {
10476      var isDifferent = textNode.nodeValue !== text;
10477      return isDifferent;
10478    }
10479    function warnForDeletedHydratableElement(parentNode, child) {
10480      {
10481        if (didWarnInvalidHydration) {
10482          return;
10483        }
10484  
10485        didWarnInvalidHydration = true;
10486  
10487        error('Did not expect server HTML to contain a <%s> in <%s>.', child.nodeName.toLowerCase(), parentNode.nodeName.toLowerCase());
10488      }
10489    }
10490    function warnForDeletedHydratableText(parentNode, child) {
10491      {
10492        if (didWarnInvalidHydration) {
10493          return;
10494        }
10495  
10496        didWarnInvalidHydration = true;
10497  
10498        error('Did not expect server HTML to contain the text node "%s" in <%s>.', child.nodeValue, parentNode.nodeName.toLowerCase());
10499      }
10500    }
10501    function warnForInsertedHydratedElement(parentNode, tag, props) {
10502      {
10503        if (didWarnInvalidHydration) {
10504          return;
10505        }
10506  
10507        didWarnInvalidHydration = true;
10508  
10509        error('Expected server HTML to contain a matching <%s> in <%s>.', tag, parentNode.nodeName.toLowerCase());
10510      }
10511    }
10512    function warnForInsertedHydratedText(parentNode, text) {
10513      {
10514        if (text === '') {
10515          // We expect to insert empty text nodes since they're not represented in
10516          // the HTML.
10517          // TODO: Remove this special case if we can just avoid inserting empty
10518          // text nodes.
10519          return;
10520        }
10521  
10522        if (didWarnInvalidHydration) {
10523          return;
10524        }
10525  
10526        didWarnInvalidHydration = true;
10527  
10528        error('Expected server HTML to contain a matching text node for "%s" in <%s>.', text, parentNode.nodeName.toLowerCase());
10529      }
10530    }
10531    function restoreControlledState$3(domElement, tag, props) {
10532      switch (tag) {
10533        case 'input':
10534          restoreControlledState(domElement, props);
10535          return;
10536  
10537        case 'textarea':
10538          restoreControlledState$2(domElement, props);
10539          return;
10540  
10541        case 'select':
10542          restoreControlledState$1(domElement, props);
10543          return;
10544      }
10545    }
10546  
10547    var validateDOMNesting = function () {};
10548  
10549    var updatedAncestorInfo = function () {};
10550  
10551    {
10552      // This validation code was written based on the HTML5 parsing spec:
10553      // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-scope
10554      //
10555      // Note: this does not catch all invalid nesting, nor does it try to (as it's
10556      // not clear what practical benefit doing so provides); instead, we warn only
10557      // for cases where the parser will give a parse tree differing from what React
10558      // intended. For example, <b><div></div></b> is invalid but we don't warn
10559      // because it still parses correctly; we do warn for other cases like nested
10560      // <p> tags where the beginning of the second element implicitly closes the
10561      // first, causing a confusing mess.
10562      // https://html.spec.whatwg.org/multipage/syntax.html#special
10563      var specialTags = ['address', 'applet', 'area', 'article', 'aside', 'base', 'basefont', 'bgsound', 'blockquote', 'body', 'br', 'button', 'caption', 'center', 'col', 'colgroup', 'dd', 'details', 'dir', 'div', 'dl', 'dt', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'frame', 'frameset', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'iframe', 'img', 'input', 'isindex', 'li', 'link', 'listing', 'main', 'marquee', 'menu', 'menuitem', 'meta', 'nav', 'noembed', 'noframes', 'noscript', 'object', 'ol', 'p', 'param', 'plaintext', 'pre', 'script', 'section', 'select', 'source', 'style', 'summary', 'table', 'tbody', 'td', 'template', 'textarea', 'tfoot', 'th', 'thead', 'title', 'tr', 'track', 'ul', 'wbr', 'xmp']; // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-scope
10564  
10565      var inScopeTags = ['applet', 'caption', 'html', 'table', 'td', 'th', 'marquee', 'object', 'template', // https://html.spec.whatwg.org/multipage/syntax.html#html-integration-point
10566      // TODO: Distinguish by namespace here -- for <title>, including it here
10567      // errs on the side of fewer warnings
10568      'foreignObject', 'desc', 'title']; // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-button-scope
10569  
10570      var buttonScopeTags = inScopeTags.concat(['button']); // https://html.spec.whatwg.org/multipage/syntax.html#generate-implied-end-tags
10571  
10572      var impliedEndTags = ['dd', 'dt', 'li', 'option', 'optgroup', 'p', 'rp', 'rt'];
10573      var emptyAncestorInfo = {
10574        current: null,
10575        formTag: null,
10576        aTagInScope: null,
10577        buttonTagInScope: null,
10578        nobrTagInScope: null,
10579        pTagInButtonScope: null,
10580        listItemTagAutoclosing: null,
10581        dlItemTagAutoclosing: null
10582      };
10583  
10584      updatedAncestorInfo = function (oldInfo, tag) {
10585        var ancestorInfo = assign({}, oldInfo || emptyAncestorInfo);
10586  
10587        var info = {
10588          tag: tag
10589        };
10590  
10591        if (inScopeTags.indexOf(tag) !== -1) {
10592          ancestorInfo.aTagInScope = null;
10593          ancestorInfo.buttonTagInScope = null;
10594          ancestorInfo.nobrTagInScope = null;
10595        }
10596  
10597        if (buttonScopeTags.indexOf(tag) !== -1) {
10598          ancestorInfo.pTagInButtonScope = null;
10599        } // See rules for 'li', 'dd', 'dt' start tags in
10600        // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inbody
10601  
10602  
10603        if (specialTags.indexOf(tag) !== -1 && tag !== 'address' && tag !== 'div' && tag !== 'p') {
10604          ancestorInfo.listItemTagAutoclosing = null;
10605          ancestorInfo.dlItemTagAutoclosing = null;
10606        }
10607  
10608        ancestorInfo.current = info;
10609  
10610        if (tag === 'form') {
10611          ancestorInfo.formTag = info;
10612        }
10613  
10614        if (tag === 'a') {
10615          ancestorInfo.aTagInScope = info;
10616        }
10617  
10618        if (tag === 'button') {
10619          ancestorInfo.buttonTagInScope = info;
10620        }
10621  
10622        if (tag === 'nobr') {
10623          ancestorInfo.nobrTagInScope = info;
10624        }
10625  
10626        if (tag === 'p') {
10627          ancestorInfo.pTagInButtonScope = info;
10628        }
10629  
10630        if (tag === 'li') {
10631          ancestorInfo.listItemTagAutoclosing = info;
10632        }
10633  
10634        if (tag === 'dd' || tag === 'dt') {
10635          ancestorInfo.dlItemTagAutoclosing = info;
10636        }
10637  
10638        return ancestorInfo;
10639      };
10640      /**
10641       * Returns whether
10642       */
10643  
10644  
10645      var isTagValidWithParent = function (tag, parentTag) {
10646        // First, let's check if we're in an unusual parsing mode...
10647        switch (parentTag) {
10648          // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inselect
10649          case 'select':
10650            return tag === 'option' || tag === 'optgroup' || tag === '#text';
10651  
10652          case 'optgroup':
10653            return tag === 'option' || tag === '#text';
10654          // Strictly speaking, seeing an <option> doesn't mean we're in a <select>
10655          // but
10656  
10657          case 'option':
10658            return tag === '#text';
10659          // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intd
10660          // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-incaption
10661          // No special behavior since these rules fall back to "in body" mode for
10662          // all except special table nodes which cause bad parsing behavior anyway.
10663          // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intr
10664  
10665          case 'tr':
10666            return tag === 'th' || tag === 'td' || tag === 'style' || tag === 'script' || tag === 'template';
10667          // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intbody
10668  
10669          case 'tbody':
10670          case 'thead':
10671          case 'tfoot':
10672            return tag === 'tr' || tag === 'style' || tag === 'script' || tag === 'template';
10673          // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-incolgroup
10674  
10675          case 'colgroup':
10676            return tag === 'col' || tag === 'template';
10677          // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intable
10678  
10679          case 'table':
10680            return tag === 'caption' || tag === 'colgroup' || tag === 'tbody' || tag === 'tfoot' || tag === 'thead' || tag === 'style' || tag === 'script' || tag === 'template';
10681          // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inhead
10682  
10683          case 'head':
10684            return tag === 'base' || tag === 'basefont' || tag === 'bgsound' || tag === 'link' || tag === 'meta' || tag === 'title' || tag === 'noscript' || tag === 'noframes' || tag === 'style' || tag === 'script' || tag === 'template';
10685          // https://html.spec.whatwg.org/multipage/semantics.html#the-html-element
10686  
10687          case 'html':
10688            return tag === 'head' || tag === 'body' || tag === 'frameset';
10689  
10690          case 'frameset':
10691            return tag === 'frame';
10692  
10693          case '#document':
10694            return tag === 'html';
10695        } // Probably in the "in body" parsing mode, so we outlaw only tag combos
10696        // where the parsing rules cause implicit opens or closes to be added.
10697        // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inbody
10698  
10699  
10700        switch (tag) {
10701          case 'h1':
10702          case 'h2':
10703          case 'h3':
10704          case 'h4':
10705          case 'h5':
10706          case 'h6':
10707            return parentTag !== 'h1' && parentTag !== 'h2' && parentTag !== 'h3' && parentTag !== 'h4' && parentTag !== 'h5' && parentTag !== 'h6';
10708  
10709          case 'rp':
10710          case 'rt':
10711            return impliedEndTags.indexOf(parentTag) === -1;
10712  
10713          case 'body':
10714          case 'caption':
10715          case 'col':
10716          case 'colgroup':
10717          case 'frameset':
10718          case 'frame':
10719          case 'head':
10720          case 'html':
10721          case 'tbody':
10722          case 'td':
10723          case 'tfoot':
10724          case 'th':
10725          case 'thead':
10726          case 'tr':
10727            // These tags are only valid with a few parents that have special child
10728            // parsing rules -- if we're down here, then none of those matched and
10729            // so we allow it only if we don't know what the parent is, as all other
10730            // cases are invalid.
10731            return parentTag == null;
10732        }
10733  
10734        return true;
10735      };
10736      /**
10737       * Returns whether
10738       */
10739  
10740  
10741      var findInvalidAncestorForTag = function (tag, ancestorInfo) {
10742        switch (tag) {
10743          case 'address':
10744          case 'article':
10745          case 'aside':
10746          case 'blockquote':
10747          case 'center':
10748          case 'details':
10749          case 'dialog':
10750          case 'dir':
10751          case 'div':
10752          case 'dl':
10753          case 'fieldset':
10754          case 'figcaption':
10755          case 'figure':
10756          case 'footer':
10757          case 'header':
10758          case 'hgroup':
10759          case 'main':
10760          case 'menu':
10761          case 'nav':
10762          case 'ol':
10763          case 'p':
10764          case 'section':
10765          case 'summary':
10766          case 'ul':
10767          case 'pre':
10768          case 'listing':
10769          case 'table':
10770          case 'hr':
10771          case 'xmp':
10772          case 'h1':
10773          case 'h2':
10774          case 'h3':
10775          case 'h4':
10776          case 'h5':
10777          case 'h6':
10778            return ancestorInfo.pTagInButtonScope;
10779  
10780          case 'form':
10781            return ancestorInfo.formTag || ancestorInfo.pTagInButtonScope;
10782  
10783          case 'li':
10784            return ancestorInfo.listItemTagAutoclosing;
10785  
10786          case 'dd':
10787          case 'dt':
10788            return ancestorInfo.dlItemTagAutoclosing;
10789  
10790          case 'button':
10791            return ancestorInfo.buttonTagInScope;
10792  
10793          case 'a':
10794            // Spec says something about storing a list of markers, but it sounds
10795            // equivalent to this check.
10796            return ancestorInfo.aTagInScope;
10797  
10798          case 'nobr':
10799            return ancestorInfo.nobrTagInScope;
10800        }
10801  
10802        return null;
10803      };
10804  
10805      var didWarn$1 = {};
10806  
10807      validateDOMNesting = function (childTag, childText, ancestorInfo) {
10808        ancestorInfo = ancestorInfo || emptyAncestorInfo;
10809        var parentInfo = ancestorInfo.current;
10810        var parentTag = parentInfo && parentInfo.tag;
10811  
10812        if (childText != null) {
10813          if (childTag != null) {
10814            error('validateDOMNesting: when childText is passed, childTag should be null');
10815          }
10816  
10817          childTag = '#text';
10818        }
10819  
10820        var invalidParent = isTagValidWithParent(childTag, parentTag) ? null : parentInfo;
10821        var invalidAncestor = invalidParent ? null : findInvalidAncestorForTag(childTag, ancestorInfo);
10822        var invalidParentOrAncestor = invalidParent || invalidAncestor;
10823  
10824        if (!invalidParentOrAncestor) {
10825          return;
10826        }
10827  
10828        var ancestorTag = invalidParentOrAncestor.tag;
10829        var warnKey = !!invalidParent + '|' + childTag + '|' + ancestorTag;
10830  
10831        if (didWarn$1[warnKey]) {
10832          return;
10833        }
10834  
10835        didWarn$1[warnKey] = true;
10836        var tagDisplayName = childTag;
10837        var whitespaceInfo = '';
10838  
10839        if (childTag === '#text') {
10840          if (/\S/.test(childText)) {
10841            tagDisplayName = 'Text nodes';
10842          } else {
10843            tagDisplayName = 'Whitespace text nodes';
10844            whitespaceInfo = " Make sure you don't have any extra whitespace between tags on " + 'each line of your source code.';
10845          }
10846        } else {
10847          tagDisplayName = '<' + childTag + '>';
10848        }
10849  
10850        if (invalidParent) {
10851          var info = '';
10852  
10853          if (ancestorTag === 'table' && childTag === 'tr') {
10854            info += ' Add a <tbody>, <thead> or <tfoot> to your code to match the DOM tree generated by ' + 'the browser.';
10855          }
10856  
10857          error('validateDOMNesting(...): %s cannot appear as a child of <%s>.%s%s', tagDisplayName, ancestorTag, whitespaceInfo, info);
10858        } else {
10859          error('validateDOMNesting(...): %s cannot appear as a descendant of ' + '<%s>.', tagDisplayName, ancestorTag);
10860        }
10861      };
10862    }
10863  
10864    var SUPPRESS_HYDRATION_WARNING$1 = 'suppressHydrationWarning';
10865    var SUSPENSE_START_DATA = '$';
10866    var SUSPENSE_END_DATA = '/$';
10867    var SUSPENSE_PENDING_START_DATA = '$?';
10868    var SUSPENSE_FALLBACK_START_DATA = '$!';
10869    var STYLE$1 = 'style';
10870    var eventsEnabled = null;
10871    var selectionInformation = null;
10872    function getRootHostContext(rootContainerInstance) {
10873      var type;
10874      var namespace;
10875      var nodeType = rootContainerInstance.nodeType;
10876  
10877      switch (nodeType) {
10878        case DOCUMENT_NODE:
10879        case DOCUMENT_FRAGMENT_NODE:
10880          {
10881            type = nodeType === DOCUMENT_NODE ? '#document' : '#fragment';
10882            var root = rootContainerInstance.documentElement;
10883            namespace = root ? root.namespaceURI : getChildNamespace(null, '');
10884            break;
10885          }
10886  
10887        default:
10888          {
10889            var container = nodeType === COMMENT_NODE ? rootContainerInstance.parentNode : rootContainerInstance;
10890            var ownNamespace = container.namespaceURI || null;
10891            type = container.tagName;
10892            namespace = getChildNamespace(ownNamespace, type);
10893            break;
10894          }
10895      }
10896  
10897      {
10898        var validatedTag = type.toLowerCase();
10899        var ancestorInfo = updatedAncestorInfo(null, validatedTag);
10900        return {
10901          namespace: namespace,
10902          ancestorInfo: ancestorInfo
10903        };
10904      }
10905    }
10906    function getChildHostContext(parentHostContext, type, rootContainerInstance) {
10907      {
10908        var parentHostContextDev = parentHostContext;
10909        var namespace = getChildNamespace(parentHostContextDev.namespace, type);
10910        var ancestorInfo = updatedAncestorInfo(parentHostContextDev.ancestorInfo, type);
10911        return {
10912          namespace: namespace,
10913          ancestorInfo: ancestorInfo
10914        };
10915      }
10916    }
10917    function getPublicInstance(instance) {
10918      return instance;
10919    }
10920    function prepareForCommit(containerInfo) {
10921      eventsEnabled = isEnabled();
10922      selectionInformation = getSelectionInformation();
10923      var activeInstance = null;
10924  
10925      setEnabled(false);
10926      return activeInstance;
10927    }
10928    function resetAfterCommit(containerInfo) {
10929      restoreSelection(selectionInformation);
10930      setEnabled(eventsEnabled);
10931      eventsEnabled = null;
10932      selectionInformation = null;
10933    }
10934    function createInstance(type, props, rootContainerInstance, hostContext, internalInstanceHandle) {
10935      var parentNamespace;
10936  
10937      {
10938        // TODO: take namespace into account when validating.
10939        var hostContextDev = hostContext;
10940        validateDOMNesting(type, null, hostContextDev.ancestorInfo);
10941  
10942        if (typeof props.children === 'string' || typeof props.children === 'number') {
10943          var string = '' + props.children;
10944          var ownAncestorInfo = updatedAncestorInfo(hostContextDev.ancestorInfo, type);
10945          validateDOMNesting(null, string, ownAncestorInfo);
10946        }
10947  
10948        parentNamespace = hostContextDev.namespace;
10949      }
10950  
10951      var domElement = createElement(type, props, rootContainerInstance, parentNamespace);
10952      precacheFiberNode(internalInstanceHandle, domElement);
10953      updateFiberProps(domElement, props);
10954      return domElement;
10955    }
10956    function appendInitialChild(parentInstance, child) {
10957      parentInstance.appendChild(child);
10958    }
10959    function finalizeInitialChildren(domElement, type, props, rootContainerInstance, hostContext) {
10960      setInitialProperties(domElement, type, props, rootContainerInstance);
10961  
10962      switch (type) {
10963        case 'button':
10964        case 'input':
10965        case 'select':
10966        case 'textarea':
10967          return !!props.autoFocus;
10968  
10969        case 'img':
10970          return true;
10971  
10972        default:
10973          return false;
10974      }
10975    }
10976    function prepareUpdate(domElement, type, oldProps, newProps, rootContainerInstance, hostContext) {
10977      {
10978        var hostContextDev = hostContext;
10979  
10980        if (typeof newProps.children !== typeof oldProps.children && (typeof newProps.children === 'string' || typeof newProps.children === 'number')) {
10981          var string = '' + newProps.children;
10982          var ownAncestorInfo = updatedAncestorInfo(hostContextDev.ancestorInfo, type);
10983          validateDOMNesting(null, string, ownAncestorInfo);
10984        }
10985      }
10986  
10987      return diffProperties(domElement, type, oldProps, newProps);
10988    }
10989    function shouldSetTextContent(type, props) {
10990      return type === 'textarea' || type === 'noscript' || typeof props.children === 'string' || typeof props.children === 'number' || typeof props.dangerouslySetInnerHTML === 'object' && props.dangerouslySetInnerHTML !== null && props.dangerouslySetInnerHTML.__html != null;
10991    }
10992    function createTextInstance(text, rootContainerInstance, hostContext, internalInstanceHandle) {
10993      {
10994        var hostContextDev = hostContext;
10995        validateDOMNesting(null, text, hostContextDev.ancestorInfo);
10996      }
10997  
10998      var textNode = createTextNode(text, rootContainerInstance);
10999      precacheFiberNode(internalInstanceHandle, textNode);
11000      return textNode;
11001    }
11002    function getCurrentEventPriority() {
11003      var currentEvent = window.event;
11004  
11005      if (currentEvent === undefined) {
11006        return DefaultEventPriority;
11007      }
11008  
11009      return getEventPriority(currentEvent.type);
11010    }
11011    // if a component just imports ReactDOM (e.g. for findDOMNode).
11012    // Some environments might not have setTimeout or clearTimeout.
11013  
11014    var scheduleTimeout = typeof setTimeout === 'function' ? setTimeout : undefined;
11015    var cancelTimeout = typeof clearTimeout === 'function' ? clearTimeout : undefined;
11016    var noTimeout = -1;
11017    var localPromise = typeof Promise === 'function' ? Promise : undefined; // -------------------
11018    var scheduleMicrotask = typeof queueMicrotask === 'function' ? queueMicrotask : typeof localPromise !== 'undefined' ? function (callback) {
11019      return localPromise.resolve(null).then(callback).catch(handleErrorInNextTick);
11020    } : scheduleTimeout; // TODO: Determine the best fallback here.
11021  
11022    function handleErrorInNextTick(error) {
11023      setTimeout(function () {
11024        throw error;
11025      });
11026    } // -------------------
11027    function commitMount(domElement, type, newProps, internalInstanceHandle) {
11028      // Despite the naming that might imply otherwise, this method only
11029      // fires if there is an `Update` effect scheduled during mounting.
11030      // This happens if `finalizeInitialChildren` returns `true` (which it
11031      // does to implement the `autoFocus` attribute on the client). But
11032      // there are also other cases when this might happen (such as patching
11033      // up text content during hydration mismatch). So we'll check this again.
11034      switch (type) {
11035        case 'button':
11036        case 'input':
11037        case 'select':
11038        case 'textarea':
11039          if (newProps.autoFocus) {
11040            domElement.focus();
11041          }
11042  
11043          return;
11044  
11045        case 'img':
11046          {
11047            if (newProps.src) {
11048              domElement.src = newProps.src;
11049            }
11050  
11051            return;
11052          }
11053      }
11054    }
11055    function commitUpdate(domElement, updatePayload, type, oldProps, newProps, internalInstanceHandle) {
11056      // Apply the diff to the DOM node.
11057      updateProperties(domElement, updatePayload, type, oldProps, newProps); // Update the props handle so that we know which props are the ones with
11058      // with current event handlers.
11059  
11060      updateFiberProps(domElement, newProps);
11061    }
11062    function resetTextContent(domElement) {
11063      setTextContent(domElement, '');
11064    }
11065    function commitTextUpdate(textInstance, oldText, newText) {
11066      textInstance.nodeValue = newText;
11067    }
11068    function appendChild(parentInstance, child) {
11069      parentInstance.appendChild(child);
11070    }
11071    function appendChildToContainer(container, child) {
11072      var parentNode;
11073  
11074      if (container.nodeType === COMMENT_NODE) {
11075        parentNode = container.parentNode;
11076        parentNode.insertBefore(child, container);
11077      } else {
11078        parentNode = container;
11079        parentNode.appendChild(child);
11080      } // This container might be used for a portal.
11081      // If something inside a portal is clicked, that click should bubble
11082      // through the React tree. However, on Mobile Safari the click would
11083      // never bubble through the *DOM* tree unless an ancestor with onclick
11084      // event exists. So we wouldn't see it and dispatch it.
11085      // This is why we ensure that non React root containers have inline onclick
11086      // defined.
11087      // https://github.com/facebook/react/issues/11918
11088  
11089  
11090      var reactRootContainer = container._reactRootContainer;
11091  
11092      if ((reactRootContainer === null || reactRootContainer === undefined) && parentNode.onclick === null) {
11093        // TODO: This cast may not be sound for SVG, MathML or custom elements.
11094        trapClickOnNonInteractiveElement(parentNode);
11095      }
11096    }
11097    function insertBefore(parentInstance, child, beforeChild) {
11098      parentInstance.insertBefore(child, beforeChild);
11099    }
11100    function insertInContainerBefore(container, child, beforeChild) {
11101      if (container.nodeType === COMMENT_NODE) {
11102        container.parentNode.insertBefore(child, beforeChild);
11103      } else {
11104        container.insertBefore(child, beforeChild);
11105      }
11106    }
11107  
11108    function removeChild(parentInstance, child) {
11109      parentInstance.removeChild(child);
11110    }
11111    function removeChildFromContainer(container, child) {
11112      if (container.nodeType === COMMENT_NODE) {
11113        container.parentNode.removeChild(child);
11114      } else {
11115        container.removeChild(child);
11116      }
11117    }
11118    function clearSuspenseBoundary(parentInstance, suspenseInstance) {
11119      var node = suspenseInstance; // Delete all nodes within this suspense boundary.
11120      // There might be nested nodes so we need to keep track of how
11121      // deep we are and only break out when we're back on top.
11122  
11123      var depth = 0;
11124  
11125      do {
11126        var nextNode = node.nextSibling;
11127        parentInstance.removeChild(node);
11128  
11129        if (nextNode && nextNode.nodeType === COMMENT_NODE) {
11130          var data = nextNode.data;
11131  
11132          if (data === SUSPENSE_END_DATA) {
11133            if (depth === 0) {
11134              parentInstance.removeChild(nextNode); // Retry if any event replaying was blocked on this.
11135  
11136              retryIfBlockedOn(suspenseInstance);
11137              return;
11138            } else {
11139              depth--;
11140            }
11141          } else if (data === SUSPENSE_START_DATA || data === SUSPENSE_PENDING_START_DATA || data === SUSPENSE_FALLBACK_START_DATA) {
11142            depth++;
11143          }
11144        }
11145  
11146        node = nextNode;
11147      } while (node); // TODO: Warn, we didn't find the end comment boundary.
11148      // Retry if any event replaying was blocked on this.
11149  
11150  
11151      retryIfBlockedOn(suspenseInstance);
11152    }
11153    function clearSuspenseBoundaryFromContainer(container, suspenseInstance) {
11154      if (container.nodeType === COMMENT_NODE) {
11155        clearSuspenseBoundary(container.parentNode, suspenseInstance);
11156      } else if (container.nodeType === ELEMENT_NODE) {
11157        clearSuspenseBoundary(container, suspenseInstance);
11158      } // Retry if any event replaying was blocked on this.
11159  
11160  
11161      retryIfBlockedOn(container);
11162    }
11163    function hideInstance(instance) {
11164      // TODO: Does this work for all element types? What about MathML? Should we
11165      // pass host context to this method?
11166      instance = instance;
11167      var style = instance.style;
11168  
11169      if (typeof style.setProperty === 'function') {
11170        style.setProperty('display', 'none', 'important');
11171      } else {
11172        style.display = 'none';
11173      }
11174    }
11175    function hideTextInstance(textInstance) {
11176      textInstance.nodeValue = '';
11177    }
11178    function unhideInstance(instance, props) {
11179      instance = instance;
11180      var styleProp = props[STYLE$1];
11181      var display = styleProp !== undefined && styleProp !== null && styleProp.hasOwnProperty('display') ? styleProp.display : null;
11182      instance.style.display = dangerousStyleValue('display', display);
11183    }
11184    function unhideTextInstance(textInstance, text) {
11185      textInstance.nodeValue = text;
11186    }
11187    function clearContainer(container) {
11188      if (container.nodeType === ELEMENT_NODE) {
11189        container.textContent = '';
11190      } else if (container.nodeType === DOCUMENT_NODE) {
11191        if (container.documentElement) {
11192          container.removeChild(container.documentElement);
11193        }
11194      }
11195    } // -------------------
11196    function canHydrateInstance(instance, type, props) {
11197      if (instance.nodeType !== ELEMENT_NODE || type.toLowerCase() !== instance.nodeName.toLowerCase()) {
11198        return null;
11199      } // This has now been refined to an element node.
11200  
11201  
11202      return instance;
11203    }
11204    function canHydrateTextInstance(instance, text) {
11205      if (text === '' || instance.nodeType !== TEXT_NODE) {
11206        // Empty strings are not parsed by HTML so there won't be a correct match here.
11207        return null;
11208      } // This has now been refined to a text node.
11209  
11210  
11211      return instance;
11212    }
11213    function canHydrateSuspenseInstance(instance) {
11214      if (instance.nodeType !== COMMENT_NODE) {
11215        // Empty strings are not parsed by HTML so there won't be a correct match here.
11216        return null;
11217      } // This has now been refined to a suspense node.
11218  
11219  
11220      return instance;
11221    }
11222    function isSuspenseInstancePending(instance) {
11223      return instance.data === SUSPENSE_PENDING_START_DATA;
11224    }
11225    function isSuspenseInstanceFallback(instance) {
11226      return instance.data === SUSPENSE_FALLBACK_START_DATA;
11227    }
11228    function getSuspenseInstanceFallbackErrorDetails(instance) {
11229      var dataset = instance.nextSibling && instance.nextSibling.dataset;
11230      var digest, message, stack;
11231  
11232      if (dataset) {
11233        digest = dataset.dgst;
11234  
11235        {
11236          message = dataset.msg;
11237          stack = dataset.stck;
11238        }
11239      }
11240  
11241      {
11242        return {
11243          message: message,
11244          digest: digest,
11245          stack: stack
11246        };
11247      } // let value = {message: undefined, hash: undefined};
11248      // const nextSibling = instance.nextSibling;
11249      // if (nextSibling) {
11250      //   const dataset = ((nextSibling: any): HTMLTemplateElement).dataset;
11251      //   value.message = dataset.msg;
11252      //   value.hash = dataset.hash;
11253      //   if (true) {
11254      //     value.stack = dataset.stack;
11255      //   }
11256      // }
11257      // return value;
11258  
11259    }
11260    function registerSuspenseInstanceRetry(instance, callback) {
11261      instance._reactRetry = callback;
11262    }
11263  
11264    function getNextHydratable(node) {
11265      // Skip non-hydratable nodes.
11266      for (; node != null; node = node.nextSibling) {
11267        var nodeType = node.nodeType;
11268  
11269        if (nodeType === ELEMENT_NODE || nodeType === TEXT_NODE) {
11270          break;
11271        }
11272  
11273        if (nodeType === COMMENT_NODE) {
11274          var nodeData = node.data;
11275  
11276          if (nodeData === SUSPENSE_START_DATA || nodeData === SUSPENSE_FALLBACK_START_DATA || nodeData === SUSPENSE_PENDING_START_DATA) {
11277            break;
11278          }
11279  
11280          if (nodeData === SUSPENSE_END_DATA) {
11281            return null;
11282          }
11283        }
11284      }
11285  
11286      return node;
11287    }
11288  
11289    function getNextHydratableSibling(instance) {
11290      return getNextHydratable(instance.nextSibling);
11291    }
11292    function getFirstHydratableChild(parentInstance) {
11293      return getNextHydratable(parentInstance.firstChild);
11294    }
11295    function getFirstHydratableChildWithinContainer(parentContainer) {
11296      return getNextHydratable(parentContainer.firstChild);
11297    }
11298    function getFirstHydratableChildWithinSuspenseInstance(parentInstance) {
11299      return getNextHydratable(parentInstance.nextSibling);
11300    }
11301    function hydrateInstance(instance, type, props, rootContainerInstance, hostContext, internalInstanceHandle, shouldWarnDev) {
11302      precacheFiberNode(internalInstanceHandle, instance); // TODO: Possibly defer this until the commit phase where all the events
11303      // get attached.
11304  
11305      updateFiberProps(instance, props);
11306      var parentNamespace;
11307  
11308      {
11309        var hostContextDev = hostContext;
11310        parentNamespace = hostContextDev.namespace;
11311      } // TODO: Temporary hack to check if we're in a concurrent root. We can delete
11312      // when the legacy root API is removed.
11313  
11314  
11315      var isConcurrentMode = (internalInstanceHandle.mode & ConcurrentMode) !== NoMode;
11316      return diffHydratedProperties(instance, type, props, parentNamespace, rootContainerInstance, isConcurrentMode, shouldWarnDev);
11317    }
11318    function hydrateTextInstance(textInstance, text, internalInstanceHandle, shouldWarnDev) {
11319      precacheFiberNode(internalInstanceHandle, textInstance); // TODO: Temporary hack to check if we're in a concurrent root. We can delete
11320      // when the legacy root API is removed.
11321  
11322      var isConcurrentMode = (internalInstanceHandle.mode & ConcurrentMode) !== NoMode;
11323      return diffHydratedText(textInstance, text);
11324    }
11325    function hydrateSuspenseInstance(suspenseInstance, internalInstanceHandle) {
11326      precacheFiberNode(internalInstanceHandle, suspenseInstance);
11327    }
11328    function getNextHydratableInstanceAfterSuspenseInstance(suspenseInstance) {
11329      var node = suspenseInstance.nextSibling; // Skip past all nodes within this suspense boundary.
11330      // There might be nested nodes so we need to keep track of how
11331      // deep we are and only break out when we're back on top.
11332  
11333      var depth = 0;
11334  
11335      while (node) {
11336        if (node.nodeType === COMMENT_NODE) {
11337          var data = node.data;
11338  
11339          if (data === SUSPENSE_END_DATA) {
11340            if (depth === 0) {
11341              return getNextHydratableSibling(node);
11342            } else {
11343              depth--;
11344            }
11345          } else if (data === SUSPENSE_START_DATA || data === SUSPENSE_FALLBACK_START_DATA || data === SUSPENSE_PENDING_START_DATA) {
11346            depth++;
11347          }
11348        }
11349  
11350        node = node.nextSibling;
11351      } // TODO: Warn, we didn't find the end comment boundary.
11352  
11353  
11354      return null;
11355    } // Returns the SuspenseInstance if this node is a direct child of a
11356    // SuspenseInstance. I.e. if its previous sibling is a Comment with
11357    // SUSPENSE_x_START_DATA. Otherwise, null.
11358  
11359    function getParentSuspenseInstance(targetInstance) {
11360      var node = targetInstance.previousSibling; // Skip past all nodes within this suspense boundary.
11361      // There might be nested nodes so we need to keep track of how
11362      // deep we are and only break out when we're back on top.
11363  
11364      var depth = 0;
11365  
11366      while (node) {
11367        if (node.nodeType === COMMENT_NODE) {
11368          var data = node.data;
11369  
11370          if (data === SUSPENSE_START_DATA || data === SUSPENSE_FALLBACK_START_DATA || data === SUSPENSE_PENDING_START_DATA) {
11371            if (depth === 0) {
11372              return node;
11373            } else {
11374              depth--;
11375            }
11376          } else if (data === SUSPENSE_END_DATA) {
11377            depth++;
11378          }
11379        }
11380  
11381        node = node.previousSibling;
11382      }
11383  
11384      return null;
11385    }
11386    function commitHydratedContainer(container) {
11387      // Retry if any event replaying was blocked on this.
11388      retryIfBlockedOn(container);
11389    }
11390    function commitHydratedSuspenseInstance(suspenseInstance) {
11391      // Retry if any event replaying was blocked on this.
11392      retryIfBlockedOn(suspenseInstance);
11393    }
11394    function shouldDeleteUnhydratedTailInstances(parentType) {
11395      return parentType !== 'head' && parentType !== 'body';
11396    }
11397    function didNotMatchHydratedContainerTextInstance(parentContainer, textInstance, text, isConcurrentMode) {
11398      var shouldWarnDev = true;
11399      checkForUnmatchedText(textInstance.nodeValue, text, isConcurrentMode, shouldWarnDev);
11400    }
11401    function didNotMatchHydratedTextInstance(parentType, parentProps, parentInstance, textInstance, text, isConcurrentMode) {
11402      if (parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) {
11403        var shouldWarnDev = true;
11404        checkForUnmatchedText(textInstance.nodeValue, text, isConcurrentMode, shouldWarnDev);
11405      }
11406    }
11407    function didNotHydrateInstanceWithinContainer(parentContainer, instance) {
11408      {
11409        if (instance.nodeType === ELEMENT_NODE) {
11410          warnForDeletedHydratableElement(parentContainer, instance);
11411        } else if (instance.nodeType === COMMENT_NODE) ; else {
11412          warnForDeletedHydratableText(parentContainer, instance);
11413        }
11414      }
11415    }
11416    function didNotHydrateInstanceWithinSuspenseInstance(parentInstance, instance) {
11417      {
11418        // $FlowFixMe: Only Element or Document can be parent nodes.
11419        var parentNode = parentInstance.parentNode;
11420  
11421        if (parentNode !== null) {
11422          if (instance.nodeType === ELEMENT_NODE) {
11423            warnForDeletedHydratableElement(parentNode, instance);
11424          } else if (instance.nodeType === COMMENT_NODE) ; else {
11425            warnForDeletedHydratableText(parentNode, instance);
11426          }
11427        }
11428      }
11429    }
11430    function didNotHydrateInstance(parentType, parentProps, parentInstance, instance, isConcurrentMode) {
11431      {
11432        if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) {
11433          if (instance.nodeType === ELEMENT_NODE) {
11434            warnForDeletedHydratableElement(parentInstance, instance);
11435          } else if (instance.nodeType === COMMENT_NODE) ; else {
11436            warnForDeletedHydratableText(parentInstance, instance);
11437          }
11438        }
11439      }
11440    }
11441    function didNotFindHydratableInstanceWithinContainer(parentContainer, type, props) {
11442      {
11443        warnForInsertedHydratedElement(parentContainer, type);
11444      }
11445    }
11446    function didNotFindHydratableTextInstanceWithinContainer(parentContainer, text) {
11447      {
11448        warnForInsertedHydratedText(parentContainer, text);
11449      }
11450    }
11451    function didNotFindHydratableInstanceWithinSuspenseInstance(parentInstance, type, props) {
11452      {
11453        // $FlowFixMe: Only Element or Document can be parent nodes.
11454        var parentNode = parentInstance.parentNode;
11455        if (parentNode !== null) warnForInsertedHydratedElement(parentNode, type);
11456      }
11457    }
11458    function didNotFindHydratableTextInstanceWithinSuspenseInstance(parentInstance, text) {
11459      {
11460        // $FlowFixMe: Only Element or Document can be parent nodes.
11461        var parentNode = parentInstance.parentNode;
11462        if (parentNode !== null) warnForInsertedHydratedText(parentNode, text);
11463      }
11464    }
11465    function didNotFindHydratableInstance(parentType, parentProps, parentInstance, type, props, isConcurrentMode) {
11466      {
11467        if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) {
11468          warnForInsertedHydratedElement(parentInstance, type);
11469        }
11470      }
11471    }
11472    function didNotFindHydratableTextInstance(parentType, parentProps, parentInstance, text, isConcurrentMode) {
11473      {
11474        if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) {
11475          warnForInsertedHydratedText(parentInstance, text);
11476        }
11477      }
11478    }
11479    function errorHydratingContainer(parentContainer) {
11480      {
11481        // TODO: This gets logged by onRecoverableError, too, so we should be
11482        // able to remove it.
11483        error('An error occurred during hydration. The server HTML was replaced with client content in <%s>.', parentContainer.nodeName.toLowerCase());
11484      }
11485    }
11486    function preparePortalMount(portalInstance) {
11487      listenToAllSupportedEvents(portalInstance);
11488    }
11489  
11490    var randomKey = Math.random().toString(36).slice(2);
11491    var internalInstanceKey = '__reactFiber$' + randomKey;
11492    var internalPropsKey = '__reactProps$' + randomKey;
11493    var internalContainerInstanceKey = '__reactContainer$' + randomKey;
11494    var internalEventHandlersKey = '__reactEvents$' + randomKey;
11495    var internalEventHandlerListenersKey = '__reactListeners$' + randomKey;
11496    var internalEventHandlesSetKey = '__reactHandles$' + randomKey;
11497    function detachDeletedInstance(node) {
11498      // TODO: This function is only called on host components. I don't think all of
11499      // these fields are relevant.
11500      delete node[internalInstanceKey];
11501      delete node[internalPropsKey];
11502      delete node[internalEventHandlersKey];
11503      delete node[internalEventHandlerListenersKey];
11504      delete node[internalEventHandlesSetKey];
11505    }
11506    function precacheFiberNode(hostInst, node) {
11507      node[internalInstanceKey] = hostInst;
11508    }
11509    function markContainerAsRoot(hostRoot, node) {
11510      node[internalContainerInstanceKey] = hostRoot;
11511    }
11512    function unmarkContainerAsRoot(node) {
11513      node[internalContainerInstanceKey] = null;
11514    }
11515    function isContainerMarkedAsRoot(node) {
11516      return !!node[internalContainerInstanceKey];
11517    } // Given a DOM node, return the closest HostComponent or HostText fiber ancestor.
11518    // If the target node is part of a hydrated or not yet rendered subtree, then
11519    // this may also return a SuspenseComponent or HostRoot to indicate that.
11520    // Conceptually the HostRoot fiber is a child of the Container node. So if you
11521    // pass the Container node as the targetNode, you will not actually get the
11522    // HostRoot back. To get to the HostRoot, you need to pass a child of it.
11523    // The same thing applies to Suspense boundaries.
11524  
11525    function getClosestInstanceFromNode(targetNode) {
11526      var targetInst = targetNode[internalInstanceKey];
11527  
11528      if (targetInst) {
11529        // Don't return HostRoot or SuspenseComponent here.
11530        return targetInst;
11531      } // If the direct event target isn't a React owned DOM node, we need to look
11532      // to see if one of its parents is a React owned DOM node.
11533  
11534  
11535      var parentNode = targetNode.parentNode;
11536  
11537      while (parentNode) {
11538        // We'll check if this is a container root that could include
11539        // React nodes in the future. We need to check this first because
11540        // if we're a child of a dehydrated container, we need to first
11541        // find that inner container before moving on to finding the parent
11542        // instance. Note that we don't check this field on  the targetNode
11543        // itself because the fibers are conceptually between the container
11544        // node and the first child. It isn't surrounding the container node.
11545        // If it's not a container, we check if it's an instance.
11546        targetInst = parentNode[internalContainerInstanceKey] || parentNode[internalInstanceKey];
11547  
11548        if (targetInst) {
11549          // Since this wasn't the direct target of the event, we might have
11550          // stepped past dehydrated DOM nodes to get here. However they could
11551          // also have been non-React nodes. We need to answer which one.
11552          // If we the instance doesn't have any children, then there can't be
11553          // a nested suspense boundary within it. So we can use this as a fast
11554          // bailout. Most of the time, when people add non-React children to
11555          // the tree, it is using a ref to a child-less DOM node.
11556          // Normally we'd only need to check one of the fibers because if it
11557          // has ever gone from having children to deleting them or vice versa
11558          // it would have deleted the dehydrated boundary nested inside already.
11559          // However, since the HostRoot starts out with an alternate it might
11560          // have one on the alternate so we need to check in case this was a
11561          // root.
11562          var alternate = targetInst.alternate;
11563  
11564          if (targetInst.child !== null || alternate !== null && alternate.child !== null) {
11565            // Next we need to figure out if the node that skipped past is
11566            // nested within a dehydrated boundary and if so, which one.
11567            var suspenseInstance = getParentSuspenseInstance(targetNode);
11568  
11569            while (suspenseInstance !== null) {
11570              // We found a suspense instance. That means that we haven't
11571              // hydrated it yet. Even though we leave the comments in the
11572              // DOM after hydrating, and there are boundaries in the DOM
11573              // that could already be hydrated, we wouldn't have found them
11574              // through this pass since if the target is hydrated it would
11575              // have had an internalInstanceKey on it.
11576              // Let's get the fiber associated with the SuspenseComponent
11577              // as the deepest instance.
11578              var targetSuspenseInst = suspenseInstance[internalInstanceKey];
11579  
11580              if (targetSuspenseInst) {
11581                return targetSuspenseInst;
11582              } // If we don't find a Fiber on the comment, it might be because
11583              // we haven't gotten to hydrate it yet. There might still be a
11584              // parent boundary that hasn't above this one so we need to find
11585              // the outer most that is known.
11586  
11587  
11588              suspenseInstance = getParentSuspenseInstance(suspenseInstance); // If we don't find one, then that should mean that the parent
11589              // host component also hasn't hydrated yet. We can return it
11590              // below since it will bail out on the isMounted check later.
11591            }
11592          }
11593  
11594          return targetInst;
11595        }
11596  
11597        targetNode = parentNode;
11598        parentNode = targetNode.parentNode;
11599      }
11600  
11601      return null;
11602    }
11603    /**
11604     * Given a DOM node, return the ReactDOMComponent or ReactDOMTextComponent
11605     * instance, or null if the node was not rendered by this React.
11606     */
11607  
11608    function getInstanceFromNode(node) {
11609      var inst = node[internalInstanceKey] || node[internalContainerInstanceKey];
11610  
11611      if (inst) {
11612        if (inst.tag === HostComponent || inst.tag === HostText || inst.tag === SuspenseComponent || inst.tag === HostRoot) {
11613          return inst;
11614        } else {
11615          return null;
11616        }
11617      }
11618  
11619      return null;
11620    }
11621    /**
11622     * Given a ReactDOMComponent or ReactDOMTextComponent, return the corresponding
11623     * DOM node.
11624     */
11625  
11626    function getNodeFromInstance(inst) {
11627      if (inst.tag === HostComponent || inst.tag === HostText) {
11628        // In Fiber this, is just the state node right now. We assume it will be
11629        // a host component or host text.
11630        return inst.stateNode;
11631      } // Without this first invariant, passing a non-DOM-component triggers the next
11632      // invariant for a missing parent, which is super confusing.
11633  
11634  
11635      throw new Error('getNodeFromInstance: Invalid argument.');
11636    }
11637    function getFiberCurrentPropsFromNode(node) {
11638      return node[internalPropsKey] || null;
11639    }
11640    function updateFiberProps(node, props) {
11641      node[internalPropsKey] = props;
11642    }
11643    function getEventListenerSet(node) {
11644      var elementListenerSet = node[internalEventHandlersKey];
11645  
11646      if (elementListenerSet === undefined) {
11647        elementListenerSet = node[internalEventHandlersKey] = new Set();
11648      }
11649  
11650      return elementListenerSet;
11651    }
11652  
11653    var loggedTypeFailures = {};
11654    var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame;
11655  
11656    function setCurrentlyValidatingElement(element) {
11657      {
11658        if (element) {
11659          var owner = element._owner;
11660          var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null);
11661          ReactDebugCurrentFrame$1.setExtraStackFrame(stack);
11662        } else {
11663          ReactDebugCurrentFrame$1.setExtraStackFrame(null);
11664        }
11665      }
11666    }
11667  
11668    function checkPropTypes(typeSpecs, values, location, componentName, element) {
11669      {
11670        // $FlowFixMe This is okay but Flow doesn't know it.
11671        var has = Function.call.bind(hasOwnProperty);
11672  
11673        for (var typeSpecName in typeSpecs) {
11674          if (has(typeSpecs, typeSpecName)) {
11675            var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
11676            // fail the render phase where it didn't fail before. So we log it.
11677            // After these have been cleaned up, we'll let them throw.
11678  
11679            try {
11680              // This is intentionally an invariant that gets caught. It's the same
11681              // behavior as without this statement except with a better message.
11682              if (typeof typeSpecs[typeSpecName] !== 'function') {
11683                // eslint-disable-next-line react-internal/prod-error-codes
11684                var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
11685                err.name = 'Invariant Violation';
11686                throw err;
11687              }
11688  
11689              error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
11690            } catch (ex) {
11691              error$1 = ex;
11692            }
11693  
11694            if (error$1 && !(error$1 instanceof Error)) {
11695              setCurrentlyValidatingElement(element);
11696  
11697              error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
11698  
11699              setCurrentlyValidatingElement(null);
11700            }
11701  
11702            if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
11703              // Only monitor this failure once because there tends to be a lot of the
11704              // same error.
11705              loggedTypeFailures[error$1.message] = true;
11706              setCurrentlyValidatingElement(element);
11707  
11708              error('Failed %s type: %s', location, error$1.message);
11709  
11710              setCurrentlyValidatingElement(null);
11711            }
11712          }
11713        }
11714      }
11715    }
11716  
11717    var valueStack = [];
11718    var fiberStack;
11719  
11720    {
11721      fiberStack = [];
11722    }
11723  
11724    var index = -1;
11725  
11726    function createCursor(defaultValue) {
11727      return {
11728        current: defaultValue
11729      };
11730    }
11731  
11732    function pop(cursor, fiber) {
11733      if (index < 0) {
11734        {
11735          error('Unexpected pop.');
11736        }
11737  
11738        return;
11739      }
11740  
11741      {
11742        if (fiber !== fiberStack[index]) {
11743          error('Unexpected Fiber popped.');
11744        }
11745      }
11746  
11747      cursor.current = valueStack[index];
11748      valueStack[index] = null;
11749  
11750      {
11751        fiberStack[index] = null;
11752      }
11753  
11754      index--;
11755    }
11756  
11757    function push(cursor, value, fiber) {
11758      index++;
11759      valueStack[index] = cursor.current;
11760  
11761      {
11762        fiberStack[index] = fiber;
11763      }
11764  
11765      cursor.current = value;
11766    }
11767  
11768    var warnedAboutMissingGetChildContext;
11769  
11770    {
11771      warnedAboutMissingGetChildContext = {};
11772    }
11773  
11774    var emptyContextObject = {};
11775  
11776    {
11777      Object.freeze(emptyContextObject);
11778    } // A cursor to the current merged context object on the stack.
11779  
11780  
11781    var contextStackCursor = createCursor(emptyContextObject); // A cursor to a boolean indicating whether the context has changed.
11782  
11783    var didPerformWorkStackCursor = createCursor(false); // Keep track of the previous context object that was on the stack.
11784    // We use this to get access to the parent context after we have already
11785    // pushed the next context provider, and now need to merge their contexts.
11786  
11787    var previousContext = emptyContextObject;
11788  
11789    function getUnmaskedContext(workInProgress, Component, didPushOwnContextIfProvider) {
11790      {
11791        if (didPushOwnContextIfProvider && isContextProvider(Component)) {
11792          // If the fiber is a context provider itself, when we read its context
11793          // we may have already pushed its own child context on the stack. A context
11794          // provider should not "see" its own child context. Therefore we read the
11795          // previous (parent) context instead for a context provider.
11796          return previousContext;
11797        }
11798  
11799        return contextStackCursor.current;
11800      }
11801    }
11802  
11803    function cacheContext(workInProgress, unmaskedContext, maskedContext) {
11804      {
11805        var instance = workInProgress.stateNode;
11806        instance.__reactInternalMemoizedUnmaskedChildContext = unmaskedContext;
11807        instance.__reactInternalMemoizedMaskedChildContext = maskedContext;
11808      }
11809    }
11810  
11811    function getMaskedContext(workInProgress, unmaskedContext) {
11812      {
11813        var type = workInProgress.type;
11814        var contextTypes = type.contextTypes;
11815  
11816        if (!contextTypes) {
11817          return emptyContextObject;
11818        } // Avoid recreating masked context unless unmasked context has changed.
11819        // Failing to do this will result in unnecessary calls to componentWillReceiveProps.
11820        // This may trigger infinite loops if componentWillReceiveProps calls setState.
11821  
11822  
11823        var instance = workInProgress.stateNode;
11824  
11825        if (instance && instance.__reactInternalMemoizedUnmaskedChildContext === unmaskedContext) {
11826          return instance.__reactInternalMemoizedMaskedChildContext;
11827        }
11828  
11829        var context = {};
11830  
11831        for (var key in contextTypes) {
11832          context[key] = unmaskedContext[key];
11833        }
11834  
11835        {
11836          var name = getComponentNameFromFiber(workInProgress) || 'Unknown';
11837          checkPropTypes(contextTypes, context, 'context', name);
11838        } // Cache unmasked context so we can avoid recreating masked context unless necessary.
11839        // Context is created before the class component is instantiated so check for instance.
11840  
11841  
11842        if (instance) {
11843          cacheContext(workInProgress, unmaskedContext, context);
11844        }
11845  
11846        return context;
11847      }
11848    }
11849  
11850    function hasContextChanged() {
11851      {
11852        return didPerformWorkStackCursor.current;
11853      }
11854    }
11855  
11856    function isContextProvider(type) {
11857      {
11858        var childContextTypes = type.childContextTypes;
11859        return childContextTypes !== null && childContextTypes !== undefined;
11860      }
11861    }
11862  
11863    function popContext(fiber) {
11864      {
11865        pop(didPerformWorkStackCursor, fiber);
11866        pop(contextStackCursor, fiber);
11867      }
11868    }
11869  
11870    function popTopLevelContextObject(fiber) {
11871      {
11872        pop(didPerformWorkStackCursor, fiber);
11873        pop(contextStackCursor, fiber);
11874      }
11875    }
11876  
11877    function pushTopLevelContextObject(fiber, context, didChange) {
11878      {
11879        if (contextStackCursor.current !== emptyContextObject) {
11880          throw new Error('Unexpected context found on stack. ' + 'This error is likely caused by a bug in React. Please file an issue.');
11881        }
11882  
11883        push(contextStackCursor, context, fiber);
11884        push(didPerformWorkStackCursor, didChange, fiber);
11885      }
11886    }
11887  
11888    function processChildContext(fiber, type, parentContext) {
11889      {
11890        var instance = fiber.stateNode;
11891        var childContextTypes = type.childContextTypes; // TODO (bvaughn) Replace this behavior with an invariant() in the future.
11892        // It has only been added in Fiber to match the (unintentional) behavior in Stack.
11893  
11894        if (typeof instance.getChildContext !== 'function') {
11895          {
11896            var componentName = getComponentNameFromFiber(fiber) || 'Unknown';
11897  
11898            if (!warnedAboutMissingGetChildContext[componentName]) {
11899              warnedAboutMissingGetChildContext[componentName] = true;
11900  
11901              error('%s.childContextTypes is specified but there is no getChildContext() method ' + 'on the instance. You can either define getChildContext() on %s or remove ' + 'childContextTypes from it.', componentName, componentName);
11902            }
11903          }
11904  
11905          return parentContext;
11906        }
11907  
11908        var childContext = instance.getChildContext();
11909  
11910        for (var contextKey in childContext) {
11911          if (!(contextKey in childContextTypes)) {
11912            throw new Error((getComponentNameFromFiber(fiber) || 'Unknown') + ".getChildContext(): key \"" + contextKey + "\" is not defined in childContextTypes.");
11913          }
11914        }
11915  
11916        {
11917          var name = getComponentNameFromFiber(fiber) || 'Unknown';
11918          checkPropTypes(childContextTypes, childContext, 'child context', name);
11919        }
11920  
11921        return assign({}, parentContext, childContext);
11922      }
11923    }
11924  
11925    function pushContextProvider(workInProgress) {
11926      {
11927        var instance = workInProgress.stateNode; // We push the context as early as possible to ensure stack integrity.
11928        // If the instance does not exist yet, we will push null at first,
11929        // and replace it on the stack later when invalidating the context.
11930  
11931        var memoizedMergedChildContext = instance && instance.__reactInternalMemoizedMergedChildContext || emptyContextObject; // Remember the parent context so we can merge with it later.
11932        // Inherit the parent's did-perform-work value to avoid inadvertently blocking updates.
11933  
11934        previousContext = contextStackCursor.current;
11935        push(contextStackCursor, memoizedMergedChildContext, workInProgress);
11936        push(didPerformWorkStackCursor, didPerformWorkStackCursor.current, workInProgress);
11937        return true;
11938      }
11939    }
11940  
11941    function invalidateContextProvider(workInProgress, type, didChange) {
11942      {
11943        var instance = workInProgress.stateNode;
11944  
11945        if (!instance) {
11946          throw new Error('Expected to have an instance by this point. ' + 'This error is likely caused by a bug in React. Please file an issue.');
11947        }
11948  
11949        if (didChange) {
11950          // Merge parent and own context.
11951          // Skip this if we're not updating due to sCU.
11952          // This avoids unnecessarily recomputing memoized values.
11953          var mergedContext = processChildContext(workInProgress, type, previousContext);
11954          instance.__reactInternalMemoizedMergedChildContext = mergedContext; // Replace the old (or empty) context with the new one.
11955          // It is important to unwind the context in the reverse order.
11956  
11957          pop(didPerformWorkStackCursor, workInProgress);
11958          pop(contextStackCursor, workInProgress); // Now push the new context and mark that it has changed.
11959  
11960          push(contextStackCursor, mergedContext, workInProgress);
11961          push(didPerformWorkStackCursor, didChange, workInProgress);
11962        } else {
11963          pop(didPerformWorkStackCursor, workInProgress);
11964          push(didPerformWorkStackCursor, didChange, workInProgress);
11965        }
11966      }
11967    }
11968  
11969    function findCurrentUnmaskedContext(fiber) {
11970      {
11971        // Currently this is only used with renderSubtreeIntoContainer; not sure if it
11972        // makes sense elsewhere
11973        if (!isFiberMounted(fiber) || fiber.tag !== ClassComponent) {
11974          throw new Error('Expected subtree parent to be a mounted class component. ' + 'This error is likely caused by a bug in React. Please file an issue.');
11975        }
11976  
11977        var node = fiber;
11978  
11979        do {
11980          switch (node.tag) {
11981            case HostRoot:
11982              return node.stateNode.context;
11983  
11984            case ClassComponent:
11985              {
11986                var Component = node.type;
11987  
11988                if (isContextProvider(Component)) {
11989                  return node.stateNode.__reactInternalMemoizedMergedChildContext;
11990                }
11991  
11992                break;
11993              }
11994          }
11995  
11996          node = node.return;
11997        } while (node !== null);
11998  
11999        throw new Error('Found unexpected detached subtree parent. ' + 'This error is likely caused by a bug in React. Please file an issue.');
12000      }
12001    }
12002  
12003    var LegacyRoot = 0;
12004    var ConcurrentRoot = 1;
12005  
12006    var syncQueue = null;
12007    var includesLegacySyncCallbacks = false;
12008    var isFlushingSyncQueue = false;
12009    function scheduleSyncCallback(callback) {
12010      // Push this callback into an internal queue. We'll flush these either in
12011      // the next tick, or earlier if something calls `flushSyncCallbackQueue`.
12012      if (syncQueue === null) {
12013        syncQueue = [callback];
12014      } else {
12015        // Push onto existing queue. Don't need to schedule a callback because
12016        // we already scheduled one when we created the queue.
12017        syncQueue.push(callback);
12018      }
12019    }
12020    function scheduleLegacySyncCallback(callback) {
12021      includesLegacySyncCallbacks = true;
12022      scheduleSyncCallback(callback);
12023    }
12024    function flushSyncCallbacksOnlyInLegacyMode() {
12025      // Only flushes the queue if there's a legacy sync callback scheduled.
12026      // TODO: There's only a single type of callback: performSyncOnWorkOnRoot. So
12027      // it might make more sense for the queue to be a list of roots instead of a
12028      // list of generic callbacks. Then we can have two: one for legacy roots, one
12029      // for concurrent roots. And this method would only flush the legacy ones.
12030      if (includesLegacySyncCallbacks) {
12031        flushSyncCallbacks();
12032      }
12033    }
12034    function flushSyncCallbacks() {
12035      if (!isFlushingSyncQueue && syncQueue !== null) {
12036        // Prevent re-entrance.
12037        isFlushingSyncQueue = true;
12038        var i = 0;
12039        var previousUpdatePriority = getCurrentUpdatePriority();
12040  
12041        try {
12042          var isSync = true;
12043          var queue = syncQueue; // TODO: Is this necessary anymore? The only user code that runs in this
12044          // queue is in the render or commit phases.
12045  
12046          setCurrentUpdatePriority(DiscreteEventPriority);
12047  
12048          for (; i < queue.length; i++) {
12049            var callback = queue[i];
12050  
12051            do {
12052              callback = callback(isSync);
12053            } while (callback !== null);
12054          }
12055  
12056          syncQueue = null;
12057          includesLegacySyncCallbacks = false;
12058        } catch (error) {
12059          // If something throws, leave the remaining callbacks on the queue.
12060          if (syncQueue !== null) {
12061            syncQueue = syncQueue.slice(i + 1);
12062          } // Resume flushing in the next tick
12063  
12064  
12065          scheduleCallback(ImmediatePriority, flushSyncCallbacks);
12066          throw error;
12067        } finally {
12068          setCurrentUpdatePriority(previousUpdatePriority);
12069          isFlushingSyncQueue = false;
12070        }
12071      }
12072  
12073      return null;
12074    }
12075  
12076    // TODO: Use the unified fiber stack module instead of this local one?
12077    // Intentionally not using it yet to derisk the initial implementation, because
12078    // the way we push/pop these values is a bit unusual. If there's a mistake, I'd
12079    // rather the ids be wrong than crash the whole reconciler.
12080    var forkStack = [];
12081    var forkStackIndex = 0;
12082    var treeForkProvider = null;
12083    var treeForkCount = 0;
12084    var idStack = [];
12085    var idStackIndex = 0;
12086    var treeContextProvider = null;
12087    var treeContextId = 1;
12088    var treeContextOverflow = '';
12089    function isForkedChild(workInProgress) {
12090      warnIfNotHydrating();
12091      return (workInProgress.flags & Forked) !== NoFlags;
12092    }
12093    function getForksAtLevel(workInProgress) {
12094      warnIfNotHydrating();
12095      return treeForkCount;
12096    }
12097    function getTreeId() {
12098      var overflow = treeContextOverflow;
12099      var idWithLeadingBit = treeContextId;
12100      var id = idWithLeadingBit & ~getLeadingBit(idWithLeadingBit);
12101      return id.toString(32) + overflow;
12102    }
12103    function pushTreeFork(workInProgress, totalChildren) {
12104      // This is called right after we reconcile an array (or iterator) of child
12105      // fibers, because that's the only place where we know how many children in
12106      // the whole set without doing extra work later, or storing addtional
12107      // information on the fiber.
12108      //
12109      // That's why this function is separate from pushTreeId — it's called during
12110      // the render phase of the fork parent, not the child, which is where we push
12111      // the other context values.
12112      //
12113      // In the Fizz implementation this is much simpler because the child is
12114      // rendered in the same callstack as the parent.
12115      //
12116      // It might be better to just add a `forks` field to the Fiber type. It would
12117      // make this module simpler.
12118      warnIfNotHydrating();
12119      forkStack[forkStackIndex++] = treeForkCount;
12120      forkStack[forkStackIndex++] = treeForkProvider;
12121      treeForkProvider = workInProgress;
12122      treeForkCount = totalChildren;
12123    }
12124    function pushTreeId(workInProgress, totalChildren, index) {
12125      warnIfNotHydrating();
12126      idStack[idStackIndex++] = treeContextId;
12127      idStack[idStackIndex++] = treeContextOverflow;
12128      idStack[idStackIndex++] = treeContextProvider;
12129      treeContextProvider = workInProgress;
12130      var baseIdWithLeadingBit = treeContextId;
12131      var baseOverflow = treeContextOverflow; // The leftmost 1 marks the end of the sequence, non-inclusive. It's not part
12132      // of the id; we use it to account for leading 0s.
12133  
12134      var baseLength = getBitLength(baseIdWithLeadingBit) - 1;
12135      var baseId = baseIdWithLeadingBit & ~(1 << baseLength);
12136      var slot = index + 1;
12137      var length = getBitLength(totalChildren) + baseLength; // 30 is the max length we can store without overflowing, taking into
12138      // consideration the leading 1 we use to mark the end of the sequence.
12139  
12140      if (length > 30) {
12141        // We overflowed the bitwise-safe range. Fall back to slower algorithm.
12142        // This branch assumes the length of the base id is greater than 5; it won't
12143        // work for smaller ids, because you need 5 bits per character.
12144        //
12145        // We encode the id in multiple steps: first the base id, then the
12146        // remaining digits.
12147        //
12148        // Each 5 bit sequence corresponds to a single base 32 character. So for
12149        // example, if the current id is 23 bits long, we can convert 20 of those
12150        // bits into a string of 4 characters, with 3 bits left over.
12151        //
12152        // First calculate how many bits in the base id represent a complete
12153        // sequence of characters.
12154        var numberOfOverflowBits = baseLength - baseLength % 5; // Then create a bitmask that selects only those bits.
12155  
12156        var newOverflowBits = (1 << numberOfOverflowBits) - 1; // Select the bits, and convert them to a base 32 string.
12157  
12158        var newOverflow = (baseId & newOverflowBits).toString(32); // Now we can remove those bits from the base id.
12159  
12160        var restOfBaseId = baseId >> numberOfOverflowBits;
12161        var restOfBaseLength = baseLength - numberOfOverflowBits; // Finally, encode the rest of the bits using the normal algorithm. Because
12162        // we made more room, this time it won't overflow.
12163  
12164        var restOfLength = getBitLength(totalChildren) + restOfBaseLength;
12165        var restOfNewBits = slot << restOfBaseLength;
12166        var id = restOfNewBits | restOfBaseId;
12167        var overflow = newOverflow + baseOverflow;
12168        treeContextId = 1 << restOfLength | id;
12169        treeContextOverflow = overflow;
12170      } else {
12171        // Normal path
12172        var newBits = slot << baseLength;
12173  
12174        var _id = newBits | baseId;
12175  
12176        var _overflow = baseOverflow;
12177        treeContextId = 1 << length | _id;
12178        treeContextOverflow = _overflow;
12179      }
12180    }
12181    function pushMaterializedTreeId(workInProgress) {
12182      warnIfNotHydrating(); // This component materialized an id. This will affect any ids that appear
12183      // in its children.
12184  
12185      var returnFiber = workInProgress.return;
12186  
12187      if (returnFiber !== null) {
12188        var numberOfForks = 1;
12189        var slotIndex = 0;
12190        pushTreeFork(workInProgress, numberOfForks);
12191        pushTreeId(workInProgress, numberOfForks, slotIndex);
12192      }
12193    }
12194  
12195    function getBitLength(number) {
12196      return 32 - clz32(number);
12197    }
12198  
12199    function getLeadingBit(id) {
12200      return 1 << getBitLength(id) - 1;
12201    }
12202  
12203    function popTreeContext(workInProgress) {
12204      // Restore the previous values.
12205      // This is a bit more complicated than other context-like modules in Fiber
12206      // because the same Fiber may appear on the stack multiple times and for
12207      // different reasons. We have to keep popping until the work-in-progress is
12208      // no longer at the top of the stack.
12209      while (workInProgress === treeForkProvider) {
12210        treeForkProvider = forkStack[--forkStackIndex];
12211        forkStack[forkStackIndex] = null;
12212        treeForkCount = forkStack[--forkStackIndex];
12213        forkStack[forkStackIndex] = null;
12214      }
12215  
12216      while (workInProgress === treeContextProvider) {
12217        treeContextProvider = idStack[--idStackIndex];
12218        idStack[idStackIndex] = null;
12219        treeContextOverflow = idStack[--idStackIndex];
12220        idStack[idStackIndex] = null;
12221        treeContextId = idStack[--idStackIndex];
12222        idStack[idStackIndex] = null;
12223      }
12224    }
12225    function getSuspendedTreeContext() {
12226      warnIfNotHydrating();
12227  
12228      if (treeContextProvider !== null) {
12229        return {
12230          id: treeContextId,
12231          overflow: treeContextOverflow
12232        };
12233      } else {
12234        return null;
12235      }
12236    }
12237    function restoreSuspendedTreeContext(workInProgress, suspendedContext) {
12238      warnIfNotHydrating();
12239      idStack[idStackIndex++] = treeContextId;
12240      idStack[idStackIndex++] = treeContextOverflow;
12241      idStack[idStackIndex++] = treeContextProvider;
12242      treeContextId = suspendedContext.id;
12243      treeContextOverflow = suspendedContext.overflow;
12244      treeContextProvider = workInProgress;
12245    }
12246  
12247    function warnIfNotHydrating() {
12248      {
12249        if (!getIsHydrating()) {
12250          error('Expected to be hydrating. This is a bug in React. Please file ' + 'an issue.');
12251        }
12252      }
12253    }
12254  
12255    // This may have been an insertion or a hydration.
12256  
12257    var hydrationParentFiber = null;
12258    var nextHydratableInstance = null;
12259    var isHydrating = false; // This flag allows for warning supression when we expect there to be mismatches
12260    // due to earlier mismatches or a suspended fiber.
12261  
12262    var didSuspendOrErrorDEV = false; // Hydration errors that were thrown inside this boundary
12263  
12264    var hydrationErrors = null;
12265  
12266    function warnIfHydrating() {
12267      {
12268        if (isHydrating) {
12269          error('We should not be hydrating here. This is a bug in React. Please file a bug.');
12270        }
12271      }
12272    }
12273  
12274    function markDidThrowWhileHydratingDEV() {
12275      {
12276        didSuspendOrErrorDEV = true;
12277      }
12278    }
12279    function didSuspendOrErrorWhileHydratingDEV() {
12280      {
12281        return didSuspendOrErrorDEV;
12282      }
12283    }
12284  
12285    function enterHydrationState(fiber) {
12286  
12287      var parentInstance = fiber.stateNode.containerInfo;
12288      nextHydratableInstance = getFirstHydratableChildWithinContainer(parentInstance);
12289      hydrationParentFiber = fiber;
12290      isHydrating = true;
12291      hydrationErrors = null;
12292      didSuspendOrErrorDEV = false;
12293      return true;
12294    }
12295  
12296    function reenterHydrationStateFromDehydratedSuspenseInstance(fiber, suspenseInstance, treeContext) {
12297  
12298      nextHydratableInstance = getFirstHydratableChildWithinSuspenseInstance(suspenseInstance);
12299      hydrationParentFiber = fiber;
12300      isHydrating = true;
12301      hydrationErrors = null;
12302      didSuspendOrErrorDEV = false;
12303  
12304      if (treeContext !== null) {
12305        restoreSuspendedTreeContext(fiber, treeContext);
12306      }
12307  
12308      return true;
12309    }
12310  
12311    function warnUnhydratedInstance(returnFiber, instance) {
12312      {
12313        switch (returnFiber.tag) {
12314          case HostRoot:
12315            {
12316              didNotHydrateInstanceWithinContainer(returnFiber.stateNode.containerInfo, instance);
12317              break;
12318            }
12319  
12320          case HostComponent:
12321            {
12322              var isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode;
12323              didNotHydrateInstance(returnFiber.type, returnFiber.memoizedProps, returnFiber.stateNode, instance, // TODO: Delete this argument when we remove the legacy root API.
12324              isConcurrentMode);
12325              break;
12326            }
12327  
12328          case SuspenseComponent:
12329            {
12330              var suspenseState = returnFiber.memoizedState;
12331              if (suspenseState.dehydrated !== null) didNotHydrateInstanceWithinSuspenseInstance(suspenseState.dehydrated, instance);
12332              break;
12333            }
12334        }
12335      }
12336    }
12337  
12338    function deleteHydratableInstance(returnFiber, instance) {
12339      warnUnhydratedInstance(returnFiber, instance);
12340      var childToDelete = createFiberFromHostInstanceForDeletion();
12341      childToDelete.stateNode = instance;
12342      childToDelete.return = returnFiber;
12343      var deletions = returnFiber.deletions;
12344  
12345      if (deletions === null) {
12346        returnFiber.deletions = [childToDelete];
12347        returnFiber.flags |= ChildDeletion;
12348      } else {
12349        deletions.push(childToDelete);
12350      }
12351    }
12352  
12353    function warnNonhydratedInstance(returnFiber, fiber) {
12354      {
12355        if (didSuspendOrErrorDEV) {
12356          // Inside a boundary that already suspended. We're currently rendering the
12357          // siblings of a suspended node. The mismatch may be due to the missing
12358          // data, so it's probably a false positive.
12359          return;
12360        }
12361  
12362        switch (returnFiber.tag) {
12363          case HostRoot:
12364            {
12365              var parentContainer = returnFiber.stateNode.containerInfo;
12366  
12367              switch (fiber.tag) {
12368                case HostComponent:
12369                  var type = fiber.type;
12370                  var props = fiber.pendingProps;
12371                  didNotFindHydratableInstanceWithinContainer(parentContainer, type);
12372                  break;
12373  
12374                case HostText:
12375                  var text = fiber.pendingProps;
12376                  didNotFindHydratableTextInstanceWithinContainer(parentContainer, text);
12377                  break;
12378              }
12379  
12380              break;
12381            }
12382  
12383          case HostComponent:
12384            {
12385              var parentType = returnFiber.type;
12386              var parentProps = returnFiber.memoizedProps;
12387              var parentInstance = returnFiber.stateNode;
12388  
12389              switch (fiber.tag) {
12390                case HostComponent:
12391                  {
12392                    var _type = fiber.type;
12393                    var _props = fiber.pendingProps;
12394                    var isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode;
12395                    didNotFindHydratableInstance(parentType, parentProps, parentInstance, _type, _props, // TODO: Delete this argument when we remove the legacy root API.
12396                    isConcurrentMode);
12397                    break;
12398                  }
12399  
12400                case HostText:
12401                  {
12402                    var _text = fiber.pendingProps;
12403  
12404                    var _isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode;
12405  
12406                    didNotFindHydratableTextInstance(parentType, parentProps, parentInstance, _text, // TODO: Delete this argument when we remove the legacy root API.
12407                    _isConcurrentMode);
12408                    break;
12409                  }
12410              }
12411  
12412              break;
12413            }
12414  
12415          case SuspenseComponent:
12416            {
12417              var suspenseState = returnFiber.memoizedState;
12418              var _parentInstance = suspenseState.dehydrated;
12419              if (_parentInstance !== null) switch (fiber.tag) {
12420                case HostComponent:
12421                  var _type2 = fiber.type;
12422                  var _props2 = fiber.pendingProps;
12423                  didNotFindHydratableInstanceWithinSuspenseInstance(_parentInstance, _type2);
12424                  break;
12425  
12426                case HostText:
12427                  var _text2 = fiber.pendingProps;
12428                  didNotFindHydratableTextInstanceWithinSuspenseInstance(_parentInstance, _text2);
12429                  break;
12430              }
12431              break;
12432            }
12433  
12434          default:
12435            return;
12436        }
12437      }
12438    }
12439  
12440    function insertNonHydratedInstance(returnFiber, fiber) {
12441      fiber.flags = fiber.flags & ~Hydrating | Placement;
12442      warnNonhydratedInstance(returnFiber, fiber);
12443    }
12444  
12445    function tryHydrate(fiber, nextInstance) {
12446      switch (fiber.tag) {
12447        case HostComponent:
12448          {
12449            var type = fiber.type;
12450            var props = fiber.pendingProps;
12451            var instance = canHydrateInstance(nextInstance, type);
12452  
12453            if (instance !== null) {
12454              fiber.stateNode = instance;
12455              hydrationParentFiber = fiber;
12456              nextHydratableInstance = getFirstHydratableChild(instance);
12457              return true;
12458            }
12459  
12460            return false;
12461          }
12462  
12463        case HostText:
12464          {
12465            var text = fiber.pendingProps;
12466            var textInstance = canHydrateTextInstance(nextInstance, text);
12467  
12468            if (textInstance !== null) {
12469              fiber.stateNode = textInstance;
12470              hydrationParentFiber = fiber; // Text Instances don't have children so there's nothing to hydrate.
12471  
12472              nextHydratableInstance = null;
12473              return true;
12474            }
12475  
12476            return false;
12477          }
12478  
12479        case SuspenseComponent:
12480          {
12481            var suspenseInstance = canHydrateSuspenseInstance(nextInstance);
12482  
12483            if (suspenseInstance !== null) {
12484              var suspenseState = {
12485                dehydrated: suspenseInstance,
12486                treeContext: getSuspendedTreeContext(),
12487                retryLane: OffscreenLane
12488              };
12489              fiber.memoizedState = suspenseState; // Store the dehydrated fragment as a child fiber.
12490              // This simplifies the code for getHostSibling and deleting nodes,
12491              // since it doesn't have to consider all Suspense boundaries and
12492              // check if they're dehydrated ones or not.
12493  
12494              var dehydratedFragment = createFiberFromDehydratedFragment(suspenseInstance);
12495              dehydratedFragment.return = fiber;
12496              fiber.child = dehydratedFragment;
12497              hydrationParentFiber = fiber; // While a Suspense Instance does have children, we won't step into
12498              // it during the first pass. Instead, we'll reenter it later.
12499  
12500              nextHydratableInstance = null;
12501              return true;
12502            }
12503  
12504            return false;
12505          }
12506  
12507        default:
12508          return false;
12509      }
12510    }
12511  
12512    function shouldClientRenderOnMismatch(fiber) {
12513      return (fiber.mode & ConcurrentMode) !== NoMode && (fiber.flags & DidCapture) === NoFlags;
12514    }
12515  
12516    function throwOnHydrationMismatch(fiber) {
12517      throw new Error('Hydration failed because the initial UI does not match what was ' + 'rendered on the server.');
12518    }
12519  
12520    function tryToClaimNextHydratableInstance(fiber) {
12521      if (!isHydrating) {
12522        return;
12523      }
12524  
12525      var nextInstance = nextHydratableInstance;
12526  
12527      if (!nextInstance) {
12528        if (shouldClientRenderOnMismatch(fiber)) {
12529          warnNonhydratedInstance(hydrationParentFiber, fiber);
12530          throwOnHydrationMismatch();
12531        } // Nothing to hydrate. Make it an insertion.
12532  
12533  
12534        insertNonHydratedInstance(hydrationParentFiber, fiber);
12535        isHydrating = false;
12536        hydrationParentFiber = fiber;
12537        return;
12538      }
12539  
12540      var firstAttemptedInstance = nextInstance;
12541  
12542      if (!tryHydrate(fiber, nextInstance)) {
12543        if (shouldClientRenderOnMismatch(fiber)) {
12544          warnNonhydratedInstance(hydrationParentFiber, fiber);
12545          throwOnHydrationMismatch();
12546        } // If we can't hydrate this instance let's try the next one.
12547        // We use this as a heuristic. It's based on intuition and not data so it
12548        // might be flawed or unnecessary.
12549  
12550  
12551        nextInstance = getNextHydratableSibling(firstAttemptedInstance);
12552        var prevHydrationParentFiber = hydrationParentFiber;
12553  
12554        if (!nextInstance || !tryHydrate(fiber, nextInstance)) {
12555          // Nothing to hydrate. Make it an insertion.
12556          insertNonHydratedInstance(hydrationParentFiber, fiber);
12557          isHydrating = false;
12558          hydrationParentFiber = fiber;
12559          return;
12560        } // We matched the next one, we'll now assume that the first one was
12561        // superfluous and we'll delete it. Since we can't eagerly delete it
12562        // we'll have to schedule a deletion. To do that, this node needs a dummy
12563        // fiber associated with it.
12564  
12565  
12566        deleteHydratableInstance(prevHydrationParentFiber, firstAttemptedInstance);
12567      }
12568    }
12569  
12570    function prepareToHydrateHostInstance(fiber, rootContainerInstance, hostContext) {
12571  
12572      var instance = fiber.stateNode;
12573      var shouldWarnIfMismatchDev = !didSuspendOrErrorDEV;
12574      var updatePayload = hydrateInstance(instance, fiber.type, fiber.memoizedProps, rootContainerInstance, hostContext, fiber, shouldWarnIfMismatchDev); // TODO: Type this specific to this type of component.
12575  
12576      fiber.updateQueue = updatePayload; // If the update payload indicates that there is a change or if there
12577      // is a new ref we mark this as an update.
12578  
12579      if (updatePayload !== null) {
12580        return true;
12581      }
12582  
12583      return false;
12584    }
12585  
12586    function prepareToHydrateHostTextInstance(fiber) {
12587  
12588      var textInstance = fiber.stateNode;
12589      var textContent = fiber.memoizedProps;
12590      var shouldUpdate = hydrateTextInstance(textInstance, textContent, fiber);
12591  
12592      if (shouldUpdate) {
12593        // We assume that prepareToHydrateHostTextInstance is called in a context where the
12594        // hydration parent is the parent host component of this host text.
12595        var returnFiber = hydrationParentFiber;
12596  
12597        if (returnFiber !== null) {
12598          switch (returnFiber.tag) {
12599            case HostRoot:
12600              {
12601                var parentContainer = returnFiber.stateNode.containerInfo;
12602                var isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode;
12603                didNotMatchHydratedContainerTextInstance(parentContainer, textInstance, textContent, // TODO: Delete this argument when we remove the legacy root API.
12604                isConcurrentMode);
12605                break;
12606              }
12607  
12608            case HostComponent:
12609              {
12610                var parentType = returnFiber.type;
12611                var parentProps = returnFiber.memoizedProps;
12612                var parentInstance = returnFiber.stateNode;
12613  
12614                var _isConcurrentMode2 = (returnFiber.mode & ConcurrentMode) !== NoMode;
12615  
12616                didNotMatchHydratedTextInstance(parentType, parentProps, parentInstance, textInstance, textContent, // TODO: Delete this argument when we remove the legacy root API.
12617                _isConcurrentMode2);
12618                break;
12619              }
12620          }
12621        }
12622      }
12623  
12624      return shouldUpdate;
12625    }
12626  
12627    function prepareToHydrateHostSuspenseInstance(fiber) {
12628  
12629      var suspenseState = fiber.memoizedState;
12630      var suspenseInstance = suspenseState !== null ? suspenseState.dehydrated : null;
12631  
12632      if (!suspenseInstance) {
12633        throw new Error('Expected to have a hydrated suspense instance. ' + 'This error is likely caused by a bug in React. Please file an issue.');
12634      }
12635  
12636      hydrateSuspenseInstance(suspenseInstance, fiber);
12637    }
12638  
12639    function skipPastDehydratedSuspenseInstance(fiber) {
12640  
12641      var suspenseState = fiber.memoizedState;
12642      var suspenseInstance = suspenseState !== null ? suspenseState.dehydrated : null;
12643  
12644      if (!suspenseInstance) {
12645        throw new Error('Expected to have a hydrated suspense instance. ' + 'This error is likely caused by a bug in React. Please file an issue.');
12646      }
12647  
12648      return getNextHydratableInstanceAfterSuspenseInstance(suspenseInstance);
12649    }
12650  
12651    function popToNextHostParent(fiber) {
12652      var parent = fiber.return;
12653  
12654      while (parent !== null && parent.tag !== HostComponent && parent.tag !== HostRoot && parent.tag !== SuspenseComponent) {
12655        parent = parent.return;
12656      }
12657  
12658      hydrationParentFiber = parent;
12659    }
12660  
12661    function popHydrationState(fiber) {
12662  
12663      if (fiber !== hydrationParentFiber) {
12664        // We're deeper than the current hydration context, inside an inserted
12665        // tree.
12666        return false;
12667      }
12668  
12669      if (!isHydrating) {
12670        // If we're not currently hydrating but we're in a hydration context, then
12671        // we were an insertion and now need to pop up reenter hydration of our
12672        // siblings.
12673        popToNextHostParent(fiber);
12674        isHydrating = true;
12675        return false;
12676      } // If we have any remaining hydratable nodes, we need to delete them now.
12677      // We only do this deeper than head and body since they tend to have random
12678      // other nodes in them. We also ignore components with pure text content in
12679      // side of them. We also don't delete anything inside the root container.
12680  
12681  
12682      if (fiber.tag !== HostRoot && (fiber.tag !== HostComponent || shouldDeleteUnhydratedTailInstances(fiber.type) && !shouldSetTextContent(fiber.type, fiber.memoizedProps))) {
12683        var nextInstance = nextHydratableInstance;
12684  
12685        if (nextInstance) {
12686          if (shouldClientRenderOnMismatch(fiber)) {
12687            warnIfUnhydratedTailNodes(fiber);
12688            throwOnHydrationMismatch();
12689          } else {
12690            while (nextInstance) {
12691              deleteHydratableInstance(fiber, nextInstance);
12692              nextInstance = getNextHydratableSibling(nextInstance);
12693            }
12694          }
12695        }
12696      }
12697  
12698      popToNextHostParent(fiber);
12699  
12700      if (fiber.tag === SuspenseComponent) {
12701        nextHydratableInstance = skipPastDehydratedSuspenseInstance(fiber);
12702      } else {
12703        nextHydratableInstance = hydrationParentFiber ? getNextHydratableSibling(fiber.stateNode) : null;
12704      }
12705  
12706      return true;
12707    }
12708  
12709    function hasUnhydratedTailNodes() {
12710      return isHydrating && nextHydratableInstance !== null;
12711    }
12712  
12713    function warnIfUnhydratedTailNodes(fiber) {
12714      var nextInstance = nextHydratableInstance;
12715  
12716      while (nextInstance) {
12717        warnUnhydratedInstance(fiber, nextInstance);
12718        nextInstance = getNextHydratableSibling(nextInstance);
12719      }
12720    }
12721  
12722    function resetHydrationState() {
12723  
12724      hydrationParentFiber = null;
12725      nextHydratableInstance = null;
12726      isHydrating = false;
12727      didSuspendOrErrorDEV = false;
12728    }
12729  
12730    function upgradeHydrationErrorsToRecoverable() {
12731      if (hydrationErrors !== null) {
12732        // Successfully completed a forced client render. The errors that occurred
12733        // during the hydration attempt are now recovered. We will log them in
12734        // commit phase, once the entire tree has finished.
12735        queueRecoverableErrors(hydrationErrors);
12736        hydrationErrors = null;
12737      }
12738    }
12739  
12740    function getIsHydrating() {
12741      return isHydrating;
12742    }
12743  
12744    function queueHydrationError(error) {
12745      if (hydrationErrors === null) {
12746        hydrationErrors = [error];
12747      } else {
12748        hydrationErrors.push(error);
12749      }
12750    }
12751  
12752    var ReactCurrentBatchConfig$1 = ReactSharedInternals.ReactCurrentBatchConfig;
12753    var NoTransition = null;
12754    function requestCurrentTransition() {
12755      return ReactCurrentBatchConfig$1.transition;
12756    }
12757  
12758    var ReactStrictModeWarnings = {
12759      recordUnsafeLifecycleWarnings: function (fiber, instance) {},
12760      flushPendingUnsafeLifecycleWarnings: function () {},
12761      recordLegacyContextWarning: function (fiber, instance) {},
12762      flushLegacyContextWarning: function () {},
12763      discardPendingWarnings: function () {}
12764    };
12765  
12766    {
12767      var findStrictRoot = function (fiber) {
12768        var maybeStrictRoot = null;
12769        var node = fiber;
12770  
12771        while (node !== null) {
12772          if (node.mode & StrictLegacyMode) {
12773            maybeStrictRoot = node;
12774          }
12775  
12776          node = node.return;
12777        }
12778  
12779        return maybeStrictRoot;
12780      };
12781  
12782      var setToSortedString = function (set) {
12783        var array = [];
12784        set.forEach(function (value) {
12785          array.push(value);
12786        });
12787        return array.sort().join(', ');
12788      };
12789  
12790      var pendingComponentWillMountWarnings = [];
12791      var pendingUNSAFE_ComponentWillMountWarnings = [];
12792      var pendingComponentWillReceivePropsWarnings = [];
12793      var pendingUNSAFE_ComponentWillReceivePropsWarnings = [];
12794      var pendingComponentWillUpdateWarnings = [];
12795      var pendingUNSAFE_ComponentWillUpdateWarnings = []; // Tracks components we have already warned about.
12796  
12797      var didWarnAboutUnsafeLifecycles = new Set();
12798  
12799      ReactStrictModeWarnings.recordUnsafeLifecycleWarnings = function (fiber, instance) {
12800        // Dedupe strategy: Warn once per component.
12801        if (didWarnAboutUnsafeLifecycles.has(fiber.type)) {
12802          return;
12803        }
12804  
12805        if (typeof instance.componentWillMount === 'function' && // Don't warn about react-lifecycles-compat polyfilled components.
12806        instance.componentWillMount.__suppressDeprecationWarning !== true) {
12807          pendingComponentWillMountWarnings.push(fiber);
12808        }
12809  
12810        if (fiber.mode & StrictLegacyMode && typeof instance.UNSAFE_componentWillMount === 'function') {
12811          pendingUNSAFE_ComponentWillMountWarnings.push(fiber);
12812        }
12813  
12814        if (typeof instance.componentWillReceiveProps === 'function' && instance.componentWillReceiveProps.__suppressDeprecationWarning !== true) {
12815          pendingComponentWillReceivePropsWarnings.push(fiber);
12816        }
12817  
12818        if (fiber.mode & StrictLegacyMode && typeof instance.UNSAFE_componentWillReceiveProps === 'function') {
12819          pendingUNSAFE_ComponentWillReceivePropsWarnings.push(fiber);
12820        }
12821  
12822        if (typeof instance.componentWillUpdate === 'function' && instance.componentWillUpdate.__suppressDeprecationWarning !== true) {
12823          pendingComponentWillUpdateWarnings.push(fiber);
12824        }
12825  
12826        if (fiber.mode & StrictLegacyMode && typeof instance.UNSAFE_componentWillUpdate === 'function') {
12827          pendingUNSAFE_ComponentWillUpdateWarnings.push(fiber);
12828        }
12829      };
12830  
12831      ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings = function () {
12832        // We do an initial pass to gather component names
12833        var componentWillMountUniqueNames = new Set();
12834  
12835        if (pendingComponentWillMountWarnings.length > 0) {
12836          pendingComponentWillMountWarnings.forEach(function (fiber) {
12837            componentWillMountUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
12838            didWarnAboutUnsafeLifecycles.add(fiber.type);
12839          });
12840          pendingComponentWillMountWarnings = [];
12841        }
12842  
12843        var UNSAFE_componentWillMountUniqueNames = new Set();
12844  
12845        if (pendingUNSAFE_ComponentWillMountWarnings.length > 0) {
12846          pendingUNSAFE_ComponentWillMountWarnings.forEach(function (fiber) {
12847            UNSAFE_componentWillMountUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
12848            didWarnAboutUnsafeLifecycles.add(fiber.type);
12849          });
12850          pendingUNSAFE_ComponentWillMountWarnings = [];
12851        }
12852  
12853        var componentWillReceivePropsUniqueNames = new Set();
12854  
12855        if (pendingComponentWillReceivePropsWarnings.length > 0) {
12856          pendingComponentWillReceivePropsWarnings.forEach(function (fiber) {
12857            componentWillReceivePropsUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
12858            didWarnAboutUnsafeLifecycles.add(fiber.type);
12859          });
12860          pendingComponentWillReceivePropsWarnings = [];
12861        }
12862  
12863        var UNSAFE_componentWillReceivePropsUniqueNames = new Set();
12864  
12865        if (pendingUNSAFE_ComponentWillReceivePropsWarnings.length > 0) {
12866          pendingUNSAFE_ComponentWillReceivePropsWarnings.forEach(function (fiber) {
12867            UNSAFE_componentWillReceivePropsUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
12868            didWarnAboutUnsafeLifecycles.add(fiber.type);
12869          });
12870          pendingUNSAFE_ComponentWillReceivePropsWarnings = [];
12871        }
12872  
12873        var componentWillUpdateUniqueNames = new Set();
12874  
12875        if (pendingComponentWillUpdateWarnings.length > 0) {
12876          pendingComponentWillUpdateWarnings.forEach(function (fiber) {
12877            componentWillUpdateUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
12878            didWarnAboutUnsafeLifecycles.add(fiber.type);
12879          });
12880          pendingComponentWillUpdateWarnings = [];
12881        }
12882  
12883        var UNSAFE_componentWillUpdateUniqueNames = new Set();
12884  
12885        if (pendingUNSAFE_ComponentWillUpdateWarnings.length > 0) {
12886          pendingUNSAFE_ComponentWillUpdateWarnings.forEach(function (fiber) {
12887            UNSAFE_componentWillUpdateUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
12888            didWarnAboutUnsafeLifecycles.add(fiber.type);
12889          });
12890          pendingUNSAFE_ComponentWillUpdateWarnings = [];
12891        } // Finally, we flush all the warnings
12892        // UNSAFE_ ones before the deprecated ones, since they'll be 'louder'
12893  
12894  
12895        if (UNSAFE_componentWillMountUniqueNames.size > 0) {
12896          var sortedNames = setToSortedString(UNSAFE_componentWillMountUniqueNames);
12897  
12898          error('Using UNSAFE_componentWillMount in strict mode is not recommended and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move code with side effects to componentDidMount, and set initial state in the constructor.\n' + '\nPlease update the following components: %s', sortedNames);
12899        }
12900  
12901        if (UNSAFE_componentWillReceivePropsUniqueNames.size > 0) {
12902          var _sortedNames = setToSortedString(UNSAFE_componentWillReceivePropsUniqueNames);
12903  
12904          error('Using UNSAFE_componentWillReceiveProps in strict mode is not recommended ' + 'and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + "* If you're updating state whenever props change, " + 'refactor your code to use memoization techniques or move it to ' + 'static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state\n' + '\nPlease update the following components: %s', _sortedNames);
12905        }
12906  
12907        if (UNSAFE_componentWillUpdateUniqueNames.size > 0) {
12908          var _sortedNames2 = setToSortedString(UNSAFE_componentWillUpdateUniqueNames);
12909  
12910          error('Using UNSAFE_componentWillUpdate in strict mode is not recommended ' + 'and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + '\nPlease update the following components: %s', _sortedNames2);
12911        }
12912  
12913        if (componentWillMountUniqueNames.size > 0) {
12914          var _sortedNames3 = setToSortedString(componentWillMountUniqueNames);
12915  
12916          warn('componentWillMount has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move code with side effects to componentDidMount, and set initial state in the constructor.\n' + '* Rename componentWillMount to UNSAFE_componentWillMount to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames3);
12917        }
12918  
12919        if (componentWillReceivePropsUniqueNames.size > 0) {
12920          var _sortedNames4 = setToSortedString(componentWillReceivePropsUniqueNames);
12921  
12922          warn('componentWillReceiveProps has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + "* If you're updating state whenever props change, refactor your " + 'code to use memoization techniques or move it to ' + 'static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state\n' + '* Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames4);
12923        }
12924  
12925        if (componentWillUpdateUniqueNames.size > 0) {
12926          var _sortedNames5 = setToSortedString(componentWillUpdateUniqueNames);
12927  
12928          warn('componentWillUpdate has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + '* Rename componentWillUpdate to UNSAFE_componentWillUpdate to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames5);
12929        }
12930      };
12931  
12932      var pendingLegacyContextWarning = new Map(); // Tracks components we have already warned about.
12933  
12934      var didWarnAboutLegacyContext = new Set();
12935  
12936      ReactStrictModeWarnings.recordLegacyContextWarning = function (fiber, instance) {
12937        var strictRoot = findStrictRoot(fiber);
12938  
12939        if (strictRoot === null) {
12940          error('Expected to find a StrictMode component in a strict mode tree. ' + 'This error is likely caused by a bug in React. Please file an issue.');
12941  
12942          return;
12943        } // Dedup strategy: Warn once per component.
12944  
12945  
12946        if (didWarnAboutLegacyContext.has(fiber.type)) {
12947          return;
12948        }
12949  
12950        var warningsForRoot = pendingLegacyContextWarning.get(strictRoot);
12951  
12952        if (fiber.type.contextTypes != null || fiber.type.childContextTypes != null || instance !== null && typeof instance.getChildContext === 'function') {
12953          if (warningsForRoot === undefined) {
12954            warningsForRoot = [];
12955            pendingLegacyContextWarning.set(strictRoot, warningsForRoot);
12956          }
12957  
12958          warningsForRoot.push(fiber);
12959        }
12960      };
12961  
12962      ReactStrictModeWarnings.flushLegacyContextWarning = function () {
12963        pendingLegacyContextWarning.forEach(function (fiberArray, strictRoot) {
12964          if (fiberArray.length === 0) {
12965            return;
12966          }
12967  
12968          var firstFiber = fiberArray[0];
12969          var uniqueNames = new Set();
12970          fiberArray.forEach(function (fiber) {
12971            uniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
12972            didWarnAboutLegacyContext.add(fiber.type);
12973          });
12974          var sortedNames = setToSortedString(uniqueNames);
12975  
12976          try {
12977            setCurrentFiber(firstFiber);
12978  
12979            error('Legacy context API has been detected within a strict-mode tree.' + '\n\nThe old API will be supported in all 16.x releases, but applications ' + 'using it should migrate to the new version.' + '\n\nPlease update the following components: %s' + '\n\nLearn more about this warning here: https://reactjs.org/link/legacy-context', sortedNames);
12980          } finally {
12981            resetCurrentFiber();
12982          }
12983        });
12984      };
12985  
12986      ReactStrictModeWarnings.discardPendingWarnings = function () {
12987        pendingComponentWillMountWarnings = [];
12988        pendingUNSAFE_ComponentWillMountWarnings = [];
12989        pendingComponentWillReceivePropsWarnings = [];
12990        pendingUNSAFE_ComponentWillReceivePropsWarnings = [];
12991        pendingComponentWillUpdateWarnings = [];
12992        pendingUNSAFE_ComponentWillUpdateWarnings = [];
12993        pendingLegacyContextWarning = new Map();
12994      };
12995    }
12996  
12997    var didWarnAboutMaps;
12998    var didWarnAboutGenerators;
12999    var didWarnAboutStringRefs;
13000    var ownerHasKeyUseWarning;
13001    var ownerHasFunctionTypeWarning;
13002  
13003    var warnForMissingKey = function (child, returnFiber) {};
13004  
13005    {
13006      didWarnAboutMaps = false;
13007      didWarnAboutGenerators = false;
13008      didWarnAboutStringRefs = {};
13009      /**
13010       * Warn if there's no key explicitly set on dynamic arrays of children or
13011       * object keys are not valid. This allows us to keep track of children between
13012       * updates.
13013       */
13014  
13015      ownerHasKeyUseWarning = {};
13016      ownerHasFunctionTypeWarning = {};
13017  
13018      warnForMissingKey = function (child, returnFiber) {
13019        if (child === null || typeof child !== 'object') {
13020          return;
13021        }
13022  
13023        if (!child._store || child._store.validated || child.key != null) {
13024          return;
13025        }
13026  
13027        if (typeof child._store !== 'object') {
13028          throw new Error('React Component in warnForMissingKey should have a _store. ' + 'This error is likely caused by a bug in React. Please file an issue.');
13029        }
13030  
13031        child._store.validated = true;
13032        var componentName = getComponentNameFromFiber(returnFiber) || 'Component';
13033  
13034        if (ownerHasKeyUseWarning[componentName]) {
13035          return;
13036        }
13037  
13038        ownerHasKeyUseWarning[componentName] = true;
13039  
13040        error('Each child in a list should have a unique ' + '"key" prop. See https://reactjs.org/link/warning-keys for ' + 'more information.');
13041      };
13042    }
13043  
13044    function isReactClass(type) {
13045      return type.prototype && type.prototype.isReactComponent;
13046    }
13047  
13048    function coerceRef(returnFiber, current, element) {
13049      var mixedRef = element.ref;
13050  
13051      if (mixedRef !== null && typeof mixedRef !== 'function' && typeof mixedRef !== 'object') {
13052        {
13053          // TODO: Clean this up once we turn on the string ref warning for
13054          // everyone, because the strict mode case will no longer be relevant
13055          if ((returnFiber.mode & StrictLegacyMode || warnAboutStringRefs) && // We warn in ReactElement.js if owner and self are equal for string refs
13056          // because these cannot be automatically converted to an arrow function
13057          // using a codemod. Therefore, we don't have to warn about string refs again.
13058          !(element._owner && element._self && element._owner.stateNode !== element._self) && // Will already throw with "Function components cannot have string refs"
13059          !(element._owner && element._owner.tag !== ClassComponent) && // Will already warn with "Function components cannot be given refs"
13060          !(typeof element.type === 'function' && !isReactClass(element.type)) && // Will already throw with "Element ref was specified as a string (someStringRef) but no owner was set"
13061          element._owner) {
13062            var componentName = getComponentNameFromFiber(returnFiber) || 'Component';
13063  
13064            if (!didWarnAboutStringRefs[componentName]) {
13065              {
13066                error('Component "%s" contains the string ref "%s". Support for string refs ' + 'will be removed in a future major release. We recommend using ' + 'useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', componentName, mixedRef);
13067              }
13068  
13069              didWarnAboutStringRefs[componentName] = true;
13070            }
13071          }
13072        }
13073  
13074        if (element._owner) {
13075          var owner = element._owner;
13076          var inst;
13077  
13078          if (owner) {
13079            var ownerFiber = owner;
13080  
13081            if (ownerFiber.tag !== ClassComponent) {
13082              throw new Error('Function components cannot have string refs. ' + 'We recommend using useRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref');
13083            }
13084  
13085            inst = ownerFiber.stateNode;
13086          }
13087  
13088          if (!inst) {
13089            throw new Error("Missing owner for string ref " + mixedRef + ". This error is likely caused by a " + 'bug in React. Please file an issue.');
13090          } // Assigning this to a const so Flow knows it won't change in the closure
13091  
13092  
13093          var resolvedInst = inst;
13094  
13095          {
13096            checkPropStringCoercion(mixedRef, 'ref');
13097          }
13098  
13099          var stringRef = '' + mixedRef; // Check if previous string ref matches new string ref
13100  
13101          if (current !== null && current.ref !== null && typeof current.ref === 'function' && current.ref._stringRef === stringRef) {
13102            return current.ref;
13103          }
13104  
13105          var ref = function (value) {
13106            var refs = resolvedInst.refs;
13107  
13108            if (value === null) {
13109              delete refs[stringRef];
13110            } else {
13111              refs[stringRef] = value;
13112            }
13113          };
13114  
13115          ref._stringRef = stringRef;
13116          return ref;
13117        } else {
13118          if (typeof mixedRef !== 'string') {
13119            throw new Error('Expected ref to be a function, a string, an object returned by React.createRef(), or null.');
13120          }
13121  
13122          if (!element._owner) {
13123            throw new Error("Element ref was specified as a string (" + mixedRef + ") but no owner was set. This could happen for one of" + ' the following reasons:\n' + '1. You may be adding a ref to a function component\n' + "2. You may be adding a ref to a component that was not created inside a component's render method\n" + '3. You have multiple copies of React loaded\n' + 'See https://reactjs.org/link/refs-must-have-owner for more information.');
13124          }
13125        }
13126      }
13127  
13128      return mixedRef;
13129    }
13130  
13131    function throwOnInvalidObjectType(returnFiber, newChild) {
13132      var childString = Object.prototype.toString.call(newChild);
13133      throw new Error("Objects are not valid as a React child (found: " + (childString === '[object Object]' ? 'object with keys {' + Object.keys(newChild).join(', ') + '}' : childString) + "). " + 'If you meant to render a collection of children, use an array ' + 'instead.');
13134    }
13135  
13136    function warnOnFunctionType(returnFiber) {
13137      {
13138        var componentName = getComponentNameFromFiber(returnFiber) || 'Component';
13139  
13140        if (ownerHasFunctionTypeWarning[componentName]) {
13141          return;
13142        }
13143  
13144        ownerHasFunctionTypeWarning[componentName] = true;
13145  
13146        error('Functions are not valid as a React child. This may happen if ' + 'you return a Component instead of <Component /> from render. ' + 'Or maybe you meant to call this function rather than return it.');
13147      }
13148    }
13149  
13150    function resolveLazy(lazyType) {
13151      var payload = lazyType._payload;
13152      var init = lazyType._init;
13153      return init(payload);
13154    } // This wrapper function exists because I expect to clone the code in each path
13155    // to be able to optimize each path individually by branching early. This needs
13156    // a compiler or we can do it manually. Helpers that don't need this branching
13157    // live outside of this function.
13158  
13159  
13160    function ChildReconciler(shouldTrackSideEffects) {
13161      function deleteChild(returnFiber, childToDelete) {
13162        if (!shouldTrackSideEffects) {
13163          // Noop.
13164          return;
13165        }
13166  
13167        var deletions = returnFiber.deletions;
13168  
13169        if (deletions === null) {
13170          returnFiber.deletions = [childToDelete];
13171          returnFiber.flags |= ChildDeletion;
13172        } else {
13173          deletions.push(childToDelete);
13174        }
13175      }
13176  
13177      function deleteRemainingChildren(returnFiber, currentFirstChild) {
13178        if (!shouldTrackSideEffects) {
13179          // Noop.
13180          return null;
13181        } // TODO: For the shouldClone case, this could be micro-optimized a bit by
13182        // assuming that after the first child we've already added everything.
13183  
13184  
13185        var childToDelete = currentFirstChild;
13186  
13187        while (childToDelete !== null) {
13188          deleteChild(returnFiber, childToDelete);
13189          childToDelete = childToDelete.sibling;
13190        }
13191  
13192        return null;
13193      }
13194  
13195      function mapRemainingChildren(returnFiber, currentFirstChild) {
13196        // Add the remaining children to a temporary map so that we can find them by
13197        // keys quickly. Implicit (null) keys get added to this set with their index
13198        // instead.
13199        var existingChildren = new Map();
13200        var existingChild = currentFirstChild;
13201  
13202        while (existingChild !== null) {
13203          if (existingChild.key !== null) {
13204            existingChildren.set(existingChild.key, existingChild);
13205          } else {
13206            existingChildren.set(existingChild.index, existingChild);
13207          }
13208  
13209          existingChild = existingChild.sibling;
13210        }
13211  
13212        return existingChildren;
13213      }
13214  
13215      function useFiber(fiber, pendingProps) {
13216        // We currently set sibling to null and index to 0 here because it is easy
13217        // to forget to do before returning it. E.g. for the single child case.
13218        var clone = createWorkInProgress(fiber, pendingProps);
13219        clone.index = 0;
13220        clone.sibling = null;
13221        return clone;
13222      }
13223  
13224      function placeChild(newFiber, lastPlacedIndex, newIndex) {
13225        newFiber.index = newIndex;
13226  
13227        if (!shouldTrackSideEffects) {
13228          // During hydration, the useId algorithm needs to know which fibers are
13229          // part of a list of children (arrays, iterators).
13230          newFiber.flags |= Forked;
13231          return lastPlacedIndex;
13232        }
13233  
13234        var current = newFiber.alternate;
13235  
13236        if (current !== null) {
13237          var oldIndex = current.index;
13238  
13239          if (oldIndex < lastPlacedIndex) {
13240            // This is a move.
13241            newFiber.flags |= Placement;
13242            return lastPlacedIndex;
13243          } else {
13244            // This item can stay in place.
13245            return oldIndex;
13246          }
13247        } else {
13248          // This is an insertion.
13249          newFiber.flags |= Placement;
13250          return lastPlacedIndex;
13251        }
13252      }
13253  
13254      function placeSingleChild(newFiber) {
13255        // This is simpler for the single child case. We only need to do a
13256        // placement for inserting new children.
13257        if (shouldTrackSideEffects && newFiber.alternate === null) {
13258          newFiber.flags |= Placement;
13259        }
13260  
13261        return newFiber;
13262      }
13263  
13264      function updateTextNode(returnFiber, current, textContent, lanes) {
13265        if (current === null || current.tag !== HostText) {
13266          // Insert
13267          var created = createFiberFromText(textContent, returnFiber.mode, lanes);
13268          created.return = returnFiber;
13269          return created;
13270        } else {
13271          // Update
13272          var existing = useFiber(current, textContent);
13273          existing.return = returnFiber;
13274          return existing;
13275        }
13276      }
13277  
13278      function updateElement(returnFiber, current, element, lanes) {
13279        var elementType = element.type;
13280  
13281        if (elementType === REACT_FRAGMENT_TYPE) {
13282          return updateFragment(returnFiber, current, element.props.children, lanes, element.key);
13283        }
13284  
13285        if (current !== null) {
13286          if (current.elementType === elementType || ( // Keep this check inline so it only runs on the false path:
13287           isCompatibleFamilyForHotReloading(current, element) ) || // Lazy types should reconcile their resolved type.
13288          // We need to do this after the Hot Reloading check above,
13289          // because hot reloading has different semantics than prod because
13290          // it doesn't resuspend. So we can't let the call below suspend.
13291          typeof elementType === 'object' && elementType !== null && elementType.$$typeof === REACT_LAZY_TYPE && resolveLazy(elementType) === current.type) {
13292            // Move based on index
13293            var existing = useFiber(current, element.props);
13294            existing.ref = coerceRef(returnFiber, current, element);
13295            existing.return = returnFiber;
13296  
13297            {
13298              existing._debugSource = element._source;
13299              existing._debugOwner = element._owner;
13300            }
13301  
13302            return existing;
13303          }
13304        } // Insert
13305  
13306  
13307        var created = createFiberFromElement(element, returnFiber.mode, lanes);
13308        created.ref = coerceRef(returnFiber, current, element);
13309        created.return = returnFiber;
13310        return created;
13311      }
13312  
13313      function updatePortal(returnFiber, current, portal, lanes) {
13314        if (current === null || current.tag !== HostPortal || current.stateNode.containerInfo !== portal.containerInfo || current.stateNode.implementation !== portal.implementation) {
13315          // Insert
13316          var created = createFiberFromPortal(portal, returnFiber.mode, lanes);
13317          created.return = returnFiber;
13318          return created;
13319        } else {
13320          // Update
13321          var existing = useFiber(current, portal.children || []);
13322          existing.return = returnFiber;
13323          return existing;
13324        }
13325      }
13326  
13327      function updateFragment(returnFiber, current, fragment, lanes, key) {
13328        if (current === null || current.tag !== Fragment) {
13329          // Insert
13330          var created = createFiberFromFragment(fragment, returnFiber.mode, lanes, key);
13331          created.return = returnFiber;
13332          return created;
13333        } else {
13334          // Update
13335          var existing = useFiber(current, fragment);
13336          existing.return = returnFiber;
13337          return existing;
13338        }
13339      }
13340  
13341      function createChild(returnFiber, newChild, lanes) {
13342        if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') {
13343          // Text nodes don't have keys. If the previous node is implicitly keyed
13344          // we can continue to replace it without aborting even if it is not a text
13345          // node.
13346          var created = createFiberFromText('' + newChild, returnFiber.mode, lanes);
13347          created.return = returnFiber;
13348          return created;
13349        }
13350  
13351        if (typeof newChild === 'object' && newChild !== null) {
13352          switch (newChild.$$typeof) {
13353            case REACT_ELEMENT_TYPE:
13354              {
13355                var _created = createFiberFromElement(newChild, returnFiber.mode, lanes);
13356  
13357                _created.ref = coerceRef(returnFiber, null, newChild);
13358                _created.return = returnFiber;
13359                return _created;
13360              }
13361  
13362            case REACT_PORTAL_TYPE:
13363              {
13364                var _created2 = createFiberFromPortal(newChild, returnFiber.mode, lanes);
13365  
13366                _created2.return = returnFiber;
13367                return _created2;
13368              }
13369  
13370            case REACT_LAZY_TYPE:
13371              {
13372                var payload = newChild._payload;
13373                var init = newChild._init;
13374                return createChild(returnFiber, init(payload), lanes);
13375              }
13376          }
13377  
13378          if (isArray(newChild) || getIteratorFn(newChild)) {
13379            var _created3 = createFiberFromFragment(newChild, returnFiber.mode, lanes, null);
13380  
13381            _created3.return = returnFiber;
13382            return _created3;
13383          }
13384  
13385          throwOnInvalidObjectType(returnFiber, newChild);
13386        }
13387  
13388        {
13389          if (typeof newChild === 'function') {
13390            warnOnFunctionType(returnFiber);
13391          }
13392        }
13393  
13394        return null;
13395      }
13396  
13397      function updateSlot(returnFiber, oldFiber, newChild, lanes) {
13398        // Update the fiber if the keys match, otherwise return null.
13399        var key = oldFiber !== null ? oldFiber.key : null;
13400  
13401        if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') {
13402          // Text nodes don't have keys. If the previous node is implicitly keyed
13403          // we can continue to replace it without aborting even if it is not a text
13404          // node.
13405          if (key !== null) {
13406            return null;
13407          }
13408  
13409          return updateTextNode(returnFiber, oldFiber, '' + newChild, lanes);
13410        }
13411  
13412        if (typeof newChild === 'object' && newChild !== null) {
13413          switch (newChild.$$typeof) {
13414            case REACT_ELEMENT_TYPE:
13415              {
13416                if (newChild.key === key) {
13417                  return updateElement(returnFiber, oldFiber, newChild, lanes);
13418                } else {
13419                  return null;
13420                }
13421              }
13422  
13423            case REACT_PORTAL_TYPE:
13424              {
13425                if (newChild.key === key) {
13426                  return updatePortal(returnFiber, oldFiber, newChild, lanes);
13427                } else {
13428                  return null;
13429                }
13430              }
13431  
13432            case REACT_LAZY_TYPE:
13433              {
13434                var payload = newChild._payload;
13435                var init = newChild._init;
13436                return updateSlot(returnFiber, oldFiber, init(payload), lanes);
13437              }
13438          }
13439  
13440          if (isArray(newChild) || getIteratorFn(newChild)) {
13441            if (key !== null) {
13442              return null;
13443            }
13444  
13445            return updateFragment(returnFiber, oldFiber, newChild, lanes, null);
13446          }
13447  
13448          throwOnInvalidObjectType(returnFiber, newChild);
13449        }
13450  
13451        {
13452          if (typeof newChild === 'function') {
13453            warnOnFunctionType(returnFiber);
13454          }
13455        }
13456  
13457        return null;
13458      }
13459  
13460      function updateFromMap(existingChildren, returnFiber, newIdx, newChild, lanes) {
13461        if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') {
13462          // Text nodes don't have keys, so we neither have to check the old nor
13463          // new node for the key. If both are text nodes, they match.
13464          var matchedFiber = existingChildren.get(newIdx) || null;
13465          return updateTextNode(returnFiber, matchedFiber, '' + newChild, lanes);
13466        }
13467  
13468        if (typeof newChild === 'object' && newChild !== null) {
13469          switch (newChild.$$typeof) {
13470            case REACT_ELEMENT_TYPE:
13471              {
13472                var _matchedFiber = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null;
13473  
13474                return updateElement(returnFiber, _matchedFiber, newChild, lanes);
13475              }
13476  
13477            case REACT_PORTAL_TYPE:
13478              {
13479                var _matchedFiber2 = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null;
13480  
13481                return updatePortal(returnFiber, _matchedFiber2, newChild, lanes);
13482              }
13483  
13484            case REACT_LAZY_TYPE:
13485              var payload = newChild._payload;
13486              var init = newChild._init;
13487              return updateFromMap(existingChildren, returnFiber, newIdx, init(payload), lanes);
13488          }
13489  
13490          if (isArray(newChild) || getIteratorFn(newChild)) {
13491            var _matchedFiber3 = existingChildren.get(newIdx) || null;
13492  
13493            return updateFragment(returnFiber, _matchedFiber3, newChild, lanes, null);
13494          }
13495  
13496          throwOnInvalidObjectType(returnFiber, newChild);
13497        }
13498  
13499        {
13500          if (typeof newChild === 'function') {
13501            warnOnFunctionType(returnFiber);
13502          }
13503        }
13504  
13505        return null;
13506      }
13507      /**
13508       * Warns if there is a duplicate or missing key
13509       */
13510  
13511  
13512      function warnOnInvalidKey(child, knownKeys, returnFiber) {
13513        {
13514          if (typeof child !== 'object' || child === null) {
13515            return knownKeys;
13516          }
13517  
13518          switch (child.$$typeof) {
13519            case REACT_ELEMENT_TYPE:
13520            case REACT_PORTAL_TYPE:
13521              warnForMissingKey(child, returnFiber);
13522              var key = child.key;
13523  
13524              if (typeof key !== 'string') {
13525                break;
13526              }
13527  
13528              if (knownKeys === null) {
13529                knownKeys = new Set();
13530                knownKeys.add(key);
13531                break;
13532              }
13533  
13534              if (!knownKeys.has(key)) {
13535                knownKeys.add(key);
13536                break;
13537              }
13538  
13539              error('Encountered two children with the same key, `%s`. ' + 'Keys should be unique so that components maintain their identity ' + 'across updates. Non-unique keys may cause children to be ' + 'duplicated and/or omitted — the behavior is unsupported and ' + 'could change in a future version.', key);
13540  
13541              break;
13542  
13543            case REACT_LAZY_TYPE:
13544              var payload = child._payload;
13545              var init = child._init;
13546              warnOnInvalidKey(init(payload), knownKeys, returnFiber);
13547              break;
13548          }
13549        }
13550  
13551        return knownKeys;
13552      }
13553  
13554      function reconcileChildrenArray(returnFiber, currentFirstChild, newChildren, lanes) {
13555        // This algorithm can't optimize by searching from both ends since we
13556        // don't have backpointers on fibers. I'm trying to see how far we can get
13557        // with that model. If it ends up not being worth the tradeoffs, we can
13558        // add it later.
13559        // Even with a two ended optimization, we'd want to optimize for the case
13560        // where there are few changes and brute force the comparison instead of
13561        // going for the Map. It'd like to explore hitting that path first in
13562        // forward-only mode and only go for the Map once we notice that we need
13563        // lots of look ahead. This doesn't handle reversal as well as two ended
13564        // search but that's unusual. Besides, for the two ended optimization to
13565        // work on Iterables, we'd need to copy the whole set.
13566        // In this first iteration, we'll just live with hitting the bad case
13567        // (adding everything to a Map) in for every insert/move.
13568        // If you change this code, also update reconcileChildrenIterator() which
13569        // uses the same algorithm.
13570        {
13571          // First, validate keys.
13572          var knownKeys = null;
13573  
13574          for (var i = 0; i < newChildren.length; i++) {
13575            var child = newChildren[i];
13576            knownKeys = warnOnInvalidKey(child, knownKeys, returnFiber);
13577          }
13578        }
13579  
13580        var resultingFirstChild = null;
13581        var previousNewFiber = null;
13582        var oldFiber = currentFirstChild;
13583        var lastPlacedIndex = 0;
13584        var newIdx = 0;
13585        var nextOldFiber = null;
13586  
13587        for (; oldFiber !== null && newIdx < newChildren.length; newIdx++) {
13588          if (oldFiber.index > newIdx) {
13589            nextOldFiber = oldFiber;
13590            oldFiber = null;
13591          } else {
13592            nextOldFiber = oldFiber.sibling;
13593          }
13594  
13595          var newFiber = updateSlot(returnFiber, oldFiber, newChildren[newIdx], lanes);
13596  
13597          if (newFiber === null) {
13598            // TODO: This breaks on empty slots like null children. That's
13599            // unfortunate because it triggers the slow path all the time. We need
13600            // a better way to communicate whether this was a miss or null,
13601            // boolean, undefined, etc.
13602            if (oldFiber === null) {
13603              oldFiber = nextOldFiber;
13604            }
13605  
13606            break;
13607          }
13608  
13609          if (shouldTrackSideEffects) {
13610            if (oldFiber && newFiber.alternate === null) {
13611              // We matched the slot, but we didn't reuse the existing fiber, so we
13612              // need to delete the existing child.
13613              deleteChild(returnFiber, oldFiber);
13614            }
13615          }
13616  
13617          lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx);
13618  
13619          if (previousNewFiber === null) {
13620            // TODO: Move out of the loop. This only happens for the first run.
13621            resultingFirstChild = newFiber;
13622          } else {
13623            // TODO: Defer siblings if we're not at the right index for this slot.
13624            // I.e. if we had null values before, then we want to defer this
13625            // for each null value. However, we also don't want to call updateSlot
13626            // with the previous one.
13627            previousNewFiber.sibling = newFiber;
13628          }
13629  
13630          previousNewFiber = newFiber;
13631          oldFiber = nextOldFiber;
13632        }
13633  
13634        if (newIdx === newChildren.length) {
13635          // We've reached the end of the new children. We can delete the rest.
13636          deleteRemainingChildren(returnFiber, oldFiber);
13637  
13638          if (getIsHydrating()) {
13639            var numberOfForks = newIdx;
13640            pushTreeFork(returnFiber, numberOfForks);
13641          }
13642  
13643          return resultingFirstChild;
13644        }
13645  
13646        if (oldFiber === null) {
13647          // If we don't have any more existing children we can choose a fast path
13648          // since the rest will all be insertions.
13649          for (; newIdx < newChildren.length; newIdx++) {
13650            var _newFiber = createChild(returnFiber, newChildren[newIdx], lanes);
13651  
13652            if (_newFiber === null) {
13653              continue;
13654            }
13655  
13656            lastPlacedIndex = placeChild(_newFiber, lastPlacedIndex, newIdx);
13657  
13658            if (previousNewFiber === null) {
13659              // TODO: Move out of the loop. This only happens for the first run.
13660              resultingFirstChild = _newFiber;
13661            } else {
13662              previousNewFiber.sibling = _newFiber;
13663            }
13664  
13665            previousNewFiber = _newFiber;
13666          }
13667  
13668          if (getIsHydrating()) {
13669            var _numberOfForks = newIdx;
13670            pushTreeFork(returnFiber, _numberOfForks);
13671          }
13672  
13673          return resultingFirstChild;
13674        } // Add all children to a key map for quick lookups.
13675  
13676  
13677        var existingChildren = mapRemainingChildren(returnFiber, oldFiber); // Keep scanning and use the map to restore deleted items as moves.
13678  
13679        for (; newIdx < newChildren.length; newIdx++) {
13680          var _newFiber2 = updateFromMap(existingChildren, returnFiber, newIdx, newChildren[newIdx], lanes);
13681  
13682          if (_newFiber2 !== null) {
13683            if (shouldTrackSideEffects) {
13684              if (_newFiber2.alternate !== null) {
13685                // The new fiber is a work in progress, but if there exists a
13686                // current, that means that we reused the fiber. We need to delete
13687                // it from the child list so that we don't add it to the deletion
13688                // list.
13689                existingChildren.delete(_newFiber2.key === null ? newIdx : _newFiber2.key);
13690              }
13691            }
13692  
13693            lastPlacedIndex = placeChild(_newFiber2, lastPlacedIndex, newIdx);
13694  
13695            if (previousNewFiber === null) {
13696              resultingFirstChild = _newFiber2;
13697            } else {
13698              previousNewFiber.sibling = _newFiber2;
13699            }
13700  
13701            previousNewFiber = _newFiber2;
13702          }
13703        }
13704  
13705        if (shouldTrackSideEffects) {
13706          // Any existing children that weren't consumed above were deleted. We need
13707          // to add them to the deletion list.
13708          existingChildren.forEach(function (child) {
13709            return deleteChild(returnFiber, child);
13710          });
13711        }
13712  
13713        if (getIsHydrating()) {
13714          var _numberOfForks2 = newIdx;
13715          pushTreeFork(returnFiber, _numberOfForks2);
13716        }
13717  
13718        return resultingFirstChild;
13719      }
13720  
13721      function reconcileChildrenIterator(returnFiber, currentFirstChild, newChildrenIterable, lanes) {
13722        // This is the same implementation as reconcileChildrenArray(),
13723        // but using the iterator instead.
13724        var iteratorFn = getIteratorFn(newChildrenIterable);
13725  
13726        if (typeof iteratorFn !== 'function') {
13727          throw new Error('An object is not an iterable. This error is likely caused by a bug in ' + 'React. Please file an issue.');
13728        }
13729  
13730        {
13731          // We don't support rendering Generators because it's a mutation.
13732          // See https://github.com/facebook/react/issues/12995
13733          if (typeof Symbol === 'function' && // $FlowFixMe Flow doesn't know about toStringTag
13734          newChildrenIterable[Symbol.toStringTag] === 'Generator') {
13735            if (!didWarnAboutGenerators) {
13736              error('Using Generators as children is unsupported and will likely yield ' + 'unexpected results because enumerating a generator mutates it. ' + 'You may convert it to an array with `Array.from()` or the ' + '`[...spread]` operator before rendering. Keep in mind ' + 'you might need to polyfill these features for older browsers.');
13737            }
13738  
13739            didWarnAboutGenerators = true;
13740          } // Warn about using Maps as children
13741  
13742  
13743          if (newChildrenIterable.entries === iteratorFn) {
13744            if (!didWarnAboutMaps) {
13745              error('Using Maps as children is not supported. ' + 'Use an array of keyed ReactElements instead.');
13746            }
13747  
13748            didWarnAboutMaps = true;
13749          } // First, validate keys.
13750          // We'll get a different iterator later for the main pass.
13751  
13752  
13753          var _newChildren = iteratorFn.call(newChildrenIterable);
13754  
13755          if (_newChildren) {
13756            var knownKeys = null;
13757  
13758            var _step = _newChildren.next();
13759  
13760            for (; !_step.done; _step = _newChildren.next()) {
13761              var child = _step.value;
13762              knownKeys = warnOnInvalidKey(child, knownKeys, returnFiber);
13763            }
13764          }
13765        }
13766  
13767        var newChildren = iteratorFn.call(newChildrenIterable);
13768  
13769        if (newChildren == null) {
13770          throw new Error('An iterable object provided no iterator.');
13771        }
13772  
13773        var resultingFirstChild = null;
13774        var previousNewFiber = null;
13775        var oldFiber = currentFirstChild;
13776        var lastPlacedIndex = 0;
13777        var newIdx = 0;
13778        var nextOldFiber = null;
13779        var step = newChildren.next();
13780  
13781        for (; oldFiber !== null && !step.done; newIdx++, step = newChildren.next()) {
13782          if (oldFiber.index > newIdx) {
13783            nextOldFiber = oldFiber;
13784            oldFiber = null;
13785          } else {
13786            nextOldFiber = oldFiber.sibling;
13787          }
13788  
13789          var newFiber = updateSlot(returnFiber, oldFiber, step.value, lanes);
13790  
13791          if (newFiber === null) {
13792            // TODO: This breaks on empty slots like null children. That's
13793            // unfortunate because it triggers the slow path all the time. We need
13794            // a better way to communicate whether this was a miss or null,
13795            // boolean, undefined, etc.
13796            if (oldFiber === null) {
13797              oldFiber = nextOldFiber;
13798            }
13799  
13800            break;
13801          }
13802  
13803          if (shouldTrackSideEffects) {
13804            if (oldFiber && newFiber.alternate === null) {
13805              // We matched the slot, but we didn't reuse the existing fiber, so we
13806              // need to delete the existing child.
13807              deleteChild(returnFiber, oldFiber);
13808            }
13809          }
13810  
13811          lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx);
13812  
13813          if (previousNewFiber === null) {
13814            // TODO: Move out of the loop. This only happens for the first run.
13815            resultingFirstChild = newFiber;
13816          } else {
13817            // TODO: Defer siblings if we're not at the right index for this slot.
13818            // I.e. if we had null values before, then we want to defer this
13819            // for each null value. However, we also don't want to call updateSlot
13820            // with the previous one.
13821            previousNewFiber.sibling = newFiber;
13822          }
13823  
13824          previousNewFiber = newFiber;
13825          oldFiber = nextOldFiber;
13826        }
13827  
13828        if (step.done) {
13829          // We've reached the end of the new children. We can delete the rest.
13830          deleteRemainingChildren(returnFiber, oldFiber);
13831  
13832          if (getIsHydrating()) {
13833            var numberOfForks = newIdx;
13834            pushTreeFork(returnFiber, numberOfForks);
13835          }
13836  
13837          return resultingFirstChild;
13838        }
13839  
13840        if (oldFiber === null) {
13841          // If we don't have any more existing children we can choose a fast path
13842          // since the rest will all be insertions.
13843          for (; !step.done; newIdx++, step = newChildren.next()) {
13844            var _newFiber3 = createChild(returnFiber, step.value, lanes);
13845  
13846            if (_newFiber3 === null) {
13847              continue;
13848            }
13849  
13850            lastPlacedIndex = placeChild(_newFiber3, lastPlacedIndex, newIdx);
13851  
13852            if (previousNewFiber === null) {
13853              // TODO: Move out of the loop. This only happens for the first run.
13854              resultingFirstChild = _newFiber3;
13855            } else {
13856              previousNewFiber.sibling = _newFiber3;
13857            }
13858  
13859            previousNewFiber = _newFiber3;
13860          }
13861  
13862          if (getIsHydrating()) {
13863            var _numberOfForks3 = newIdx;
13864            pushTreeFork(returnFiber, _numberOfForks3);
13865          }
13866  
13867          return resultingFirstChild;
13868        } // Add all children to a key map for quick lookups.
13869  
13870  
13871        var existingChildren = mapRemainingChildren(returnFiber, oldFiber); // Keep scanning and use the map to restore deleted items as moves.
13872  
13873        for (; !step.done; newIdx++, step = newChildren.next()) {
13874          var _newFiber4 = updateFromMap(existingChildren, returnFiber, newIdx, step.value, lanes);
13875  
13876          if (_newFiber4 !== null) {
13877            if (shouldTrackSideEffects) {
13878              if (_newFiber4.alternate !== null) {
13879                // The new fiber is a work in progress, but if there exists a
13880                // current, that means that we reused the fiber. We need to delete
13881                // it from the child list so that we don't add it to the deletion
13882                // list.
13883                existingChildren.delete(_newFiber4.key === null ? newIdx : _newFiber4.key);
13884              }
13885            }
13886  
13887            lastPlacedIndex = placeChild(_newFiber4, lastPlacedIndex, newIdx);
13888  
13889            if (previousNewFiber === null) {
13890              resultingFirstChild = _newFiber4;
13891            } else {
13892              previousNewFiber.sibling = _newFiber4;
13893            }
13894  
13895            previousNewFiber = _newFiber4;
13896          }
13897        }
13898  
13899        if (shouldTrackSideEffects) {
13900          // Any existing children that weren't consumed above were deleted. We need
13901          // to add them to the deletion list.
13902          existingChildren.forEach(function (child) {
13903            return deleteChild(returnFiber, child);
13904          });
13905        }
13906  
13907        if (getIsHydrating()) {
13908          var _numberOfForks4 = newIdx;
13909          pushTreeFork(returnFiber, _numberOfForks4);
13910        }
13911  
13912        return resultingFirstChild;
13913      }
13914  
13915      function reconcileSingleTextNode(returnFiber, currentFirstChild, textContent, lanes) {
13916        // There's no need to check for keys on text nodes since we don't have a
13917        // way to define them.
13918        if (currentFirstChild !== null && currentFirstChild.tag === HostText) {
13919          // We already have an existing node so let's just update it and delete
13920          // the rest.
13921          deleteRemainingChildren(returnFiber, currentFirstChild.sibling);
13922          var existing = useFiber(currentFirstChild, textContent);
13923          existing.return = returnFiber;
13924          return existing;
13925        } // The existing first child is not a text node so we need to create one
13926        // and delete the existing ones.
13927  
13928  
13929        deleteRemainingChildren(returnFiber, currentFirstChild);
13930        var created = createFiberFromText(textContent, returnFiber.mode, lanes);
13931        created.return = returnFiber;
13932        return created;
13933      }
13934  
13935      function reconcileSingleElement(returnFiber, currentFirstChild, element, lanes) {
13936        var key = element.key;
13937        var child = currentFirstChild;
13938  
13939        while (child !== null) {
13940          // TODO: If key === null and child.key === null, then this only applies to
13941          // the first item in the list.
13942          if (child.key === key) {
13943            var elementType = element.type;
13944  
13945            if (elementType === REACT_FRAGMENT_TYPE) {
13946              if (child.tag === Fragment) {
13947                deleteRemainingChildren(returnFiber, child.sibling);
13948                var existing = useFiber(child, element.props.children);
13949                existing.return = returnFiber;
13950  
13951                {
13952                  existing._debugSource = element._source;
13953                  existing._debugOwner = element._owner;
13954                }
13955  
13956                return existing;
13957              }
13958            } else {
13959              if (child.elementType === elementType || ( // Keep this check inline so it only runs on the false path:
13960               isCompatibleFamilyForHotReloading(child, element) ) || // Lazy types should reconcile their resolved type.
13961              // We need to do this after the Hot Reloading check above,
13962              // because hot reloading has different semantics than prod because
13963              // it doesn't resuspend. So we can't let the call below suspend.
13964              typeof elementType === 'object' && elementType !== null && elementType.$$typeof === REACT_LAZY_TYPE && resolveLazy(elementType) === child.type) {
13965                deleteRemainingChildren(returnFiber, child.sibling);
13966  
13967                var _existing = useFiber(child, element.props);
13968  
13969                _existing.ref = coerceRef(returnFiber, child, element);
13970                _existing.return = returnFiber;
13971  
13972                {
13973                  _existing._debugSource = element._source;
13974                  _existing._debugOwner = element._owner;
13975                }
13976  
13977                return _existing;
13978              }
13979            } // Didn't match.
13980  
13981  
13982            deleteRemainingChildren(returnFiber, child);
13983            break;
13984          } else {
13985            deleteChild(returnFiber, child);
13986          }
13987  
13988          child = child.sibling;
13989        }
13990  
13991        if (element.type === REACT_FRAGMENT_TYPE) {
13992          var created = createFiberFromFragment(element.props.children, returnFiber.mode, lanes, element.key);
13993          created.return = returnFiber;
13994          return created;
13995        } else {
13996          var _created4 = createFiberFromElement(element, returnFiber.mode, lanes);
13997  
13998          _created4.ref = coerceRef(returnFiber, currentFirstChild, element);
13999          _created4.return = returnFiber;
14000          return _created4;
14001        }
14002      }
14003  
14004      function reconcileSinglePortal(returnFiber, currentFirstChild, portal, lanes) {
14005        var key = portal.key;
14006        var child = currentFirstChild;
14007  
14008        while (child !== null) {
14009          // TODO: If key === null and child.key === null, then this only applies to
14010          // the first item in the list.
14011          if (child.key === key) {
14012            if (child.tag === HostPortal && child.stateNode.containerInfo === portal.containerInfo && child.stateNode.implementation === portal.implementation) {
14013              deleteRemainingChildren(returnFiber, child.sibling);
14014              var existing = useFiber(child, portal.children || []);
14015              existing.return = returnFiber;
14016              return existing;
14017            } else {
14018              deleteRemainingChildren(returnFiber, child);
14019              break;
14020            }
14021          } else {
14022            deleteChild(returnFiber, child);
14023          }
14024  
14025          child = child.sibling;
14026        }
14027  
14028        var created = createFiberFromPortal(portal, returnFiber.mode, lanes);
14029        created.return = returnFiber;
14030        return created;
14031      } // This API will tag the children with the side-effect of the reconciliation
14032      // itself. They will be added to the side-effect list as we pass through the
14033      // children and the parent.
14034  
14035  
14036      function reconcileChildFibers(returnFiber, currentFirstChild, newChild, lanes) {
14037        // This function is not recursive.
14038        // If the top level item is an array, we treat it as a set of children,
14039        // not as a fragment. Nested arrays on the other hand will be treated as
14040        // fragment nodes. Recursion happens at the normal flow.
14041        // Handle top level unkeyed fragments as if they were arrays.
14042        // This leads to an ambiguity between <>{[...]}</> and <>...</>.
14043        // We treat the ambiguous cases above the same.
14044        var isUnkeyedTopLevelFragment = typeof newChild === 'object' && newChild !== null && newChild.type === REACT_FRAGMENT_TYPE && newChild.key === null;
14045  
14046        if (isUnkeyedTopLevelFragment) {
14047          newChild = newChild.props.children;
14048        } // Handle object types
14049  
14050  
14051        if (typeof newChild === 'object' && newChild !== null) {
14052          switch (newChild.$$typeof) {
14053            case REACT_ELEMENT_TYPE:
14054              return placeSingleChild(reconcileSingleElement(returnFiber, currentFirstChild, newChild, lanes));
14055  
14056            case REACT_PORTAL_TYPE:
14057              return placeSingleChild(reconcileSinglePortal(returnFiber, currentFirstChild, newChild, lanes));
14058  
14059            case REACT_LAZY_TYPE:
14060              var payload = newChild._payload;
14061              var init = newChild._init; // TODO: This function is supposed to be non-recursive.
14062  
14063              return reconcileChildFibers(returnFiber, currentFirstChild, init(payload), lanes);
14064          }
14065  
14066          if (isArray(newChild)) {
14067            return reconcileChildrenArray(returnFiber, currentFirstChild, newChild, lanes);
14068          }
14069  
14070          if (getIteratorFn(newChild)) {
14071            return reconcileChildrenIterator(returnFiber, currentFirstChild, newChild, lanes);
14072          }
14073  
14074          throwOnInvalidObjectType(returnFiber, newChild);
14075        }
14076  
14077        if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') {
14078          return placeSingleChild(reconcileSingleTextNode(returnFiber, currentFirstChild, '' + newChild, lanes));
14079        }
14080  
14081        {
14082          if (typeof newChild === 'function') {
14083            warnOnFunctionType(returnFiber);
14084          }
14085        } // Remaining cases are all treated as empty.
14086  
14087  
14088        return deleteRemainingChildren(returnFiber, currentFirstChild);
14089      }
14090  
14091      return reconcileChildFibers;
14092    }
14093  
14094    var reconcileChildFibers = ChildReconciler(true);
14095    var mountChildFibers = ChildReconciler(false);
14096    function cloneChildFibers(current, workInProgress) {
14097      if (current !== null && workInProgress.child !== current.child) {
14098        throw new Error('Resuming work not yet implemented.');
14099      }
14100  
14101      if (workInProgress.child === null) {
14102        return;
14103      }
14104  
14105      var currentChild = workInProgress.child;
14106      var newChild = createWorkInProgress(currentChild, currentChild.pendingProps);
14107      workInProgress.child = newChild;
14108      newChild.return = workInProgress;
14109  
14110      while (currentChild.sibling !== null) {
14111        currentChild = currentChild.sibling;
14112        newChild = newChild.sibling = createWorkInProgress(currentChild, currentChild.pendingProps);
14113        newChild.return = workInProgress;
14114      }
14115  
14116      newChild.sibling = null;
14117    } // Reset a workInProgress child set to prepare it for a second pass.
14118  
14119    function resetChildFibers(workInProgress, lanes) {
14120      var child = workInProgress.child;
14121  
14122      while (child !== null) {
14123        resetWorkInProgress(child, lanes);
14124        child = child.sibling;
14125      }
14126    }
14127  
14128    var valueCursor = createCursor(null);
14129    var rendererSigil;
14130  
14131    {
14132      // Use this to detect multiple renderers using the same context
14133      rendererSigil = {};
14134    }
14135  
14136    var currentlyRenderingFiber = null;
14137    var lastContextDependency = null;
14138    var lastFullyObservedContext = null;
14139    var isDisallowedContextReadInDEV = false;
14140    function resetContextDependencies() {
14141      // This is called right before React yields execution, to ensure `readContext`
14142      // cannot be called outside the render phase.
14143      currentlyRenderingFiber = null;
14144      lastContextDependency = null;
14145      lastFullyObservedContext = null;
14146  
14147      {
14148        isDisallowedContextReadInDEV = false;
14149      }
14150    }
14151    function enterDisallowedContextReadInDEV() {
14152      {
14153        isDisallowedContextReadInDEV = true;
14154      }
14155    }
14156    function exitDisallowedContextReadInDEV() {
14157      {
14158        isDisallowedContextReadInDEV = false;
14159      }
14160    }
14161    function pushProvider(providerFiber, context, nextValue) {
14162      {
14163        push(valueCursor, context._currentValue, providerFiber);
14164        context._currentValue = nextValue;
14165  
14166        {
14167          if (context._currentRenderer !== undefined && context._currentRenderer !== null && context._currentRenderer !== rendererSigil) {
14168            error('Detected multiple renderers concurrently rendering the ' + 'same context provider. This is currently unsupported.');
14169          }
14170  
14171          context._currentRenderer = rendererSigil;
14172        }
14173      }
14174    }
14175    function popProvider(context, providerFiber) {
14176      var currentValue = valueCursor.current;
14177      pop(valueCursor, providerFiber);
14178  
14179      {
14180        {
14181          context._currentValue = currentValue;
14182        }
14183      }
14184    }
14185    function scheduleContextWorkOnParentPath(parent, renderLanes, propagationRoot) {
14186      // Update the child lanes of all the ancestors, including the alternates.
14187      var node = parent;
14188  
14189      while (node !== null) {
14190        var alternate = node.alternate;
14191  
14192        if (!isSubsetOfLanes(node.childLanes, renderLanes)) {
14193          node.childLanes = mergeLanes(node.childLanes, renderLanes);
14194  
14195          if (alternate !== null) {
14196            alternate.childLanes = mergeLanes(alternate.childLanes, renderLanes);
14197          }
14198        } else if (alternate !== null && !isSubsetOfLanes(alternate.childLanes, renderLanes)) {
14199          alternate.childLanes = mergeLanes(alternate.childLanes, renderLanes);
14200        }
14201  
14202        if (node === propagationRoot) {
14203          break;
14204        }
14205  
14206        node = node.return;
14207      }
14208  
14209      {
14210        if (node !== propagationRoot) {
14211          error('Expected to find the propagation root when scheduling context work. ' + 'This error is likely caused by a bug in React. Please file an issue.');
14212        }
14213      }
14214    }
14215    function propagateContextChange(workInProgress, context, renderLanes) {
14216      {
14217        propagateContextChange_eager(workInProgress, context, renderLanes);
14218      }
14219    }
14220  
14221    function propagateContextChange_eager(workInProgress, context, renderLanes) {
14222  
14223      var fiber = workInProgress.child;
14224  
14225      if (fiber !== null) {
14226        // Set the return pointer of the child to the work-in-progress fiber.
14227        fiber.return = workInProgress;
14228      }
14229  
14230      while (fiber !== null) {
14231        var nextFiber = void 0; // Visit this fiber.
14232  
14233        var list = fiber.dependencies;
14234  
14235        if (list !== null) {
14236          nextFiber = fiber.child;
14237          var dependency = list.firstContext;
14238  
14239          while (dependency !== null) {
14240            // Check if the context matches.
14241            if (dependency.context === context) {
14242              // Match! Schedule an update on this fiber.
14243              if (fiber.tag === ClassComponent) {
14244                // Schedule a force update on the work-in-progress.
14245                var lane = pickArbitraryLane(renderLanes);
14246                var update = createUpdate(NoTimestamp, lane);
14247                update.tag = ForceUpdate; // TODO: Because we don't have a work-in-progress, this will add the
14248                // update to the current fiber, too, which means it will persist even if
14249                // this render is thrown away. Since it's a race condition, not sure it's
14250                // worth fixing.
14251                // Inlined `enqueueUpdate` to remove interleaved update check
14252  
14253                var updateQueue = fiber.updateQueue;
14254  
14255                if (updateQueue === null) ; else {
14256                  var sharedQueue = updateQueue.shared;
14257                  var pending = sharedQueue.pending;
14258  
14259                  if (pending === null) {
14260                    // This is the first update. Create a circular list.
14261                    update.next = update;
14262                  } else {
14263                    update.next = pending.next;
14264                    pending.next = update;
14265                  }
14266  
14267                  sharedQueue.pending = update;
14268                }
14269              }
14270  
14271              fiber.lanes = mergeLanes(fiber.lanes, renderLanes);
14272              var alternate = fiber.alternate;
14273  
14274              if (alternate !== null) {
14275                alternate.lanes = mergeLanes(alternate.lanes, renderLanes);
14276              }
14277  
14278              scheduleContextWorkOnParentPath(fiber.return, renderLanes, workInProgress); // Mark the updated lanes on the list, too.
14279  
14280              list.lanes = mergeLanes(list.lanes, renderLanes); // Since we already found a match, we can stop traversing the
14281              // dependency list.
14282  
14283              break;
14284            }
14285  
14286            dependency = dependency.next;
14287          }
14288        } else if (fiber.tag === ContextProvider) {
14289          // Don't scan deeper if this is a matching provider
14290          nextFiber = fiber.type === workInProgress.type ? null : fiber.child;
14291        } else if (fiber.tag === DehydratedFragment) {
14292          // If a dehydrated suspense boundary is in this subtree, we don't know
14293          // if it will have any context consumers in it. The best we can do is
14294          // mark it as having updates.
14295          var parentSuspense = fiber.return;
14296  
14297          if (parentSuspense === null) {
14298            throw new Error('We just came from a parent so we must have had a parent. This is a bug in React.');
14299          }
14300  
14301          parentSuspense.lanes = mergeLanes(parentSuspense.lanes, renderLanes);
14302          var _alternate = parentSuspense.alternate;
14303  
14304          if (_alternate !== null) {
14305            _alternate.lanes = mergeLanes(_alternate.lanes, renderLanes);
14306          } // This is intentionally passing this fiber as the parent
14307          // because we want to schedule this fiber as having work
14308          // on its children. We'll use the childLanes on
14309          // this fiber to indicate that a context has changed.
14310  
14311  
14312          scheduleContextWorkOnParentPath(parentSuspense, renderLanes, workInProgress);
14313          nextFiber = fiber.sibling;
14314        } else {
14315          // Traverse down.
14316          nextFiber = fiber.child;
14317        }
14318  
14319        if (nextFiber !== null) {
14320          // Set the return pointer of the child to the work-in-progress fiber.
14321          nextFiber.return = fiber;
14322        } else {
14323          // No child. Traverse to next sibling.
14324          nextFiber = fiber;
14325  
14326          while (nextFiber !== null) {
14327            if (nextFiber === workInProgress) {
14328              // We're back to the root of this subtree. Exit.
14329              nextFiber = null;
14330              break;
14331            }
14332  
14333            var sibling = nextFiber.sibling;
14334  
14335            if (sibling !== null) {
14336              // Set the return pointer of the sibling to the work-in-progress fiber.
14337              sibling.return = nextFiber.return;
14338              nextFiber = sibling;
14339              break;
14340            } // No more siblings. Traverse up.
14341  
14342  
14343            nextFiber = nextFiber.return;
14344          }
14345        }
14346  
14347        fiber = nextFiber;
14348      }
14349    }
14350    function prepareToReadContext(workInProgress, renderLanes) {
14351      currentlyRenderingFiber = workInProgress;
14352      lastContextDependency = null;
14353      lastFullyObservedContext = null;
14354      var dependencies = workInProgress.dependencies;
14355  
14356      if (dependencies !== null) {
14357        {
14358          var firstContext = dependencies.firstContext;
14359  
14360          if (firstContext !== null) {
14361            if (includesSomeLane(dependencies.lanes, renderLanes)) {
14362              // Context list has a pending update. Mark that this fiber performed work.
14363              markWorkInProgressReceivedUpdate();
14364            } // Reset the work-in-progress list
14365  
14366  
14367            dependencies.firstContext = null;
14368          }
14369        }
14370      }
14371    }
14372    function readContext(context) {
14373      {
14374        // This warning would fire if you read context inside a Hook like useMemo.
14375        // Unlike the class check below, it's not enforced in production for perf.
14376        if (isDisallowedContextReadInDEV) {
14377          error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().');
14378        }
14379      }
14380  
14381      var value =  context._currentValue ;
14382  
14383      if (lastFullyObservedContext === context) ; else {
14384        var contextItem = {
14385          context: context,
14386          memoizedValue: value,
14387          next: null
14388        };
14389  
14390        if (lastContextDependency === null) {
14391          if (currentlyRenderingFiber === null) {
14392            throw new Error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().');
14393          } // This is the first dependency for this component. Create a new list.
14394  
14395  
14396          lastContextDependency = contextItem;
14397          currentlyRenderingFiber.dependencies = {
14398            lanes: NoLanes,
14399            firstContext: contextItem
14400          };
14401        } else {
14402          // Append a new context item.
14403          lastContextDependency = lastContextDependency.next = contextItem;
14404        }
14405      }
14406  
14407      return value;
14408    }
14409  
14410    // render. When this render exits, either because it finishes or because it is
14411    // interrupted, the interleaved updates will be transferred onto the main part
14412    // of the queue.
14413  
14414    var concurrentQueues = null;
14415    function pushConcurrentUpdateQueue(queue) {
14416      if (concurrentQueues === null) {
14417        concurrentQueues = [queue];
14418      } else {
14419        concurrentQueues.push(queue);
14420      }
14421    }
14422    function finishQueueingConcurrentUpdates() {
14423      // Transfer the interleaved updates onto the main queue. Each queue has a
14424      // `pending` field and an `interleaved` field. When they are not null, they
14425      // point to the last node in a circular linked list. We need to append the
14426      // interleaved list to the end of the pending list by joining them into a
14427      // single, circular list.
14428      if (concurrentQueues !== null) {
14429        for (var i = 0; i < concurrentQueues.length; i++) {
14430          var queue = concurrentQueues[i];
14431          var lastInterleavedUpdate = queue.interleaved;
14432  
14433          if (lastInterleavedUpdate !== null) {
14434            queue.interleaved = null;
14435            var firstInterleavedUpdate = lastInterleavedUpdate.next;
14436            var lastPendingUpdate = queue.pending;
14437  
14438            if (lastPendingUpdate !== null) {
14439              var firstPendingUpdate = lastPendingUpdate.next;
14440              lastPendingUpdate.next = firstInterleavedUpdate;
14441              lastInterleavedUpdate.next = firstPendingUpdate;
14442            }
14443  
14444            queue.pending = lastInterleavedUpdate;
14445          }
14446        }
14447  
14448        concurrentQueues = null;
14449      }
14450    }
14451    function enqueueConcurrentHookUpdate(fiber, queue, update, lane) {
14452      var interleaved = queue.interleaved;
14453  
14454      if (interleaved === null) {
14455        // This is the first update. Create a circular list.
14456        update.next = update; // At the end of the current render, this queue's interleaved updates will
14457        // be transferred to the pending queue.
14458  
14459        pushConcurrentUpdateQueue(queue);
14460      } else {
14461        update.next = interleaved.next;
14462        interleaved.next = update;
14463      }
14464  
14465      queue.interleaved = update;
14466      return markUpdateLaneFromFiberToRoot(fiber, lane);
14467    }
14468    function enqueueConcurrentHookUpdateAndEagerlyBailout(fiber, queue, update, lane) {
14469      var interleaved = queue.interleaved;
14470  
14471      if (interleaved === null) {
14472        // This is the first update. Create a circular list.
14473        update.next = update; // At the end of the current render, this queue's interleaved updates will
14474        // be transferred to the pending queue.
14475  
14476        pushConcurrentUpdateQueue(queue);
14477      } else {
14478        update.next = interleaved.next;
14479        interleaved.next = update;
14480      }
14481  
14482      queue.interleaved = update;
14483    }
14484    function enqueueConcurrentClassUpdate(fiber, queue, update, lane) {
14485      var interleaved = queue.interleaved;
14486  
14487      if (interleaved === null) {
14488        // This is the first update. Create a circular list.
14489        update.next = update; // At the end of the current render, this queue's interleaved updates will
14490        // be transferred to the pending queue.
14491  
14492        pushConcurrentUpdateQueue(queue);
14493      } else {
14494        update.next = interleaved.next;
14495        interleaved.next = update;
14496      }
14497  
14498      queue.interleaved = update;
14499      return markUpdateLaneFromFiberToRoot(fiber, lane);
14500    }
14501    function enqueueConcurrentRenderForLane(fiber, lane) {
14502      return markUpdateLaneFromFiberToRoot(fiber, lane);
14503    } // Calling this function outside this module should only be done for backwards
14504    // compatibility and should always be accompanied by a warning.
14505  
14506    var unsafe_markUpdateLaneFromFiberToRoot = markUpdateLaneFromFiberToRoot;
14507  
14508    function markUpdateLaneFromFiberToRoot(sourceFiber, lane) {
14509      // Update the source fiber's lanes
14510      sourceFiber.lanes = mergeLanes(sourceFiber.lanes, lane);
14511      var alternate = sourceFiber.alternate;
14512  
14513      if (alternate !== null) {
14514        alternate.lanes = mergeLanes(alternate.lanes, lane);
14515      }
14516  
14517      {
14518        if (alternate === null && (sourceFiber.flags & (Placement | Hydrating)) !== NoFlags) {
14519          warnAboutUpdateOnNotYetMountedFiberInDEV(sourceFiber);
14520        }
14521      } // Walk the parent path to the root and update the child lanes.
14522  
14523  
14524      var node = sourceFiber;
14525      var parent = sourceFiber.return;
14526  
14527      while (parent !== null) {
14528        parent.childLanes = mergeLanes(parent.childLanes, lane);
14529        alternate = parent.alternate;
14530  
14531        if (alternate !== null) {
14532          alternate.childLanes = mergeLanes(alternate.childLanes, lane);
14533        } else {
14534          {
14535            if ((parent.flags & (Placement | Hydrating)) !== NoFlags) {
14536              warnAboutUpdateOnNotYetMountedFiberInDEV(sourceFiber);
14537            }
14538          }
14539        }
14540  
14541        node = parent;
14542        parent = parent.return;
14543      }
14544  
14545      if (node.tag === HostRoot) {
14546        var root = node.stateNode;
14547        return root;
14548      } else {
14549        return null;
14550      }
14551    }
14552  
14553    var UpdateState = 0;
14554    var ReplaceState = 1;
14555    var ForceUpdate = 2;
14556    var CaptureUpdate = 3; // Global state that is reset at the beginning of calling `processUpdateQueue`.
14557    // It should only be read right after calling `processUpdateQueue`, via
14558    // `checkHasForceUpdateAfterProcessing`.
14559  
14560    var hasForceUpdate = false;
14561    var didWarnUpdateInsideUpdate;
14562    var currentlyProcessingQueue;
14563  
14564    {
14565      didWarnUpdateInsideUpdate = false;
14566      currentlyProcessingQueue = null;
14567    }
14568  
14569    function initializeUpdateQueue(fiber) {
14570      var queue = {
14571        baseState: fiber.memoizedState,
14572        firstBaseUpdate: null,
14573        lastBaseUpdate: null,
14574        shared: {
14575          pending: null,
14576          interleaved: null,
14577          lanes: NoLanes
14578        },
14579        effects: null
14580      };
14581      fiber.updateQueue = queue;
14582    }
14583    function cloneUpdateQueue(current, workInProgress) {
14584      // Clone the update queue from current. Unless it's already a clone.
14585      var queue = workInProgress.updateQueue;
14586      var currentQueue = current.updateQueue;
14587  
14588      if (queue === currentQueue) {
14589        var clone = {
14590          baseState: currentQueue.baseState,
14591          firstBaseUpdate: currentQueue.firstBaseUpdate,
14592          lastBaseUpdate: currentQueue.lastBaseUpdate,
14593          shared: currentQueue.shared,
14594          effects: currentQueue.effects
14595        };
14596        workInProgress.updateQueue = clone;
14597      }
14598    }
14599    function createUpdate(eventTime, lane) {
14600      var update = {
14601        eventTime: eventTime,
14602        lane: lane,
14603        tag: UpdateState,
14604        payload: null,
14605        callback: null,
14606        next: null
14607      };
14608      return update;
14609    }
14610    function enqueueUpdate(fiber, update, lane) {
14611      var updateQueue = fiber.updateQueue;
14612  
14613      if (updateQueue === null) {
14614        // Only occurs if the fiber has been unmounted.
14615        return null;
14616      }
14617  
14618      var sharedQueue = updateQueue.shared;
14619  
14620      {
14621        if (currentlyProcessingQueue === sharedQueue && !didWarnUpdateInsideUpdate) {
14622          error('An update (setState, replaceState, or forceUpdate) was scheduled ' + 'from inside an update function. Update functions should be pure, ' + 'with zero side-effects. Consider using componentDidUpdate or a ' + 'callback.');
14623  
14624          didWarnUpdateInsideUpdate = true;
14625        }
14626      }
14627  
14628      if (isUnsafeClassRenderPhaseUpdate()) {
14629        // This is an unsafe render phase update. Add directly to the update
14630        // queue so we can process it immediately during the current render.
14631        var pending = sharedQueue.pending;
14632  
14633        if (pending === null) {
14634          // This is the first update. Create a circular list.
14635          update.next = update;
14636        } else {
14637          update.next = pending.next;
14638          pending.next = update;
14639        }
14640  
14641        sharedQueue.pending = update; // Update the childLanes even though we're most likely already rendering
14642        // this fiber. This is for backwards compatibility in the case where you
14643        // update a different component during render phase than the one that is
14644        // currently renderings (a pattern that is accompanied by a warning).
14645  
14646        return unsafe_markUpdateLaneFromFiberToRoot(fiber, lane);
14647      } else {
14648        return enqueueConcurrentClassUpdate(fiber, sharedQueue, update, lane);
14649      }
14650    }
14651    function entangleTransitions(root, fiber, lane) {
14652      var updateQueue = fiber.updateQueue;
14653  
14654      if (updateQueue === null) {
14655        // Only occurs if the fiber has been unmounted.
14656        return;
14657      }
14658  
14659      var sharedQueue = updateQueue.shared;
14660  
14661      if (isTransitionLane(lane)) {
14662        var queueLanes = sharedQueue.lanes; // If any entangled lanes are no longer pending on the root, then they must
14663        // have finished. We can remove them from the shared queue, which represents
14664        // a superset of the actually pending lanes. In some cases we may entangle
14665        // more than we need to, but that's OK. In fact it's worse if we *don't*
14666        // entangle when we should.
14667  
14668        queueLanes = intersectLanes(queueLanes, root.pendingLanes); // Entangle the new transition lane with the other transition lanes.
14669  
14670        var newQueueLanes = mergeLanes(queueLanes, lane);
14671        sharedQueue.lanes = newQueueLanes; // Even if queue.lanes already include lane, we don't know for certain if
14672        // the lane finished since the last time we entangled it. So we need to
14673        // entangle it again, just to be sure.
14674  
14675        markRootEntangled(root, newQueueLanes);
14676      }
14677    }
14678    function enqueueCapturedUpdate(workInProgress, capturedUpdate) {
14679      // Captured updates are updates that are thrown by a child during the render
14680      // phase. They should be discarded if the render is aborted. Therefore,
14681      // we should only put them on the work-in-progress queue, not the current one.
14682      var queue = workInProgress.updateQueue; // Check if the work-in-progress queue is a clone.
14683  
14684      var current = workInProgress.alternate;
14685  
14686      if (current !== null) {
14687        var currentQueue = current.updateQueue;
14688  
14689        if (queue === currentQueue) {
14690          // The work-in-progress queue is the same as current. This happens when
14691          // we bail out on a parent fiber that then captures an error thrown by
14692          // a child. Since we want to append the update only to the work-in
14693          // -progress queue, we need to clone the updates. We usually clone during
14694          // processUpdateQueue, but that didn't happen in this case because we
14695          // skipped over the parent when we bailed out.
14696          var newFirst = null;
14697          var newLast = null;
14698          var firstBaseUpdate = queue.firstBaseUpdate;
14699  
14700          if (firstBaseUpdate !== null) {
14701            // Loop through the updates and clone them.
14702            var update = firstBaseUpdate;
14703  
14704            do {
14705              var clone = {
14706                eventTime: update.eventTime,
14707                lane: update.lane,
14708                tag: update.tag,
14709                payload: update.payload,
14710                callback: update.callback,
14711                next: null
14712              };
14713  
14714              if (newLast === null) {
14715                newFirst = newLast = clone;
14716              } else {
14717                newLast.next = clone;
14718                newLast = clone;
14719              }
14720  
14721              update = update.next;
14722            } while (update !== null); // Append the captured update the end of the cloned list.
14723  
14724  
14725            if (newLast === null) {
14726              newFirst = newLast = capturedUpdate;
14727            } else {
14728              newLast.next = capturedUpdate;
14729              newLast = capturedUpdate;
14730            }
14731          } else {
14732            // There are no base updates.
14733            newFirst = newLast = capturedUpdate;
14734          }
14735  
14736          queue = {
14737            baseState: currentQueue.baseState,
14738            firstBaseUpdate: newFirst,
14739            lastBaseUpdate: newLast,
14740            shared: currentQueue.shared,
14741            effects: currentQueue.effects
14742          };
14743          workInProgress.updateQueue = queue;
14744          return;
14745        }
14746      } // Append the update to the end of the list.
14747  
14748  
14749      var lastBaseUpdate = queue.lastBaseUpdate;
14750  
14751      if (lastBaseUpdate === null) {
14752        queue.firstBaseUpdate = capturedUpdate;
14753      } else {
14754        lastBaseUpdate.next = capturedUpdate;
14755      }
14756  
14757      queue.lastBaseUpdate = capturedUpdate;
14758    }
14759  
14760    function getStateFromUpdate(workInProgress, queue, update, prevState, nextProps, instance) {
14761      switch (update.tag) {
14762        case ReplaceState:
14763          {
14764            var payload = update.payload;
14765  
14766            if (typeof payload === 'function') {
14767              // Updater function
14768              {
14769                enterDisallowedContextReadInDEV();
14770              }
14771  
14772              var nextState = payload.call(instance, prevState, nextProps);
14773  
14774              {
14775                if ( workInProgress.mode & StrictLegacyMode) {
14776                  setIsStrictModeForDevtools(true);
14777  
14778                  try {
14779                    payload.call(instance, prevState, nextProps);
14780                  } finally {
14781                    setIsStrictModeForDevtools(false);
14782                  }
14783                }
14784  
14785                exitDisallowedContextReadInDEV();
14786              }
14787  
14788              return nextState;
14789            } // State object
14790  
14791  
14792            return payload;
14793          }
14794  
14795        case CaptureUpdate:
14796          {
14797            workInProgress.flags = workInProgress.flags & ~ShouldCapture | DidCapture;
14798          }
14799        // Intentional fallthrough
14800  
14801        case UpdateState:
14802          {
14803            var _payload = update.payload;
14804            var partialState;
14805  
14806            if (typeof _payload === 'function') {
14807              // Updater function
14808              {
14809                enterDisallowedContextReadInDEV();
14810              }
14811  
14812              partialState = _payload.call(instance, prevState, nextProps);
14813  
14814              {
14815                if ( workInProgress.mode & StrictLegacyMode) {
14816                  setIsStrictModeForDevtools(true);
14817  
14818                  try {
14819                    _payload.call(instance, prevState, nextProps);
14820                  } finally {
14821                    setIsStrictModeForDevtools(false);
14822                  }
14823                }
14824  
14825                exitDisallowedContextReadInDEV();
14826              }
14827            } else {
14828              // Partial state object
14829              partialState = _payload;
14830            }
14831  
14832            if (partialState === null || partialState === undefined) {
14833              // Null and undefined are treated as no-ops.
14834              return prevState;
14835            } // Merge the partial state and the previous state.
14836  
14837  
14838            return assign({}, prevState, partialState);
14839          }
14840  
14841        case ForceUpdate:
14842          {
14843            hasForceUpdate = true;
14844            return prevState;
14845          }
14846      }
14847  
14848      return prevState;
14849    }
14850  
14851    function processUpdateQueue(workInProgress, props, instance, renderLanes) {
14852      // This is always non-null on a ClassComponent or HostRoot
14853      var queue = workInProgress.updateQueue;
14854      hasForceUpdate = false;
14855  
14856      {
14857        currentlyProcessingQueue = queue.shared;
14858      }
14859  
14860      var firstBaseUpdate = queue.firstBaseUpdate;
14861      var lastBaseUpdate = queue.lastBaseUpdate; // Check if there are pending updates. If so, transfer them to the base queue.
14862  
14863      var pendingQueue = queue.shared.pending;
14864  
14865      if (pendingQueue !== null) {
14866        queue.shared.pending = null; // The pending queue is circular. Disconnect the pointer between first
14867        // and last so that it's non-circular.
14868  
14869        var lastPendingUpdate = pendingQueue;
14870        var firstPendingUpdate = lastPendingUpdate.next;
14871        lastPendingUpdate.next = null; // Append pending updates to base queue
14872  
14873        if (lastBaseUpdate === null) {
14874          firstBaseUpdate = firstPendingUpdate;
14875        } else {
14876          lastBaseUpdate.next = firstPendingUpdate;
14877        }
14878  
14879        lastBaseUpdate = lastPendingUpdate; // If there's a current queue, and it's different from the base queue, then
14880        // we need to transfer the updates to that queue, too. Because the base
14881        // queue is a singly-linked list with no cycles, we can append to both
14882        // lists and take advantage of structural sharing.
14883        // TODO: Pass `current` as argument
14884  
14885        var current = workInProgress.alternate;
14886  
14887        if (current !== null) {
14888          // This is always non-null on a ClassComponent or HostRoot
14889          var currentQueue = current.updateQueue;
14890          var currentLastBaseUpdate = currentQueue.lastBaseUpdate;
14891  
14892          if (currentLastBaseUpdate !== lastBaseUpdate) {
14893            if (currentLastBaseUpdate === null) {
14894              currentQueue.firstBaseUpdate = firstPendingUpdate;
14895            } else {
14896              currentLastBaseUpdate.next = firstPendingUpdate;
14897            }
14898  
14899            currentQueue.lastBaseUpdate = lastPendingUpdate;
14900          }
14901        }
14902      } // These values may change as we process the queue.
14903  
14904  
14905      if (firstBaseUpdate !== null) {
14906        // Iterate through the list of updates to compute the result.
14907        var newState = queue.baseState; // TODO: Don't need to accumulate this. Instead, we can remove renderLanes
14908        // from the original lanes.
14909  
14910        var newLanes = NoLanes;
14911        var newBaseState = null;
14912        var newFirstBaseUpdate = null;
14913        var newLastBaseUpdate = null;
14914        var update = firstBaseUpdate;
14915  
14916        do {
14917          var updateLane = update.lane;
14918          var updateEventTime = update.eventTime;
14919  
14920          if (!isSubsetOfLanes(renderLanes, updateLane)) {
14921            // Priority is insufficient. Skip this update. If this is the first
14922            // skipped update, the previous update/state is the new base
14923            // update/state.
14924            var clone = {
14925              eventTime: updateEventTime,
14926              lane: updateLane,
14927              tag: update.tag,
14928              payload: update.payload,
14929              callback: update.callback,
14930              next: null
14931            };
14932  
14933            if (newLastBaseUpdate === null) {
14934              newFirstBaseUpdate = newLastBaseUpdate = clone;
14935              newBaseState = newState;
14936            } else {
14937              newLastBaseUpdate = newLastBaseUpdate.next = clone;
14938            } // Update the remaining priority in the queue.
14939  
14940  
14941            newLanes = mergeLanes(newLanes, updateLane);
14942          } else {
14943            // This update does have sufficient priority.
14944            if (newLastBaseUpdate !== null) {
14945              var _clone = {
14946                eventTime: updateEventTime,
14947                // This update is going to be committed so we never want uncommit
14948                // it. Using NoLane works because 0 is a subset of all bitmasks, so
14949                // this will never be skipped by the check above.
14950                lane: NoLane,
14951                tag: update.tag,
14952                payload: update.payload,
14953                callback: update.callback,
14954                next: null
14955              };
14956              newLastBaseUpdate = newLastBaseUpdate.next = _clone;
14957            } // Process this update.
14958  
14959  
14960            newState = getStateFromUpdate(workInProgress, queue, update, newState, props, instance);
14961            var callback = update.callback;
14962  
14963            if (callback !== null && // If the update was already committed, we should not queue its
14964            // callback again.
14965            update.lane !== NoLane) {
14966              workInProgress.flags |= Callback;
14967              var effects = queue.effects;
14968  
14969              if (effects === null) {
14970                queue.effects = [update];
14971              } else {
14972                effects.push(update);
14973              }
14974            }
14975          }
14976  
14977          update = update.next;
14978  
14979          if (update === null) {
14980            pendingQueue = queue.shared.pending;
14981  
14982            if (pendingQueue === null) {
14983              break;
14984            } else {
14985              // An update was scheduled from inside a reducer. Add the new
14986              // pending updates to the end of the list and keep processing.
14987              var _lastPendingUpdate = pendingQueue; // Intentionally unsound. Pending updates form a circular list, but we
14988              // unravel them when transferring them to the base queue.
14989  
14990              var _firstPendingUpdate = _lastPendingUpdate.next;
14991              _lastPendingUpdate.next = null;
14992              update = _firstPendingUpdate;
14993              queue.lastBaseUpdate = _lastPendingUpdate;
14994              queue.shared.pending = null;
14995            }
14996          }
14997        } while (true);
14998  
14999        if (newLastBaseUpdate === null) {
15000          newBaseState = newState;
15001        }
15002  
15003        queue.baseState = newBaseState;
15004        queue.firstBaseUpdate = newFirstBaseUpdate;
15005        queue.lastBaseUpdate = newLastBaseUpdate; // Interleaved updates are stored on a separate queue. We aren't going to
15006        // process them during this render, but we do need to track which lanes
15007        // are remaining.
15008  
15009        var lastInterleaved = queue.shared.interleaved;
15010  
15011        if (lastInterleaved !== null) {
15012          var interleaved = lastInterleaved;
15013  
15014          do {
15015            newLanes = mergeLanes(newLanes, interleaved.lane);
15016            interleaved = interleaved.next;
15017          } while (interleaved !== lastInterleaved);
15018        } else if (firstBaseUpdate === null) {
15019          // `queue.lanes` is used for entangling transitions. We can set it back to
15020          // zero once the queue is empty.
15021          queue.shared.lanes = NoLanes;
15022        } // Set the remaining expiration time to be whatever is remaining in the queue.
15023        // This should be fine because the only two other things that contribute to
15024        // expiration time are props and context. We're already in the middle of the
15025        // begin phase by the time we start processing the queue, so we've already
15026        // dealt with the props. Context in components that specify
15027        // shouldComponentUpdate is tricky; but we'll have to account for
15028        // that regardless.
15029  
15030  
15031        markSkippedUpdateLanes(newLanes);
15032        workInProgress.lanes = newLanes;
15033        workInProgress.memoizedState = newState;
15034      }
15035  
15036      {
15037        currentlyProcessingQueue = null;
15038      }
15039    }
15040  
15041    function callCallback(callback, context) {
15042      if (typeof callback !== 'function') {
15043        throw new Error('Invalid argument passed as callback. Expected a function. Instead ' + ("received: " + callback));
15044      }
15045  
15046      callback.call(context);
15047    }
15048  
15049    function resetHasForceUpdateBeforeProcessing() {
15050      hasForceUpdate = false;
15051    }
15052    function checkHasForceUpdateAfterProcessing() {
15053      return hasForceUpdate;
15054    }
15055    function commitUpdateQueue(finishedWork, finishedQueue, instance) {
15056      // Commit the effects
15057      var effects = finishedQueue.effects;
15058      finishedQueue.effects = null;
15059  
15060      if (effects !== null) {
15061        for (var i = 0; i < effects.length; i++) {
15062          var effect = effects[i];
15063          var callback = effect.callback;
15064  
15065          if (callback !== null) {
15066            effect.callback = null;
15067            callCallback(callback, instance);
15068          }
15069        }
15070      }
15071    }
15072  
15073    var NO_CONTEXT = {};
15074    var contextStackCursor$1 = createCursor(NO_CONTEXT);
15075    var contextFiberStackCursor = createCursor(NO_CONTEXT);
15076    var rootInstanceStackCursor = createCursor(NO_CONTEXT);
15077  
15078    function requiredContext(c) {
15079      if (c === NO_CONTEXT) {
15080        throw new Error('Expected host context to exist. This error is likely caused by a bug ' + 'in React. Please file an issue.');
15081      }
15082  
15083      return c;
15084    }
15085  
15086    function getRootHostContainer() {
15087      var rootInstance = requiredContext(rootInstanceStackCursor.current);
15088      return rootInstance;
15089    }
15090  
15091    function pushHostContainer(fiber, nextRootInstance) {
15092      // Push current root instance onto the stack;
15093      // This allows us to reset root when portals are popped.
15094      push(rootInstanceStackCursor, nextRootInstance, fiber); // Track the context and the Fiber that provided it.
15095      // This enables us to pop only Fibers that provide unique contexts.
15096  
15097      push(contextFiberStackCursor, fiber, fiber); // Finally, we need to push the host context to the stack.
15098      // However, we can't just call getRootHostContext() and push it because
15099      // we'd have a different number of entries on the stack depending on
15100      // whether getRootHostContext() throws somewhere in renderer code or not.
15101      // So we push an empty value first. This lets us safely unwind on errors.
15102  
15103      push(contextStackCursor$1, NO_CONTEXT, fiber);
15104      var nextRootContext = getRootHostContext(nextRootInstance); // Now that we know this function doesn't throw, replace it.
15105  
15106      pop(contextStackCursor$1, fiber);
15107      push(contextStackCursor$1, nextRootContext, fiber);
15108    }
15109  
15110    function popHostContainer(fiber) {
15111      pop(contextStackCursor$1, fiber);
15112      pop(contextFiberStackCursor, fiber);
15113      pop(rootInstanceStackCursor, fiber);
15114    }
15115  
15116    function getHostContext() {
15117      var context = requiredContext(contextStackCursor$1.current);
15118      return context;
15119    }
15120  
15121    function pushHostContext(fiber) {
15122      var rootInstance = requiredContext(rootInstanceStackCursor.current);
15123      var context = requiredContext(contextStackCursor$1.current);
15124      var nextContext = getChildHostContext(context, fiber.type); // Don't push this Fiber's context unless it's unique.
15125  
15126      if (context === nextContext) {
15127        return;
15128      } // Track the context and the Fiber that provided it.
15129      // This enables us to pop only Fibers that provide unique contexts.
15130  
15131  
15132      push(contextFiberStackCursor, fiber, fiber);
15133      push(contextStackCursor$1, nextContext, fiber);
15134    }
15135  
15136    function popHostContext(fiber) {
15137      // Do not pop unless this Fiber provided the current context.
15138      // pushHostContext() only pushes Fibers that provide unique contexts.
15139      if (contextFiberStackCursor.current !== fiber) {
15140        return;
15141      }
15142  
15143      pop(contextStackCursor$1, fiber);
15144      pop(contextFiberStackCursor, fiber);
15145    }
15146  
15147    var DefaultSuspenseContext = 0; // The Suspense Context is split into two parts. The lower bits is
15148    // inherited deeply down the subtree. The upper bits only affect
15149    // this immediate suspense boundary and gets reset each new
15150    // boundary or suspense list.
15151  
15152    var SubtreeSuspenseContextMask = 1; // Subtree Flags:
15153    // InvisibleParentSuspenseContext indicates that one of our parent Suspense
15154    // boundaries is not currently showing visible main content.
15155    // Either because it is already showing a fallback or is not mounted at all.
15156    // We can use this to determine if it is desirable to trigger a fallback at
15157    // the parent. If not, then we might need to trigger undesirable boundaries
15158    // and/or suspend the commit to avoid hiding the parent content.
15159  
15160    var InvisibleParentSuspenseContext = 1; // Shallow Flags:
15161    // ForceSuspenseFallback can be used by SuspenseList to force newly added
15162    // items into their fallback state during one of the render passes.
15163  
15164    var ForceSuspenseFallback = 2;
15165    var suspenseStackCursor = createCursor(DefaultSuspenseContext);
15166    function hasSuspenseContext(parentContext, flag) {
15167      return (parentContext & flag) !== 0;
15168    }
15169    function setDefaultShallowSuspenseContext(parentContext) {
15170      return parentContext & SubtreeSuspenseContextMask;
15171    }
15172    function setShallowSuspenseContext(parentContext, shallowContext) {
15173      return parentContext & SubtreeSuspenseContextMask | shallowContext;
15174    }
15175    function addSubtreeSuspenseContext(parentContext, subtreeContext) {
15176      return parentContext | subtreeContext;
15177    }
15178    function pushSuspenseContext(fiber, newContext) {
15179      push(suspenseStackCursor, newContext, fiber);
15180    }
15181    function popSuspenseContext(fiber) {
15182      pop(suspenseStackCursor, fiber);
15183    }
15184  
15185    function shouldCaptureSuspense(workInProgress, hasInvisibleParent) {
15186      // If it was the primary children that just suspended, capture and render the
15187      // fallback. Otherwise, don't capture and bubble to the next boundary.
15188      var nextState = workInProgress.memoizedState;
15189  
15190      if (nextState !== null) {
15191        if (nextState.dehydrated !== null) {
15192          // A dehydrated boundary always captures.
15193          return true;
15194        }
15195  
15196        return false;
15197      }
15198  
15199      var props = workInProgress.memoizedProps; // Regular boundaries always capture.
15200  
15201      {
15202        return true;
15203      } // If it's a boundary we should avoid, then we prefer to bubble up to the
15204    }
15205    function findFirstSuspended(row) {
15206      var node = row;
15207  
15208      while (node !== null) {
15209        if (node.tag === SuspenseComponent) {
15210          var state = node.memoizedState;
15211  
15212          if (state !== null) {
15213            var dehydrated = state.dehydrated;
15214  
15215            if (dehydrated === null || isSuspenseInstancePending(dehydrated) || isSuspenseInstanceFallback(dehydrated)) {
15216              return node;
15217            }
15218          }
15219        } else if (node.tag === SuspenseListComponent && // revealOrder undefined can't be trusted because it don't
15220        // keep track of whether it suspended or not.
15221        node.memoizedProps.revealOrder !== undefined) {
15222          var didSuspend = (node.flags & DidCapture) !== NoFlags;
15223  
15224          if (didSuspend) {
15225            return node;
15226          }
15227        } else if (node.child !== null) {
15228          node.child.return = node;
15229          node = node.child;
15230          continue;
15231        }
15232  
15233        if (node === row) {
15234          return null;
15235        }
15236  
15237        while (node.sibling === null) {
15238          if (node.return === null || node.return === row) {
15239            return null;
15240          }
15241  
15242          node = node.return;
15243        }
15244  
15245        node.sibling.return = node.return;
15246        node = node.sibling;
15247      }
15248  
15249      return null;
15250    }
15251  
15252    var NoFlags$1 =
15253    /*   */
15254    0; // Represents whether effect should fire.
15255  
15256    var HasEffect =
15257    /* */
15258    1; // Represents the phase in which the effect (not the clean-up) fires.
15259  
15260    var Insertion =
15261    /*  */
15262    2;
15263    var Layout =
15264    /*    */
15265    4;
15266    var Passive$1 =
15267    /*   */
15268    8;
15269  
15270    // and should be reset before starting a new render.
15271    // This tracks which mutable sources need to be reset after a render.
15272  
15273    var workInProgressSources = [];
15274    function resetWorkInProgressVersions() {
15275      for (var i = 0; i < workInProgressSources.length; i++) {
15276        var mutableSource = workInProgressSources[i];
15277  
15278        {
15279          mutableSource._workInProgressVersionPrimary = null;
15280        }
15281      }
15282  
15283      workInProgressSources.length = 0;
15284    }
15285    // This ensures that the version used for server rendering matches the one
15286    // that is eventually read during hydration.
15287    // If they don't match there's a potential tear and a full deopt render is required.
15288  
15289    function registerMutableSourceForHydration(root, mutableSource) {
15290      var getVersion = mutableSource._getVersion;
15291      var version = getVersion(mutableSource._source); // TODO Clear this data once all pending hydration work is finished.
15292      // Retaining it forever may interfere with GC.
15293  
15294      if (root.mutableSourceEagerHydrationData == null) {
15295        root.mutableSourceEagerHydrationData = [mutableSource, version];
15296      } else {
15297        root.mutableSourceEagerHydrationData.push(mutableSource, version);
15298      }
15299    }
15300  
15301    var ReactCurrentDispatcher$1 = ReactSharedInternals.ReactCurrentDispatcher,
15302        ReactCurrentBatchConfig$2 = ReactSharedInternals.ReactCurrentBatchConfig;
15303    var didWarnAboutMismatchedHooksForComponent;
15304    var didWarnUncachedGetSnapshot;
15305  
15306    {
15307      didWarnAboutMismatchedHooksForComponent = new Set();
15308    }
15309  
15310    // These are set right before calling the component.
15311    var renderLanes = NoLanes; // The work-in-progress fiber. I've named it differently to distinguish it from
15312    // the work-in-progress hook.
15313  
15314    var currentlyRenderingFiber$1 = null; // Hooks are stored as a linked list on the fiber's memoizedState field. The
15315    // current hook list is the list that belongs to the current fiber. The
15316    // work-in-progress hook list is a new list that will be added to the
15317    // work-in-progress fiber.
15318  
15319    var currentHook = null;
15320    var workInProgressHook = null; // Whether an update was scheduled at any point during the render phase. This
15321    // does not get reset if we do another render pass; only when we're completely
15322    // finished evaluating this component. This is an optimization so we know
15323    // whether we need to clear render phase updates after a throw.
15324  
15325    var didScheduleRenderPhaseUpdate = false; // Where an update was scheduled only during the current render pass. This
15326    // gets reset after each attempt.
15327    // TODO: Maybe there's some way to consolidate this with
15328    // `didScheduleRenderPhaseUpdate`. Or with `numberOfReRenders`.
15329  
15330    var didScheduleRenderPhaseUpdateDuringThisPass = false; // Counts the number of useId hooks in this component.
15331  
15332    var localIdCounter = 0; // Used for ids that are generated completely client-side (i.e. not during
15333    // hydration). This counter is global, so client ids are not stable across
15334    // render attempts.
15335  
15336    var globalClientIdCounter = 0;
15337    var RE_RENDER_LIMIT = 25; // In DEV, this is the name of the currently executing primitive hook
15338  
15339    var currentHookNameInDev = null; // In DEV, this list ensures that hooks are called in the same order between renders.
15340    // The list stores the order of hooks used during the initial render (mount).
15341    // Subsequent renders (updates) reference this list.
15342  
15343    var hookTypesDev = null;
15344    var hookTypesUpdateIndexDev = -1; // In DEV, this tracks whether currently rendering component needs to ignore
15345    // the dependencies for Hooks that need them (e.g. useEffect or useMemo).
15346    // When true, such Hooks will always be "remounted". Only used during hot reload.
15347  
15348    var ignorePreviousDependencies = false;
15349  
15350    function mountHookTypesDev() {
15351      {
15352        var hookName = currentHookNameInDev;
15353  
15354        if (hookTypesDev === null) {
15355          hookTypesDev = [hookName];
15356        } else {
15357          hookTypesDev.push(hookName);
15358        }
15359      }
15360    }
15361  
15362    function updateHookTypesDev() {
15363      {
15364        var hookName = currentHookNameInDev;
15365  
15366        if (hookTypesDev !== null) {
15367          hookTypesUpdateIndexDev++;
15368  
15369          if (hookTypesDev[hookTypesUpdateIndexDev] !== hookName) {
15370            warnOnHookMismatchInDev(hookName);
15371          }
15372        }
15373      }
15374    }
15375  
15376    function checkDepsAreArrayDev(deps) {
15377      {
15378        if (deps !== undefined && deps !== null && !isArray(deps)) {
15379          // Verify deps, but only on mount to avoid extra checks.
15380          // It's unlikely their type would change as usually you define them inline.
15381          error('%s received a final argument that is not an array (instead, received `%s`). When ' + 'specified, the final argument must be an array.', currentHookNameInDev, typeof deps);
15382        }
15383      }
15384    }
15385  
15386    function warnOnHookMismatchInDev(currentHookName) {
15387      {
15388        var componentName = getComponentNameFromFiber(currentlyRenderingFiber$1);
15389  
15390        if (!didWarnAboutMismatchedHooksForComponent.has(componentName)) {
15391          didWarnAboutMismatchedHooksForComponent.add(componentName);
15392  
15393          if (hookTypesDev !== null) {
15394            var table = '';
15395            var secondColumnStart = 30;
15396  
15397            for (var i = 0; i <= hookTypesUpdateIndexDev; i++) {
15398              var oldHookName = hookTypesDev[i];
15399              var newHookName = i === hookTypesUpdateIndexDev ? currentHookName : oldHookName;
15400              var row = i + 1 + ". " + oldHookName; // Extra space so second column lines up
15401              // lol @ IE not supporting String#repeat
15402  
15403              while (row.length < secondColumnStart) {
15404                row += ' ';
15405              }
15406  
15407              row += newHookName + '\n';
15408              table += row;
15409            }
15410  
15411            error('React has detected a change in the order of Hooks called by %s. ' + 'This will lead to bugs and errors if not fixed. ' + 'For more information, read the Rules of Hooks: https://reactjs.org/link/rules-of-hooks\n\n' + '   Previous render            Next render\n' + '   ------------------------------------------------------\n' + '%s' + '   ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^\n', componentName, table);
15412          }
15413        }
15414      }
15415    }
15416  
15417    function throwInvalidHookError() {
15418      throw new Error('Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' + ' one of the following reasons:\n' + '1. You might have mismatching versions of React and the renderer (such as React DOM)\n' + '2. You might be breaking the Rules of Hooks\n' + '3. You might have more than one copy of React in the same app\n' + 'See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.');
15419    }
15420  
15421    function areHookInputsEqual(nextDeps, prevDeps) {
15422      {
15423        if (ignorePreviousDependencies) {
15424          // Only true when this component is being hot reloaded.
15425          return false;
15426        }
15427      }
15428  
15429      if (prevDeps === null) {
15430        {
15431          error('%s received a final argument during this render, but not during ' + 'the previous render. Even though the final argument is optional, ' + 'its type cannot change between renders.', currentHookNameInDev);
15432        }
15433  
15434        return false;
15435      }
15436  
15437      {
15438        // Don't bother comparing lengths in prod because these arrays should be
15439        // passed inline.
15440        if (nextDeps.length !== prevDeps.length) {
15441          error('The final argument passed to %s changed size between renders. The ' + 'order and size of this array must remain constant.\n\n' + 'Previous: %s\n' + 'Incoming: %s', currentHookNameInDev, "[" + prevDeps.join(', ') + "]", "[" + nextDeps.join(', ') + "]");
15442        }
15443      }
15444  
15445      for (var i = 0; i < prevDeps.length && i < nextDeps.length; i++) {
15446        if (objectIs(nextDeps[i], prevDeps[i])) {
15447          continue;
15448        }
15449  
15450        return false;
15451      }
15452  
15453      return true;
15454    }
15455  
15456    function renderWithHooks(current, workInProgress, Component, props, secondArg, nextRenderLanes) {
15457      renderLanes = nextRenderLanes;
15458      currentlyRenderingFiber$1 = workInProgress;
15459  
15460      {
15461        hookTypesDev = current !== null ? current._debugHookTypes : null;
15462        hookTypesUpdateIndexDev = -1; // Used for hot reloading:
15463  
15464        ignorePreviousDependencies = current !== null && current.type !== workInProgress.type;
15465      }
15466  
15467      workInProgress.memoizedState = null;
15468      workInProgress.updateQueue = null;
15469      workInProgress.lanes = NoLanes; // The following should have already been reset
15470      // currentHook = null;
15471      // workInProgressHook = null;
15472      // didScheduleRenderPhaseUpdate = false;
15473      // localIdCounter = 0;
15474      // TODO Warn if no hooks are used at all during mount, then some are used during update.
15475      // Currently we will identify the update render as a mount because memoizedState === null.
15476      // This is tricky because it's valid for certain types of components (e.g. React.lazy)
15477      // Using memoizedState to differentiate between mount/update only works if at least one stateful hook is used.
15478      // Non-stateful hooks (e.g. context) don't get added to memoizedState,
15479      // so memoizedState would be null during updates and mounts.
15480  
15481      {
15482        if (current !== null && current.memoizedState !== null) {
15483          ReactCurrentDispatcher$1.current = HooksDispatcherOnUpdateInDEV;
15484        } else if (hookTypesDev !== null) {
15485          // This dispatcher handles an edge case where a component is updating,
15486          // but no stateful hooks have been used.
15487          // We want to match the production code behavior (which will use HooksDispatcherOnMount),
15488          // but with the extra DEV validation to ensure hooks ordering hasn't changed.
15489          // This dispatcher does that.
15490          ReactCurrentDispatcher$1.current = HooksDispatcherOnMountWithHookTypesInDEV;
15491        } else {
15492          ReactCurrentDispatcher$1.current = HooksDispatcherOnMountInDEV;
15493        }
15494      }
15495  
15496      var children = Component(props, secondArg); // Check if there was a render phase update
15497  
15498      if (didScheduleRenderPhaseUpdateDuringThisPass) {
15499        // Keep rendering in a loop for as long as render phase updates continue to
15500        // be scheduled. Use a counter to prevent infinite loops.
15501        var numberOfReRenders = 0;
15502  
15503        do {
15504          didScheduleRenderPhaseUpdateDuringThisPass = false;
15505          localIdCounter = 0;
15506  
15507          if (numberOfReRenders >= RE_RENDER_LIMIT) {
15508            throw new Error('Too many re-renders. React limits the number of renders to prevent ' + 'an infinite loop.');
15509          }
15510  
15511          numberOfReRenders += 1;
15512  
15513          {
15514            // Even when hot reloading, allow dependencies to stabilize
15515            // after first render to prevent infinite render phase updates.
15516            ignorePreviousDependencies = false;
15517          } // Start over from the beginning of the list
15518  
15519  
15520          currentHook = null;
15521          workInProgressHook = null;
15522          workInProgress.updateQueue = null;
15523  
15524          {
15525            // Also validate hook order for cascading updates.
15526            hookTypesUpdateIndexDev = -1;
15527          }
15528  
15529          ReactCurrentDispatcher$1.current =  HooksDispatcherOnRerenderInDEV ;
15530          children = Component(props, secondArg);
15531        } while (didScheduleRenderPhaseUpdateDuringThisPass);
15532      } // We can assume the previous dispatcher is always this one, since we set it
15533      // at the beginning of the render phase and there's no re-entrance.
15534  
15535  
15536      ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
15537  
15538      {
15539        workInProgress._debugHookTypes = hookTypesDev;
15540      } // This check uses currentHook so that it works the same in DEV and prod bundles.
15541      // hookTypesDev could catch more cases (e.g. context) but only in DEV bundles.
15542  
15543  
15544      var didRenderTooFewHooks = currentHook !== null && currentHook.next !== null;
15545      renderLanes = NoLanes;
15546      currentlyRenderingFiber$1 = null;
15547      currentHook = null;
15548      workInProgressHook = null;
15549  
15550      {
15551        currentHookNameInDev = null;
15552        hookTypesDev = null;
15553        hookTypesUpdateIndexDev = -1; // Confirm that a static flag was not added or removed since the last
15554        // render. If this fires, it suggests that we incorrectly reset the static
15555        // flags in some other part of the codebase. This has happened before, for
15556        // example, in the SuspenseList implementation.
15557  
15558        if (current !== null && (current.flags & StaticMask) !== (workInProgress.flags & StaticMask) && // Disable this warning in legacy mode, because legacy Suspense is weird
15559        // and creates false positives. To make this work in legacy mode, we'd
15560        // need to mark fibers that commit in an incomplete state, somehow. For
15561        // now I'll disable the warning that most of the bugs that would trigger
15562        // it are either exclusive to concurrent mode or exist in both.
15563        (current.mode & ConcurrentMode) !== NoMode) {
15564          error('Internal React error: Expected static flag was missing. Please ' + 'notify the React team.');
15565        }
15566      }
15567  
15568      didScheduleRenderPhaseUpdate = false; // This is reset by checkDidRenderIdHook
15569      // localIdCounter = 0;
15570  
15571      if (didRenderTooFewHooks) {
15572        throw new Error('Rendered fewer hooks than expected. This may be caused by an accidental ' + 'early return statement.');
15573      }
15574  
15575      return children;
15576    }
15577    function checkDidRenderIdHook() {
15578      // This should be called immediately after every renderWithHooks call.
15579      // Conceptually, it's part of the return value of renderWithHooks; it's only a
15580      // separate function to avoid using an array tuple.
15581      var didRenderIdHook = localIdCounter !== 0;
15582      localIdCounter = 0;
15583      return didRenderIdHook;
15584    }
15585    function bailoutHooks(current, workInProgress, lanes) {
15586      workInProgress.updateQueue = current.updateQueue; // TODO: Don't need to reset the flags here, because they're reset in the
15587      // complete phase (bubbleProperties).
15588  
15589      if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
15590        workInProgress.flags &= ~(MountPassiveDev | MountLayoutDev | Passive | Update);
15591      } else {
15592        workInProgress.flags &= ~(Passive | Update);
15593      }
15594  
15595      current.lanes = removeLanes(current.lanes, lanes);
15596    }
15597    function resetHooksAfterThrow() {
15598      // We can assume the previous dispatcher is always this one, since we set it
15599      // at the beginning of the render phase and there's no re-entrance.
15600      ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
15601  
15602      if (didScheduleRenderPhaseUpdate) {
15603        // There were render phase updates. These are only valid for this render
15604        // phase, which we are now aborting. Remove the updates from the queues so
15605        // they do not persist to the next render. Do not remove updates from hooks
15606        // that weren't processed.
15607        //
15608        // Only reset the updates from the queue if it has a clone. If it does
15609        // not have a clone, that means it wasn't processed, and the updates were
15610        // scheduled before we entered the render phase.
15611        var hook = currentlyRenderingFiber$1.memoizedState;
15612  
15613        while (hook !== null) {
15614          var queue = hook.queue;
15615  
15616          if (queue !== null) {
15617            queue.pending = null;
15618          }
15619  
15620          hook = hook.next;
15621        }
15622  
15623        didScheduleRenderPhaseUpdate = false;
15624      }
15625  
15626      renderLanes = NoLanes;
15627      currentlyRenderingFiber$1 = null;
15628      currentHook = null;
15629      workInProgressHook = null;
15630  
15631      {
15632        hookTypesDev = null;
15633        hookTypesUpdateIndexDev = -1;
15634        currentHookNameInDev = null;
15635        isUpdatingOpaqueValueInRenderPhase = false;
15636      }
15637  
15638      didScheduleRenderPhaseUpdateDuringThisPass = false;
15639      localIdCounter = 0;
15640    }
15641  
15642    function mountWorkInProgressHook() {
15643      var hook = {
15644        memoizedState: null,
15645        baseState: null,
15646        baseQueue: null,
15647        queue: null,
15648        next: null
15649      };
15650  
15651      if (workInProgressHook === null) {
15652        // This is the first hook in the list
15653        currentlyRenderingFiber$1.memoizedState = workInProgressHook = hook;
15654      } else {
15655        // Append to the end of the list
15656        workInProgressHook = workInProgressHook.next = hook;
15657      }
15658  
15659      return workInProgressHook;
15660    }
15661  
15662    function updateWorkInProgressHook() {
15663      // This function is used both for updates and for re-renders triggered by a
15664      // render phase update. It assumes there is either a current hook we can
15665      // clone, or a work-in-progress hook from a previous render pass that we can
15666      // use as a base. When we reach the end of the base list, we must switch to
15667      // the dispatcher used for mounts.
15668      var nextCurrentHook;
15669  
15670      if (currentHook === null) {
15671        var current = currentlyRenderingFiber$1.alternate;
15672  
15673        if (current !== null) {
15674          nextCurrentHook = current.memoizedState;
15675        } else {
15676          nextCurrentHook = null;
15677        }
15678      } else {
15679        nextCurrentHook = currentHook.next;
15680      }
15681  
15682      var nextWorkInProgressHook;
15683  
15684      if (workInProgressHook === null) {
15685        nextWorkInProgressHook = currentlyRenderingFiber$1.memoizedState;
15686      } else {
15687        nextWorkInProgressHook = workInProgressHook.next;
15688      }
15689  
15690      if (nextWorkInProgressHook !== null) {
15691        // There's already a work-in-progress. Reuse it.
15692        workInProgressHook = nextWorkInProgressHook;
15693        nextWorkInProgressHook = workInProgressHook.next;
15694        currentHook = nextCurrentHook;
15695      } else {
15696        // Clone from the current hook.
15697        if (nextCurrentHook === null) {
15698          throw new Error('Rendered more hooks than during the previous render.');
15699        }
15700  
15701        currentHook = nextCurrentHook;
15702        var newHook = {
15703          memoizedState: currentHook.memoizedState,
15704          baseState: currentHook.baseState,
15705          baseQueue: currentHook.baseQueue,
15706          queue: currentHook.queue,
15707          next: null
15708        };
15709  
15710        if (workInProgressHook === null) {
15711          // This is the first hook in the list.
15712          currentlyRenderingFiber$1.memoizedState = workInProgressHook = newHook;
15713        } else {
15714          // Append to the end of the list.
15715          workInProgressHook = workInProgressHook.next = newHook;
15716        }
15717      }
15718  
15719      return workInProgressHook;
15720    }
15721  
15722    function createFunctionComponentUpdateQueue() {
15723      return {
15724        lastEffect: null,
15725        stores: null
15726      };
15727    }
15728  
15729    function basicStateReducer(state, action) {
15730      // $FlowFixMe: Flow doesn't like mixed types
15731      return typeof action === 'function' ? action(state) : action;
15732    }
15733  
15734    function mountReducer(reducer, initialArg, init) {
15735      var hook = mountWorkInProgressHook();
15736      var initialState;
15737  
15738      if (init !== undefined) {
15739        initialState = init(initialArg);
15740      } else {
15741        initialState = initialArg;
15742      }
15743  
15744      hook.memoizedState = hook.baseState = initialState;
15745      var queue = {
15746        pending: null,
15747        interleaved: null,
15748        lanes: NoLanes,
15749        dispatch: null,
15750        lastRenderedReducer: reducer,
15751        lastRenderedState: initialState
15752      };
15753      hook.queue = queue;
15754      var dispatch = queue.dispatch = dispatchReducerAction.bind(null, currentlyRenderingFiber$1, queue);
15755      return [hook.memoizedState, dispatch];
15756    }
15757  
15758    function updateReducer(reducer, initialArg, init) {
15759      var hook = updateWorkInProgressHook();
15760      var queue = hook.queue;
15761  
15762      if (queue === null) {
15763        throw new Error('Should have a queue. This is likely a bug in React. Please file an issue.');
15764      }
15765  
15766      queue.lastRenderedReducer = reducer;
15767      var current = currentHook; // The last rebase update that is NOT part of the base state.
15768  
15769      var baseQueue = current.baseQueue; // The last pending update that hasn't been processed yet.
15770  
15771      var pendingQueue = queue.pending;
15772  
15773      if (pendingQueue !== null) {
15774        // We have new updates that haven't been processed yet.
15775        // We'll add them to the base queue.
15776        if (baseQueue !== null) {
15777          // Merge the pending queue and the base queue.
15778          var baseFirst = baseQueue.next;
15779          var pendingFirst = pendingQueue.next;
15780          baseQueue.next = pendingFirst;
15781          pendingQueue.next = baseFirst;
15782        }
15783  
15784        {
15785          if (current.baseQueue !== baseQueue) {
15786            // Internal invariant that should never happen, but feasibly could in
15787            // the future if we implement resuming, or some form of that.
15788            error('Internal error: Expected work-in-progress queue to be a clone. ' + 'This is a bug in React.');
15789          }
15790        }
15791  
15792        current.baseQueue = baseQueue = pendingQueue;
15793        queue.pending = null;
15794      }
15795  
15796      if (baseQueue !== null) {
15797        // We have a queue to process.
15798        var first = baseQueue.next;
15799        var newState = current.baseState;
15800        var newBaseState = null;
15801        var newBaseQueueFirst = null;
15802        var newBaseQueueLast = null;
15803        var update = first;
15804  
15805        do {
15806          var updateLane = update.lane;
15807  
15808          if (!isSubsetOfLanes(renderLanes, updateLane)) {
15809            // Priority is insufficient. Skip this update. If this is the first
15810            // skipped update, the previous update/state is the new base
15811            // update/state.
15812            var clone = {
15813              lane: updateLane,
15814              action: update.action,
15815              hasEagerState: update.hasEagerState,
15816              eagerState: update.eagerState,
15817              next: null
15818            };
15819  
15820            if (newBaseQueueLast === null) {
15821              newBaseQueueFirst = newBaseQueueLast = clone;
15822              newBaseState = newState;
15823            } else {
15824              newBaseQueueLast = newBaseQueueLast.next = clone;
15825            } // Update the remaining priority in the queue.
15826            // TODO: Don't need to accumulate this. Instead, we can remove
15827            // renderLanes from the original lanes.
15828  
15829  
15830            currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, updateLane);
15831            markSkippedUpdateLanes(updateLane);
15832          } else {
15833            // This update does have sufficient priority.
15834            if (newBaseQueueLast !== null) {
15835              var _clone = {
15836                // This update is going to be committed so we never want uncommit
15837                // it. Using NoLane works because 0 is a subset of all bitmasks, so
15838                // this will never be skipped by the check above.
15839                lane: NoLane,
15840                action: update.action,
15841                hasEagerState: update.hasEagerState,
15842                eagerState: update.eagerState,
15843                next: null
15844              };
15845              newBaseQueueLast = newBaseQueueLast.next = _clone;
15846            } // Process this update.
15847  
15848  
15849            if (update.hasEagerState) {
15850              // If this update is a state update (not a reducer) and was processed eagerly,
15851              // we can use the eagerly computed state
15852              newState = update.eagerState;
15853            } else {
15854              var action = update.action;
15855              newState = reducer(newState, action);
15856            }
15857          }
15858  
15859          update = update.next;
15860        } while (update !== null && update !== first);
15861  
15862        if (newBaseQueueLast === null) {
15863          newBaseState = newState;
15864        } else {
15865          newBaseQueueLast.next = newBaseQueueFirst;
15866        } // Mark that the fiber performed work, but only if the new state is
15867        // different from the current state.
15868  
15869  
15870        if (!objectIs(newState, hook.memoizedState)) {
15871          markWorkInProgressReceivedUpdate();
15872        }
15873  
15874        hook.memoizedState = newState;
15875        hook.baseState = newBaseState;
15876        hook.baseQueue = newBaseQueueLast;
15877        queue.lastRenderedState = newState;
15878      } // Interleaved updates are stored on a separate queue. We aren't going to
15879      // process them during this render, but we do need to track which lanes
15880      // are remaining.
15881  
15882  
15883      var lastInterleaved = queue.interleaved;
15884  
15885      if (lastInterleaved !== null) {
15886        var interleaved = lastInterleaved;
15887  
15888        do {
15889          var interleavedLane = interleaved.lane;
15890          currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, interleavedLane);
15891          markSkippedUpdateLanes(interleavedLane);
15892          interleaved = interleaved.next;
15893        } while (interleaved !== lastInterleaved);
15894      } else if (baseQueue === null) {
15895        // `queue.lanes` is used for entangling transitions. We can set it back to
15896        // zero once the queue is empty.
15897        queue.lanes = NoLanes;
15898      }
15899  
15900      var dispatch = queue.dispatch;
15901      return [hook.memoizedState, dispatch];
15902    }
15903  
15904    function rerenderReducer(reducer, initialArg, init) {
15905      var hook = updateWorkInProgressHook();
15906      var queue = hook.queue;
15907  
15908      if (queue === null) {
15909        throw new Error('Should have a queue. This is likely a bug in React. Please file an issue.');
15910      }
15911  
15912      queue.lastRenderedReducer = reducer; // This is a re-render. Apply the new render phase updates to the previous
15913      // work-in-progress hook.
15914  
15915      var dispatch = queue.dispatch;
15916      var lastRenderPhaseUpdate = queue.pending;
15917      var newState = hook.memoizedState;
15918  
15919      if (lastRenderPhaseUpdate !== null) {
15920        // The queue doesn't persist past this render pass.
15921        queue.pending = null;
15922        var firstRenderPhaseUpdate = lastRenderPhaseUpdate.next;
15923        var update = firstRenderPhaseUpdate;
15924  
15925        do {
15926          // Process this render phase update. We don't have to check the
15927          // priority because it will always be the same as the current
15928          // render's.
15929          var action = update.action;
15930          newState = reducer(newState, action);
15931          update = update.next;
15932        } while (update !== firstRenderPhaseUpdate); // Mark that the fiber performed work, but only if the new state is
15933        // different from the current state.
15934  
15935  
15936        if (!objectIs(newState, hook.memoizedState)) {
15937          markWorkInProgressReceivedUpdate();
15938        }
15939  
15940        hook.memoizedState = newState; // Don't persist the state accumulated from the render phase updates to
15941        // the base state unless the queue is empty.
15942        // TODO: Not sure if this is the desired semantics, but it's what we
15943        // do for gDSFP. I can't remember why.
15944  
15945        if (hook.baseQueue === null) {
15946          hook.baseState = newState;
15947        }
15948  
15949        queue.lastRenderedState = newState;
15950      }
15951  
15952      return [newState, dispatch];
15953    }
15954  
15955    function mountMutableSource(source, getSnapshot, subscribe) {
15956      {
15957        return undefined;
15958      }
15959    }
15960  
15961    function updateMutableSource(source, getSnapshot, subscribe) {
15962      {
15963        return undefined;
15964      }
15965    }
15966  
15967    function mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) {
15968      var fiber = currentlyRenderingFiber$1;
15969      var hook = mountWorkInProgressHook();
15970      var nextSnapshot;
15971      var isHydrating = getIsHydrating();
15972  
15973      if (isHydrating) {
15974        if (getServerSnapshot === undefined) {
15975          throw new Error('Missing getServerSnapshot, which is required for ' + 'server-rendered content. Will revert to client rendering.');
15976        }
15977  
15978        nextSnapshot = getServerSnapshot();
15979  
15980        {
15981          if (!didWarnUncachedGetSnapshot) {
15982            if (nextSnapshot !== getServerSnapshot()) {
15983              error('The result of getServerSnapshot should be cached to avoid an infinite loop');
15984  
15985              didWarnUncachedGetSnapshot = true;
15986            }
15987          }
15988        }
15989      } else {
15990        nextSnapshot = getSnapshot();
15991  
15992        {
15993          if (!didWarnUncachedGetSnapshot) {
15994            var cachedSnapshot = getSnapshot();
15995  
15996            if (!objectIs(nextSnapshot, cachedSnapshot)) {
15997              error('The result of getSnapshot should be cached to avoid an infinite loop');
15998  
15999              didWarnUncachedGetSnapshot = true;
16000            }
16001          }
16002        } // Unless we're rendering a blocking lane, schedule a consistency check.
16003        // Right before committing, we will walk the tree and check if any of the
16004        // stores were mutated.
16005        //
16006        // We won't do this if we're hydrating server-rendered content, because if
16007        // the content is stale, it's already visible anyway. Instead we'll patch
16008        // it up in a passive effect.
16009  
16010  
16011        var root = getWorkInProgressRoot();
16012  
16013        if (root === null) {
16014          throw new Error('Expected a work-in-progress root. This is a bug in React. Please file an issue.');
16015        }
16016  
16017        if (!includesBlockingLane(root, renderLanes)) {
16018          pushStoreConsistencyCheck(fiber, getSnapshot, nextSnapshot);
16019        }
16020      } // Read the current snapshot from the store on every render. This breaks the
16021      // normal rules of React, and only works because store updates are
16022      // always synchronous.
16023  
16024  
16025      hook.memoizedState = nextSnapshot;
16026      var inst = {
16027        value: nextSnapshot,
16028        getSnapshot: getSnapshot
16029      };
16030      hook.queue = inst; // Schedule an effect to subscribe to the store.
16031  
16032      mountEffect(subscribeToStore.bind(null, fiber, inst, subscribe), [subscribe]); // Schedule an effect to update the mutable instance fields. We will update
16033      // this whenever subscribe, getSnapshot, or value changes. Because there's no
16034      // clean-up function, and we track the deps correctly, we can call pushEffect
16035      // directly, without storing any additional state. For the same reason, we
16036      // don't need to set a static flag, either.
16037      // TODO: We can move this to the passive phase once we add a pre-commit
16038      // consistency check. See the next comment.
16039  
16040      fiber.flags |= Passive;
16041      pushEffect(HasEffect | Passive$1, updateStoreInstance.bind(null, fiber, inst, nextSnapshot, getSnapshot), undefined, null);
16042      return nextSnapshot;
16043    }
16044  
16045    function updateSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) {
16046      var fiber = currentlyRenderingFiber$1;
16047      var hook = updateWorkInProgressHook(); // Read the current snapshot from the store on every render. This breaks the
16048      // normal rules of React, and only works because store updates are
16049      // always synchronous.
16050  
16051      var nextSnapshot = getSnapshot();
16052  
16053      {
16054        if (!didWarnUncachedGetSnapshot) {
16055          var cachedSnapshot = getSnapshot();
16056  
16057          if (!objectIs(nextSnapshot, cachedSnapshot)) {
16058            error('The result of getSnapshot should be cached to avoid an infinite loop');
16059  
16060            didWarnUncachedGetSnapshot = true;
16061          }
16062        }
16063      }
16064  
16065      var prevSnapshot = hook.memoizedState;
16066      var snapshotChanged = !objectIs(prevSnapshot, nextSnapshot);
16067  
16068      if (snapshotChanged) {
16069        hook.memoizedState = nextSnapshot;
16070        markWorkInProgressReceivedUpdate();
16071      }
16072  
16073      var inst = hook.queue;
16074      updateEffect(subscribeToStore.bind(null, fiber, inst, subscribe), [subscribe]); // Whenever getSnapshot or subscribe changes, we need to check in the
16075      // commit phase if there was an interleaved mutation. In concurrent mode
16076      // this can happen all the time, but even in synchronous mode, an earlier
16077      // effect may have mutated the store.
16078  
16079      if (inst.getSnapshot !== getSnapshot || snapshotChanged || // Check if the susbcribe function changed. We can save some memory by
16080      // checking whether we scheduled a subscription effect above.
16081      workInProgressHook !== null && workInProgressHook.memoizedState.tag & HasEffect) {
16082        fiber.flags |= Passive;
16083        pushEffect(HasEffect | Passive$1, updateStoreInstance.bind(null, fiber, inst, nextSnapshot, getSnapshot), undefined, null); // Unless we're rendering a blocking lane, schedule a consistency check.
16084        // Right before committing, we will walk the tree and check if any of the
16085        // stores were mutated.
16086  
16087        var root = getWorkInProgressRoot();
16088  
16089        if (root === null) {
16090          throw new Error('Expected a work-in-progress root. This is a bug in React. Please file an issue.');
16091        }
16092  
16093        if (!includesBlockingLane(root, renderLanes)) {
16094          pushStoreConsistencyCheck(fiber, getSnapshot, nextSnapshot);
16095        }
16096      }
16097  
16098      return nextSnapshot;
16099    }
16100  
16101    function pushStoreConsistencyCheck(fiber, getSnapshot, renderedSnapshot) {
16102      fiber.flags |= StoreConsistency;
16103      var check = {
16104        getSnapshot: getSnapshot,
16105        value: renderedSnapshot
16106      };
16107      var componentUpdateQueue = currentlyRenderingFiber$1.updateQueue;
16108  
16109      if (componentUpdateQueue === null) {
16110        componentUpdateQueue = createFunctionComponentUpdateQueue();
16111        currentlyRenderingFiber$1.updateQueue = componentUpdateQueue;
16112        componentUpdateQueue.stores = [check];
16113      } else {
16114        var stores = componentUpdateQueue.stores;
16115  
16116        if (stores === null) {
16117          componentUpdateQueue.stores = [check];
16118        } else {
16119          stores.push(check);
16120        }
16121      }
16122    }
16123  
16124    function updateStoreInstance(fiber, inst, nextSnapshot, getSnapshot) {
16125      // These are updated in the passive phase
16126      inst.value = nextSnapshot;
16127      inst.getSnapshot = getSnapshot; // Something may have been mutated in between render and commit. This could
16128      // have been in an event that fired before the passive effects, or it could
16129      // have been in a layout effect. In that case, we would have used the old
16130      // snapsho and getSnapshot values to bail out. We need to check one more time.
16131  
16132      if (checkIfSnapshotChanged(inst)) {
16133        // Force a re-render.
16134        forceStoreRerender(fiber);
16135      }
16136    }
16137  
16138    function subscribeToStore(fiber, inst, subscribe) {
16139      var handleStoreChange = function () {
16140        // The store changed. Check if the snapshot changed since the last time we
16141        // read from the store.
16142        if (checkIfSnapshotChanged(inst)) {
16143          // Force a re-render.
16144          forceStoreRerender(fiber);
16145        }
16146      }; // Subscribe to the store and return a clean-up function.
16147  
16148  
16149      return subscribe(handleStoreChange);
16150    }
16151  
16152    function checkIfSnapshotChanged(inst) {
16153      var latestGetSnapshot = inst.getSnapshot;
16154      var prevValue = inst.value;
16155  
16156      try {
16157        var nextValue = latestGetSnapshot();
16158        return !objectIs(prevValue, nextValue);
16159      } catch (error) {
16160        return true;
16161      }
16162    }
16163  
16164    function forceStoreRerender(fiber) {
16165      var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
16166  
16167      if (root !== null) {
16168        scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
16169      }
16170    }
16171  
16172    function mountState(initialState) {
16173      var hook = mountWorkInProgressHook();
16174  
16175      if (typeof initialState === 'function') {
16176        // $FlowFixMe: Flow doesn't like mixed types
16177        initialState = initialState();
16178      }
16179  
16180      hook.memoizedState = hook.baseState = initialState;
16181      var queue = {
16182        pending: null,
16183        interleaved: null,
16184        lanes: NoLanes,
16185        dispatch: null,
16186        lastRenderedReducer: basicStateReducer,
16187        lastRenderedState: initialState
16188      };
16189      hook.queue = queue;
16190      var dispatch = queue.dispatch = dispatchSetState.bind(null, currentlyRenderingFiber$1, queue);
16191      return [hook.memoizedState, dispatch];
16192    }
16193  
16194    function updateState(initialState) {
16195      return updateReducer(basicStateReducer);
16196    }
16197  
16198    function rerenderState(initialState) {
16199      return rerenderReducer(basicStateReducer);
16200    }
16201  
16202    function pushEffect(tag, create, destroy, deps) {
16203      var effect = {
16204        tag: tag,
16205        create: create,
16206        destroy: destroy,
16207        deps: deps,
16208        // Circular
16209        next: null
16210      };
16211      var componentUpdateQueue = currentlyRenderingFiber$1.updateQueue;
16212  
16213      if (componentUpdateQueue === null) {
16214        componentUpdateQueue = createFunctionComponentUpdateQueue();
16215        currentlyRenderingFiber$1.updateQueue = componentUpdateQueue;
16216        componentUpdateQueue.lastEffect = effect.next = effect;
16217      } else {
16218        var lastEffect = componentUpdateQueue.lastEffect;
16219  
16220        if (lastEffect === null) {
16221          componentUpdateQueue.lastEffect = effect.next = effect;
16222        } else {
16223          var firstEffect = lastEffect.next;
16224          lastEffect.next = effect;
16225          effect.next = firstEffect;
16226          componentUpdateQueue.lastEffect = effect;
16227        }
16228      }
16229  
16230      return effect;
16231    }
16232  
16233    function mountRef(initialValue) {
16234      var hook = mountWorkInProgressHook();
16235  
16236      {
16237        var _ref2 = {
16238          current: initialValue
16239        };
16240        hook.memoizedState = _ref2;
16241        return _ref2;
16242      }
16243    }
16244  
16245    function updateRef(initialValue) {
16246      var hook = updateWorkInProgressHook();
16247      return hook.memoizedState;
16248    }
16249  
16250    function mountEffectImpl(fiberFlags, hookFlags, create, deps) {
16251      var hook = mountWorkInProgressHook();
16252      var nextDeps = deps === undefined ? null : deps;
16253      currentlyRenderingFiber$1.flags |= fiberFlags;
16254      hook.memoizedState = pushEffect(HasEffect | hookFlags, create, undefined, nextDeps);
16255    }
16256  
16257    function updateEffectImpl(fiberFlags, hookFlags, create, deps) {
16258      var hook = updateWorkInProgressHook();
16259      var nextDeps = deps === undefined ? null : deps;
16260      var destroy = undefined;
16261  
16262      if (currentHook !== null) {
16263        var prevEffect = currentHook.memoizedState;
16264        destroy = prevEffect.destroy;
16265  
16266        if (nextDeps !== null) {
16267          var prevDeps = prevEffect.deps;
16268  
16269          if (areHookInputsEqual(nextDeps, prevDeps)) {
16270            hook.memoizedState = pushEffect(hookFlags, create, destroy, nextDeps);
16271            return;
16272          }
16273        }
16274      }
16275  
16276      currentlyRenderingFiber$1.flags |= fiberFlags;
16277      hook.memoizedState = pushEffect(HasEffect | hookFlags, create, destroy, nextDeps);
16278    }
16279  
16280    function mountEffect(create, deps) {
16281      if ( (currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
16282        return mountEffectImpl(MountPassiveDev | Passive | PassiveStatic, Passive$1, create, deps);
16283      } else {
16284        return mountEffectImpl(Passive | PassiveStatic, Passive$1, create, deps);
16285      }
16286    }
16287  
16288    function updateEffect(create, deps) {
16289      return updateEffectImpl(Passive, Passive$1, create, deps);
16290    }
16291  
16292    function mountInsertionEffect(create, deps) {
16293      return mountEffectImpl(Update, Insertion, create, deps);
16294    }
16295  
16296    function updateInsertionEffect(create, deps) {
16297      return updateEffectImpl(Update, Insertion, create, deps);
16298    }
16299  
16300    function mountLayoutEffect(create, deps) {
16301      var fiberFlags = Update;
16302  
16303      {
16304        fiberFlags |= LayoutStatic;
16305      }
16306  
16307      if ( (currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
16308        fiberFlags |= MountLayoutDev;
16309      }
16310  
16311      return mountEffectImpl(fiberFlags, Layout, create, deps);
16312    }
16313  
16314    function updateLayoutEffect(create, deps) {
16315      return updateEffectImpl(Update, Layout, create, deps);
16316    }
16317  
16318    function imperativeHandleEffect(create, ref) {
16319      if (typeof ref === 'function') {
16320        var refCallback = ref;
16321  
16322        var _inst = create();
16323  
16324        refCallback(_inst);
16325        return function () {
16326          refCallback(null);
16327        };
16328      } else if (ref !== null && ref !== undefined) {
16329        var refObject = ref;
16330  
16331        {
16332          if (!refObject.hasOwnProperty('current')) {
16333            error('Expected useImperativeHandle() first argument to either be a ' + 'ref callback or React.createRef() object. Instead received: %s.', 'an object with keys {' + Object.keys(refObject).join(', ') + '}');
16334          }
16335        }
16336  
16337        var _inst2 = create();
16338  
16339        refObject.current = _inst2;
16340        return function () {
16341          refObject.current = null;
16342        };
16343      }
16344    }
16345  
16346    function mountImperativeHandle(ref, create, deps) {
16347      {
16348        if (typeof create !== 'function') {
16349          error('Expected useImperativeHandle() second argument to be a function ' + 'that creates a handle. Instead received: %s.', create !== null ? typeof create : 'null');
16350        }
16351      } // TODO: If deps are provided, should we skip comparing the ref itself?
16352  
16353  
16354      var effectDeps = deps !== null && deps !== undefined ? deps.concat([ref]) : null;
16355      var fiberFlags = Update;
16356  
16357      {
16358        fiberFlags |= LayoutStatic;
16359      }
16360  
16361      if ( (currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
16362        fiberFlags |= MountLayoutDev;
16363      }
16364  
16365      return mountEffectImpl(fiberFlags, Layout, imperativeHandleEffect.bind(null, create, ref), effectDeps);
16366    }
16367  
16368    function updateImperativeHandle(ref, create, deps) {
16369      {
16370        if (typeof create !== 'function') {
16371          error('Expected useImperativeHandle() second argument to be a function ' + 'that creates a handle. Instead received: %s.', create !== null ? typeof create : 'null');
16372        }
16373      } // TODO: If deps are provided, should we skip comparing the ref itself?
16374  
16375  
16376      var effectDeps = deps !== null && deps !== undefined ? deps.concat([ref]) : null;
16377      return updateEffectImpl(Update, Layout, imperativeHandleEffect.bind(null, create, ref), effectDeps);
16378    }
16379  
16380    function mountDebugValue(value, formatterFn) {// This hook is normally a no-op.
16381      // The react-debug-hooks package injects its own implementation
16382      // so that e.g. DevTools can display custom hook values.
16383    }
16384  
16385    var updateDebugValue = mountDebugValue;
16386  
16387    function mountCallback(callback, deps) {
16388      var hook = mountWorkInProgressHook();
16389      var nextDeps = deps === undefined ? null : deps;
16390      hook.memoizedState = [callback, nextDeps];
16391      return callback;
16392    }
16393  
16394    function updateCallback(callback, deps) {
16395      var hook = updateWorkInProgressHook();
16396      var nextDeps = deps === undefined ? null : deps;
16397      var prevState = hook.memoizedState;
16398  
16399      if (prevState !== null) {
16400        if (nextDeps !== null) {
16401          var prevDeps = prevState[1];
16402  
16403          if (areHookInputsEqual(nextDeps, prevDeps)) {
16404            return prevState[0];
16405          }
16406        }
16407      }
16408  
16409      hook.memoizedState = [callback, nextDeps];
16410      return callback;
16411    }
16412  
16413    function mountMemo(nextCreate, deps) {
16414      var hook = mountWorkInProgressHook();
16415      var nextDeps = deps === undefined ? null : deps;
16416      var nextValue = nextCreate();
16417      hook.memoizedState = [nextValue, nextDeps];
16418      return nextValue;
16419    }
16420  
16421    function updateMemo(nextCreate, deps) {
16422      var hook = updateWorkInProgressHook();
16423      var nextDeps = deps === undefined ? null : deps;
16424      var prevState = hook.memoizedState;
16425  
16426      if (prevState !== null) {
16427        // Assume these are defined. If they're not, areHookInputsEqual will warn.
16428        if (nextDeps !== null) {
16429          var prevDeps = prevState[1];
16430  
16431          if (areHookInputsEqual(nextDeps, prevDeps)) {
16432            return prevState[0];
16433          }
16434        }
16435      }
16436  
16437      var nextValue = nextCreate();
16438      hook.memoizedState = [nextValue, nextDeps];
16439      return nextValue;
16440    }
16441  
16442    function mountDeferredValue(value) {
16443      var hook = mountWorkInProgressHook();
16444      hook.memoizedState = value;
16445      return value;
16446    }
16447  
16448    function updateDeferredValue(value) {
16449      var hook = updateWorkInProgressHook();
16450      var resolvedCurrentHook = currentHook;
16451      var prevValue = resolvedCurrentHook.memoizedState;
16452      return updateDeferredValueImpl(hook, prevValue, value);
16453    }
16454  
16455    function rerenderDeferredValue(value) {
16456      var hook = updateWorkInProgressHook();
16457  
16458      if (currentHook === null) {
16459        // This is a rerender during a mount.
16460        hook.memoizedState = value;
16461        return value;
16462      } else {
16463        // This is a rerender during an update.
16464        var prevValue = currentHook.memoizedState;
16465        return updateDeferredValueImpl(hook, prevValue, value);
16466      }
16467    }
16468  
16469    function updateDeferredValueImpl(hook, prevValue, value) {
16470      var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes);
16471  
16472      if (shouldDeferValue) {
16473        // This is an urgent update. If the value has changed, keep using the
16474        // previous value and spawn a deferred render to update it later.
16475        if (!objectIs(value, prevValue)) {
16476          // Schedule a deferred render
16477          var deferredLane = claimNextTransitionLane();
16478          currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, deferredLane);
16479          markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent
16480          // from the latest value. The name "baseState" doesn't really match how we
16481          // use it because we're reusing a state hook field instead of creating a
16482          // new one.
16483  
16484          hook.baseState = true;
16485        } // Reuse the previous value
16486  
16487  
16488        return prevValue;
16489      } else {
16490        // This is not an urgent update, so we can use the latest value regardless
16491        // of what it is. No need to defer it.
16492        // However, if we're currently inside a spawned render, then we need to mark
16493        // this as an update to prevent the fiber from bailing out.
16494        //
16495        // `baseState` is true when the current value is different from the rendered
16496        // value. The name doesn't really match how we use it because we're reusing
16497        // a state hook field instead of creating a new one.
16498        if (hook.baseState) {
16499          // Flip this back to false.
16500          hook.baseState = false;
16501          markWorkInProgressReceivedUpdate();
16502        }
16503  
16504        hook.memoizedState = value;
16505        return value;
16506      }
16507    }
16508  
16509    function startTransition(setPending, callback, options) {
16510      var previousPriority = getCurrentUpdatePriority();
16511      setCurrentUpdatePriority(higherEventPriority(previousPriority, ContinuousEventPriority));
16512      setPending(true);
16513      var prevTransition = ReactCurrentBatchConfig$2.transition;
16514      ReactCurrentBatchConfig$2.transition = {};
16515      var currentTransition = ReactCurrentBatchConfig$2.transition;
16516  
16517      {
16518        ReactCurrentBatchConfig$2.transition._updatedFibers = new Set();
16519      }
16520  
16521      try {
16522        setPending(false);
16523        callback();
16524      } finally {
16525        setCurrentUpdatePriority(previousPriority);
16526        ReactCurrentBatchConfig$2.transition = prevTransition;
16527  
16528        {
16529          if (prevTransition === null && currentTransition._updatedFibers) {
16530            var updatedFibersCount = currentTransition._updatedFibers.size;
16531  
16532            if (updatedFibersCount > 10) {
16533              warn('Detected a large number of updates inside startTransition. ' + 'If this is due to a subscription please re-write it to use React provided hooks. ' + 'Otherwise concurrent mode guarantees are off the table.');
16534            }
16535  
16536            currentTransition._updatedFibers.clear();
16537          }
16538        }
16539      }
16540    }
16541  
16542    function mountTransition() {
16543      var _mountState = mountState(false),
16544          isPending = _mountState[0],
16545          setPending = _mountState[1]; // The `start` method never changes.
16546  
16547  
16548      var start = startTransition.bind(null, setPending);
16549      var hook = mountWorkInProgressHook();
16550      hook.memoizedState = start;
16551      return [isPending, start];
16552    }
16553  
16554    function updateTransition() {
16555      var _updateState = updateState(),
16556          isPending = _updateState[0];
16557  
16558      var hook = updateWorkInProgressHook();
16559      var start = hook.memoizedState;
16560      return [isPending, start];
16561    }
16562  
16563    function rerenderTransition() {
16564      var _rerenderState = rerenderState(),
16565          isPending = _rerenderState[0];
16566  
16567      var hook = updateWorkInProgressHook();
16568      var start = hook.memoizedState;
16569      return [isPending, start];
16570    }
16571  
16572    var isUpdatingOpaqueValueInRenderPhase = false;
16573    function getIsUpdatingOpaqueValueInRenderPhaseInDEV() {
16574      {
16575        return isUpdatingOpaqueValueInRenderPhase;
16576      }
16577    }
16578  
16579    function mountId() {
16580      var hook = mountWorkInProgressHook();
16581      var root = getWorkInProgressRoot(); // TODO: In Fizz, id generation is specific to each server config. Maybe we
16582      // should do this in Fiber, too? Deferring this decision for now because
16583      // there's no other place to store the prefix except for an internal field on
16584      // the public createRoot object, which the fiber tree does not currently have
16585      // a reference to.
16586  
16587      var identifierPrefix = root.identifierPrefix;
16588      var id;
16589  
16590      if (getIsHydrating()) {
16591        var treeId = getTreeId(); // Use a captial R prefix for server-generated ids.
16592  
16593        id = ':' + identifierPrefix + 'R' + treeId; // Unless this is the first id at this level, append a number at the end
16594        // that represents the position of this useId hook among all the useId
16595        // hooks for this fiber.
16596  
16597        var localId = localIdCounter++;
16598  
16599        if (localId > 0) {
16600          id += 'H' + localId.toString(32);
16601        }
16602  
16603        id += ':';
16604      } else {
16605        // Use a lowercase r prefix for client-generated ids.
16606        var globalClientId = globalClientIdCounter++;
16607        id = ':' + identifierPrefix + 'r' + globalClientId.toString(32) + ':';
16608      }
16609  
16610      hook.memoizedState = id;
16611      return id;
16612    }
16613  
16614    function updateId() {
16615      var hook = updateWorkInProgressHook();
16616      var id = hook.memoizedState;
16617      return id;
16618    }
16619  
16620    function dispatchReducerAction(fiber, queue, action) {
16621      {
16622        if (typeof arguments[3] === 'function') {
16623          error("State updates from the useState() and useReducer() Hooks don't support the " + 'second callback argument. To execute a side effect after ' + 'rendering, declare it in the component body with useEffect().');
16624        }
16625      }
16626  
16627      var lane = requestUpdateLane(fiber);
16628      var update = {
16629        lane: lane,
16630        action: action,
16631        hasEagerState: false,
16632        eagerState: null,
16633        next: null
16634      };
16635  
16636      if (isRenderPhaseUpdate(fiber)) {
16637        enqueueRenderPhaseUpdate(queue, update);
16638      } else {
16639        var root = enqueueConcurrentHookUpdate(fiber, queue, update, lane);
16640  
16641        if (root !== null) {
16642          var eventTime = requestEventTime();
16643          scheduleUpdateOnFiber(root, fiber, lane, eventTime);
16644          entangleTransitionUpdate(root, queue, lane);
16645        }
16646      }
16647  
16648      markUpdateInDevTools(fiber, lane);
16649    }
16650  
16651    function dispatchSetState(fiber, queue, action) {
16652      {
16653        if (typeof arguments[3] === 'function') {
16654          error("State updates from the useState() and useReducer() Hooks don't support the " + 'second callback argument. To execute a side effect after ' + 'rendering, declare it in the component body with useEffect().');
16655        }
16656      }
16657  
16658      var lane = requestUpdateLane(fiber);
16659      var update = {
16660        lane: lane,
16661        action: action,
16662        hasEagerState: false,
16663        eagerState: null,
16664        next: null
16665      };
16666  
16667      if (isRenderPhaseUpdate(fiber)) {
16668        enqueueRenderPhaseUpdate(queue, update);
16669      } else {
16670        var alternate = fiber.alternate;
16671  
16672        if (fiber.lanes === NoLanes && (alternate === null || alternate.lanes === NoLanes)) {
16673          // The queue is currently empty, which means we can eagerly compute the
16674          // next state before entering the render phase. If the new state is the
16675          // same as the current state, we may be able to bail out entirely.
16676          var lastRenderedReducer = queue.lastRenderedReducer;
16677  
16678          if (lastRenderedReducer !== null) {
16679            var prevDispatcher;
16680  
16681            {
16682              prevDispatcher = ReactCurrentDispatcher$1.current;
16683              ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
16684            }
16685  
16686            try {
16687              var currentState = queue.lastRenderedState;
16688              var eagerState = lastRenderedReducer(currentState, action); // Stash the eagerly computed state, and the reducer used to compute
16689              // it, on the update object. If the reducer hasn't changed by the
16690              // time we enter the render phase, then the eager state can be used
16691              // without calling the reducer again.
16692  
16693              update.hasEagerState = true;
16694              update.eagerState = eagerState;
16695  
16696              if (objectIs(eagerState, currentState)) {
16697                // Fast path. We can bail out without scheduling React to re-render.
16698                // It's still possible that we'll need to rebase this update later,
16699                // if the component re-renders for a different reason and by that
16700                // time the reducer has changed.
16701                // TODO: Do we still need to entangle transitions in this case?
16702                enqueueConcurrentHookUpdateAndEagerlyBailout(fiber, queue, update, lane);
16703                return;
16704              }
16705            } catch (error) {// Suppress the error. It will throw again in the render phase.
16706            } finally {
16707              {
16708                ReactCurrentDispatcher$1.current = prevDispatcher;
16709              }
16710            }
16711          }
16712        }
16713  
16714        var root = enqueueConcurrentHookUpdate(fiber, queue, update, lane);
16715  
16716        if (root !== null) {
16717          var eventTime = requestEventTime();
16718          scheduleUpdateOnFiber(root, fiber, lane, eventTime);
16719          entangleTransitionUpdate(root, queue, lane);
16720        }
16721      }
16722  
16723      markUpdateInDevTools(fiber, lane);
16724    }
16725  
16726    function isRenderPhaseUpdate(fiber) {
16727      var alternate = fiber.alternate;
16728      return fiber === currentlyRenderingFiber$1 || alternate !== null && alternate === currentlyRenderingFiber$1;
16729    }
16730  
16731    function enqueueRenderPhaseUpdate(queue, update) {
16732      // This is a render phase update. Stash it in a lazily-created map of
16733      // queue -> linked list of updates. After this render pass, we'll restart
16734      // and apply the stashed updates on top of the work-in-progress hook.
16735      didScheduleRenderPhaseUpdateDuringThisPass = didScheduleRenderPhaseUpdate = true;
16736      var pending = queue.pending;
16737  
16738      if (pending === null) {
16739        // This is the first update. Create a circular list.
16740        update.next = update;
16741      } else {
16742        update.next = pending.next;
16743        pending.next = update;
16744      }
16745  
16746      queue.pending = update;
16747    } // TODO: Move to ReactFiberConcurrentUpdates?
16748  
16749  
16750    function entangleTransitionUpdate(root, queue, lane) {
16751      if (isTransitionLane(lane)) {
16752        var queueLanes = queue.lanes; // If any entangled lanes are no longer pending on the root, then they
16753        // must have finished. We can remove them from the shared queue, which
16754        // represents a superset of the actually pending lanes. In some cases we
16755        // may entangle more than we need to, but that's OK. In fact it's worse if
16756        // we *don't* entangle when we should.
16757  
16758        queueLanes = intersectLanes(queueLanes, root.pendingLanes); // Entangle the new transition lane with the other transition lanes.
16759  
16760        var newQueueLanes = mergeLanes(queueLanes, lane);
16761        queue.lanes = newQueueLanes; // Even if queue.lanes already include lane, we don't know for certain if
16762        // the lane finished since the last time we entangled it. So we need to
16763        // entangle it again, just to be sure.
16764  
16765        markRootEntangled(root, newQueueLanes);
16766      }
16767    }
16768  
16769    function markUpdateInDevTools(fiber, lane, action) {
16770  
16771      {
16772        markStateUpdateScheduled(fiber, lane);
16773      }
16774    }
16775  
16776    var ContextOnlyDispatcher = {
16777      readContext: readContext,
16778      useCallback: throwInvalidHookError,
16779      useContext: throwInvalidHookError,
16780      useEffect: throwInvalidHookError,
16781      useImperativeHandle: throwInvalidHookError,
16782      useInsertionEffect: throwInvalidHookError,
16783      useLayoutEffect: throwInvalidHookError,
16784      useMemo: throwInvalidHookError,
16785      useReducer: throwInvalidHookError,
16786      useRef: throwInvalidHookError,
16787      useState: throwInvalidHookError,
16788      useDebugValue: throwInvalidHookError,
16789      useDeferredValue: throwInvalidHookError,
16790      useTransition: throwInvalidHookError,
16791      useMutableSource: throwInvalidHookError,
16792      useSyncExternalStore: throwInvalidHookError,
16793      useId: throwInvalidHookError,
16794      unstable_isNewReconciler: enableNewReconciler
16795    };
16796  
16797    var HooksDispatcherOnMountInDEV = null;
16798    var HooksDispatcherOnMountWithHookTypesInDEV = null;
16799    var HooksDispatcherOnUpdateInDEV = null;
16800    var HooksDispatcherOnRerenderInDEV = null;
16801    var InvalidNestedHooksDispatcherOnMountInDEV = null;
16802    var InvalidNestedHooksDispatcherOnUpdateInDEV = null;
16803    var InvalidNestedHooksDispatcherOnRerenderInDEV = null;
16804  
16805    {
16806      var warnInvalidContextAccess = function () {
16807        error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().');
16808      };
16809  
16810      var warnInvalidHookAccess = function () {
16811        error('Do not call Hooks inside useEffect(...), useMemo(...), or other built-in Hooks. ' + 'You can only call Hooks at the top level of your React function. ' + 'For more information, see ' + 'https://reactjs.org/link/rules-of-hooks');
16812      };
16813  
16814      HooksDispatcherOnMountInDEV = {
16815        readContext: function (context) {
16816          return readContext(context);
16817        },
16818        useCallback: function (callback, deps) {
16819          currentHookNameInDev = 'useCallback';
16820          mountHookTypesDev();
16821          checkDepsAreArrayDev(deps);
16822          return mountCallback(callback, deps);
16823        },
16824        useContext: function (context) {
16825          currentHookNameInDev = 'useContext';
16826          mountHookTypesDev();
16827          return readContext(context);
16828        },
16829        useEffect: function (create, deps) {
16830          currentHookNameInDev = 'useEffect';
16831          mountHookTypesDev();
16832          checkDepsAreArrayDev(deps);
16833          return mountEffect(create, deps);
16834        },
16835        useImperativeHandle: function (ref, create, deps) {
16836          currentHookNameInDev = 'useImperativeHandle';
16837          mountHookTypesDev();
16838          checkDepsAreArrayDev(deps);
16839          return mountImperativeHandle(ref, create, deps);
16840        },
16841        useInsertionEffect: function (create, deps) {
16842          currentHookNameInDev = 'useInsertionEffect';
16843          mountHookTypesDev();
16844          checkDepsAreArrayDev(deps);
16845          return mountInsertionEffect(create, deps);
16846        },
16847        useLayoutEffect: function (create, deps) {
16848          currentHookNameInDev = 'useLayoutEffect';
16849          mountHookTypesDev();
16850          checkDepsAreArrayDev(deps);
16851          return mountLayoutEffect(create, deps);
16852        },
16853        useMemo: function (create, deps) {
16854          currentHookNameInDev = 'useMemo';
16855          mountHookTypesDev();
16856          checkDepsAreArrayDev(deps);
16857          var prevDispatcher = ReactCurrentDispatcher$1.current;
16858          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
16859  
16860          try {
16861            return mountMemo(create, deps);
16862          } finally {
16863            ReactCurrentDispatcher$1.current = prevDispatcher;
16864          }
16865        },
16866        useReducer: function (reducer, initialArg, init) {
16867          currentHookNameInDev = 'useReducer';
16868          mountHookTypesDev();
16869          var prevDispatcher = ReactCurrentDispatcher$1.current;
16870          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
16871  
16872          try {
16873            return mountReducer(reducer, initialArg, init);
16874          } finally {
16875            ReactCurrentDispatcher$1.current = prevDispatcher;
16876          }
16877        },
16878        useRef: function (initialValue) {
16879          currentHookNameInDev = 'useRef';
16880          mountHookTypesDev();
16881          return mountRef(initialValue);
16882        },
16883        useState: function (initialState) {
16884          currentHookNameInDev = 'useState';
16885          mountHookTypesDev();
16886          var prevDispatcher = ReactCurrentDispatcher$1.current;
16887          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
16888  
16889          try {
16890            return mountState(initialState);
16891          } finally {
16892            ReactCurrentDispatcher$1.current = prevDispatcher;
16893          }
16894        },
16895        useDebugValue: function (value, formatterFn) {
16896          currentHookNameInDev = 'useDebugValue';
16897          mountHookTypesDev();
16898          return mountDebugValue();
16899        },
16900        useDeferredValue: function (value) {
16901          currentHookNameInDev = 'useDeferredValue';
16902          mountHookTypesDev();
16903          return mountDeferredValue(value);
16904        },
16905        useTransition: function () {
16906          currentHookNameInDev = 'useTransition';
16907          mountHookTypesDev();
16908          return mountTransition();
16909        },
16910        useMutableSource: function (source, getSnapshot, subscribe) {
16911          currentHookNameInDev = 'useMutableSource';
16912          mountHookTypesDev();
16913          return mountMutableSource();
16914        },
16915        useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
16916          currentHookNameInDev = 'useSyncExternalStore';
16917          mountHookTypesDev();
16918          return mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
16919        },
16920        useId: function () {
16921          currentHookNameInDev = 'useId';
16922          mountHookTypesDev();
16923          return mountId();
16924        },
16925        unstable_isNewReconciler: enableNewReconciler
16926      };
16927  
16928      HooksDispatcherOnMountWithHookTypesInDEV = {
16929        readContext: function (context) {
16930          return readContext(context);
16931        },
16932        useCallback: function (callback, deps) {
16933          currentHookNameInDev = 'useCallback';
16934          updateHookTypesDev();
16935          return mountCallback(callback, deps);
16936        },
16937        useContext: function (context) {
16938          currentHookNameInDev = 'useContext';
16939          updateHookTypesDev();
16940          return readContext(context);
16941        },
16942        useEffect: function (create, deps) {
16943          currentHookNameInDev = 'useEffect';
16944          updateHookTypesDev();
16945          return mountEffect(create, deps);
16946        },
16947        useImperativeHandle: function (ref, create, deps) {
16948          currentHookNameInDev = 'useImperativeHandle';
16949          updateHookTypesDev();
16950          return mountImperativeHandle(ref, create, deps);
16951        },
16952        useInsertionEffect: function (create, deps) {
16953          currentHookNameInDev = 'useInsertionEffect';
16954          updateHookTypesDev();
16955          return mountInsertionEffect(create, deps);
16956        },
16957        useLayoutEffect: function (create, deps) {
16958          currentHookNameInDev = 'useLayoutEffect';
16959          updateHookTypesDev();
16960          return mountLayoutEffect(create, deps);
16961        },
16962        useMemo: function (create, deps) {
16963          currentHookNameInDev = 'useMemo';
16964          updateHookTypesDev();
16965          var prevDispatcher = ReactCurrentDispatcher$1.current;
16966          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
16967  
16968          try {
16969            return mountMemo(create, deps);
16970          } finally {
16971            ReactCurrentDispatcher$1.current = prevDispatcher;
16972          }
16973        },
16974        useReducer: function (reducer, initialArg, init) {
16975          currentHookNameInDev = 'useReducer';
16976          updateHookTypesDev();
16977          var prevDispatcher = ReactCurrentDispatcher$1.current;
16978          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
16979  
16980          try {
16981            return mountReducer(reducer, initialArg, init);
16982          } finally {
16983            ReactCurrentDispatcher$1.current = prevDispatcher;
16984          }
16985        },
16986        useRef: function (initialValue) {
16987          currentHookNameInDev = 'useRef';
16988          updateHookTypesDev();
16989          return mountRef(initialValue);
16990        },
16991        useState: function (initialState) {
16992          currentHookNameInDev = 'useState';
16993          updateHookTypesDev();
16994          var prevDispatcher = ReactCurrentDispatcher$1.current;
16995          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
16996  
16997          try {
16998            return mountState(initialState);
16999          } finally {
17000            ReactCurrentDispatcher$1.current = prevDispatcher;
17001          }
17002        },
17003        useDebugValue: function (value, formatterFn) {
17004          currentHookNameInDev = 'useDebugValue';
17005          updateHookTypesDev();
17006          return mountDebugValue();
17007        },
17008        useDeferredValue: function (value) {
17009          currentHookNameInDev = 'useDeferredValue';
17010          updateHookTypesDev();
17011          return mountDeferredValue(value);
17012        },
17013        useTransition: function () {
17014          currentHookNameInDev = 'useTransition';
17015          updateHookTypesDev();
17016          return mountTransition();
17017        },
17018        useMutableSource: function (source, getSnapshot, subscribe) {
17019          currentHookNameInDev = 'useMutableSource';
17020          updateHookTypesDev();
17021          return mountMutableSource();
17022        },
17023        useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
17024          currentHookNameInDev = 'useSyncExternalStore';
17025          updateHookTypesDev();
17026          return mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
17027        },
17028        useId: function () {
17029          currentHookNameInDev = 'useId';
17030          updateHookTypesDev();
17031          return mountId();
17032        },
17033        unstable_isNewReconciler: enableNewReconciler
17034      };
17035  
17036      HooksDispatcherOnUpdateInDEV = {
17037        readContext: function (context) {
17038          return readContext(context);
17039        },
17040        useCallback: function (callback, deps) {
17041          currentHookNameInDev = 'useCallback';
17042          updateHookTypesDev();
17043          return updateCallback(callback, deps);
17044        },
17045        useContext: function (context) {
17046          currentHookNameInDev = 'useContext';
17047          updateHookTypesDev();
17048          return readContext(context);
17049        },
17050        useEffect: function (create, deps) {
17051          currentHookNameInDev = 'useEffect';
17052          updateHookTypesDev();
17053          return updateEffect(create, deps);
17054        },
17055        useImperativeHandle: function (ref, create, deps) {
17056          currentHookNameInDev = 'useImperativeHandle';
17057          updateHookTypesDev();
17058          return updateImperativeHandle(ref, create, deps);
17059        },
17060        useInsertionEffect: function (create, deps) {
17061          currentHookNameInDev = 'useInsertionEffect';
17062          updateHookTypesDev();
17063          return updateInsertionEffect(create, deps);
17064        },
17065        useLayoutEffect: function (create, deps) {
17066          currentHookNameInDev = 'useLayoutEffect';
17067          updateHookTypesDev();
17068          return updateLayoutEffect(create, deps);
17069        },
17070        useMemo: function (create, deps) {
17071          currentHookNameInDev = 'useMemo';
17072          updateHookTypesDev();
17073          var prevDispatcher = ReactCurrentDispatcher$1.current;
17074          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
17075  
17076          try {
17077            return updateMemo(create, deps);
17078          } finally {
17079            ReactCurrentDispatcher$1.current = prevDispatcher;
17080          }
17081        },
17082        useReducer: function (reducer, initialArg, init) {
17083          currentHookNameInDev = 'useReducer';
17084          updateHookTypesDev();
17085          var prevDispatcher = ReactCurrentDispatcher$1.current;
17086          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
17087  
17088          try {
17089            return updateReducer(reducer, initialArg, init);
17090          } finally {
17091            ReactCurrentDispatcher$1.current = prevDispatcher;
17092          }
17093        },
17094        useRef: function (initialValue) {
17095          currentHookNameInDev = 'useRef';
17096          updateHookTypesDev();
17097          return updateRef();
17098        },
17099        useState: function (initialState) {
17100          currentHookNameInDev = 'useState';
17101          updateHookTypesDev();
17102          var prevDispatcher = ReactCurrentDispatcher$1.current;
17103          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
17104  
17105          try {
17106            return updateState(initialState);
17107          } finally {
17108            ReactCurrentDispatcher$1.current = prevDispatcher;
17109          }
17110        },
17111        useDebugValue: function (value, formatterFn) {
17112          currentHookNameInDev = 'useDebugValue';
17113          updateHookTypesDev();
17114          return updateDebugValue();
17115        },
17116        useDeferredValue: function (value) {
17117          currentHookNameInDev = 'useDeferredValue';
17118          updateHookTypesDev();
17119          return updateDeferredValue(value);
17120        },
17121        useTransition: function () {
17122          currentHookNameInDev = 'useTransition';
17123          updateHookTypesDev();
17124          return updateTransition();
17125        },
17126        useMutableSource: function (source, getSnapshot, subscribe) {
17127          currentHookNameInDev = 'useMutableSource';
17128          updateHookTypesDev();
17129          return updateMutableSource();
17130        },
17131        useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
17132          currentHookNameInDev = 'useSyncExternalStore';
17133          updateHookTypesDev();
17134          return updateSyncExternalStore(subscribe, getSnapshot);
17135        },
17136        useId: function () {
17137          currentHookNameInDev = 'useId';
17138          updateHookTypesDev();
17139          return updateId();
17140        },
17141        unstable_isNewReconciler: enableNewReconciler
17142      };
17143  
17144      HooksDispatcherOnRerenderInDEV = {
17145        readContext: function (context) {
17146          return readContext(context);
17147        },
17148        useCallback: function (callback, deps) {
17149          currentHookNameInDev = 'useCallback';
17150          updateHookTypesDev();
17151          return updateCallback(callback, deps);
17152        },
17153        useContext: function (context) {
17154          currentHookNameInDev = 'useContext';
17155          updateHookTypesDev();
17156          return readContext(context);
17157        },
17158        useEffect: function (create, deps) {
17159          currentHookNameInDev = 'useEffect';
17160          updateHookTypesDev();
17161          return updateEffect(create, deps);
17162        },
17163        useImperativeHandle: function (ref, create, deps) {
17164          currentHookNameInDev = 'useImperativeHandle';
17165          updateHookTypesDev();
17166          return updateImperativeHandle(ref, create, deps);
17167        },
17168        useInsertionEffect: function (create, deps) {
17169          currentHookNameInDev = 'useInsertionEffect';
17170          updateHookTypesDev();
17171          return updateInsertionEffect(create, deps);
17172        },
17173        useLayoutEffect: function (create, deps) {
17174          currentHookNameInDev = 'useLayoutEffect';
17175          updateHookTypesDev();
17176          return updateLayoutEffect(create, deps);
17177        },
17178        useMemo: function (create, deps) {
17179          currentHookNameInDev = 'useMemo';
17180          updateHookTypesDev();
17181          var prevDispatcher = ReactCurrentDispatcher$1.current;
17182          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV;
17183  
17184          try {
17185            return updateMemo(create, deps);
17186          } finally {
17187            ReactCurrentDispatcher$1.current = prevDispatcher;
17188          }
17189        },
17190        useReducer: function (reducer, initialArg, init) {
17191          currentHookNameInDev = 'useReducer';
17192          updateHookTypesDev();
17193          var prevDispatcher = ReactCurrentDispatcher$1.current;
17194          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV;
17195  
17196          try {
17197            return rerenderReducer(reducer, initialArg, init);
17198          } finally {
17199            ReactCurrentDispatcher$1.current = prevDispatcher;
17200          }
17201        },
17202        useRef: function (initialValue) {
17203          currentHookNameInDev = 'useRef';
17204          updateHookTypesDev();
17205          return updateRef();
17206        },
17207        useState: function (initialState) {
17208          currentHookNameInDev = 'useState';
17209          updateHookTypesDev();
17210          var prevDispatcher = ReactCurrentDispatcher$1.current;
17211          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV;
17212  
17213          try {
17214            return rerenderState(initialState);
17215          } finally {
17216            ReactCurrentDispatcher$1.current = prevDispatcher;
17217          }
17218        },
17219        useDebugValue: function (value, formatterFn) {
17220          currentHookNameInDev = 'useDebugValue';
17221          updateHookTypesDev();
17222          return updateDebugValue();
17223        },
17224        useDeferredValue: function (value) {
17225          currentHookNameInDev = 'useDeferredValue';
17226          updateHookTypesDev();
17227          return rerenderDeferredValue(value);
17228        },
17229        useTransition: function () {
17230          currentHookNameInDev = 'useTransition';
17231          updateHookTypesDev();
17232          return rerenderTransition();
17233        },
17234        useMutableSource: function (source, getSnapshot, subscribe) {
17235          currentHookNameInDev = 'useMutableSource';
17236          updateHookTypesDev();
17237          return updateMutableSource();
17238        },
17239        useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
17240          currentHookNameInDev = 'useSyncExternalStore';
17241          updateHookTypesDev();
17242          return updateSyncExternalStore(subscribe, getSnapshot);
17243        },
17244        useId: function () {
17245          currentHookNameInDev = 'useId';
17246          updateHookTypesDev();
17247          return updateId();
17248        },
17249        unstable_isNewReconciler: enableNewReconciler
17250      };
17251  
17252      InvalidNestedHooksDispatcherOnMountInDEV = {
17253        readContext: function (context) {
17254          warnInvalidContextAccess();
17255          return readContext(context);
17256        },
17257        useCallback: function (callback, deps) {
17258          currentHookNameInDev = 'useCallback';
17259          warnInvalidHookAccess();
17260          mountHookTypesDev();
17261          return mountCallback(callback, deps);
17262        },
17263        useContext: function (context) {
17264          currentHookNameInDev = 'useContext';
17265          warnInvalidHookAccess();
17266          mountHookTypesDev();
17267          return readContext(context);
17268        },
17269        useEffect: function (create, deps) {
17270          currentHookNameInDev = 'useEffect';
17271          warnInvalidHookAccess();
17272          mountHookTypesDev();
17273          return mountEffect(create, deps);
17274        },
17275        useImperativeHandle: function (ref, create, deps) {
17276          currentHookNameInDev = 'useImperativeHandle';
17277          warnInvalidHookAccess();
17278          mountHookTypesDev();
17279          return mountImperativeHandle(ref, create, deps);
17280        },
17281        useInsertionEffect: function (create, deps) {
17282          currentHookNameInDev = 'useInsertionEffect';
17283          warnInvalidHookAccess();
17284          mountHookTypesDev();
17285          return mountInsertionEffect(create, deps);
17286        },
17287        useLayoutEffect: function (create, deps) {
17288          currentHookNameInDev = 'useLayoutEffect';
17289          warnInvalidHookAccess();
17290          mountHookTypesDev();
17291          return mountLayoutEffect(create, deps);
17292        },
17293        useMemo: function (create, deps) {
17294          currentHookNameInDev = 'useMemo';
17295          warnInvalidHookAccess();
17296          mountHookTypesDev();
17297          var prevDispatcher = ReactCurrentDispatcher$1.current;
17298          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
17299  
17300          try {
17301            return mountMemo(create, deps);
17302          } finally {
17303            ReactCurrentDispatcher$1.current = prevDispatcher;
17304          }
17305        },
17306        useReducer: function (reducer, initialArg, init) {
17307          currentHookNameInDev = 'useReducer';
17308          warnInvalidHookAccess();
17309          mountHookTypesDev();
17310          var prevDispatcher = ReactCurrentDispatcher$1.current;
17311          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
17312  
17313          try {
17314            return mountReducer(reducer, initialArg, init);
17315          } finally {
17316            ReactCurrentDispatcher$1.current = prevDispatcher;
17317          }
17318        },
17319        useRef: function (initialValue) {
17320          currentHookNameInDev = 'useRef';
17321          warnInvalidHookAccess();
17322          mountHookTypesDev();
17323          return mountRef(initialValue);
17324        },
17325        useState: function (initialState) {
17326          currentHookNameInDev = 'useState';
17327          warnInvalidHookAccess();
17328          mountHookTypesDev();
17329          var prevDispatcher = ReactCurrentDispatcher$1.current;
17330          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
17331  
17332          try {
17333            return mountState(initialState);
17334          } finally {
17335            ReactCurrentDispatcher$1.current = prevDispatcher;
17336          }
17337        },
17338        useDebugValue: function (value, formatterFn) {
17339          currentHookNameInDev = 'useDebugValue';
17340          warnInvalidHookAccess();
17341          mountHookTypesDev();
17342          return mountDebugValue();
17343        },
17344        useDeferredValue: function (value) {
17345          currentHookNameInDev = 'useDeferredValue';
17346          warnInvalidHookAccess();
17347          mountHookTypesDev();
17348          return mountDeferredValue(value);
17349        },
17350        useTransition: function () {
17351          currentHookNameInDev = 'useTransition';
17352          warnInvalidHookAccess();
17353          mountHookTypesDev();
17354          return mountTransition();
17355        },
17356        useMutableSource: function (source, getSnapshot, subscribe) {
17357          currentHookNameInDev = 'useMutableSource';
17358          warnInvalidHookAccess();
17359          mountHookTypesDev();
17360          return mountMutableSource();
17361        },
17362        useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
17363          currentHookNameInDev = 'useSyncExternalStore';
17364          warnInvalidHookAccess();
17365          mountHookTypesDev();
17366          return mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
17367        },
17368        useId: function () {
17369          currentHookNameInDev = 'useId';
17370          warnInvalidHookAccess();
17371          mountHookTypesDev();
17372          return mountId();
17373        },
17374        unstable_isNewReconciler: enableNewReconciler
17375      };
17376  
17377      InvalidNestedHooksDispatcherOnUpdateInDEV = {
17378        readContext: function (context) {
17379          warnInvalidContextAccess();
17380          return readContext(context);
17381        },
17382        useCallback: function (callback, deps) {
17383          currentHookNameInDev = 'useCallback';
17384          warnInvalidHookAccess();
17385          updateHookTypesDev();
17386          return updateCallback(callback, deps);
17387        },
17388        useContext: function (context) {
17389          currentHookNameInDev = 'useContext';
17390          warnInvalidHookAccess();
17391          updateHookTypesDev();
17392          return readContext(context);
17393        },
17394        useEffect: function (create, deps) {
17395          currentHookNameInDev = 'useEffect';
17396          warnInvalidHookAccess();
17397          updateHookTypesDev();
17398          return updateEffect(create, deps);
17399        },
17400        useImperativeHandle: function (ref, create, deps) {
17401          currentHookNameInDev = 'useImperativeHandle';
17402          warnInvalidHookAccess();
17403          updateHookTypesDev();
17404          return updateImperativeHandle(ref, create, deps);
17405        },
17406        useInsertionEffect: function (create, deps) {
17407          currentHookNameInDev = 'useInsertionEffect';
17408          warnInvalidHookAccess();
17409          updateHookTypesDev();
17410          return updateInsertionEffect(create, deps);
17411        },
17412        useLayoutEffect: function (create, deps) {
17413          currentHookNameInDev = 'useLayoutEffect';
17414          warnInvalidHookAccess();
17415          updateHookTypesDev();
17416          return updateLayoutEffect(create, deps);
17417        },
17418        useMemo: function (create, deps) {
17419          currentHookNameInDev = 'useMemo';
17420          warnInvalidHookAccess();
17421          updateHookTypesDev();
17422          var prevDispatcher = ReactCurrentDispatcher$1.current;
17423          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
17424  
17425          try {
17426            return updateMemo(create, deps);
17427          } finally {
17428            ReactCurrentDispatcher$1.current = prevDispatcher;
17429          }
17430        },
17431        useReducer: function (reducer, initialArg, init) {
17432          currentHookNameInDev = 'useReducer';
17433          warnInvalidHookAccess();
17434          updateHookTypesDev();
17435          var prevDispatcher = ReactCurrentDispatcher$1.current;
17436          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
17437  
17438          try {
17439            return updateReducer(reducer, initialArg, init);
17440          } finally {
17441            ReactCurrentDispatcher$1.current = prevDispatcher;
17442          }
17443        },
17444        useRef: function (initialValue) {
17445          currentHookNameInDev = 'useRef';
17446          warnInvalidHookAccess();
17447          updateHookTypesDev();
17448          return updateRef();
17449        },
17450        useState: function (initialState) {
17451          currentHookNameInDev = 'useState';
17452          warnInvalidHookAccess();
17453          updateHookTypesDev();
17454          var prevDispatcher = ReactCurrentDispatcher$1.current;
17455          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
17456  
17457          try {
17458            return updateState(initialState);
17459          } finally {
17460            ReactCurrentDispatcher$1.current = prevDispatcher;
17461          }
17462        },
17463        useDebugValue: function (value, formatterFn) {
17464          currentHookNameInDev = 'useDebugValue';
17465          warnInvalidHookAccess();
17466          updateHookTypesDev();
17467          return updateDebugValue();
17468        },
17469        useDeferredValue: function (value) {
17470          currentHookNameInDev = 'useDeferredValue';
17471          warnInvalidHookAccess();
17472          updateHookTypesDev();
17473          return updateDeferredValue(value);
17474        },
17475        useTransition: function () {
17476          currentHookNameInDev = 'useTransition';
17477          warnInvalidHookAccess();
17478          updateHookTypesDev();
17479          return updateTransition();
17480        },
17481        useMutableSource: function (source, getSnapshot, subscribe) {
17482          currentHookNameInDev = 'useMutableSource';
17483          warnInvalidHookAccess();
17484          updateHookTypesDev();
17485          return updateMutableSource();
17486        },
17487        useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
17488          currentHookNameInDev = 'useSyncExternalStore';
17489          warnInvalidHookAccess();
17490          updateHookTypesDev();
17491          return updateSyncExternalStore(subscribe, getSnapshot);
17492        },
17493        useId: function () {
17494          currentHookNameInDev = 'useId';
17495          warnInvalidHookAccess();
17496          updateHookTypesDev();
17497          return updateId();
17498        },
17499        unstable_isNewReconciler: enableNewReconciler
17500      };
17501  
17502      InvalidNestedHooksDispatcherOnRerenderInDEV = {
17503        readContext: function (context) {
17504          warnInvalidContextAccess();
17505          return readContext(context);
17506        },
17507        useCallback: function (callback, deps) {
17508          currentHookNameInDev = 'useCallback';
17509          warnInvalidHookAccess();
17510          updateHookTypesDev();
17511          return updateCallback(callback, deps);
17512        },
17513        useContext: function (context) {
17514          currentHookNameInDev = 'useContext';
17515          warnInvalidHookAccess();
17516          updateHookTypesDev();
17517          return readContext(context);
17518        },
17519        useEffect: function (create, deps) {
17520          currentHookNameInDev = 'useEffect';
17521          warnInvalidHookAccess();
17522          updateHookTypesDev();
17523          return updateEffect(create, deps);
17524        },
17525        useImperativeHandle: function (ref, create, deps) {
17526          currentHookNameInDev = 'useImperativeHandle';
17527          warnInvalidHookAccess();
17528          updateHookTypesDev();
17529          return updateImperativeHandle(ref, create, deps);
17530        },
17531        useInsertionEffect: function (create, deps) {
17532          currentHookNameInDev = 'useInsertionEffect';
17533          warnInvalidHookAccess();
17534          updateHookTypesDev();
17535          return updateInsertionEffect(create, deps);
17536        },
17537        useLayoutEffect: function (create, deps) {
17538          currentHookNameInDev = 'useLayoutEffect';
17539          warnInvalidHookAccess();
17540          updateHookTypesDev();
17541          return updateLayoutEffect(create, deps);
17542        },
17543        useMemo: function (create, deps) {
17544          currentHookNameInDev = 'useMemo';
17545          warnInvalidHookAccess();
17546          updateHookTypesDev();
17547          var prevDispatcher = ReactCurrentDispatcher$1.current;
17548          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
17549  
17550          try {
17551            return updateMemo(create, deps);
17552          } finally {
17553            ReactCurrentDispatcher$1.current = prevDispatcher;
17554          }
17555        },
17556        useReducer: function (reducer, initialArg, init) {
17557          currentHookNameInDev = 'useReducer';
17558          warnInvalidHookAccess();
17559          updateHookTypesDev();
17560          var prevDispatcher = ReactCurrentDispatcher$1.current;
17561          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
17562  
17563          try {
17564            return rerenderReducer(reducer, initialArg, init);
17565          } finally {
17566            ReactCurrentDispatcher$1.current = prevDispatcher;
17567          }
17568        },
17569        useRef: function (initialValue) {
17570          currentHookNameInDev = 'useRef';
17571          warnInvalidHookAccess();
17572          updateHookTypesDev();
17573          return updateRef();
17574        },
17575        useState: function (initialState) {
17576          currentHookNameInDev = 'useState';
17577          warnInvalidHookAccess();
17578          updateHookTypesDev();
17579          var prevDispatcher = ReactCurrentDispatcher$1.current;
17580          ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
17581  
17582          try {
17583            return rerenderState(initialState);
17584          } finally {
17585            ReactCurrentDispatcher$1.current = prevDispatcher;
17586          }
17587        },
17588        useDebugValue: function (value, formatterFn) {
17589          currentHookNameInDev = 'useDebugValue';
17590          warnInvalidHookAccess();
17591          updateHookTypesDev();
17592          return updateDebugValue();
17593        },
17594        useDeferredValue: function (value) {
17595          currentHookNameInDev = 'useDeferredValue';
17596          warnInvalidHookAccess();
17597          updateHookTypesDev();
17598          return rerenderDeferredValue(value);
17599        },
17600        useTransition: function () {
17601          currentHookNameInDev = 'useTransition';
17602          warnInvalidHookAccess();
17603          updateHookTypesDev();
17604          return rerenderTransition();
17605        },
17606        useMutableSource: function (source, getSnapshot, subscribe) {
17607          currentHookNameInDev = 'useMutableSource';
17608          warnInvalidHookAccess();
17609          updateHookTypesDev();
17610          return updateMutableSource();
17611        },
17612        useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
17613          currentHookNameInDev = 'useSyncExternalStore';
17614          warnInvalidHookAccess();
17615          updateHookTypesDev();
17616          return updateSyncExternalStore(subscribe, getSnapshot);
17617        },
17618        useId: function () {
17619          currentHookNameInDev = 'useId';
17620          warnInvalidHookAccess();
17621          updateHookTypesDev();
17622          return updateId();
17623        },
17624        unstable_isNewReconciler: enableNewReconciler
17625      };
17626    }
17627  
17628    var now$1 = unstable_now;
17629    var commitTime = 0;
17630    var layoutEffectStartTime = -1;
17631    var profilerStartTime = -1;
17632    var passiveEffectStartTime = -1;
17633    /**
17634     * Tracks whether the current update was a nested/cascading update (scheduled from a layout effect).
17635     *
17636     * The overall sequence is:
17637     *   1. render
17638     *   2. commit (and call `onRender`, `onCommit`)
17639     *   3. check for nested updates
17640     *   4. flush passive effects (and call `onPostCommit`)
17641     *
17642     * Nested updates are identified in step 3 above,
17643     * but step 4 still applies to the work that was just committed.
17644     * We use two flags to track nested updates then:
17645     * one tracks whether the upcoming update is a nested update,
17646     * and the other tracks whether the current update was a nested update.
17647     * The first value gets synced to the second at the start of the render phase.
17648     */
17649  
17650    var currentUpdateIsNested = false;
17651    var nestedUpdateScheduled = false;
17652  
17653    function isCurrentUpdateNested() {
17654      return currentUpdateIsNested;
17655    }
17656  
17657    function markNestedUpdateScheduled() {
17658      {
17659        nestedUpdateScheduled = true;
17660      }
17661    }
17662  
17663    function resetNestedUpdateFlag() {
17664      {
17665        currentUpdateIsNested = false;
17666        nestedUpdateScheduled = false;
17667      }
17668    }
17669  
17670    function syncNestedUpdateFlag() {
17671      {
17672        currentUpdateIsNested = nestedUpdateScheduled;
17673        nestedUpdateScheduled = false;
17674      }
17675    }
17676  
17677    function getCommitTime() {
17678      return commitTime;
17679    }
17680  
17681    function recordCommitTime() {
17682  
17683      commitTime = now$1();
17684    }
17685  
17686    function startProfilerTimer(fiber) {
17687  
17688      profilerStartTime = now$1();
17689  
17690      if (fiber.actualStartTime < 0) {
17691        fiber.actualStartTime = now$1();
17692      }
17693    }
17694  
17695    function stopProfilerTimerIfRunning(fiber) {
17696  
17697      profilerStartTime = -1;
17698    }
17699  
17700    function stopProfilerTimerIfRunningAndRecordDelta(fiber, overrideBaseTime) {
17701  
17702      if (profilerStartTime >= 0) {
17703        var elapsedTime = now$1() - profilerStartTime;
17704        fiber.actualDuration += elapsedTime;
17705  
17706        if (overrideBaseTime) {
17707          fiber.selfBaseDuration = elapsedTime;
17708        }
17709  
17710        profilerStartTime = -1;
17711      }
17712    }
17713  
17714    function recordLayoutEffectDuration(fiber) {
17715  
17716      if (layoutEffectStartTime >= 0) {
17717        var elapsedTime = now$1() - layoutEffectStartTime;
17718        layoutEffectStartTime = -1; // Store duration on the next nearest Profiler ancestor
17719        // Or the root (for the DevTools Profiler to read)
17720  
17721        var parentFiber = fiber.return;
17722  
17723        while (parentFiber !== null) {
17724          switch (parentFiber.tag) {
17725            case HostRoot:
17726              var root = parentFiber.stateNode;
17727              root.effectDuration += elapsedTime;
17728              return;
17729  
17730            case Profiler:
17731              var parentStateNode = parentFiber.stateNode;
17732              parentStateNode.effectDuration += elapsedTime;
17733              return;
17734          }
17735  
17736          parentFiber = parentFiber.return;
17737        }
17738      }
17739    }
17740  
17741    function recordPassiveEffectDuration(fiber) {
17742  
17743      if (passiveEffectStartTime >= 0) {
17744        var elapsedTime = now$1() - passiveEffectStartTime;
17745        passiveEffectStartTime = -1; // Store duration on the next nearest Profiler ancestor
17746        // Or the root (for the DevTools Profiler to read)
17747  
17748        var parentFiber = fiber.return;
17749  
17750        while (parentFiber !== null) {
17751          switch (parentFiber.tag) {
17752            case HostRoot:
17753              var root = parentFiber.stateNode;
17754  
17755              if (root !== null) {
17756                root.passiveEffectDuration += elapsedTime;
17757              }
17758  
17759              return;
17760  
17761            case Profiler:
17762              var parentStateNode = parentFiber.stateNode;
17763  
17764              if (parentStateNode !== null) {
17765                // Detached fibers have their state node cleared out.
17766                // In this case, the return pointer is also cleared out,
17767                // so we won't be able to report the time spent in this Profiler's subtree.
17768                parentStateNode.passiveEffectDuration += elapsedTime;
17769              }
17770  
17771              return;
17772          }
17773  
17774          parentFiber = parentFiber.return;
17775        }
17776      }
17777    }
17778  
17779    function startLayoutEffectTimer() {
17780  
17781      layoutEffectStartTime = now$1();
17782    }
17783  
17784    function startPassiveEffectTimer() {
17785  
17786      passiveEffectStartTime = now$1();
17787    }
17788  
17789    function transferActualDuration(fiber) {
17790      // Transfer time spent rendering these children so we don't lose it
17791      // after we rerender. This is used as a helper in special cases
17792      // where we should count the work of multiple passes.
17793      var child = fiber.child;
17794  
17795      while (child) {
17796        fiber.actualDuration += child.actualDuration;
17797        child = child.sibling;
17798      }
17799    }
17800  
17801    function resolveDefaultProps(Component, baseProps) {
17802      if (Component && Component.defaultProps) {
17803        // Resolve default props. Taken from ReactElement
17804        var props = assign({}, baseProps);
17805        var defaultProps = Component.defaultProps;
17806  
17807        for (var propName in defaultProps) {
17808          if (props[propName] === undefined) {
17809            props[propName] = defaultProps[propName];
17810          }
17811        }
17812  
17813        return props;
17814      }
17815  
17816      return baseProps;
17817    }
17818  
17819    var fakeInternalInstance = {};
17820    var didWarnAboutStateAssignmentForComponent;
17821    var didWarnAboutUninitializedState;
17822    var didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate;
17823    var didWarnAboutLegacyLifecyclesAndDerivedState;
17824    var didWarnAboutUndefinedDerivedState;
17825    var warnOnUndefinedDerivedState;
17826    var warnOnInvalidCallback;
17827    var didWarnAboutDirectlyAssigningPropsToState;
17828    var didWarnAboutContextTypeAndContextTypes;
17829    var didWarnAboutInvalidateContextType;
17830    var didWarnAboutLegacyContext$1;
17831  
17832    {
17833      didWarnAboutStateAssignmentForComponent = new Set();
17834      didWarnAboutUninitializedState = new Set();
17835      didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate = new Set();
17836      didWarnAboutLegacyLifecyclesAndDerivedState = new Set();
17837      didWarnAboutDirectlyAssigningPropsToState = new Set();
17838      didWarnAboutUndefinedDerivedState = new Set();
17839      didWarnAboutContextTypeAndContextTypes = new Set();
17840      didWarnAboutInvalidateContextType = new Set();
17841      didWarnAboutLegacyContext$1 = new Set();
17842      var didWarnOnInvalidCallback = new Set();
17843  
17844      warnOnInvalidCallback = function (callback, callerName) {
17845        if (callback === null || typeof callback === 'function') {
17846          return;
17847        }
17848  
17849        var key = callerName + '_' + callback;
17850  
17851        if (!didWarnOnInvalidCallback.has(key)) {
17852          didWarnOnInvalidCallback.add(key);
17853  
17854          error('%s(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callerName, callback);
17855        }
17856      };
17857  
17858      warnOnUndefinedDerivedState = function (type, partialState) {
17859        if (partialState === undefined) {
17860          var componentName = getComponentNameFromType(type) || 'Component';
17861  
17862          if (!didWarnAboutUndefinedDerivedState.has(componentName)) {
17863            didWarnAboutUndefinedDerivedState.add(componentName);
17864  
17865            error('%s.getDerivedStateFromProps(): A valid state object (or null) must be returned. ' + 'You have returned undefined.', componentName);
17866          }
17867        }
17868      }; // This is so gross but it's at least non-critical and can be removed if
17869      // it causes problems. This is meant to give a nicer error message for
17870      // ReactDOM15.unstable_renderSubtreeIntoContainer(reactDOM16Component,
17871      // ...)) which otherwise throws a "_processChildContext is not a function"
17872      // exception.
17873  
17874  
17875      Object.defineProperty(fakeInternalInstance, '_processChildContext', {
17876        enumerable: false,
17877        value: function () {
17878          throw new Error('_processChildContext is not available in React 16+. This likely ' + 'means you have multiple copies of React and are attempting to nest ' + 'a React 15 tree inside a React 16 tree using ' + "unstable_renderSubtreeIntoContainer, which isn't supported. Try " + 'to make sure you have only one copy of React (and ideally, switch ' + 'to ReactDOM.createPortal).');
17879        }
17880      });
17881      Object.freeze(fakeInternalInstance);
17882    }
17883  
17884    function applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, nextProps) {
17885      var prevState = workInProgress.memoizedState;
17886      var partialState = getDerivedStateFromProps(nextProps, prevState);
17887  
17888      {
17889        if ( workInProgress.mode & StrictLegacyMode) {
17890          setIsStrictModeForDevtools(true);
17891  
17892          try {
17893            // Invoke the function an extra time to help detect side-effects.
17894            partialState = getDerivedStateFromProps(nextProps, prevState);
17895          } finally {
17896            setIsStrictModeForDevtools(false);
17897          }
17898        }
17899  
17900        warnOnUndefinedDerivedState(ctor, partialState);
17901      } // Merge the partial state and the previous state.
17902  
17903  
17904      var memoizedState = partialState === null || partialState === undefined ? prevState : assign({}, prevState, partialState);
17905      workInProgress.memoizedState = memoizedState; // Once the update queue is empty, persist the derived state onto the
17906      // base state.
17907  
17908      if (workInProgress.lanes === NoLanes) {
17909        // Queue is always non-null for classes
17910        var updateQueue = workInProgress.updateQueue;
17911        updateQueue.baseState = memoizedState;
17912      }
17913    }
17914  
17915    var classComponentUpdater = {
17916      isMounted: isMounted,
17917      enqueueSetState: function (inst, payload, callback) {
17918        var fiber = get(inst);
17919        var eventTime = requestEventTime();
17920        var lane = requestUpdateLane(fiber);
17921        var update = createUpdate(eventTime, lane);
17922        update.payload = payload;
17923  
17924        if (callback !== undefined && callback !== null) {
17925          {
17926            warnOnInvalidCallback(callback, 'setState');
17927          }
17928  
17929          update.callback = callback;
17930        }
17931  
17932        var root = enqueueUpdate(fiber, update, lane);
17933  
17934        if (root !== null) {
17935          scheduleUpdateOnFiber(root, fiber, lane, eventTime);
17936          entangleTransitions(root, fiber, lane);
17937        }
17938  
17939        {
17940          markStateUpdateScheduled(fiber, lane);
17941        }
17942      },
17943      enqueueReplaceState: function (inst, payload, callback) {
17944        var fiber = get(inst);
17945        var eventTime = requestEventTime();
17946        var lane = requestUpdateLane(fiber);
17947        var update = createUpdate(eventTime, lane);
17948        update.tag = ReplaceState;
17949        update.payload = payload;
17950  
17951        if (callback !== undefined && callback !== null) {
17952          {
17953            warnOnInvalidCallback(callback, 'replaceState');
17954          }
17955  
17956          update.callback = callback;
17957        }
17958  
17959        var root = enqueueUpdate(fiber, update, lane);
17960  
17961        if (root !== null) {
17962          scheduleUpdateOnFiber(root, fiber, lane, eventTime);
17963          entangleTransitions(root, fiber, lane);
17964        }
17965  
17966        {
17967          markStateUpdateScheduled(fiber, lane);
17968        }
17969      },
17970      enqueueForceUpdate: function (inst, callback) {
17971        var fiber = get(inst);
17972        var eventTime = requestEventTime();
17973        var lane = requestUpdateLane(fiber);
17974        var update = createUpdate(eventTime, lane);
17975        update.tag = ForceUpdate;
17976  
17977        if (callback !== undefined && callback !== null) {
17978          {
17979            warnOnInvalidCallback(callback, 'forceUpdate');
17980          }
17981  
17982          update.callback = callback;
17983        }
17984  
17985        var root = enqueueUpdate(fiber, update, lane);
17986  
17987        if (root !== null) {
17988          scheduleUpdateOnFiber(root, fiber, lane, eventTime);
17989          entangleTransitions(root, fiber, lane);
17990        }
17991  
17992        {
17993          markForceUpdateScheduled(fiber, lane);
17994        }
17995      }
17996    };
17997  
17998    function checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext) {
17999      var instance = workInProgress.stateNode;
18000  
18001      if (typeof instance.shouldComponentUpdate === 'function') {
18002        var shouldUpdate = instance.shouldComponentUpdate(newProps, newState, nextContext);
18003  
18004        {
18005          if ( workInProgress.mode & StrictLegacyMode) {
18006            setIsStrictModeForDevtools(true);
18007  
18008            try {
18009              // Invoke the function an extra time to help detect side-effects.
18010              shouldUpdate = instance.shouldComponentUpdate(newProps, newState, nextContext);
18011            } finally {
18012              setIsStrictModeForDevtools(false);
18013            }
18014          }
18015  
18016          if (shouldUpdate === undefined) {
18017            error('%s.shouldComponentUpdate(): Returned undefined instead of a ' + 'boolean value. Make sure to return true or false.', getComponentNameFromType(ctor) || 'Component');
18018          }
18019        }
18020  
18021        return shouldUpdate;
18022      }
18023  
18024      if (ctor.prototype && ctor.prototype.isPureReactComponent) {
18025        return !shallowEqual(oldProps, newProps) || !shallowEqual(oldState, newState);
18026      }
18027  
18028      return true;
18029    }
18030  
18031    function checkClassInstance(workInProgress, ctor, newProps) {
18032      var instance = workInProgress.stateNode;
18033  
18034      {
18035        var name = getComponentNameFromType(ctor) || 'Component';
18036        var renderPresent = instance.render;
18037  
18038        if (!renderPresent) {
18039          if (ctor.prototype && typeof ctor.prototype.render === 'function') {
18040            error('%s(...): No `render` method found on the returned component ' + 'instance: did you accidentally return an object from the constructor?', name);
18041          } else {
18042            error('%s(...): No `render` method found on the returned component ' + 'instance: you may have forgotten to define `render`.', name);
18043          }
18044        }
18045  
18046        if (instance.getInitialState && !instance.getInitialState.isReactClassApproved && !instance.state) {
18047          error('getInitialState was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Did you mean to define a state property instead?', name);
18048        }
18049  
18050        if (instance.getDefaultProps && !instance.getDefaultProps.isReactClassApproved) {
18051          error('getDefaultProps was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Use a static property to define defaultProps instead.', name);
18052        }
18053  
18054        if (instance.propTypes) {
18055          error('propTypes was defined as an instance property on %s. Use a static ' + 'property to define propTypes instead.', name);
18056        }
18057  
18058        if (instance.contextType) {
18059          error('contextType was defined as an instance property on %s. Use a static ' + 'property to define contextType instead.', name);
18060        }
18061  
18062        {
18063          if (ctor.childContextTypes && !didWarnAboutLegacyContext$1.has(ctor) && // Strict Mode has its own warning for legacy context, so we can skip
18064          // this one.
18065          (workInProgress.mode & StrictLegacyMode) === NoMode) {
18066            didWarnAboutLegacyContext$1.add(ctor);
18067  
18068            error('%s uses the legacy childContextTypes API which is no longer ' + 'supported and will be removed in the next major release. Use ' + 'React.createContext() instead\n\n.' + 'Learn more about this warning here: https://reactjs.org/link/legacy-context', name);
18069          }
18070  
18071          if (ctor.contextTypes && !didWarnAboutLegacyContext$1.has(ctor) && // Strict Mode has its own warning for legacy context, so we can skip
18072          // this one.
18073          (workInProgress.mode & StrictLegacyMode) === NoMode) {
18074            didWarnAboutLegacyContext$1.add(ctor);
18075  
18076            error('%s uses the legacy contextTypes API which is no longer supported ' + 'and will be removed in the next major release. Use ' + 'React.createContext() with static contextType instead.\n\n' + 'Learn more about this warning here: https://reactjs.org/link/legacy-context', name);
18077          }
18078  
18079          if (instance.contextTypes) {
18080            error('contextTypes was defined as an instance property on %s. Use a static ' + 'property to define contextTypes instead.', name);
18081          }
18082  
18083          if (ctor.contextType && ctor.contextTypes && !didWarnAboutContextTypeAndContextTypes.has(ctor)) {
18084            didWarnAboutContextTypeAndContextTypes.add(ctor);
18085  
18086            error('%s declares both contextTypes and contextType static properties. ' + 'The legacy contextTypes property will be ignored.', name);
18087          }
18088        }
18089  
18090        if (typeof instance.componentShouldUpdate === 'function') {
18091          error('%s has a method called ' + 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' + 'The name is phrased as a question because the function is ' + 'expected to return a value.', name);
18092        }
18093  
18094        if (ctor.prototype && ctor.prototype.isPureReactComponent && typeof instance.shouldComponentUpdate !== 'undefined') {
18095          error('%s has a method called shouldComponentUpdate(). ' + 'shouldComponentUpdate should not be used when extending React.PureComponent. ' + 'Please extend React.Component if shouldComponentUpdate is used.', getComponentNameFromType(ctor) || 'A pure component');
18096        }
18097  
18098        if (typeof instance.componentDidUnmount === 'function') {
18099          error('%s has a method called ' + 'componentDidUnmount(). But there is no such lifecycle method. ' + 'Did you mean componentWillUnmount()?', name);
18100        }
18101  
18102        if (typeof instance.componentDidReceiveProps === 'function') {
18103          error('%s has a method called ' + 'componentDidReceiveProps(). But there is no such lifecycle method. ' + 'If you meant to update the state in response to changing props, ' + 'use componentWillReceiveProps(). If you meant to fetch data or ' + 'run side-effects or mutations after React has updated the UI, use componentDidUpdate().', name);
18104        }
18105  
18106        if (typeof instance.componentWillRecieveProps === 'function') {
18107          error('%s has a method called ' + 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?', name);
18108        }
18109  
18110        if (typeof instance.UNSAFE_componentWillRecieveProps === 'function') {
18111          error('%s has a method called ' + 'UNSAFE_componentWillRecieveProps(). Did you mean UNSAFE_componentWillReceiveProps()?', name);
18112        }
18113  
18114        var hasMutatedProps = instance.props !== newProps;
18115  
18116        if (instance.props !== undefined && hasMutatedProps) {
18117          error('%s(...): When calling super() in `%s`, make sure to pass ' + "up the same props that your component's constructor was passed.", name, name);
18118        }
18119  
18120        if (instance.defaultProps) {
18121          error('Setting defaultProps as an instance property on %s is not supported and will be ignored.' + ' Instead, define defaultProps as a static property on %s.', name, name);
18122        }
18123  
18124        if (typeof instance.getSnapshotBeforeUpdate === 'function' && typeof instance.componentDidUpdate !== 'function' && !didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate.has(ctor)) {
18125          didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate.add(ctor);
18126  
18127          error('%s: getSnapshotBeforeUpdate() should be used with componentDidUpdate(). ' + 'This component defines getSnapshotBeforeUpdate() only.', getComponentNameFromType(ctor));
18128        }
18129  
18130        if (typeof instance.getDerivedStateFromProps === 'function') {
18131          error('%s: getDerivedStateFromProps() is defined as an instance method ' + 'and will be ignored. Instead, declare it as a static method.', name);
18132        }
18133  
18134        if (typeof instance.getDerivedStateFromError === 'function') {
18135          error('%s: getDerivedStateFromError() is defined as an instance method ' + 'and will be ignored. Instead, declare it as a static method.', name);
18136        }
18137  
18138        if (typeof ctor.getSnapshotBeforeUpdate === 'function') {
18139          error('%s: getSnapshotBeforeUpdate() is defined as a static method ' + 'and will be ignored. Instead, declare it as an instance method.', name);
18140        }
18141  
18142        var _state = instance.state;
18143  
18144        if (_state && (typeof _state !== 'object' || isArray(_state))) {
18145          error('%s.state: must be set to an object or null', name);
18146        }
18147  
18148        if (typeof instance.getChildContext === 'function' && typeof ctor.childContextTypes !== 'object') {
18149          error('%s.getChildContext(): childContextTypes must be defined in order to ' + 'use getChildContext().', name);
18150        }
18151      }
18152    }
18153  
18154    function adoptClassInstance(workInProgress, instance) {
18155      instance.updater = classComponentUpdater;
18156      workInProgress.stateNode = instance; // The instance needs access to the fiber so that it can schedule updates
18157  
18158      set(instance, workInProgress);
18159  
18160      {
18161        instance._reactInternalInstance = fakeInternalInstance;
18162      }
18163    }
18164  
18165    function constructClassInstance(workInProgress, ctor, props) {
18166      var isLegacyContextConsumer = false;
18167      var unmaskedContext = emptyContextObject;
18168      var context = emptyContextObject;
18169      var contextType = ctor.contextType;
18170  
18171      {
18172        if ('contextType' in ctor) {
18173          var isValid = // Allow null for conditional declaration
18174          contextType === null || contextType !== undefined && contextType.$$typeof === REACT_CONTEXT_TYPE && contextType._context === undefined; // Not a <Context.Consumer>
18175  
18176          if (!isValid && !didWarnAboutInvalidateContextType.has(ctor)) {
18177            didWarnAboutInvalidateContextType.add(ctor);
18178            var addendum = '';
18179  
18180            if (contextType === undefined) {
18181              addendum = ' However, it is set to undefined. ' + 'This can be caused by a typo or by mixing up named and default imports. ' + 'This can also happen due to a circular dependency, so ' + 'try moving the createContext() call to a separate file.';
18182            } else if (typeof contextType !== 'object') {
18183              addendum = ' However, it is set to a ' + typeof contextType + '.';
18184            } else if (contextType.$$typeof === REACT_PROVIDER_TYPE) {
18185              addendum = ' Did you accidentally pass the Context.Provider instead?';
18186            } else if (contextType._context !== undefined) {
18187              // <Context.Consumer>
18188              addendum = ' Did you accidentally pass the Context.Consumer instead?';
18189            } else {
18190              addendum = ' However, it is set to an object with keys {' + Object.keys(contextType).join(', ') + '}.';
18191            }
18192  
18193            error('%s defines an invalid contextType. ' + 'contextType should point to the Context object returned by React.createContext().%s', getComponentNameFromType(ctor) || 'Component', addendum);
18194          }
18195        }
18196      }
18197  
18198      if (typeof contextType === 'object' && contextType !== null) {
18199        context = readContext(contextType);
18200      } else {
18201        unmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
18202        var contextTypes = ctor.contextTypes;
18203        isLegacyContextConsumer = contextTypes !== null && contextTypes !== undefined;
18204        context = isLegacyContextConsumer ? getMaskedContext(workInProgress, unmaskedContext) : emptyContextObject;
18205      }
18206  
18207      var instance = new ctor(props, context); // Instantiate twice to help detect side-effects.
18208  
18209      {
18210        if ( workInProgress.mode & StrictLegacyMode) {
18211          setIsStrictModeForDevtools(true);
18212  
18213          try {
18214            instance = new ctor(props, context); // eslint-disable-line no-new
18215          } finally {
18216            setIsStrictModeForDevtools(false);
18217          }
18218        }
18219      }
18220  
18221      var state = workInProgress.memoizedState = instance.state !== null && instance.state !== undefined ? instance.state : null;
18222      adoptClassInstance(workInProgress, instance);
18223  
18224      {
18225        if (typeof ctor.getDerivedStateFromProps === 'function' && state === null) {
18226          var componentName = getComponentNameFromType(ctor) || 'Component';
18227  
18228          if (!didWarnAboutUninitializedState.has(componentName)) {
18229            didWarnAboutUninitializedState.add(componentName);
18230  
18231            error('`%s` uses `getDerivedStateFromProps` but its initial state is ' + '%s. This is not recommended. Instead, define the initial state by ' + 'assigning an object to `this.state` in the constructor of `%s`. ' + 'This ensures that `getDerivedStateFromProps` arguments have a consistent shape.', componentName, instance.state === null ? 'null' : 'undefined', componentName);
18232          }
18233        } // If new component APIs are defined, "unsafe" lifecycles won't be called.
18234        // Warn about these lifecycles if they are present.
18235        // Don't warn about react-lifecycles-compat polyfilled methods though.
18236  
18237  
18238        if (typeof ctor.getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function') {
18239          var foundWillMountName = null;
18240          var foundWillReceivePropsName = null;
18241          var foundWillUpdateName = null;
18242  
18243          if (typeof instance.componentWillMount === 'function' && instance.componentWillMount.__suppressDeprecationWarning !== true) {
18244            foundWillMountName = 'componentWillMount';
18245          } else if (typeof instance.UNSAFE_componentWillMount === 'function') {
18246            foundWillMountName = 'UNSAFE_componentWillMount';
18247          }
18248  
18249          if (typeof instance.componentWillReceiveProps === 'function' && instance.componentWillReceiveProps.__suppressDeprecationWarning !== true) {
18250            foundWillReceivePropsName = 'componentWillReceiveProps';
18251          } else if (typeof instance.UNSAFE_componentWillReceiveProps === 'function') {
18252            foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';
18253          }
18254  
18255          if (typeof instance.componentWillUpdate === 'function' && instance.componentWillUpdate.__suppressDeprecationWarning !== true) {
18256            foundWillUpdateName = 'componentWillUpdate';
18257          } else if (typeof instance.UNSAFE_componentWillUpdate === 'function') {
18258            foundWillUpdateName = 'UNSAFE_componentWillUpdate';
18259          }
18260  
18261          if (foundWillMountName !== null || foundWillReceivePropsName !== null || foundWillUpdateName !== null) {
18262            var _componentName = getComponentNameFromType(ctor) || 'Component';
18263  
18264            var newApiName = typeof ctor.getDerivedStateFromProps === 'function' ? 'getDerivedStateFromProps()' : 'getSnapshotBeforeUpdate()';
18265  
18266            if (!didWarnAboutLegacyLifecyclesAndDerivedState.has(_componentName)) {
18267              didWarnAboutLegacyLifecyclesAndDerivedState.add(_componentName);
18268  
18269              error('Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' + '%s uses %s but also contains the following legacy lifecycles:%s%s%s\n\n' + 'The above lifecycles should be removed. Learn more about this warning here:\n' + 'https://reactjs.org/link/unsafe-component-lifecycles', _componentName, newApiName, foundWillMountName !== null ? "\n  " + foundWillMountName : '', foundWillReceivePropsName !== null ? "\n  " + foundWillReceivePropsName : '', foundWillUpdateName !== null ? "\n  " + foundWillUpdateName : '');
18270            }
18271          }
18272        }
18273      } // Cache unmasked context so we can avoid recreating masked context unless necessary.
18274      // ReactFiberContext usually updates this cache but can't for newly-created instances.
18275  
18276  
18277      if (isLegacyContextConsumer) {
18278        cacheContext(workInProgress, unmaskedContext, context);
18279      }
18280  
18281      return instance;
18282    }
18283  
18284    function callComponentWillMount(workInProgress, instance) {
18285      var oldState = instance.state;
18286  
18287      if (typeof instance.componentWillMount === 'function') {
18288        instance.componentWillMount();
18289      }
18290  
18291      if (typeof instance.UNSAFE_componentWillMount === 'function') {
18292        instance.UNSAFE_componentWillMount();
18293      }
18294  
18295      if (oldState !== instance.state) {
18296        {
18297          error('%s.componentWillMount(): Assigning directly to this.state is ' + "deprecated (except inside a component's " + 'constructor). Use setState instead.', getComponentNameFromFiber(workInProgress) || 'Component');
18298        }
18299  
18300        classComponentUpdater.enqueueReplaceState(instance, instance.state, null);
18301      }
18302    }
18303  
18304    function callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext) {
18305      var oldState = instance.state;
18306  
18307      if (typeof instance.componentWillReceiveProps === 'function') {
18308        instance.componentWillReceiveProps(newProps, nextContext);
18309      }
18310  
18311      if (typeof instance.UNSAFE_componentWillReceiveProps === 'function') {
18312        instance.UNSAFE_componentWillReceiveProps(newProps, nextContext);
18313      }
18314  
18315      if (instance.state !== oldState) {
18316        {
18317          var componentName = getComponentNameFromFiber(workInProgress) || 'Component';
18318  
18319          if (!didWarnAboutStateAssignmentForComponent.has(componentName)) {
18320            didWarnAboutStateAssignmentForComponent.add(componentName);
18321  
18322            error('%s.componentWillReceiveProps(): Assigning directly to ' + "this.state is deprecated (except inside a component's " + 'constructor). Use setState instead.', componentName);
18323          }
18324        }
18325  
18326        classComponentUpdater.enqueueReplaceState(instance, instance.state, null);
18327      }
18328    } // Invokes the mount life-cycles on a previously never rendered instance.
18329  
18330  
18331    function mountClassInstance(workInProgress, ctor, newProps, renderLanes) {
18332      {
18333        checkClassInstance(workInProgress, ctor, newProps);
18334      }
18335  
18336      var instance = workInProgress.stateNode;
18337      instance.props = newProps;
18338      instance.state = workInProgress.memoizedState;
18339      instance.refs = {};
18340      initializeUpdateQueue(workInProgress);
18341      var contextType = ctor.contextType;
18342  
18343      if (typeof contextType === 'object' && contextType !== null) {
18344        instance.context = readContext(contextType);
18345      } else {
18346        var unmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
18347        instance.context = getMaskedContext(workInProgress, unmaskedContext);
18348      }
18349  
18350      {
18351        if (instance.state === newProps) {
18352          var componentName = getComponentNameFromType(ctor) || 'Component';
18353  
18354          if (!didWarnAboutDirectlyAssigningPropsToState.has(componentName)) {
18355            didWarnAboutDirectlyAssigningPropsToState.add(componentName);
18356  
18357            error('%s: It is not recommended to assign props directly to state ' + "because updates to props won't be reflected in state. " + 'In most cases, it is better to use props directly.', componentName);
18358          }
18359        }
18360  
18361        if (workInProgress.mode & StrictLegacyMode) {
18362          ReactStrictModeWarnings.recordLegacyContextWarning(workInProgress, instance);
18363        }
18364  
18365        {
18366          ReactStrictModeWarnings.recordUnsafeLifecycleWarnings(workInProgress, instance);
18367        }
18368      }
18369  
18370      instance.state = workInProgress.memoizedState;
18371      var getDerivedStateFromProps = ctor.getDerivedStateFromProps;
18372  
18373      if (typeof getDerivedStateFromProps === 'function') {
18374        applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps);
18375        instance.state = workInProgress.memoizedState;
18376      } // In order to support react-lifecycles-compat polyfilled components,
18377      // Unsafe lifecycles should not be invoked for components using the new APIs.
18378  
18379  
18380      if (typeof ctor.getDerivedStateFromProps !== 'function' && typeof instance.getSnapshotBeforeUpdate !== 'function' && (typeof instance.UNSAFE_componentWillMount === 'function' || typeof instance.componentWillMount === 'function')) {
18381        callComponentWillMount(workInProgress, instance); // If we had additional state updates during this life-cycle, let's
18382        // process them now.
18383  
18384        processUpdateQueue(workInProgress, newProps, instance, renderLanes);
18385        instance.state = workInProgress.memoizedState;
18386      }
18387  
18388      if (typeof instance.componentDidMount === 'function') {
18389        var fiberFlags = Update;
18390  
18391        {
18392          fiberFlags |= LayoutStatic;
18393        }
18394  
18395        if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
18396          fiberFlags |= MountLayoutDev;
18397        }
18398  
18399        workInProgress.flags |= fiberFlags;
18400      }
18401    }
18402  
18403    function resumeMountClassInstance(workInProgress, ctor, newProps, renderLanes) {
18404      var instance = workInProgress.stateNode;
18405      var oldProps = workInProgress.memoizedProps;
18406      instance.props = oldProps;
18407      var oldContext = instance.context;
18408      var contextType = ctor.contextType;
18409      var nextContext = emptyContextObject;
18410  
18411      if (typeof contextType === 'object' && contextType !== null) {
18412        nextContext = readContext(contextType);
18413      } else {
18414        var nextLegacyUnmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
18415        nextContext = getMaskedContext(workInProgress, nextLegacyUnmaskedContext);
18416      }
18417  
18418      var getDerivedStateFromProps = ctor.getDerivedStateFromProps;
18419      var hasNewLifecycles = typeof getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function'; // Note: During these life-cycles, instance.props/instance.state are what
18420      // ever the previously attempted to render - not the "current". However,
18421      // during componentDidUpdate we pass the "current" props.
18422      // In order to support react-lifecycles-compat polyfilled components,
18423      // Unsafe lifecycles should not be invoked for components using the new APIs.
18424  
18425      if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillReceiveProps === 'function' || typeof instance.componentWillReceiveProps === 'function')) {
18426        if (oldProps !== newProps || oldContext !== nextContext) {
18427          callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext);
18428        }
18429      }
18430  
18431      resetHasForceUpdateBeforeProcessing();
18432      var oldState = workInProgress.memoizedState;
18433      var newState = instance.state = oldState;
18434      processUpdateQueue(workInProgress, newProps, instance, renderLanes);
18435      newState = workInProgress.memoizedState;
18436  
18437      if (oldProps === newProps && oldState === newState && !hasContextChanged() && !checkHasForceUpdateAfterProcessing()) {
18438        // If an update was already in progress, we should schedule an Update
18439        // effect even though we're bailing out, so that cWU/cDU are called.
18440        if (typeof instance.componentDidMount === 'function') {
18441          var fiberFlags = Update;
18442  
18443          {
18444            fiberFlags |= LayoutStatic;
18445          }
18446  
18447          if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
18448            fiberFlags |= MountLayoutDev;
18449          }
18450  
18451          workInProgress.flags |= fiberFlags;
18452        }
18453  
18454        return false;
18455      }
18456  
18457      if (typeof getDerivedStateFromProps === 'function') {
18458        applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps);
18459        newState = workInProgress.memoizedState;
18460      }
18461  
18462      var shouldUpdate = checkHasForceUpdateAfterProcessing() || checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext);
18463  
18464      if (shouldUpdate) {
18465        // In order to support react-lifecycles-compat polyfilled components,
18466        // Unsafe lifecycles should not be invoked for components using the new APIs.
18467        if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillMount === 'function' || typeof instance.componentWillMount === 'function')) {
18468          if (typeof instance.componentWillMount === 'function') {
18469            instance.componentWillMount();
18470          }
18471  
18472          if (typeof instance.UNSAFE_componentWillMount === 'function') {
18473            instance.UNSAFE_componentWillMount();
18474          }
18475        }
18476  
18477        if (typeof instance.componentDidMount === 'function') {
18478          var _fiberFlags = Update;
18479  
18480          {
18481            _fiberFlags |= LayoutStatic;
18482          }
18483  
18484          if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
18485            _fiberFlags |= MountLayoutDev;
18486          }
18487  
18488          workInProgress.flags |= _fiberFlags;
18489        }
18490      } else {
18491        // If an update was already in progress, we should schedule an Update
18492        // effect even though we're bailing out, so that cWU/cDU are called.
18493        if (typeof instance.componentDidMount === 'function') {
18494          var _fiberFlags2 = Update;
18495  
18496          {
18497            _fiberFlags2 |= LayoutStatic;
18498          }
18499  
18500          if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
18501            _fiberFlags2 |= MountLayoutDev;
18502          }
18503  
18504          workInProgress.flags |= _fiberFlags2;
18505        } // If shouldComponentUpdate returned false, we should still update the
18506        // memoized state to indicate that this work can be reused.
18507  
18508  
18509        workInProgress.memoizedProps = newProps;
18510        workInProgress.memoizedState = newState;
18511      } // Update the existing instance's state, props, and context pointers even
18512      // if shouldComponentUpdate returns false.
18513  
18514  
18515      instance.props = newProps;
18516      instance.state = newState;
18517      instance.context = nextContext;
18518      return shouldUpdate;
18519    } // Invokes the update life-cycles and returns false if it shouldn't rerender.
18520  
18521  
18522    function updateClassInstance(current, workInProgress, ctor, newProps, renderLanes) {
18523      var instance = workInProgress.stateNode;
18524      cloneUpdateQueue(current, workInProgress);
18525      var unresolvedOldProps = workInProgress.memoizedProps;
18526      var oldProps = workInProgress.type === workInProgress.elementType ? unresolvedOldProps : resolveDefaultProps(workInProgress.type, unresolvedOldProps);
18527      instance.props = oldProps;
18528      var unresolvedNewProps = workInProgress.pendingProps;
18529      var oldContext = instance.context;
18530      var contextType = ctor.contextType;
18531      var nextContext = emptyContextObject;
18532  
18533      if (typeof contextType === 'object' && contextType !== null) {
18534        nextContext = readContext(contextType);
18535      } else {
18536        var nextUnmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
18537        nextContext = getMaskedContext(workInProgress, nextUnmaskedContext);
18538      }
18539  
18540      var getDerivedStateFromProps = ctor.getDerivedStateFromProps;
18541      var hasNewLifecycles = typeof getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function'; // Note: During these life-cycles, instance.props/instance.state are what
18542      // ever the previously attempted to render - not the "current". However,
18543      // during componentDidUpdate we pass the "current" props.
18544      // In order to support react-lifecycles-compat polyfilled components,
18545      // Unsafe lifecycles should not be invoked for components using the new APIs.
18546  
18547      if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillReceiveProps === 'function' || typeof instance.componentWillReceiveProps === 'function')) {
18548        if (unresolvedOldProps !== unresolvedNewProps || oldContext !== nextContext) {
18549          callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext);
18550        }
18551      }
18552  
18553      resetHasForceUpdateBeforeProcessing();
18554      var oldState = workInProgress.memoizedState;
18555      var newState = instance.state = oldState;
18556      processUpdateQueue(workInProgress, newProps, instance, renderLanes);
18557      newState = workInProgress.memoizedState;
18558  
18559      if (unresolvedOldProps === unresolvedNewProps && oldState === newState && !hasContextChanged() && !checkHasForceUpdateAfterProcessing() && !(enableLazyContextPropagation   )) {
18560        // If an update was already in progress, we should schedule an Update
18561        // effect even though we're bailing out, so that cWU/cDU are called.
18562        if (typeof instance.componentDidUpdate === 'function') {
18563          if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
18564            workInProgress.flags |= Update;
18565          }
18566        }
18567  
18568        if (typeof instance.getSnapshotBeforeUpdate === 'function') {
18569          if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
18570            workInProgress.flags |= Snapshot;
18571          }
18572        }
18573  
18574        return false;
18575      }
18576  
18577      if (typeof getDerivedStateFromProps === 'function') {
18578        applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps);
18579        newState = workInProgress.memoizedState;
18580      }
18581  
18582      var shouldUpdate = checkHasForceUpdateAfterProcessing() || checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext) || // TODO: In some cases, we'll end up checking if context has changed twice,
18583      // both before and after `shouldComponentUpdate` has been called. Not ideal,
18584      // but I'm loath to refactor this function. This only happens for memoized
18585      // components so it's not that common.
18586      enableLazyContextPropagation   ;
18587  
18588      if (shouldUpdate) {
18589        // In order to support react-lifecycles-compat polyfilled components,
18590        // Unsafe lifecycles should not be invoked for components using the new APIs.
18591        if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillUpdate === 'function' || typeof instance.componentWillUpdate === 'function')) {
18592          if (typeof instance.componentWillUpdate === 'function') {
18593            instance.componentWillUpdate(newProps, newState, nextContext);
18594          }
18595  
18596          if (typeof instance.UNSAFE_componentWillUpdate === 'function') {
18597            instance.UNSAFE_componentWillUpdate(newProps, newState, nextContext);
18598          }
18599        }
18600  
18601        if (typeof instance.componentDidUpdate === 'function') {
18602          workInProgress.flags |= Update;
18603        }
18604  
18605        if (typeof instance.getSnapshotBeforeUpdate === 'function') {
18606          workInProgress.flags |= Snapshot;
18607        }
18608      } else {
18609        // If an update was already in progress, we should schedule an Update
18610        // effect even though we're bailing out, so that cWU/cDU are called.
18611        if (typeof instance.componentDidUpdate === 'function') {
18612          if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
18613            workInProgress.flags |= Update;
18614          }
18615        }
18616  
18617        if (typeof instance.getSnapshotBeforeUpdate === 'function') {
18618          if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
18619            workInProgress.flags |= Snapshot;
18620          }
18621        } // If shouldComponentUpdate returned false, we should still update the
18622        // memoized props/state to indicate that this work can be reused.
18623  
18624  
18625        workInProgress.memoizedProps = newProps;
18626        workInProgress.memoizedState = newState;
18627      } // Update the existing instance's state, props, and context pointers even
18628      // if shouldComponentUpdate returns false.
18629  
18630  
18631      instance.props = newProps;
18632      instance.state = newState;
18633      instance.context = nextContext;
18634      return shouldUpdate;
18635    }
18636  
18637    function createCapturedValueAtFiber(value, source) {
18638      // If the value is an error, call this function immediately after it is thrown
18639      // so the stack is accurate.
18640      return {
18641        value: value,
18642        source: source,
18643        stack: getStackByFiberInDevAndProd(source),
18644        digest: null
18645      };
18646    }
18647    function createCapturedValue(value, digest, stack) {
18648      return {
18649        value: value,
18650        source: null,
18651        stack: stack != null ? stack : null,
18652        digest: digest != null ? digest : null
18653      };
18654    }
18655  
18656    // This module is forked in different environments.
18657    // By default, return `true` to log errors to the console.
18658    // Forks can return `false` if this isn't desirable.
18659    function showErrorDialog(boundary, errorInfo) {
18660      return true;
18661    }
18662  
18663    function logCapturedError(boundary, errorInfo) {
18664      try {
18665        var logError = showErrorDialog(boundary, errorInfo); // Allow injected showErrorDialog() to prevent default console.error logging.
18666        // This enables renderers like ReactNative to better manage redbox behavior.
18667  
18668        if (logError === false) {
18669          return;
18670        }
18671  
18672        var error = errorInfo.value;
18673  
18674        if (true) {
18675          var source = errorInfo.source;
18676          var stack = errorInfo.stack;
18677          var componentStack = stack !== null ? stack : ''; // Browsers support silencing uncaught errors by calling
18678          // `preventDefault()` in window `error` handler.
18679          // We record this information as an expando on the error.
18680  
18681          if (error != null && error._suppressLogging) {
18682            if (boundary.tag === ClassComponent) {
18683              // The error is recoverable and was silenced.
18684              // Ignore it and don't print the stack addendum.
18685              // This is handy for testing error boundaries without noise.
18686              return;
18687            } // The error is fatal. Since the silencing might have
18688            // been accidental, we'll surface it anyway.
18689            // However, the browser would have silenced the original error
18690            // so we'll print it first, and then print the stack addendum.
18691  
18692  
18693            console['error'](error); // Don't transform to our wrapper
18694            // For a more detailed description of this block, see:
18695            // https://github.com/facebook/react/pull/13384
18696          }
18697  
18698          var componentName = source ? getComponentNameFromFiber(source) : null;
18699          var componentNameMessage = componentName ? "The above error occurred in the <" + componentName + "> component:" : 'The above error occurred in one of your React components:';
18700          var errorBoundaryMessage;
18701  
18702          if (boundary.tag === HostRoot) {
18703            errorBoundaryMessage = 'Consider adding an error boundary to your tree to customize error handling behavior.\n' + 'Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.';
18704          } else {
18705            var errorBoundaryName = getComponentNameFromFiber(boundary) || 'Anonymous';
18706            errorBoundaryMessage = "React will try to recreate this component tree from scratch " + ("using the error boundary you provided, " + errorBoundaryName + ".");
18707          }
18708  
18709          var combinedMessage = componentNameMessage + "\n" + componentStack + "\n\n" + ("" + errorBoundaryMessage); // In development, we provide our own message with just the component stack.
18710          // We don't include the original error message and JS stack because the browser
18711          // has already printed it. Even if the application swallows the error, it is still
18712          // displayed by the browser thanks to the DEV-only fake event trick in ReactErrorUtils.
18713  
18714          console['error'](combinedMessage); // Don't transform to our wrapper
18715        } else {
18716          // In production, we print the error directly.
18717          // This will include the message, the JS stack, and anything the browser wants to show.
18718          // We pass the error object instead of custom message so that the browser displays the error natively.
18719          console['error'](error); // Don't transform to our wrapper
18720        }
18721      } catch (e) {
18722        // This method must not throw, or React internal state will get messed up.
18723        // If console.error is overridden, or logCapturedError() shows a dialog that throws,
18724        // we want to report this error outside of the normal stack as a last resort.
18725        // https://github.com/facebook/react/issues/13188
18726        setTimeout(function () {
18727          throw e;
18728        });
18729      }
18730    }
18731  
18732    var PossiblyWeakMap$1 = typeof WeakMap === 'function' ? WeakMap : Map;
18733  
18734    function createRootErrorUpdate(fiber, errorInfo, lane) {
18735      var update = createUpdate(NoTimestamp, lane); // Unmount the root by rendering null.
18736  
18737      update.tag = CaptureUpdate; // Caution: React DevTools currently depends on this property
18738      // being called "element".
18739  
18740      update.payload = {
18741        element: null
18742      };
18743      var error = errorInfo.value;
18744  
18745      update.callback = function () {
18746        onUncaughtError(error);
18747        logCapturedError(fiber, errorInfo);
18748      };
18749  
18750      return update;
18751    }
18752  
18753    function createClassErrorUpdate(fiber, errorInfo, lane) {
18754      var update = createUpdate(NoTimestamp, lane);
18755      update.tag = CaptureUpdate;
18756      var getDerivedStateFromError = fiber.type.getDerivedStateFromError;
18757  
18758      if (typeof getDerivedStateFromError === 'function') {
18759        var error$1 = errorInfo.value;
18760  
18761        update.payload = function () {
18762          return getDerivedStateFromError(error$1);
18763        };
18764  
18765        update.callback = function () {
18766          {
18767            markFailedErrorBoundaryForHotReloading(fiber);
18768          }
18769  
18770          logCapturedError(fiber, errorInfo);
18771        };
18772      }
18773  
18774      var inst = fiber.stateNode;
18775  
18776      if (inst !== null && typeof inst.componentDidCatch === 'function') {
18777        update.callback = function callback() {
18778          {
18779            markFailedErrorBoundaryForHotReloading(fiber);
18780          }
18781  
18782          logCapturedError(fiber, errorInfo);
18783  
18784          if (typeof getDerivedStateFromError !== 'function') {
18785            // To preserve the preexisting retry behavior of error boundaries,
18786            // we keep track of which ones already failed during this batch.
18787            // This gets reset before we yield back to the browser.
18788            // TODO: Warn in strict mode if getDerivedStateFromError is
18789            // not defined.
18790            markLegacyErrorBoundaryAsFailed(this);
18791          }
18792  
18793          var error$1 = errorInfo.value;
18794          var stack = errorInfo.stack;
18795          this.componentDidCatch(error$1, {
18796            componentStack: stack !== null ? stack : ''
18797          });
18798  
18799          {
18800            if (typeof getDerivedStateFromError !== 'function') {
18801              // If componentDidCatch is the only error boundary method defined,
18802              // then it needs to call setState to recover from errors.
18803              // If no state update is scheduled then the boundary will swallow the error.
18804              if (!includesSomeLane(fiber.lanes, SyncLane)) {
18805                error('%s: Error boundaries should implement getDerivedStateFromError(). ' + 'In that method, return a state update to display an error message or fallback UI.', getComponentNameFromFiber(fiber) || 'Unknown');
18806              }
18807            }
18808          }
18809        };
18810      }
18811  
18812      return update;
18813    }
18814  
18815    function attachPingListener(root, wakeable, lanes) {
18816      // Attach a ping listener
18817      //
18818      // The data might resolve before we have a chance to commit the fallback. Or,
18819      // in the case of a refresh, we'll never commit a fallback. So we need to
18820      // attach a listener now. When it resolves ("pings"), we can decide whether to
18821      // try rendering the tree again.
18822      //
18823      // Only attach a listener if one does not already exist for the lanes
18824      // we're currently rendering (which acts like a "thread ID" here).
18825      //
18826      // We only need to do this in concurrent mode. Legacy Suspense always
18827      // commits fallbacks synchronously, so there are no pings.
18828      var pingCache = root.pingCache;
18829      var threadIDs;
18830  
18831      if (pingCache === null) {
18832        pingCache = root.pingCache = new PossiblyWeakMap$1();
18833        threadIDs = new Set();
18834        pingCache.set(wakeable, threadIDs);
18835      } else {
18836        threadIDs = pingCache.get(wakeable);
18837  
18838        if (threadIDs === undefined) {
18839          threadIDs = new Set();
18840          pingCache.set(wakeable, threadIDs);
18841        }
18842      }
18843  
18844      if (!threadIDs.has(lanes)) {
18845        // Memoize using the thread ID to prevent redundant listeners.
18846        threadIDs.add(lanes);
18847        var ping = pingSuspendedRoot.bind(null, root, wakeable, lanes);
18848  
18849        {
18850          if (isDevToolsPresent) {
18851            // If we have pending work still, restore the original updaters
18852            restorePendingUpdaters(root, lanes);
18853          }
18854        }
18855  
18856        wakeable.then(ping, ping);
18857      }
18858    }
18859  
18860    function attachRetryListener(suspenseBoundary, root, wakeable, lanes) {
18861      // Retry listener
18862      //
18863      // If the fallback does commit, we need to attach a different type of
18864      // listener. This one schedules an update on the Suspense boundary to turn
18865      // the fallback state off.
18866      //
18867      // Stash the wakeable on the boundary fiber so we can access it in the
18868      // commit phase.
18869      //
18870      // When the wakeable resolves, we'll attempt to render the boundary
18871      // again ("retry").
18872      var wakeables = suspenseBoundary.updateQueue;
18873  
18874      if (wakeables === null) {
18875        var updateQueue = new Set();
18876        updateQueue.add(wakeable);
18877        suspenseBoundary.updateQueue = updateQueue;
18878      } else {
18879        wakeables.add(wakeable);
18880      }
18881    }
18882  
18883    function resetSuspendedComponent(sourceFiber, rootRenderLanes) {
18884      // A legacy mode Suspense quirk, only relevant to hook components.
18885  
18886  
18887      var tag = sourceFiber.tag;
18888  
18889      if ((sourceFiber.mode & ConcurrentMode) === NoMode && (tag === FunctionComponent || tag === ForwardRef || tag === SimpleMemoComponent)) {
18890        var currentSource = sourceFiber.alternate;
18891  
18892        if (currentSource) {
18893          sourceFiber.updateQueue = currentSource.updateQueue;
18894          sourceFiber.memoizedState = currentSource.memoizedState;
18895          sourceFiber.lanes = currentSource.lanes;
18896        } else {
18897          sourceFiber.updateQueue = null;
18898          sourceFiber.memoizedState = null;
18899        }
18900      }
18901    }
18902  
18903    function getNearestSuspenseBoundaryToCapture(returnFiber) {
18904      var node = returnFiber;
18905  
18906      do {
18907        if (node.tag === SuspenseComponent && shouldCaptureSuspense(node)) {
18908          return node;
18909        } // This boundary already captured during this render. Continue to the next
18910        // boundary.
18911  
18912  
18913        node = node.return;
18914      } while (node !== null);
18915  
18916      return null;
18917    }
18918  
18919    function markSuspenseBoundaryShouldCapture(suspenseBoundary, returnFiber, sourceFiber, root, rootRenderLanes) {
18920      // This marks a Suspense boundary so that when we're unwinding the stack,
18921      // it captures the suspended "exception" and does a second (fallback) pass.
18922      if ((suspenseBoundary.mode & ConcurrentMode) === NoMode) {
18923        // Legacy Mode Suspense
18924        //
18925        // If the boundary is in legacy mode, we should *not*
18926        // suspend the commit. Pretend as if the suspended component rendered
18927        // null and keep rendering. When the Suspense boundary completes,
18928        // we'll do a second pass to render the fallback.
18929        if (suspenseBoundary === returnFiber) {
18930          // Special case where we suspended while reconciling the children of
18931          // a Suspense boundary's inner Offscreen wrapper fiber. This happens
18932          // when a React.lazy component is a direct child of a
18933          // Suspense boundary.
18934          //
18935          // Suspense boundaries are implemented as multiple fibers, but they
18936          // are a single conceptual unit. The legacy mode behavior where we
18937          // pretend the suspended fiber committed as `null` won't work,
18938          // because in this case the "suspended" fiber is the inner
18939          // Offscreen wrapper.
18940          //
18941          // Because the contents of the boundary haven't started rendering
18942          // yet (i.e. nothing in the tree has partially rendered) we can
18943          // switch to the regular, concurrent mode behavior: mark the
18944          // boundary with ShouldCapture and enter the unwind phase.
18945          suspenseBoundary.flags |= ShouldCapture;
18946        } else {
18947          suspenseBoundary.flags |= DidCapture;
18948          sourceFiber.flags |= ForceUpdateForLegacySuspense; // We're going to commit this fiber even though it didn't complete.
18949          // But we shouldn't call any lifecycle methods or callbacks. Remove
18950          // all lifecycle effect tags.
18951  
18952          sourceFiber.flags &= ~(LifecycleEffectMask | Incomplete);
18953  
18954          if (sourceFiber.tag === ClassComponent) {
18955            var currentSourceFiber = sourceFiber.alternate;
18956  
18957            if (currentSourceFiber === null) {
18958              // This is a new mount. Change the tag so it's not mistaken for a
18959              // completed class component. For example, we should not call
18960              // componentWillUnmount if it is deleted.
18961              sourceFiber.tag = IncompleteClassComponent;
18962            } else {
18963              // When we try rendering again, we should not reuse the current fiber,
18964              // since it's known to be in an inconsistent state. Use a force update to
18965              // prevent a bail out.
18966              var update = createUpdate(NoTimestamp, SyncLane);
18967              update.tag = ForceUpdate;
18968              enqueueUpdate(sourceFiber, update, SyncLane);
18969            }
18970          } // The source fiber did not complete. Mark it with Sync priority to
18971          // indicate that it still has pending work.
18972  
18973  
18974          sourceFiber.lanes = mergeLanes(sourceFiber.lanes, SyncLane);
18975        }
18976  
18977        return suspenseBoundary;
18978      } // Confirmed that the boundary is in a concurrent mode tree. Continue
18979      // with the normal suspend path.
18980      //
18981      // After this we'll use a set of heuristics to determine whether this
18982      // render pass will run to completion or restart or "suspend" the commit.
18983      // The actual logic for this is spread out in different places.
18984      //
18985      // This first principle is that if we're going to suspend when we complete
18986      // a root, then we should also restart if we get an update or ping that
18987      // might unsuspend it, and vice versa. The only reason to suspend is
18988      // because you think you might want to restart before committing. However,
18989      // it doesn't make sense to restart only while in the period we're suspended.
18990      //
18991      // Restarting too aggressively is also not good because it starves out any
18992      // intermediate loading state. So we use heuristics to determine when.
18993      // Suspense Heuristics
18994      //
18995      // If nothing threw a Promise or all the same fallbacks are already showing,
18996      // then don't suspend/restart.
18997      //
18998      // If this is an initial render of a new tree of Suspense boundaries and
18999      // those trigger a fallback, then don't suspend/restart. We want to ensure
19000      // that we can show the initial loading state as quickly as possible.
19001      //
19002      // If we hit a "Delayed" case, such as when we'd switch from content back into
19003      // a fallback, then we should always suspend/restart. Transitions apply
19004      // to this case. If none is defined, JND is used instead.
19005      //
19006      // If we're already showing a fallback and it gets "retried", allowing us to show
19007      // another level, but there's still an inner boundary that would show a fallback,
19008      // then we suspend/restart for 500ms since the last time we showed a fallback
19009      // anywhere in the tree. This effectively throttles progressive loading into a
19010      // consistent train of commits. This also gives us an opportunity to restart to
19011      // get to the completed state slightly earlier.
19012      //
19013      // If there's ambiguity due to batching it's resolved in preference of:
19014      // 1) "delayed", 2) "initial render", 3) "retry".
19015      //
19016      // We want to ensure that a "busy" state doesn't get force committed. We want to
19017      // ensure that new initial loading states can commit as soon as possible.
19018  
19019  
19020      suspenseBoundary.flags |= ShouldCapture; // TODO: I think we can remove this, since we now use `DidCapture` in
19021      // the begin phase to prevent an early bailout.
19022  
19023      suspenseBoundary.lanes = rootRenderLanes;
19024      return suspenseBoundary;
19025    }
19026  
19027    function throwException(root, returnFiber, sourceFiber, value, rootRenderLanes) {
19028      // The source fiber did not complete.
19029      sourceFiber.flags |= Incomplete;
19030  
19031      {
19032        if (isDevToolsPresent) {
19033          // If we have pending work still, restore the original updaters
19034          restorePendingUpdaters(root, rootRenderLanes);
19035        }
19036      }
19037  
19038      if (value !== null && typeof value === 'object' && typeof value.then === 'function') {
19039        // This is a wakeable. The component suspended.
19040        var wakeable = value;
19041        resetSuspendedComponent(sourceFiber);
19042  
19043        {
19044          if (getIsHydrating() && sourceFiber.mode & ConcurrentMode) {
19045            markDidThrowWhileHydratingDEV();
19046          }
19047        }
19048  
19049  
19050        var suspenseBoundary = getNearestSuspenseBoundaryToCapture(returnFiber);
19051  
19052        if (suspenseBoundary !== null) {
19053          suspenseBoundary.flags &= ~ForceClientRender;
19054          markSuspenseBoundaryShouldCapture(suspenseBoundary, returnFiber, sourceFiber, root, rootRenderLanes); // We only attach ping listeners in concurrent mode. Legacy Suspense always
19055          // commits fallbacks synchronously, so there are no pings.
19056  
19057          if (suspenseBoundary.mode & ConcurrentMode) {
19058            attachPingListener(root, wakeable, rootRenderLanes);
19059          }
19060  
19061          attachRetryListener(suspenseBoundary, root, wakeable);
19062          return;
19063        } else {
19064          // No boundary was found. Unless this is a sync update, this is OK.
19065          // We can suspend and wait for more data to arrive.
19066          if (!includesSyncLane(rootRenderLanes)) {
19067            // This is not a sync update. Suspend. Since we're not activating a
19068            // Suspense boundary, this will unwind all the way to the root without
19069            // performing a second pass to render a fallback. (This is arguably how
19070            // refresh transitions should work, too, since we're not going to commit
19071            // the fallbacks anyway.)
19072            //
19073            // This case also applies to initial hydration.
19074            attachPingListener(root, wakeable, rootRenderLanes);
19075            renderDidSuspendDelayIfPossible();
19076            return;
19077          } // This is a sync/discrete update. We treat this case like an error
19078          // because discrete renders are expected to produce a complete tree
19079          // synchronously to maintain consistency with external state.
19080  
19081  
19082          var uncaughtSuspenseError = new Error('A component suspended while responding to synchronous input. This ' + 'will cause the UI to be replaced with a loading indicator. To ' + 'fix, updates that suspend should be wrapped ' + 'with startTransition.'); // If we're outside a transition, fall through to the regular error path.
19083          // The error will be caught by the nearest suspense boundary.
19084  
19085          value = uncaughtSuspenseError;
19086        }
19087      } else {
19088        // This is a regular error, not a Suspense wakeable.
19089        if (getIsHydrating() && sourceFiber.mode & ConcurrentMode) {
19090          markDidThrowWhileHydratingDEV();
19091  
19092          var _suspenseBoundary = getNearestSuspenseBoundaryToCapture(returnFiber); // If the error was thrown during hydration, we may be able to recover by
19093          // discarding the dehydrated content and switching to a client render.
19094          // Instead of surfacing the error, find the nearest Suspense boundary
19095          // and render it again without hydration.
19096  
19097  
19098          if (_suspenseBoundary !== null) {
19099            if ((_suspenseBoundary.flags & ShouldCapture) === NoFlags) {
19100              // Set a flag to indicate that we should try rendering the normal
19101              // children again, not the fallback.
19102              _suspenseBoundary.flags |= ForceClientRender;
19103            }
19104  
19105            markSuspenseBoundaryShouldCapture(_suspenseBoundary, returnFiber, sourceFiber, root, rootRenderLanes); // Even though the user may not be affected by this error, we should
19106            // still log it so it can be fixed.
19107  
19108            queueHydrationError(createCapturedValueAtFiber(value, sourceFiber));
19109            return;
19110          }
19111        }
19112      }
19113  
19114      value = createCapturedValueAtFiber(value, sourceFiber);
19115      renderDidError(value); // We didn't find a boundary that could handle this type of exception. Start
19116      // over and traverse parent path again, this time treating the exception
19117      // as an error.
19118  
19119      var workInProgress = returnFiber;
19120  
19121      do {
19122        switch (workInProgress.tag) {
19123          case HostRoot:
19124            {
19125              var _errorInfo = value;
19126              workInProgress.flags |= ShouldCapture;
19127              var lane = pickArbitraryLane(rootRenderLanes);
19128              workInProgress.lanes = mergeLanes(workInProgress.lanes, lane);
19129              var update = createRootErrorUpdate(workInProgress, _errorInfo, lane);
19130              enqueueCapturedUpdate(workInProgress, update);
19131              return;
19132            }
19133  
19134          case ClassComponent:
19135            // Capture and retry
19136            var errorInfo = value;
19137            var ctor = workInProgress.type;
19138            var instance = workInProgress.stateNode;
19139  
19140            if ((workInProgress.flags & DidCapture) === NoFlags && (typeof ctor.getDerivedStateFromError === 'function' || instance !== null && typeof instance.componentDidCatch === 'function' && !isAlreadyFailedLegacyErrorBoundary(instance))) {
19141              workInProgress.flags |= ShouldCapture;
19142  
19143              var _lane = pickArbitraryLane(rootRenderLanes);
19144  
19145              workInProgress.lanes = mergeLanes(workInProgress.lanes, _lane); // Schedule the error boundary to re-render using updated state
19146  
19147              var _update = createClassErrorUpdate(workInProgress, errorInfo, _lane);
19148  
19149              enqueueCapturedUpdate(workInProgress, _update);
19150              return;
19151            }
19152  
19153            break;
19154        }
19155  
19156        workInProgress = workInProgress.return;
19157      } while (workInProgress !== null);
19158    }
19159  
19160    function getSuspendedCache() {
19161      {
19162        return null;
19163      } // This function is called when a Suspense boundary suspends. It returns the
19164    }
19165  
19166    var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
19167    var didReceiveUpdate = false;
19168    var didWarnAboutBadClass;
19169    var didWarnAboutModulePatternComponent;
19170    var didWarnAboutContextTypeOnFunctionComponent;
19171    var didWarnAboutGetDerivedStateOnFunctionComponent;
19172    var didWarnAboutFunctionRefs;
19173    var didWarnAboutReassigningProps;
19174    var didWarnAboutRevealOrder;
19175    var didWarnAboutTailOptions;
19176    var didWarnAboutDefaultPropsOnFunctionComponent;
19177  
19178    {
19179      didWarnAboutBadClass = {};
19180      didWarnAboutModulePatternComponent = {};
19181      didWarnAboutContextTypeOnFunctionComponent = {};
19182      didWarnAboutGetDerivedStateOnFunctionComponent = {};
19183      didWarnAboutFunctionRefs = {};
19184      didWarnAboutReassigningProps = false;
19185      didWarnAboutRevealOrder = {};
19186      didWarnAboutTailOptions = {};
19187      didWarnAboutDefaultPropsOnFunctionComponent = {};
19188    }
19189  
19190    function reconcileChildren(current, workInProgress, nextChildren, renderLanes) {
19191      if (current === null) {
19192        // If this is a fresh new component that hasn't been rendered yet, we
19193        // won't update its child set by applying minimal side-effects. Instead,
19194        // we will add them all to the child before it gets rendered. That means
19195        // we can optimize this reconciliation pass by not tracking side-effects.
19196        workInProgress.child = mountChildFibers(workInProgress, null, nextChildren, renderLanes);
19197      } else {
19198        // If the current child is the same as the work in progress, it means that
19199        // we haven't yet started any work on these children. Therefore, we use
19200        // the clone algorithm to create a copy of all the current children.
19201        // If we had any progressed work already, that is invalid at this point so
19202        // let's throw it out.
19203        workInProgress.child = reconcileChildFibers(workInProgress, current.child, nextChildren, renderLanes);
19204      }
19205    }
19206  
19207    function forceUnmountCurrentAndReconcile(current, workInProgress, nextChildren, renderLanes) {
19208      // This function is fork of reconcileChildren. It's used in cases where we
19209      // want to reconcile without matching against the existing set. This has the
19210      // effect of all current children being unmounted; even if the type and key
19211      // are the same, the old child is unmounted and a new child is created.
19212      //
19213      // To do this, we're going to go through the reconcile algorithm twice. In
19214      // the first pass, we schedule a deletion for all the current children by
19215      // passing null.
19216      workInProgress.child = reconcileChildFibers(workInProgress, current.child, null, renderLanes); // In the second pass, we mount the new children. The trick here is that we
19217      // pass null in place of where we usually pass the current child set. This has
19218      // the effect of remounting all children regardless of whether their
19219      // identities match.
19220  
19221      workInProgress.child = reconcileChildFibers(workInProgress, null, nextChildren, renderLanes);
19222    }
19223  
19224    function updateForwardRef(current, workInProgress, Component, nextProps, renderLanes) {
19225      // TODO: current can be non-null here even if the component
19226      // hasn't yet mounted. This happens after the first render suspends.
19227      // We'll need to figure out if this is fine or can cause issues.
19228      {
19229        if (workInProgress.type !== workInProgress.elementType) {
19230          // Lazy component props can't be validated in createElement
19231          // because they're only guaranteed to be resolved here.
19232          var innerPropTypes = Component.propTypes;
19233  
19234          if (innerPropTypes) {
19235            checkPropTypes(innerPropTypes, nextProps, // Resolved props
19236            'prop', getComponentNameFromType(Component));
19237          }
19238        }
19239      }
19240  
19241      var render = Component.render;
19242      var ref = workInProgress.ref; // The rest is a fork of updateFunctionComponent
19243  
19244      var nextChildren;
19245      var hasId;
19246      prepareToReadContext(workInProgress, renderLanes);
19247  
19248      {
19249        markComponentRenderStarted(workInProgress);
19250      }
19251  
19252      {
19253        ReactCurrentOwner$1.current = workInProgress;
19254        setIsRendering(true);
19255        nextChildren = renderWithHooks(current, workInProgress, render, nextProps, ref, renderLanes);
19256        hasId = checkDidRenderIdHook();
19257  
19258        if ( workInProgress.mode & StrictLegacyMode) {
19259          setIsStrictModeForDevtools(true);
19260  
19261          try {
19262            nextChildren = renderWithHooks(current, workInProgress, render, nextProps, ref, renderLanes);
19263            hasId = checkDidRenderIdHook();
19264          } finally {
19265            setIsStrictModeForDevtools(false);
19266          }
19267        }
19268  
19269        setIsRendering(false);
19270      }
19271  
19272      {
19273        markComponentRenderStopped();
19274      }
19275  
19276      if (current !== null && !didReceiveUpdate) {
19277        bailoutHooks(current, workInProgress, renderLanes);
19278        return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
19279      }
19280  
19281      if (getIsHydrating() && hasId) {
19282        pushMaterializedTreeId(workInProgress);
19283      } // React DevTools reads this flag.
19284  
19285  
19286      workInProgress.flags |= PerformedWork;
19287      reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19288      return workInProgress.child;
19289    }
19290  
19291    function updateMemoComponent(current, workInProgress, Component, nextProps, renderLanes) {
19292      if (current === null) {
19293        var type = Component.type;
19294  
19295        if (isSimpleFunctionComponent(type) && Component.compare === null && // SimpleMemoComponent codepath doesn't resolve outer props either.
19296        Component.defaultProps === undefined) {
19297          var resolvedType = type;
19298  
19299          {
19300            resolvedType = resolveFunctionForHotReloading(type);
19301          } // If this is a plain function component without default props,
19302          // and with only the default shallow comparison, we upgrade it
19303          // to a SimpleMemoComponent to allow fast path updates.
19304  
19305  
19306          workInProgress.tag = SimpleMemoComponent;
19307          workInProgress.type = resolvedType;
19308  
19309          {
19310            validateFunctionComponentInDev(workInProgress, type);
19311          }
19312  
19313          return updateSimpleMemoComponent(current, workInProgress, resolvedType, nextProps, renderLanes);
19314        }
19315  
19316        {
19317          var innerPropTypes = type.propTypes;
19318  
19319          if (innerPropTypes) {
19320            // Inner memo component props aren't currently validated in createElement.
19321            // We could move it there, but we'd still need this for lazy code path.
19322            checkPropTypes(innerPropTypes, nextProps, // Resolved props
19323            'prop', getComponentNameFromType(type));
19324          }
19325  
19326          if ( Component.defaultProps !== undefined) {
19327            var componentName = getComponentNameFromType(type) || 'Unknown';
19328  
19329            if (!didWarnAboutDefaultPropsOnFunctionComponent[componentName]) {
19330              error('%s: Support for defaultProps will be removed from memo components ' + 'in a future major release. Use JavaScript default parameters instead.', componentName);
19331  
19332              didWarnAboutDefaultPropsOnFunctionComponent[componentName] = true;
19333            }
19334          }
19335        }
19336  
19337        var child = createFiberFromTypeAndProps(Component.type, null, nextProps, workInProgress, workInProgress.mode, renderLanes);
19338        child.ref = workInProgress.ref;
19339        child.return = workInProgress;
19340        workInProgress.child = child;
19341        return child;
19342      }
19343  
19344      {
19345        var _type = Component.type;
19346        var _innerPropTypes = _type.propTypes;
19347  
19348        if (_innerPropTypes) {
19349          // Inner memo component props aren't currently validated in createElement.
19350          // We could move it there, but we'd still need this for lazy code path.
19351          checkPropTypes(_innerPropTypes, nextProps, // Resolved props
19352          'prop', getComponentNameFromType(_type));
19353        }
19354      }
19355  
19356      var currentChild = current.child; // This is always exactly one child
19357  
19358      var hasScheduledUpdateOrContext = checkScheduledUpdateOrContext(current, renderLanes);
19359  
19360      if (!hasScheduledUpdateOrContext) {
19361        // This will be the props with resolved defaultProps,
19362        // unlike current.memoizedProps which will be the unresolved ones.
19363        var prevProps = currentChild.memoizedProps; // Default to shallow comparison
19364  
19365        var compare = Component.compare;
19366        compare = compare !== null ? compare : shallowEqual;
19367  
19368        if (compare(prevProps, nextProps) && current.ref === workInProgress.ref) {
19369          return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
19370        }
19371      } // React DevTools reads this flag.
19372  
19373  
19374      workInProgress.flags |= PerformedWork;
19375      var newChild = createWorkInProgress(currentChild, nextProps);
19376      newChild.ref = workInProgress.ref;
19377      newChild.return = workInProgress;
19378      workInProgress.child = newChild;
19379      return newChild;
19380    }
19381  
19382    function updateSimpleMemoComponent(current, workInProgress, Component, nextProps, renderLanes) {
19383      // TODO: current can be non-null here even if the component
19384      // hasn't yet mounted. This happens when the inner render suspends.
19385      // We'll need to figure out if this is fine or can cause issues.
19386      {
19387        if (workInProgress.type !== workInProgress.elementType) {
19388          // Lazy component props can't be validated in createElement
19389          // because they're only guaranteed to be resolved here.
19390          var outerMemoType = workInProgress.elementType;
19391  
19392          if (outerMemoType.$$typeof === REACT_LAZY_TYPE) {
19393            // We warn when you define propTypes on lazy()
19394            // so let's just skip over it to find memo() outer wrapper.
19395            // Inner props for memo are validated later.
19396            var lazyComponent = outerMemoType;
19397            var payload = lazyComponent._payload;
19398            var init = lazyComponent._init;
19399  
19400            try {
19401              outerMemoType = init(payload);
19402            } catch (x) {
19403              outerMemoType = null;
19404            } // Inner propTypes will be validated in the function component path.
19405  
19406  
19407            var outerPropTypes = outerMemoType && outerMemoType.propTypes;
19408  
19409            if (outerPropTypes) {
19410              checkPropTypes(outerPropTypes, nextProps, // Resolved (SimpleMemoComponent has no defaultProps)
19411              'prop', getComponentNameFromType(outerMemoType));
19412            }
19413          }
19414        }
19415      }
19416  
19417      if (current !== null) {
19418        var prevProps = current.memoizedProps;
19419  
19420        if (shallowEqual(prevProps, nextProps) && current.ref === workInProgress.ref && ( // Prevent bailout if the implementation changed due to hot reload.
19421         workInProgress.type === current.type )) {
19422          didReceiveUpdate = false; // The props are shallowly equal. Reuse the previous props object, like we
19423          // would during a normal fiber bailout.
19424          //
19425          // We don't have strong guarantees that the props object is referentially
19426          // equal during updates where we can't bail out anyway — like if the props
19427          // are shallowly equal, but there's a local state or context update in the
19428          // same batch.
19429          //
19430          // However, as a principle, we should aim to make the behavior consistent
19431          // across different ways of memoizing a component. For example, React.memo
19432          // has a different internal Fiber layout if you pass a normal function
19433          // component (SimpleMemoComponent) versus if you pass a different type
19434          // like forwardRef (MemoComponent). But this is an implementation detail.
19435          // Wrapping a component in forwardRef (or React.lazy, etc) shouldn't
19436          // affect whether the props object is reused during a bailout.
19437  
19438          workInProgress.pendingProps = nextProps = prevProps;
19439  
19440          if (!checkScheduledUpdateOrContext(current, renderLanes)) {
19441            // The pending lanes were cleared at the beginning of beginWork. We're
19442            // about to bail out, but there might be other lanes that weren't
19443            // included in the current render. Usually, the priority level of the
19444            // remaining updates is accumulated during the evaluation of the
19445            // component (i.e. when processing the update queue). But since since
19446            // we're bailing out early *without* evaluating the component, we need
19447            // to account for it here, too. Reset to the value of the current fiber.
19448            // NOTE: This only applies to SimpleMemoComponent, not MemoComponent,
19449            // because a MemoComponent fiber does not have hooks or an update queue;
19450            // rather, it wraps around an inner component, which may or may not
19451            // contains hooks.
19452            // TODO: Move the reset at in beginWork out of the common path so that
19453            // this is no longer necessary.
19454            workInProgress.lanes = current.lanes;
19455            return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
19456          } else if ((current.flags & ForceUpdateForLegacySuspense) !== NoFlags) {
19457            // This is a special case that only exists for legacy mode.
19458            // See https://github.com/facebook/react/pull/19216.
19459            didReceiveUpdate = true;
19460          }
19461        }
19462      }
19463  
19464      return updateFunctionComponent(current, workInProgress, Component, nextProps, renderLanes);
19465    }
19466  
19467    function updateOffscreenComponent(current, workInProgress, renderLanes) {
19468      var nextProps = workInProgress.pendingProps;
19469      var nextChildren = nextProps.children;
19470      var prevState = current !== null ? current.memoizedState : null;
19471  
19472      if (nextProps.mode === 'hidden' || enableLegacyHidden ) {
19473        // Rendering a hidden tree.
19474        if ((workInProgress.mode & ConcurrentMode) === NoMode) {
19475          // In legacy sync mode, don't defer the subtree. Render it now.
19476          // TODO: Consider how Offscreen should work with transitions in the future
19477          var nextState = {
19478            baseLanes: NoLanes,
19479            cachePool: null,
19480            transitions: null
19481          };
19482          workInProgress.memoizedState = nextState;
19483  
19484          pushRenderLanes(workInProgress, renderLanes);
19485        } else if (!includesSomeLane(renderLanes, OffscreenLane)) {
19486          var spawnedCachePool = null; // We're hidden, and we're not rendering at Offscreen. We will bail out
19487          // and resume this tree later.
19488  
19489          var nextBaseLanes;
19490  
19491          if (prevState !== null) {
19492            var prevBaseLanes = prevState.baseLanes;
19493            nextBaseLanes = mergeLanes(prevBaseLanes, renderLanes);
19494          } else {
19495            nextBaseLanes = renderLanes;
19496          } // Schedule this fiber to re-render at offscreen priority. Then bailout.
19497  
19498  
19499          workInProgress.lanes = workInProgress.childLanes = laneToLanes(OffscreenLane);
19500          var _nextState = {
19501            baseLanes: nextBaseLanes,
19502            cachePool: spawnedCachePool,
19503            transitions: null
19504          };
19505          workInProgress.memoizedState = _nextState;
19506          workInProgress.updateQueue = null;
19507          // to avoid a push/pop misalignment.
19508  
19509  
19510          pushRenderLanes(workInProgress, nextBaseLanes);
19511  
19512          return null;
19513        } else {
19514          // This is the second render. The surrounding visible content has already
19515          // committed. Now we resume rendering the hidden tree.
19516          // Rendering at offscreen, so we can clear the base lanes.
19517          var _nextState2 = {
19518            baseLanes: NoLanes,
19519            cachePool: null,
19520            transitions: null
19521          };
19522          workInProgress.memoizedState = _nextState2; // Push the lanes that were skipped when we bailed out.
19523  
19524          var subtreeRenderLanes = prevState !== null ? prevState.baseLanes : renderLanes;
19525  
19526          pushRenderLanes(workInProgress, subtreeRenderLanes);
19527        }
19528      } else {
19529        // Rendering a visible tree.
19530        var _subtreeRenderLanes;
19531  
19532        if (prevState !== null) {
19533          // We're going from hidden -> visible.
19534          _subtreeRenderLanes = mergeLanes(prevState.baseLanes, renderLanes);
19535  
19536          workInProgress.memoizedState = null;
19537        } else {
19538          // We weren't previously hidden, and we still aren't, so there's nothing
19539          // special to do. Need to push to the stack regardless, though, to avoid
19540          // a push/pop misalignment.
19541          _subtreeRenderLanes = renderLanes;
19542        }
19543  
19544        pushRenderLanes(workInProgress, _subtreeRenderLanes);
19545      }
19546  
19547      reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19548      return workInProgress.child;
19549    } // Note: These happen to have identical begin phases, for now. We shouldn't hold
19550  
19551    function updateFragment(current, workInProgress, renderLanes) {
19552      var nextChildren = workInProgress.pendingProps;
19553      reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19554      return workInProgress.child;
19555    }
19556  
19557    function updateMode(current, workInProgress, renderLanes) {
19558      var nextChildren = workInProgress.pendingProps.children;
19559      reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19560      return workInProgress.child;
19561    }
19562  
19563    function updateProfiler(current, workInProgress, renderLanes) {
19564      {
19565        workInProgress.flags |= Update;
19566  
19567        {
19568          // Reset effect durations for the next eventual effect phase.
19569          // These are reset during render to allow the DevTools commit hook a chance to read them,
19570          var stateNode = workInProgress.stateNode;
19571          stateNode.effectDuration = 0;
19572          stateNode.passiveEffectDuration = 0;
19573        }
19574      }
19575  
19576      var nextProps = workInProgress.pendingProps;
19577      var nextChildren = nextProps.children;
19578      reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19579      return workInProgress.child;
19580    }
19581  
19582    function markRef(current, workInProgress) {
19583      var ref = workInProgress.ref;
19584  
19585      if (current === null && ref !== null || current !== null && current.ref !== ref) {
19586        // Schedule a Ref effect
19587        workInProgress.flags |= Ref;
19588  
19589        {
19590          workInProgress.flags |= RefStatic;
19591        }
19592      }
19593    }
19594  
19595    function updateFunctionComponent(current, workInProgress, Component, nextProps, renderLanes) {
19596      {
19597        if (workInProgress.type !== workInProgress.elementType) {
19598          // Lazy component props can't be validated in createElement
19599          // because they're only guaranteed to be resolved here.
19600          var innerPropTypes = Component.propTypes;
19601  
19602          if (innerPropTypes) {
19603            checkPropTypes(innerPropTypes, nextProps, // Resolved props
19604            'prop', getComponentNameFromType(Component));
19605          }
19606        }
19607      }
19608  
19609      var context;
19610  
19611      {
19612        var unmaskedContext = getUnmaskedContext(workInProgress, Component, true);
19613        context = getMaskedContext(workInProgress, unmaskedContext);
19614      }
19615  
19616      var nextChildren;
19617      var hasId;
19618      prepareToReadContext(workInProgress, renderLanes);
19619  
19620      {
19621        markComponentRenderStarted(workInProgress);
19622      }
19623  
19624      {
19625        ReactCurrentOwner$1.current = workInProgress;
19626        setIsRendering(true);
19627        nextChildren = renderWithHooks(current, workInProgress, Component, nextProps, context, renderLanes);
19628        hasId = checkDidRenderIdHook();
19629  
19630        if ( workInProgress.mode & StrictLegacyMode) {
19631          setIsStrictModeForDevtools(true);
19632  
19633          try {
19634            nextChildren = renderWithHooks(current, workInProgress, Component, nextProps, context, renderLanes);
19635            hasId = checkDidRenderIdHook();
19636          } finally {
19637            setIsStrictModeForDevtools(false);
19638          }
19639        }
19640  
19641        setIsRendering(false);
19642      }
19643  
19644      {
19645        markComponentRenderStopped();
19646      }
19647  
19648      if (current !== null && !didReceiveUpdate) {
19649        bailoutHooks(current, workInProgress, renderLanes);
19650        return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
19651      }
19652  
19653      if (getIsHydrating() && hasId) {
19654        pushMaterializedTreeId(workInProgress);
19655      } // React DevTools reads this flag.
19656  
19657  
19658      workInProgress.flags |= PerformedWork;
19659      reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19660      return workInProgress.child;
19661    }
19662  
19663    function updateClassComponent(current, workInProgress, Component, nextProps, renderLanes) {
19664      {
19665        // This is used by DevTools to force a boundary to error.
19666        switch (shouldError(workInProgress)) {
19667          case false:
19668            {
19669              var _instance = workInProgress.stateNode;
19670              var ctor = workInProgress.type; // TODO This way of resetting the error boundary state is a hack.
19671              // Is there a better way to do this?
19672  
19673              var tempInstance = new ctor(workInProgress.memoizedProps, _instance.context);
19674              var state = tempInstance.state;
19675  
19676              _instance.updater.enqueueSetState(_instance, state, null);
19677  
19678              break;
19679            }
19680  
19681          case true:
19682            {
19683              workInProgress.flags |= DidCapture;
19684              workInProgress.flags |= ShouldCapture; // eslint-disable-next-line react-internal/prod-error-codes
19685  
19686              var error$1 = new Error('Simulated error coming from DevTools');
19687              var lane = pickArbitraryLane(renderLanes);
19688              workInProgress.lanes = mergeLanes(workInProgress.lanes, lane); // Schedule the error boundary to re-render using updated state
19689  
19690              var update = createClassErrorUpdate(workInProgress, createCapturedValueAtFiber(error$1, workInProgress), lane);
19691              enqueueCapturedUpdate(workInProgress, update);
19692              break;
19693            }
19694        }
19695  
19696        if (workInProgress.type !== workInProgress.elementType) {
19697          // Lazy component props can't be validated in createElement
19698          // because they're only guaranteed to be resolved here.
19699          var innerPropTypes = Component.propTypes;
19700  
19701          if (innerPropTypes) {
19702            checkPropTypes(innerPropTypes, nextProps, // Resolved props
19703            'prop', getComponentNameFromType(Component));
19704          }
19705        }
19706      } // Push context providers early to prevent context stack mismatches.
19707      // During mounting we don't know the child context yet as the instance doesn't exist.
19708      // We will invalidate the child context in finishClassComponent() right after rendering.
19709  
19710  
19711      var hasContext;
19712  
19713      if (isContextProvider(Component)) {
19714        hasContext = true;
19715        pushContextProvider(workInProgress);
19716      } else {
19717        hasContext = false;
19718      }
19719  
19720      prepareToReadContext(workInProgress, renderLanes);
19721      var instance = workInProgress.stateNode;
19722      var shouldUpdate;
19723  
19724      if (instance === null) {
19725        resetSuspendedCurrentOnMountInLegacyMode(current, workInProgress); // In the initial pass we might need to construct the instance.
19726  
19727        constructClassInstance(workInProgress, Component, nextProps);
19728        mountClassInstance(workInProgress, Component, nextProps, renderLanes);
19729        shouldUpdate = true;
19730      } else if (current === null) {
19731        // In a resume, we'll already have an instance we can reuse.
19732        shouldUpdate = resumeMountClassInstance(workInProgress, Component, nextProps, renderLanes);
19733      } else {
19734        shouldUpdate = updateClassInstance(current, workInProgress, Component, nextProps, renderLanes);
19735      }
19736  
19737      var nextUnitOfWork = finishClassComponent(current, workInProgress, Component, shouldUpdate, hasContext, renderLanes);
19738  
19739      {
19740        var inst = workInProgress.stateNode;
19741  
19742        if (shouldUpdate && inst.props !== nextProps) {
19743          if (!didWarnAboutReassigningProps) {
19744            error('It looks like %s is reassigning its own `this.props` while rendering. ' + 'This is not supported and can lead to confusing bugs.', getComponentNameFromFiber(workInProgress) || 'a component');
19745          }
19746  
19747          didWarnAboutReassigningProps = true;
19748        }
19749      }
19750  
19751      return nextUnitOfWork;
19752    }
19753  
19754    function finishClassComponent(current, workInProgress, Component, shouldUpdate, hasContext, renderLanes) {
19755      // Refs should update even if shouldComponentUpdate returns false
19756      markRef(current, workInProgress);
19757      var didCaptureError = (workInProgress.flags & DidCapture) !== NoFlags;
19758  
19759      if (!shouldUpdate && !didCaptureError) {
19760        // Context providers should defer to sCU for rendering
19761        if (hasContext) {
19762          invalidateContextProvider(workInProgress, Component, false);
19763        }
19764  
19765        return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
19766      }
19767  
19768      var instance = workInProgress.stateNode; // Rerender
19769  
19770      ReactCurrentOwner$1.current = workInProgress;
19771      var nextChildren;
19772  
19773      if (didCaptureError && typeof Component.getDerivedStateFromError !== 'function') {
19774        // If we captured an error, but getDerivedStateFromError is not defined,
19775        // unmount all the children. componentDidCatch will schedule an update to
19776        // re-render a fallback. This is temporary until we migrate everyone to
19777        // the new API.
19778        // TODO: Warn in a future release.
19779        nextChildren = null;
19780  
19781        {
19782          stopProfilerTimerIfRunning();
19783        }
19784      } else {
19785        {
19786          markComponentRenderStarted(workInProgress);
19787        }
19788  
19789        {
19790          setIsRendering(true);
19791          nextChildren = instance.render();
19792  
19793          if ( workInProgress.mode & StrictLegacyMode) {
19794            setIsStrictModeForDevtools(true);
19795  
19796            try {
19797              instance.render();
19798            } finally {
19799              setIsStrictModeForDevtools(false);
19800            }
19801          }
19802  
19803          setIsRendering(false);
19804        }
19805  
19806        {
19807          markComponentRenderStopped();
19808        }
19809      } // React DevTools reads this flag.
19810  
19811  
19812      workInProgress.flags |= PerformedWork;
19813  
19814      if (current !== null && didCaptureError) {
19815        // If we're recovering from an error, reconcile without reusing any of
19816        // the existing children. Conceptually, the normal children and the children
19817        // that are shown on error are two different sets, so we shouldn't reuse
19818        // normal children even if their identities match.
19819        forceUnmountCurrentAndReconcile(current, workInProgress, nextChildren, renderLanes);
19820      } else {
19821        reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19822      } // Memoize state using the values we just used to render.
19823      // TODO: Restructure so we never read values from the instance.
19824  
19825  
19826      workInProgress.memoizedState = instance.state; // The context might have changed so we need to recalculate it.
19827  
19828      if (hasContext) {
19829        invalidateContextProvider(workInProgress, Component, true);
19830      }
19831  
19832      return workInProgress.child;
19833    }
19834  
19835    function pushHostRootContext(workInProgress) {
19836      var root = workInProgress.stateNode;
19837  
19838      if (root.pendingContext) {
19839        pushTopLevelContextObject(workInProgress, root.pendingContext, root.pendingContext !== root.context);
19840      } else if (root.context) {
19841        // Should always be set
19842        pushTopLevelContextObject(workInProgress, root.context, false);
19843      }
19844  
19845      pushHostContainer(workInProgress, root.containerInfo);
19846    }
19847  
19848    function updateHostRoot(current, workInProgress, renderLanes) {
19849      pushHostRootContext(workInProgress);
19850  
19851      if (current === null) {
19852        throw new Error('Should have a current fiber. This is a bug in React.');
19853      }
19854  
19855      var nextProps = workInProgress.pendingProps;
19856      var prevState = workInProgress.memoizedState;
19857      var prevChildren = prevState.element;
19858      cloneUpdateQueue(current, workInProgress);
19859      processUpdateQueue(workInProgress, nextProps, null, renderLanes);
19860      var nextState = workInProgress.memoizedState;
19861      var root = workInProgress.stateNode;
19862      // being called "element".
19863  
19864  
19865      var nextChildren = nextState.element;
19866  
19867      if ( prevState.isDehydrated) {
19868        // This is a hydration root whose shell has not yet hydrated. We should
19869        // attempt to hydrate.
19870        // Flip isDehydrated to false to indicate that when this render
19871        // finishes, the root will no longer be dehydrated.
19872        var overrideState = {
19873          element: nextChildren,
19874          isDehydrated: false,
19875          cache: nextState.cache,
19876          pendingSuspenseBoundaries: nextState.pendingSuspenseBoundaries,
19877          transitions: nextState.transitions
19878        };
19879        var updateQueue = workInProgress.updateQueue; // `baseState` can always be the last state because the root doesn't
19880        // have reducer functions so it doesn't need rebasing.
19881  
19882        updateQueue.baseState = overrideState;
19883        workInProgress.memoizedState = overrideState;
19884  
19885        if (workInProgress.flags & ForceClientRender) {
19886          // Something errored during a previous attempt to hydrate the shell, so we
19887          // forced a client render.
19888          var recoverableError = createCapturedValueAtFiber(new Error('There was an error while hydrating. Because the error happened outside ' + 'of a Suspense boundary, the entire root will switch to ' + 'client rendering.'), workInProgress);
19889          return mountHostRootWithoutHydrating(current, workInProgress, nextChildren, renderLanes, recoverableError);
19890        } else if (nextChildren !== prevChildren) {
19891          var _recoverableError = createCapturedValueAtFiber(new Error('This root received an early update, before anything was able ' + 'hydrate. Switched the entire root to client rendering.'), workInProgress);
19892  
19893          return mountHostRootWithoutHydrating(current, workInProgress, nextChildren, renderLanes, _recoverableError);
19894        } else {
19895          // The outermost shell has not hydrated yet. Start hydrating.
19896          enterHydrationState(workInProgress);
19897  
19898          var child = mountChildFibers(workInProgress, null, nextChildren, renderLanes);
19899          workInProgress.child = child;
19900          var node = child;
19901  
19902          while (node) {
19903            // Mark each child as hydrating. This is a fast path to know whether this
19904            // tree is part of a hydrating tree. This is used to determine if a child
19905            // node has fully mounted yet, and for scheduling event replaying.
19906            // Conceptually this is similar to Placement in that a new subtree is
19907            // inserted into the React tree here. It just happens to not need DOM
19908            // mutations because it already exists.
19909            node.flags = node.flags & ~Placement | Hydrating;
19910            node = node.sibling;
19911          }
19912        }
19913      } else {
19914        // Root is not dehydrated. Either this is a client-only root, or it
19915        // already hydrated.
19916        resetHydrationState();
19917  
19918        if (nextChildren === prevChildren) {
19919          return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
19920        }
19921  
19922        reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19923      }
19924  
19925      return workInProgress.child;
19926    }
19927  
19928    function mountHostRootWithoutHydrating(current, workInProgress, nextChildren, renderLanes, recoverableError) {
19929      // Revert to client rendering.
19930      resetHydrationState();
19931      queueHydrationError(recoverableError);
19932      workInProgress.flags |= ForceClientRender;
19933      reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19934      return workInProgress.child;
19935    }
19936  
19937    function updateHostComponent(current, workInProgress, renderLanes) {
19938      pushHostContext(workInProgress);
19939  
19940      if (current === null) {
19941        tryToClaimNextHydratableInstance(workInProgress);
19942      }
19943  
19944      var type = workInProgress.type;
19945      var nextProps = workInProgress.pendingProps;
19946      var prevProps = current !== null ? current.memoizedProps : null;
19947      var nextChildren = nextProps.children;
19948      var isDirectTextChild = shouldSetTextContent(type, nextProps);
19949  
19950      if (isDirectTextChild) {
19951        // We special case a direct text child of a host node. This is a common
19952        // case. We won't handle it as a reified child. We will instead handle
19953        // this in the host environment that also has access to this prop. That
19954        // avoids allocating another HostText fiber and traversing it.
19955        nextChildren = null;
19956      } else if (prevProps !== null && shouldSetTextContent(type, prevProps)) {
19957        // If we're switching from a direct text child to a normal child, or to
19958        // empty, we need to schedule the text content to be reset.
19959        workInProgress.flags |= ContentReset;
19960      }
19961  
19962      markRef(current, workInProgress);
19963      reconcileChildren(current, workInProgress, nextChildren, renderLanes);
19964      return workInProgress.child;
19965    }
19966  
19967    function updateHostText(current, workInProgress) {
19968      if (current === null) {
19969        tryToClaimNextHydratableInstance(workInProgress);
19970      } // Nothing to do here. This is terminal. We'll do the completion step
19971      // immediately after.
19972  
19973  
19974      return null;
19975    }
19976  
19977    function mountLazyComponent(_current, workInProgress, elementType, renderLanes) {
19978      resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress);
19979      var props = workInProgress.pendingProps;
19980      var lazyComponent = elementType;
19981      var payload = lazyComponent._payload;
19982      var init = lazyComponent._init;
19983      var Component = init(payload); // Store the unwrapped component in the type.
19984  
19985      workInProgress.type = Component;
19986      var resolvedTag = workInProgress.tag = resolveLazyComponentTag(Component);
19987      var resolvedProps = resolveDefaultProps(Component, props);
19988      var child;
19989  
19990      switch (resolvedTag) {
19991        case FunctionComponent:
19992          {
19993            {
19994              validateFunctionComponentInDev(workInProgress, Component);
19995              workInProgress.type = Component = resolveFunctionForHotReloading(Component);
19996            }
19997  
19998            child = updateFunctionComponent(null, workInProgress, Component, resolvedProps, renderLanes);
19999            return child;
20000          }
20001  
20002        case ClassComponent:
20003          {
20004            {
20005              workInProgress.type = Component = resolveClassForHotReloading(Component);
20006            }
20007  
20008            child = updateClassComponent(null, workInProgress, Component, resolvedProps, renderLanes);
20009            return child;
20010          }
20011  
20012        case ForwardRef:
20013          {
20014            {
20015              workInProgress.type = Component = resolveForwardRefForHotReloading(Component);
20016            }
20017  
20018            child = updateForwardRef(null, workInProgress, Component, resolvedProps, renderLanes);
20019            return child;
20020          }
20021  
20022        case MemoComponent:
20023          {
20024            {
20025              if (workInProgress.type !== workInProgress.elementType) {
20026                var outerPropTypes = Component.propTypes;
20027  
20028                if (outerPropTypes) {
20029                  checkPropTypes(outerPropTypes, resolvedProps, // Resolved for outer only
20030                  'prop', getComponentNameFromType(Component));
20031                }
20032              }
20033            }
20034  
20035            child = updateMemoComponent(null, workInProgress, Component, resolveDefaultProps(Component.type, resolvedProps), // The inner type can have defaults too
20036            renderLanes);
20037            return child;
20038          }
20039      }
20040  
20041      var hint = '';
20042  
20043      {
20044        if (Component !== null && typeof Component === 'object' && Component.$$typeof === REACT_LAZY_TYPE) {
20045          hint = ' Did you wrap a component in React.lazy() more than once?';
20046        }
20047      } // This message intentionally doesn't mention ForwardRef or MemoComponent
20048      // because the fact that it's a separate type of work is an
20049      // implementation detail.
20050  
20051  
20052      throw new Error("Element type is invalid. Received a promise that resolves to: " + Component + ". " + ("Lazy element type must resolve to a class or function." + hint));
20053    }
20054  
20055    function mountIncompleteClassComponent(_current, workInProgress, Component, nextProps, renderLanes) {
20056      resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress); // Promote the fiber to a class and try rendering again.
20057  
20058      workInProgress.tag = ClassComponent; // The rest of this function is a fork of `updateClassComponent`
20059      // Push context providers early to prevent context stack mismatches.
20060      // During mounting we don't know the child context yet as the instance doesn't exist.
20061      // We will invalidate the child context in finishClassComponent() right after rendering.
20062  
20063      var hasContext;
20064  
20065      if (isContextProvider(Component)) {
20066        hasContext = true;
20067        pushContextProvider(workInProgress);
20068      } else {
20069        hasContext = false;
20070      }
20071  
20072      prepareToReadContext(workInProgress, renderLanes);
20073      constructClassInstance(workInProgress, Component, nextProps);
20074      mountClassInstance(workInProgress, Component, nextProps, renderLanes);
20075      return finishClassComponent(null, workInProgress, Component, true, hasContext, renderLanes);
20076    }
20077  
20078    function mountIndeterminateComponent(_current, workInProgress, Component, renderLanes) {
20079      resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress);
20080      var props = workInProgress.pendingProps;
20081      var context;
20082  
20083      {
20084        var unmaskedContext = getUnmaskedContext(workInProgress, Component, false);
20085        context = getMaskedContext(workInProgress, unmaskedContext);
20086      }
20087  
20088      prepareToReadContext(workInProgress, renderLanes);
20089      var value;
20090      var hasId;
20091  
20092      {
20093        markComponentRenderStarted(workInProgress);
20094      }
20095  
20096      {
20097        if (Component.prototype && typeof Component.prototype.render === 'function') {
20098          var componentName = getComponentNameFromType(Component) || 'Unknown';
20099  
20100          if (!didWarnAboutBadClass[componentName]) {
20101            error("The <%s /> component appears to have a render method, but doesn't extend React.Component. " + 'This is likely to cause errors. Change %s to extend React.Component instead.', componentName, componentName);
20102  
20103            didWarnAboutBadClass[componentName] = true;
20104          }
20105        }
20106  
20107        if (workInProgress.mode & StrictLegacyMode) {
20108          ReactStrictModeWarnings.recordLegacyContextWarning(workInProgress, null);
20109        }
20110  
20111        setIsRendering(true);
20112        ReactCurrentOwner$1.current = workInProgress;
20113        value = renderWithHooks(null, workInProgress, Component, props, context, renderLanes);
20114        hasId = checkDidRenderIdHook();
20115        setIsRendering(false);
20116      }
20117  
20118      {
20119        markComponentRenderStopped();
20120      } // React DevTools reads this flag.
20121  
20122  
20123      workInProgress.flags |= PerformedWork;
20124  
20125      {
20126        // Support for module components is deprecated and is removed behind a flag.
20127        // Whether or not it would crash later, we want to show a good message in DEV first.
20128        if (typeof value === 'object' && value !== null && typeof value.render === 'function' && value.$$typeof === undefined) {
20129          var _componentName = getComponentNameFromType(Component) || 'Unknown';
20130  
20131          if (!didWarnAboutModulePatternComponent[_componentName]) {
20132            error('The <%s /> component appears to be a function component that returns a class instance. ' + 'Change %s to a class that extends React.Component instead. ' + "If you can't use a class try assigning the prototype on the function as a workaround. " + "`%s.prototype = React.Component.prototype`. Don't use an arrow function since it " + 'cannot be called with `new` by React.', _componentName, _componentName, _componentName);
20133  
20134            didWarnAboutModulePatternComponent[_componentName] = true;
20135          }
20136        }
20137      }
20138  
20139      if ( // Run these checks in production only if the flag is off.
20140      // Eventually we'll delete this branch altogether.
20141       typeof value === 'object' && value !== null && typeof value.render === 'function' && value.$$typeof === undefined) {
20142        {
20143          var _componentName2 = getComponentNameFromType(Component) || 'Unknown';
20144  
20145          if (!didWarnAboutModulePatternComponent[_componentName2]) {
20146            error('The <%s /> component appears to be a function component that returns a class instance. ' + 'Change %s to a class that extends React.Component instead. ' + "If you can't use a class try assigning the prototype on the function as a workaround. " + "`%s.prototype = React.Component.prototype`. Don't use an arrow function since it " + 'cannot be called with `new` by React.', _componentName2, _componentName2, _componentName2);
20147  
20148            didWarnAboutModulePatternComponent[_componentName2] = true;
20149          }
20150        } // Proceed under the assumption that this is a class instance
20151  
20152  
20153        workInProgress.tag = ClassComponent; // Throw out any hooks that were used.
20154  
20155        workInProgress.memoizedState = null;
20156        workInProgress.updateQueue = null; // Push context providers early to prevent context stack mismatches.
20157        // During mounting we don't know the child context yet as the instance doesn't exist.
20158        // We will invalidate the child context in finishClassComponent() right after rendering.
20159  
20160        var hasContext = false;
20161  
20162        if (isContextProvider(Component)) {
20163          hasContext = true;
20164          pushContextProvider(workInProgress);
20165        } else {
20166          hasContext = false;
20167        }
20168  
20169        workInProgress.memoizedState = value.state !== null && value.state !== undefined ? value.state : null;
20170        initializeUpdateQueue(workInProgress);
20171        adoptClassInstance(workInProgress, value);
20172        mountClassInstance(workInProgress, Component, props, renderLanes);
20173        return finishClassComponent(null, workInProgress, Component, true, hasContext, renderLanes);
20174      } else {
20175        // Proceed under the assumption that this is a function component
20176        workInProgress.tag = FunctionComponent;
20177  
20178        {
20179  
20180          if ( workInProgress.mode & StrictLegacyMode) {
20181            setIsStrictModeForDevtools(true);
20182  
20183            try {
20184              value = renderWithHooks(null, workInProgress, Component, props, context, renderLanes);
20185              hasId = checkDidRenderIdHook();
20186            } finally {
20187              setIsStrictModeForDevtools(false);
20188            }
20189          }
20190        }
20191  
20192        if (getIsHydrating() && hasId) {
20193          pushMaterializedTreeId(workInProgress);
20194        }
20195  
20196        reconcileChildren(null, workInProgress, value, renderLanes);
20197  
20198        {
20199          validateFunctionComponentInDev(workInProgress, Component);
20200        }
20201  
20202        return workInProgress.child;
20203      }
20204    }
20205  
20206    function validateFunctionComponentInDev(workInProgress, Component) {
20207      {
20208        if (Component) {
20209          if (Component.childContextTypes) {
20210            error('%s(...): childContextTypes cannot be defined on a function component.', Component.displayName || Component.name || 'Component');
20211          }
20212        }
20213  
20214        if (workInProgress.ref !== null) {
20215          var info = '';
20216          var ownerName = getCurrentFiberOwnerNameInDevOrNull();
20217  
20218          if (ownerName) {
20219            info += '\n\nCheck the render method of `' + ownerName + '`.';
20220          }
20221  
20222          var warningKey = ownerName || '';
20223          var debugSource = workInProgress._debugSource;
20224  
20225          if (debugSource) {
20226            warningKey = debugSource.fileName + ':' + debugSource.lineNumber;
20227          }
20228  
20229          if (!didWarnAboutFunctionRefs[warningKey]) {
20230            didWarnAboutFunctionRefs[warningKey] = true;
20231  
20232            error('Function components cannot be given refs. ' + 'Attempts to access this ref will fail. ' + 'Did you mean to use React.forwardRef()?%s', info);
20233          }
20234        }
20235  
20236        if ( Component.defaultProps !== undefined) {
20237          var componentName = getComponentNameFromType(Component) || 'Unknown';
20238  
20239          if (!didWarnAboutDefaultPropsOnFunctionComponent[componentName]) {
20240            error('%s: Support for defaultProps will be removed from function components ' + 'in a future major release. Use JavaScript default parameters instead.', componentName);
20241  
20242            didWarnAboutDefaultPropsOnFunctionComponent[componentName] = true;
20243          }
20244        }
20245  
20246        if (typeof Component.getDerivedStateFromProps === 'function') {
20247          var _componentName3 = getComponentNameFromType(Component) || 'Unknown';
20248  
20249          if (!didWarnAboutGetDerivedStateOnFunctionComponent[_componentName3]) {
20250            error('%s: Function components do not support getDerivedStateFromProps.', _componentName3);
20251  
20252            didWarnAboutGetDerivedStateOnFunctionComponent[_componentName3] = true;
20253          }
20254        }
20255  
20256        if (typeof Component.contextType === 'object' && Component.contextType !== null) {
20257          var _componentName4 = getComponentNameFromType(Component) || 'Unknown';
20258  
20259          if (!didWarnAboutContextTypeOnFunctionComponent[_componentName4]) {
20260            error('%s: Function components do not support contextType.', _componentName4);
20261  
20262            didWarnAboutContextTypeOnFunctionComponent[_componentName4] = true;
20263          }
20264        }
20265      }
20266    }
20267  
20268    var SUSPENDED_MARKER = {
20269      dehydrated: null,
20270      treeContext: null,
20271      retryLane: NoLane
20272    };
20273  
20274    function mountSuspenseOffscreenState(renderLanes) {
20275      return {
20276        baseLanes: renderLanes,
20277        cachePool: getSuspendedCache(),
20278        transitions: null
20279      };
20280    }
20281  
20282    function updateSuspenseOffscreenState(prevOffscreenState, renderLanes) {
20283      var cachePool = null;
20284  
20285      return {
20286        baseLanes: mergeLanes(prevOffscreenState.baseLanes, renderLanes),
20287        cachePool: cachePool,
20288        transitions: prevOffscreenState.transitions
20289      };
20290    } // TODO: Probably should inline this back
20291  
20292  
20293    function shouldRemainOnFallback(suspenseContext, current, workInProgress, renderLanes) {
20294      // If we're already showing a fallback, there are cases where we need to
20295      // remain on that fallback regardless of whether the content has resolved.
20296      // For example, SuspenseList coordinates when nested content appears.
20297      if (current !== null) {
20298        var suspenseState = current.memoizedState;
20299  
20300        if (suspenseState === null) {
20301          // Currently showing content. Don't hide it, even if ForceSuspenseFallback
20302          // is true. More precise name might be "ForceRemainSuspenseFallback".
20303          // Note: This is a factoring smell. Can't remain on a fallback if there's
20304          // no fallback to remain on.
20305          return false;
20306        }
20307      } // Not currently showing content. Consult the Suspense context.
20308  
20309  
20310      return hasSuspenseContext(suspenseContext, ForceSuspenseFallback);
20311    }
20312  
20313    function getRemainingWorkInPrimaryTree(current, renderLanes) {
20314      // TODO: Should not remove render lanes that were pinged during this render
20315      return removeLanes(current.childLanes, renderLanes);
20316    }
20317  
20318    function updateSuspenseComponent(current, workInProgress, renderLanes) {
20319      var nextProps = workInProgress.pendingProps; // This is used by DevTools to force a boundary to suspend.
20320  
20321      {
20322        if (shouldSuspend(workInProgress)) {
20323          workInProgress.flags |= DidCapture;
20324        }
20325      }
20326  
20327      var suspenseContext = suspenseStackCursor.current;
20328      var showFallback = false;
20329      var didSuspend = (workInProgress.flags & DidCapture) !== NoFlags;
20330  
20331      if (didSuspend || shouldRemainOnFallback(suspenseContext, current)) {
20332        // Something in this boundary's subtree already suspended. Switch to
20333        // rendering the fallback children.
20334        showFallback = true;
20335        workInProgress.flags &= ~DidCapture;
20336      } else {
20337        // Attempting the main content
20338        if (current === null || current.memoizedState !== null) {
20339          // This is a new mount or this boundary is already showing a fallback state.
20340          // Mark this subtree context as having at least one invisible parent that could
20341          // handle the fallback state.
20342          // Avoided boundaries are not considered since they cannot handle preferred fallback states.
20343          {
20344            suspenseContext = addSubtreeSuspenseContext(suspenseContext, InvisibleParentSuspenseContext);
20345          }
20346        }
20347      }
20348  
20349      suspenseContext = setDefaultShallowSuspenseContext(suspenseContext);
20350      pushSuspenseContext(workInProgress, suspenseContext); // OK, the next part is confusing. We're about to reconcile the Suspense
20351      // boundary's children. This involves some custom reconciliation logic. Two
20352      // main reasons this is so complicated.
20353      //
20354      // First, Legacy Mode has different semantics for backwards compatibility. The
20355      // primary tree will commit in an inconsistent state, so when we do the
20356      // second pass to render the fallback, we do some exceedingly, uh, clever
20357      // hacks to make that not totally break. Like transferring effects and
20358      // deletions from hidden tree. In Concurrent Mode, it's much simpler,
20359      // because we bailout on the primary tree completely and leave it in its old
20360      // state, no effects. Same as what we do for Offscreen (except that
20361      // Offscreen doesn't have the first render pass).
20362      //
20363      // Second is hydration. During hydration, the Suspense fiber has a slightly
20364      // different layout, where the child points to a dehydrated fragment, which
20365      // contains the DOM rendered by the server.
20366      //
20367      // Third, even if you set all that aside, Suspense is like error boundaries in
20368      // that we first we try to render one tree, and if that fails, we render again
20369      // and switch to a different tree. Like a try/catch block. So we have to track
20370      // which branch we're currently rendering. Ideally we would model this using
20371      // a stack.
20372  
20373      if (current === null) {
20374        // Initial mount
20375        // Special path for hydration
20376        // If we're currently hydrating, try to hydrate this boundary.
20377        tryToClaimNextHydratableInstance(workInProgress); // This could've been a dehydrated suspense component.
20378  
20379        var suspenseState = workInProgress.memoizedState;
20380  
20381        if (suspenseState !== null) {
20382          var dehydrated = suspenseState.dehydrated;
20383  
20384          if (dehydrated !== null) {
20385            return mountDehydratedSuspenseComponent(workInProgress, dehydrated);
20386          }
20387        }
20388  
20389        var nextPrimaryChildren = nextProps.children;
20390        var nextFallbackChildren = nextProps.fallback;
20391  
20392        if (showFallback) {
20393          var fallbackFragment = mountSuspenseFallbackChildren(workInProgress, nextPrimaryChildren, nextFallbackChildren, renderLanes);
20394          var primaryChildFragment = workInProgress.child;
20395          primaryChildFragment.memoizedState = mountSuspenseOffscreenState(renderLanes);
20396          workInProgress.memoizedState = SUSPENDED_MARKER;
20397  
20398          return fallbackFragment;
20399        } else {
20400          return mountSuspensePrimaryChildren(workInProgress, nextPrimaryChildren);
20401        }
20402      } else {
20403        // This is an update.
20404        // Special path for hydration
20405        var prevState = current.memoizedState;
20406  
20407        if (prevState !== null) {
20408          var _dehydrated = prevState.dehydrated;
20409  
20410          if (_dehydrated !== null) {
20411            return updateDehydratedSuspenseComponent(current, workInProgress, didSuspend, nextProps, _dehydrated, prevState, renderLanes);
20412          }
20413        }
20414  
20415        if (showFallback) {
20416          var _nextFallbackChildren = nextProps.fallback;
20417          var _nextPrimaryChildren = nextProps.children;
20418          var fallbackChildFragment = updateSuspenseFallbackChildren(current, workInProgress, _nextPrimaryChildren, _nextFallbackChildren, renderLanes);
20419          var _primaryChildFragment2 = workInProgress.child;
20420          var prevOffscreenState = current.child.memoizedState;
20421          _primaryChildFragment2.memoizedState = prevOffscreenState === null ? mountSuspenseOffscreenState(renderLanes) : updateSuspenseOffscreenState(prevOffscreenState, renderLanes);
20422  
20423          _primaryChildFragment2.childLanes = getRemainingWorkInPrimaryTree(current, renderLanes);
20424          workInProgress.memoizedState = SUSPENDED_MARKER;
20425          return fallbackChildFragment;
20426        } else {
20427          var _nextPrimaryChildren2 = nextProps.children;
20428  
20429          var _primaryChildFragment3 = updateSuspensePrimaryChildren(current, workInProgress, _nextPrimaryChildren2, renderLanes);
20430  
20431          workInProgress.memoizedState = null;
20432          return _primaryChildFragment3;
20433        }
20434      }
20435    }
20436  
20437    function mountSuspensePrimaryChildren(workInProgress, primaryChildren, renderLanes) {
20438      var mode = workInProgress.mode;
20439      var primaryChildProps = {
20440        mode: 'visible',
20441        children: primaryChildren
20442      };
20443      var primaryChildFragment = mountWorkInProgressOffscreenFiber(primaryChildProps, mode);
20444      primaryChildFragment.return = workInProgress;
20445      workInProgress.child = primaryChildFragment;
20446      return primaryChildFragment;
20447    }
20448  
20449    function mountSuspenseFallbackChildren(workInProgress, primaryChildren, fallbackChildren, renderLanes) {
20450      var mode = workInProgress.mode;
20451      var progressedPrimaryFragment = workInProgress.child;
20452      var primaryChildProps = {
20453        mode: 'hidden',
20454        children: primaryChildren
20455      };
20456      var primaryChildFragment;
20457      var fallbackChildFragment;
20458  
20459      if ((mode & ConcurrentMode) === NoMode && progressedPrimaryFragment !== null) {
20460        // In legacy mode, we commit the primary tree as if it successfully
20461        // completed, even though it's in an inconsistent state.
20462        primaryChildFragment = progressedPrimaryFragment;
20463        primaryChildFragment.childLanes = NoLanes;
20464        primaryChildFragment.pendingProps = primaryChildProps;
20465  
20466        if ( workInProgress.mode & ProfileMode) {
20467          // Reset the durations from the first pass so they aren't included in the
20468          // final amounts. This seems counterintuitive, since we're intentionally
20469          // not measuring part of the render phase, but this makes it match what we
20470          // do in Concurrent Mode.
20471          primaryChildFragment.actualDuration = 0;
20472          primaryChildFragment.actualStartTime = -1;
20473          primaryChildFragment.selfBaseDuration = 0;
20474          primaryChildFragment.treeBaseDuration = 0;
20475        }
20476  
20477        fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null);
20478      } else {
20479        primaryChildFragment = mountWorkInProgressOffscreenFiber(primaryChildProps, mode);
20480        fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null);
20481      }
20482  
20483      primaryChildFragment.return = workInProgress;
20484      fallbackChildFragment.return = workInProgress;
20485      primaryChildFragment.sibling = fallbackChildFragment;
20486      workInProgress.child = primaryChildFragment;
20487      return fallbackChildFragment;
20488    }
20489  
20490    function mountWorkInProgressOffscreenFiber(offscreenProps, mode, renderLanes) {
20491      // The props argument to `createFiberFromOffscreen` is `any` typed, so we use
20492      // this wrapper function to constrain it.
20493      return createFiberFromOffscreen(offscreenProps, mode, NoLanes, null);
20494    }
20495  
20496    function updateWorkInProgressOffscreenFiber(current, offscreenProps) {
20497      // The props argument to `createWorkInProgress` is `any` typed, so we use this
20498      // wrapper function to constrain it.
20499      return createWorkInProgress(current, offscreenProps);
20500    }
20501  
20502    function updateSuspensePrimaryChildren(current, workInProgress, primaryChildren, renderLanes) {
20503      var currentPrimaryChildFragment = current.child;
20504      var currentFallbackChildFragment = currentPrimaryChildFragment.sibling;
20505      var primaryChildFragment = updateWorkInProgressOffscreenFiber(currentPrimaryChildFragment, {
20506        mode: 'visible',
20507        children: primaryChildren
20508      });
20509  
20510      if ((workInProgress.mode & ConcurrentMode) === NoMode) {
20511        primaryChildFragment.lanes = renderLanes;
20512      }
20513  
20514      primaryChildFragment.return = workInProgress;
20515      primaryChildFragment.sibling = null;
20516  
20517      if (currentFallbackChildFragment !== null) {
20518        // Delete the fallback child fragment
20519        var deletions = workInProgress.deletions;
20520  
20521        if (deletions === null) {
20522          workInProgress.deletions = [currentFallbackChildFragment];
20523          workInProgress.flags |= ChildDeletion;
20524        } else {
20525          deletions.push(currentFallbackChildFragment);
20526        }
20527      }
20528  
20529      workInProgress.child = primaryChildFragment;
20530      return primaryChildFragment;
20531    }
20532  
20533    function updateSuspenseFallbackChildren(current, workInProgress, primaryChildren, fallbackChildren, renderLanes) {
20534      var mode = workInProgress.mode;
20535      var currentPrimaryChildFragment = current.child;
20536      var currentFallbackChildFragment = currentPrimaryChildFragment.sibling;
20537      var primaryChildProps = {
20538        mode: 'hidden',
20539        children: primaryChildren
20540      };
20541      var primaryChildFragment;
20542  
20543      if ( // In legacy mode, we commit the primary tree as if it successfully
20544      // completed, even though it's in an inconsistent state.
20545      (mode & ConcurrentMode) === NoMode && // Make sure we're on the second pass, i.e. the primary child fragment was
20546      // already cloned. In legacy mode, the only case where this isn't true is
20547      // when DevTools forces us to display a fallback; we skip the first render
20548      // pass entirely and go straight to rendering the fallback. (In Concurrent
20549      // Mode, SuspenseList can also trigger this scenario, but this is a legacy-
20550      // only codepath.)
20551      workInProgress.child !== currentPrimaryChildFragment) {
20552        var progressedPrimaryFragment = workInProgress.child;
20553        primaryChildFragment = progressedPrimaryFragment;
20554        primaryChildFragment.childLanes = NoLanes;
20555        primaryChildFragment.pendingProps = primaryChildProps;
20556  
20557        if ( workInProgress.mode & ProfileMode) {
20558          // Reset the durations from the first pass so they aren't included in the
20559          // final amounts. This seems counterintuitive, since we're intentionally
20560          // not measuring part of the render phase, but this makes it match what we
20561          // do in Concurrent Mode.
20562          primaryChildFragment.actualDuration = 0;
20563          primaryChildFragment.actualStartTime = -1;
20564          primaryChildFragment.selfBaseDuration = currentPrimaryChildFragment.selfBaseDuration;
20565          primaryChildFragment.treeBaseDuration = currentPrimaryChildFragment.treeBaseDuration;
20566        } // The fallback fiber was added as a deletion during the first pass.
20567        // However, since we're going to remain on the fallback, we no longer want
20568        // to delete it.
20569  
20570  
20571        workInProgress.deletions = null;
20572      } else {
20573        primaryChildFragment = updateWorkInProgressOffscreenFiber(currentPrimaryChildFragment, primaryChildProps); // Since we're reusing a current tree, we need to reuse the flags, too.
20574        // (We don't do this in legacy mode, because in legacy mode we don't re-use
20575        // the current tree; see previous branch.)
20576  
20577        primaryChildFragment.subtreeFlags = currentPrimaryChildFragment.subtreeFlags & StaticMask;
20578      }
20579  
20580      var fallbackChildFragment;
20581  
20582      if (currentFallbackChildFragment !== null) {
20583        fallbackChildFragment = createWorkInProgress(currentFallbackChildFragment, fallbackChildren);
20584      } else {
20585        fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null); // Needs a placement effect because the parent (the Suspense boundary) already
20586        // mounted but this is a new fiber.
20587  
20588        fallbackChildFragment.flags |= Placement;
20589      }
20590  
20591      fallbackChildFragment.return = workInProgress;
20592      primaryChildFragment.return = workInProgress;
20593      primaryChildFragment.sibling = fallbackChildFragment;
20594      workInProgress.child = primaryChildFragment;
20595      return fallbackChildFragment;
20596    }
20597  
20598    function retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, recoverableError) {
20599      // Falling back to client rendering. Because this has performance
20600      // implications, it's considered a recoverable error, even though the user
20601      // likely won't observe anything wrong with the UI.
20602      //
20603      // The error is passed in as an argument to enforce that every caller provide
20604      // a custom message, or explicitly opt out (currently the only path that opts
20605      // out is legacy mode; every concurrent path provides an error).
20606      if (recoverableError !== null) {
20607        queueHydrationError(recoverableError);
20608      } // This will add the old fiber to the deletion list
20609  
20610  
20611      reconcileChildFibers(workInProgress, current.child, null, renderLanes); // We're now not suspended nor dehydrated.
20612  
20613      var nextProps = workInProgress.pendingProps;
20614      var primaryChildren = nextProps.children;
20615      var primaryChildFragment = mountSuspensePrimaryChildren(workInProgress, primaryChildren); // Needs a placement effect because the parent (the Suspense boundary) already
20616      // mounted but this is a new fiber.
20617  
20618      primaryChildFragment.flags |= Placement;
20619      workInProgress.memoizedState = null;
20620      return primaryChildFragment;
20621    }
20622  
20623    function mountSuspenseFallbackAfterRetryWithoutHydrating(current, workInProgress, primaryChildren, fallbackChildren, renderLanes) {
20624      var fiberMode = workInProgress.mode;
20625      var primaryChildProps = {
20626        mode: 'visible',
20627        children: primaryChildren
20628      };
20629      var primaryChildFragment = mountWorkInProgressOffscreenFiber(primaryChildProps, fiberMode);
20630      var fallbackChildFragment = createFiberFromFragment(fallbackChildren, fiberMode, renderLanes, null); // Needs a placement effect because the parent (the Suspense
20631      // boundary) already mounted but this is a new fiber.
20632  
20633      fallbackChildFragment.flags |= Placement;
20634      primaryChildFragment.return = workInProgress;
20635      fallbackChildFragment.return = workInProgress;
20636      primaryChildFragment.sibling = fallbackChildFragment;
20637      workInProgress.child = primaryChildFragment;
20638  
20639      if ((workInProgress.mode & ConcurrentMode) !== NoMode) {
20640        // We will have dropped the effect list which contains the
20641        // deletion. We need to reconcile to delete the current child.
20642        reconcileChildFibers(workInProgress, current.child, null, renderLanes);
20643      }
20644  
20645      return fallbackChildFragment;
20646    }
20647  
20648    function mountDehydratedSuspenseComponent(workInProgress, suspenseInstance, renderLanes) {
20649      // During the first pass, we'll bail out and not drill into the children.
20650      // Instead, we'll leave the content in place and try to hydrate it later.
20651      if ((workInProgress.mode & ConcurrentMode) === NoMode) {
20652        {
20653          error('Cannot hydrate Suspense in legacy mode. Switch from ' + 'ReactDOM.hydrate(element, container) to ' + 'ReactDOMClient.hydrateRoot(container, <App />)' + '.render(element) or remove the Suspense components from ' + 'the server rendered components.');
20654        }
20655  
20656        workInProgress.lanes = laneToLanes(SyncLane);
20657      } else if (isSuspenseInstanceFallback(suspenseInstance)) {
20658        // This is a client-only boundary. Since we won't get any content from the server
20659        // for this, we need to schedule that at a higher priority based on when it would
20660        // have timed out. In theory we could render it in this pass but it would have the
20661        // wrong priority associated with it and will prevent hydration of parent path.
20662        // Instead, we'll leave work left on it to render it in a separate commit.
20663        // TODO This time should be the time at which the server rendered response that is
20664        // a parent to this boundary was displayed. However, since we currently don't have
20665        // a protocol to transfer that time, we'll just estimate it by using the current
20666        // time. This will mean that Suspense timeouts are slightly shifted to later than
20667        // they should be.
20668        // Schedule a normal pri update to render this content.
20669        workInProgress.lanes = laneToLanes(DefaultHydrationLane);
20670      } else {
20671        // We'll continue hydrating the rest at offscreen priority since we'll already
20672        // be showing the right content coming from the server, it is no rush.
20673        workInProgress.lanes = laneToLanes(OffscreenLane);
20674      }
20675  
20676      return null;
20677    }
20678  
20679    function updateDehydratedSuspenseComponent(current, workInProgress, didSuspend, nextProps, suspenseInstance, suspenseState, renderLanes) {
20680      if (!didSuspend) {
20681        // This is the first render pass. Attempt to hydrate.
20682        // We should never be hydrating at this point because it is the first pass,
20683        // but after we've already committed once.
20684        warnIfHydrating();
20685  
20686        if ((workInProgress.mode & ConcurrentMode) === NoMode) {
20687          return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, // TODO: When we delete legacy mode, we should make this error argument
20688          // required — every concurrent mode path that causes hydration to
20689          // de-opt to client rendering should have an error message.
20690          null);
20691        }
20692  
20693        if (isSuspenseInstanceFallback(suspenseInstance)) {
20694          // This boundary is in a permanent fallback state. In this case, we'll never
20695          // get an update and we'll never be able to hydrate the final content. Let's just try the
20696          // client side render instead.
20697          var digest, message, stack;
20698  
20699          {
20700            var _getSuspenseInstanceF = getSuspenseInstanceFallbackErrorDetails(suspenseInstance);
20701  
20702            digest = _getSuspenseInstanceF.digest;
20703            message = _getSuspenseInstanceF.message;
20704            stack = _getSuspenseInstanceF.stack;
20705          }
20706  
20707          var error;
20708  
20709          if (message) {
20710            // eslint-disable-next-line react-internal/prod-error-codes
20711            error = new Error(message);
20712          } else {
20713            error = new Error('The server could not finish this Suspense boundary, likely ' + 'due to an error during server rendering. Switched to ' + 'client rendering.');
20714          }
20715  
20716          var capturedValue = createCapturedValue(error, digest, stack);
20717          return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, capturedValue);
20718        }
20719        // any context has changed, we need to treat is as if the input might have changed.
20720  
20721  
20722        var hasContextChanged = includesSomeLane(renderLanes, current.childLanes);
20723  
20724        if (didReceiveUpdate || hasContextChanged) {
20725          // This boundary has changed since the first render. This means that we are now unable to
20726          // hydrate it. We might still be able to hydrate it using a higher priority lane.
20727          var root = getWorkInProgressRoot();
20728  
20729          if (root !== null) {
20730            var attemptHydrationAtLane = getBumpedLaneForHydration(root, renderLanes);
20731  
20732            if (attemptHydrationAtLane !== NoLane && attemptHydrationAtLane !== suspenseState.retryLane) {
20733              // Intentionally mutating since this render will get interrupted. This
20734              // is one of the very rare times where we mutate the current tree
20735              // during the render phase.
20736              suspenseState.retryLane = attemptHydrationAtLane; // TODO: Ideally this would inherit the event time of the current render
20737  
20738              var eventTime = NoTimestamp;
20739              enqueueConcurrentRenderForLane(current, attemptHydrationAtLane);
20740              scheduleUpdateOnFiber(root, current, attemptHydrationAtLane, eventTime);
20741            }
20742          } // If we have scheduled higher pri work above, this will probably just abort the render
20743          // since we now have higher priority work, but in case it doesn't, we need to prepare to
20744          // render something, if we time out. Even if that requires us to delete everything and
20745          // skip hydration.
20746          // Delay having to do this as long as the suspense timeout allows us.
20747  
20748  
20749          renderDidSuspendDelayIfPossible();
20750  
20751          var _capturedValue = createCapturedValue(new Error('This Suspense boundary received an update before it finished ' + 'hydrating. This caused the boundary to switch to client rendering. ' + 'The usual way to fix this is to wrap the original update ' + 'in startTransition.'));
20752  
20753          return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, _capturedValue);
20754        } else if (isSuspenseInstancePending(suspenseInstance)) {
20755          // This component is still pending more data from the server, so we can't hydrate its
20756          // content. We treat it as if this component suspended itself. It might seem as if
20757          // we could just try to render it client-side instead. However, this will perform a
20758          // lot of unnecessary work and is unlikely to complete since it often will suspend
20759          // on missing data anyway. Additionally, the server might be able to render more
20760          // than we can on the client yet. In that case we'd end up with more fallback states
20761          // on the client than if we just leave it alone. If the server times out or errors
20762          // these should update this boundary to the permanent Fallback state instead.
20763          // Mark it as having captured (i.e. suspended).
20764          workInProgress.flags |= DidCapture; // Leave the child in place. I.e. the dehydrated fragment.
20765  
20766          workInProgress.child = current.child; // Register a callback to retry this boundary once the server has sent the result.
20767  
20768          var retry = retryDehydratedSuspenseBoundary.bind(null, current);
20769          registerSuspenseInstanceRetry(suspenseInstance, retry);
20770          return null;
20771        } else {
20772          // This is the first attempt.
20773          reenterHydrationStateFromDehydratedSuspenseInstance(workInProgress, suspenseInstance, suspenseState.treeContext);
20774          var primaryChildren = nextProps.children;
20775          var primaryChildFragment = mountSuspensePrimaryChildren(workInProgress, primaryChildren); // Mark the children as hydrating. This is a fast path to know whether this
20776          // tree is part of a hydrating tree. This is used to determine if a child
20777          // node has fully mounted yet, and for scheduling event replaying.
20778          // Conceptually this is similar to Placement in that a new subtree is
20779          // inserted into the React tree here. It just happens to not need DOM
20780          // mutations because it already exists.
20781  
20782          primaryChildFragment.flags |= Hydrating;
20783          return primaryChildFragment;
20784        }
20785      } else {
20786        // This is the second render pass. We already attempted to hydrated, but
20787        // something either suspended or errored.
20788        if (workInProgress.flags & ForceClientRender) {
20789          // Something errored during hydration. Try again without hydrating.
20790          workInProgress.flags &= ~ForceClientRender;
20791  
20792          var _capturedValue2 = createCapturedValue(new Error('There was an error while hydrating this Suspense boundary. ' + 'Switched to client rendering.'));
20793  
20794          return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, _capturedValue2);
20795        } else if (workInProgress.memoizedState !== null) {
20796          // Something suspended and we should still be in dehydrated mode.
20797          // Leave the existing child in place.
20798          workInProgress.child = current.child; // The dehydrated completion pass expects this flag to be there
20799          // but the normal suspense pass doesn't.
20800  
20801          workInProgress.flags |= DidCapture;
20802          return null;
20803        } else {
20804          // Suspended but we should no longer be in dehydrated mode.
20805          // Therefore we now have to render the fallback.
20806          var nextPrimaryChildren = nextProps.children;
20807          var nextFallbackChildren = nextProps.fallback;
20808          var fallbackChildFragment = mountSuspenseFallbackAfterRetryWithoutHydrating(current, workInProgress, nextPrimaryChildren, nextFallbackChildren, renderLanes);
20809          var _primaryChildFragment4 = workInProgress.child;
20810          _primaryChildFragment4.memoizedState = mountSuspenseOffscreenState(renderLanes);
20811          workInProgress.memoizedState = SUSPENDED_MARKER;
20812          return fallbackChildFragment;
20813        }
20814      }
20815    }
20816  
20817    function scheduleSuspenseWorkOnFiber(fiber, renderLanes, propagationRoot) {
20818      fiber.lanes = mergeLanes(fiber.lanes, renderLanes);
20819      var alternate = fiber.alternate;
20820  
20821      if (alternate !== null) {
20822        alternate.lanes = mergeLanes(alternate.lanes, renderLanes);
20823      }
20824  
20825      scheduleContextWorkOnParentPath(fiber.return, renderLanes, propagationRoot);
20826    }
20827  
20828    function propagateSuspenseContextChange(workInProgress, firstChild, renderLanes) {
20829      // Mark any Suspense boundaries with fallbacks as having work to do.
20830      // If they were previously forced into fallbacks, they may now be able
20831      // to unblock.
20832      var node = firstChild;
20833  
20834      while (node !== null) {
20835        if (node.tag === SuspenseComponent) {
20836          var state = node.memoizedState;
20837  
20838          if (state !== null) {
20839            scheduleSuspenseWorkOnFiber(node, renderLanes, workInProgress);
20840          }
20841        } else if (node.tag === SuspenseListComponent) {
20842          // If the tail is hidden there might not be an Suspense boundaries
20843          // to schedule work on. In this case we have to schedule it on the
20844          // list itself.
20845          // We don't have to traverse to the children of the list since
20846          // the list will propagate the change when it rerenders.
20847          scheduleSuspenseWorkOnFiber(node, renderLanes, workInProgress);
20848        } else if (node.child !== null) {
20849          node.child.return = node;
20850          node = node.child;
20851          continue;
20852        }
20853  
20854        if (node === workInProgress) {
20855          return;
20856        }
20857  
20858        while (node.sibling === null) {
20859          if (node.return === null || node.return === workInProgress) {
20860            return;
20861          }
20862  
20863          node = node.return;
20864        }
20865  
20866        node.sibling.return = node.return;
20867        node = node.sibling;
20868      }
20869    }
20870  
20871    function findLastContentRow(firstChild) {
20872      // This is going to find the last row among these children that is already
20873      // showing content on the screen, as opposed to being in fallback state or
20874      // new. If a row has multiple Suspense boundaries, any of them being in the
20875      // fallback state, counts as the whole row being in a fallback state.
20876      // Note that the "rows" will be workInProgress, but any nested children
20877      // will still be current since we haven't rendered them yet. The mounted
20878      // order may not be the same as the new order. We use the new order.
20879      var row = firstChild;
20880      var lastContentRow = null;
20881  
20882      while (row !== null) {
20883        var currentRow = row.alternate; // New rows can't be content rows.
20884  
20885        if (currentRow !== null && findFirstSuspended(currentRow) === null) {
20886          lastContentRow = row;
20887        }
20888  
20889        row = row.sibling;
20890      }
20891  
20892      return lastContentRow;
20893    }
20894  
20895    function validateRevealOrder(revealOrder) {
20896      {
20897        if (revealOrder !== undefined && revealOrder !== 'forwards' && revealOrder !== 'backwards' && revealOrder !== 'together' && !didWarnAboutRevealOrder[revealOrder]) {
20898          didWarnAboutRevealOrder[revealOrder] = true;
20899  
20900          if (typeof revealOrder === 'string') {
20901            switch (revealOrder.toLowerCase()) {
20902              case 'together':
20903              case 'forwards':
20904              case 'backwards':
20905                {
20906                  error('"%s" is not a valid value for revealOrder on <SuspenseList />. ' + 'Use lowercase "%s" instead.', revealOrder, revealOrder.toLowerCase());
20907  
20908                  break;
20909                }
20910  
20911              case 'forward':
20912              case 'backward':
20913                {
20914                  error('"%s" is not a valid value for revealOrder on <SuspenseList />. ' + 'React uses the -s suffix in the spelling. Use "%ss" instead.', revealOrder, revealOrder.toLowerCase());
20915  
20916                  break;
20917                }
20918  
20919              default:
20920                error('"%s" is not a supported revealOrder on <SuspenseList />. ' + 'Did you mean "together", "forwards" or "backwards"?', revealOrder);
20921  
20922                break;
20923            }
20924          } else {
20925            error('%s is not a supported value for revealOrder on <SuspenseList />. ' + 'Did you mean "together", "forwards" or "backwards"?', revealOrder);
20926          }
20927        }
20928      }
20929    }
20930  
20931    function validateTailOptions(tailMode, revealOrder) {
20932      {
20933        if (tailMode !== undefined && !didWarnAboutTailOptions[tailMode]) {
20934          if (tailMode !== 'collapsed' && tailMode !== 'hidden') {
20935            didWarnAboutTailOptions[tailMode] = true;
20936  
20937            error('"%s" is not a supported value for tail on <SuspenseList />. ' + 'Did you mean "collapsed" or "hidden"?', tailMode);
20938          } else if (revealOrder !== 'forwards' && revealOrder !== 'backwards') {
20939            didWarnAboutTailOptions[tailMode] = true;
20940  
20941            error('<SuspenseList tail="%s" /> is only valid if revealOrder is ' + '"forwards" or "backwards". ' + 'Did you mean to specify revealOrder="forwards"?', tailMode);
20942          }
20943        }
20944      }
20945    }
20946  
20947    function validateSuspenseListNestedChild(childSlot, index) {
20948      {
20949        var isAnArray = isArray(childSlot);
20950        var isIterable = !isAnArray && typeof getIteratorFn(childSlot) === 'function';
20951  
20952        if (isAnArray || isIterable) {
20953          var type = isAnArray ? 'array' : 'iterable';
20954  
20955          error('A nested %s was passed to row #%s in <SuspenseList />. Wrap it in ' + 'an additional SuspenseList to configure its revealOrder: ' + '<SuspenseList revealOrder=...> ... ' + '<SuspenseList revealOrder=...>{%s}</SuspenseList> ... ' + '</SuspenseList>', type, index, type);
20956  
20957          return false;
20958        }
20959      }
20960  
20961      return true;
20962    }
20963  
20964    function validateSuspenseListChildren(children, revealOrder) {
20965      {
20966        if ((revealOrder === 'forwards' || revealOrder === 'backwards') && children !== undefined && children !== null && children !== false) {
20967          if (isArray(children)) {
20968            for (var i = 0; i < children.length; i++) {
20969              if (!validateSuspenseListNestedChild(children[i], i)) {
20970                return;
20971              }
20972            }
20973          } else {
20974            var iteratorFn = getIteratorFn(children);
20975  
20976            if (typeof iteratorFn === 'function') {
20977              var childrenIterator = iteratorFn.call(children);
20978  
20979              if (childrenIterator) {
20980                var step = childrenIterator.next();
20981                var _i = 0;
20982  
20983                for (; !step.done; step = childrenIterator.next()) {
20984                  if (!validateSuspenseListNestedChild(step.value, _i)) {
20985                    return;
20986                  }
20987  
20988                  _i++;
20989                }
20990              }
20991            } else {
20992              error('A single row was passed to a <SuspenseList revealOrder="%s" />. ' + 'This is not useful since it needs multiple rows. ' + 'Did you mean to pass multiple children or an array?', revealOrder);
20993            }
20994          }
20995        }
20996      }
20997    }
20998  
20999    function initSuspenseListRenderState(workInProgress, isBackwards, tail, lastContentRow, tailMode) {
21000      var renderState = workInProgress.memoizedState;
21001  
21002      if (renderState === null) {
21003        workInProgress.memoizedState = {
21004          isBackwards: isBackwards,
21005          rendering: null,
21006          renderingStartTime: 0,
21007          last: lastContentRow,
21008          tail: tail,
21009          tailMode: tailMode
21010        };
21011      } else {
21012        // We can reuse the existing object from previous renders.
21013        renderState.isBackwards = isBackwards;
21014        renderState.rendering = null;
21015        renderState.renderingStartTime = 0;
21016        renderState.last = lastContentRow;
21017        renderState.tail = tail;
21018        renderState.tailMode = tailMode;
21019      }
21020    } // This can end up rendering this component multiple passes.
21021    // The first pass splits the children fibers into two sets. A head and tail.
21022    // We first render the head. If anything is in fallback state, we do another
21023    // pass through beginWork to rerender all children (including the tail) with
21024    // the force suspend context. If the first render didn't have anything in
21025    // in fallback state. Then we render each row in the tail one-by-one.
21026    // That happens in the completeWork phase without going back to beginWork.
21027  
21028  
21029    function updateSuspenseListComponent(current, workInProgress, renderLanes) {
21030      var nextProps = workInProgress.pendingProps;
21031      var revealOrder = nextProps.revealOrder;
21032      var tailMode = nextProps.tail;
21033      var newChildren = nextProps.children;
21034      validateRevealOrder(revealOrder);
21035      validateTailOptions(tailMode, revealOrder);
21036      validateSuspenseListChildren(newChildren, revealOrder);
21037      reconcileChildren(current, workInProgress, newChildren, renderLanes);
21038      var suspenseContext = suspenseStackCursor.current;
21039      var shouldForceFallback = hasSuspenseContext(suspenseContext, ForceSuspenseFallback);
21040  
21041      if (shouldForceFallback) {
21042        suspenseContext = setShallowSuspenseContext(suspenseContext, ForceSuspenseFallback);
21043        workInProgress.flags |= DidCapture;
21044      } else {
21045        var didSuspendBefore = current !== null && (current.flags & DidCapture) !== NoFlags;
21046  
21047        if (didSuspendBefore) {
21048          // If we previously forced a fallback, we need to schedule work
21049          // on any nested boundaries to let them know to try to render
21050          // again. This is the same as context updating.
21051          propagateSuspenseContextChange(workInProgress, workInProgress.child, renderLanes);
21052        }
21053  
21054        suspenseContext = setDefaultShallowSuspenseContext(suspenseContext);
21055      }
21056  
21057      pushSuspenseContext(workInProgress, suspenseContext);
21058  
21059      if ((workInProgress.mode & ConcurrentMode) === NoMode) {
21060        // In legacy mode, SuspenseList doesn't work so we just
21061        // use make it a noop by treating it as the default revealOrder.
21062        workInProgress.memoizedState = null;
21063      } else {
21064        switch (revealOrder) {
21065          case 'forwards':
21066            {
21067              var lastContentRow = findLastContentRow(workInProgress.child);
21068              var tail;
21069  
21070              if (lastContentRow === null) {
21071                // The whole list is part of the tail.
21072                // TODO: We could fast path by just rendering the tail now.
21073                tail = workInProgress.child;
21074                workInProgress.child = null;
21075              } else {
21076                // Disconnect the tail rows after the content row.
21077                // We're going to render them separately later.
21078                tail = lastContentRow.sibling;
21079                lastContentRow.sibling = null;
21080              }
21081  
21082              initSuspenseListRenderState(workInProgress, false, // isBackwards
21083              tail, lastContentRow, tailMode);
21084              break;
21085            }
21086  
21087          case 'backwards':
21088            {
21089              // We're going to find the first row that has existing content.
21090              // At the same time we're going to reverse the list of everything
21091              // we pass in the meantime. That's going to be our tail in reverse
21092              // order.
21093              var _tail = null;
21094              var row = workInProgress.child;
21095              workInProgress.child = null;
21096  
21097              while (row !== null) {
21098                var currentRow = row.alternate; // New rows can't be content rows.
21099  
21100                if (currentRow !== null && findFirstSuspended(currentRow) === null) {
21101                  // This is the beginning of the main content.
21102                  workInProgress.child = row;
21103                  break;
21104                }
21105  
21106                var nextRow = row.sibling;
21107                row.sibling = _tail;
21108                _tail = row;
21109                row = nextRow;
21110              } // TODO: If workInProgress.child is null, we can continue on the tail immediately.
21111  
21112  
21113              initSuspenseListRenderState(workInProgress, true, // isBackwards
21114              _tail, null, // last
21115              tailMode);
21116              break;
21117            }
21118  
21119          case 'together':
21120            {
21121              initSuspenseListRenderState(workInProgress, false, // isBackwards
21122              null, // tail
21123              null, // last
21124              undefined);
21125              break;
21126            }
21127  
21128          default:
21129            {
21130              // The default reveal order is the same as not having
21131              // a boundary.
21132              workInProgress.memoizedState = null;
21133            }
21134        }
21135      }
21136  
21137      return workInProgress.child;
21138    }
21139  
21140    function updatePortalComponent(current, workInProgress, renderLanes) {
21141      pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo);
21142      var nextChildren = workInProgress.pendingProps;
21143  
21144      if (current === null) {
21145        // Portals are special because we don't append the children during mount
21146        // but at commit. Therefore we need to track insertions which the normal
21147        // flow doesn't do during mount. This doesn't happen at the root because
21148        // the root always starts with a "current" with a null child.
21149        // TODO: Consider unifying this with how the root works.
21150        workInProgress.child = reconcileChildFibers(workInProgress, null, nextChildren, renderLanes);
21151      } else {
21152        reconcileChildren(current, workInProgress, nextChildren, renderLanes);
21153      }
21154  
21155      return workInProgress.child;
21156    }
21157  
21158    var hasWarnedAboutUsingNoValuePropOnContextProvider = false;
21159  
21160    function updateContextProvider(current, workInProgress, renderLanes) {
21161      var providerType = workInProgress.type;
21162      var context = providerType._context;
21163      var newProps = workInProgress.pendingProps;
21164      var oldProps = workInProgress.memoizedProps;
21165      var newValue = newProps.value;
21166  
21167      {
21168        if (!('value' in newProps)) {
21169          if (!hasWarnedAboutUsingNoValuePropOnContextProvider) {
21170            hasWarnedAboutUsingNoValuePropOnContextProvider = true;
21171  
21172            error('The `value` prop is required for the `<Context.Provider>`. Did you misspell it or forget to pass it?');
21173          }
21174        }
21175  
21176        var providerPropTypes = workInProgress.type.propTypes;
21177  
21178        if (providerPropTypes) {
21179          checkPropTypes(providerPropTypes, newProps, 'prop', 'Context.Provider');
21180        }
21181      }
21182  
21183      pushProvider(workInProgress, context, newValue);
21184  
21185      {
21186        if (oldProps !== null) {
21187          var oldValue = oldProps.value;
21188  
21189          if (objectIs(oldValue, newValue)) {
21190            // No change. Bailout early if children are the same.
21191            if (oldProps.children === newProps.children && !hasContextChanged()) {
21192              return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
21193            }
21194          } else {
21195            // The context value changed. Search for matching consumers and schedule
21196            // them to update.
21197            propagateContextChange(workInProgress, context, renderLanes);
21198          }
21199        }
21200      }
21201  
21202      var newChildren = newProps.children;
21203      reconcileChildren(current, workInProgress, newChildren, renderLanes);
21204      return workInProgress.child;
21205    }
21206  
21207    var hasWarnedAboutUsingContextAsConsumer = false;
21208  
21209    function updateContextConsumer(current, workInProgress, renderLanes) {
21210      var context = workInProgress.type; // The logic below for Context differs depending on PROD or DEV mode. In
21211      // DEV mode, we create a separate object for Context.Consumer that acts
21212      // like a proxy to Context. This proxy object adds unnecessary code in PROD
21213      // so we use the old behaviour (Context.Consumer references Context) to
21214      // reduce size and overhead. The separate object references context via
21215      // a property called "_context", which also gives us the ability to check
21216      // in DEV mode if this property exists or not and warn if it does not.
21217  
21218      {
21219        if (context._context === undefined) {
21220          // This may be because it's a Context (rather than a Consumer).
21221          // Or it may be because it's older React where they're the same thing.
21222          // We only want to warn if we're sure it's a new React.
21223          if (context !== context.Consumer) {
21224            if (!hasWarnedAboutUsingContextAsConsumer) {
21225              hasWarnedAboutUsingContextAsConsumer = true;
21226  
21227              error('Rendering <Context> directly is not supported and will be removed in ' + 'a future major release. Did you mean to render <Context.Consumer> instead?');
21228            }
21229          }
21230        } else {
21231          context = context._context;
21232        }
21233      }
21234  
21235      var newProps = workInProgress.pendingProps;
21236      var render = newProps.children;
21237  
21238      {
21239        if (typeof render !== 'function') {
21240          error('A context consumer was rendered with multiple children, or a child ' + "that isn't a function. A context consumer expects a single child " + 'that is a function. If you did pass a function, make sure there ' + 'is no trailing or leading whitespace around it.');
21241        }
21242      }
21243  
21244      prepareToReadContext(workInProgress, renderLanes);
21245      var newValue = readContext(context);
21246  
21247      {
21248        markComponentRenderStarted(workInProgress);
21249      }
21250  
21251      var newChildren;
21252  
21253      {
21254        ReactCurrentOwner$1.current = workInProgress;
21255        setIsRendering(true);
21256        newChildren = render(newValue);
21257        setIsRendering(false);
21258      }
21259  
21260      {
21261        markComponentRenderStopped();
21262      } // React DevTools reads this flag.
21263  
21264  
21265      workInProgress.flags |= PerformedWork;
21266      reconcileChildren(current, workInProgress, newChildren, renderLanes);
21267      return workInProgress.child;
21268    }
21269  
21270    function markWorkInProgressReceivedUpdate() {
21271      didReceiveUpdate = true;
21272    }
21273  
21274    function resetSuspendedCurrentOnMountInLegacyMode(current, workInProgress) {
21275      if ((workInProgress.mode & ConcurrentMode) === NoMode) {
21276        if (current !== null) {
21277          // A lazy component only mounts if it suspended inside a non-
21278          // concurrent tree, in an inconsistent state. We want to treat it like
21279          // a new mount, even though an empty version of it already committed.
21280          // Disconnect the alternate pointers.
21281          current.alternate = null;
21282          workInProgress.alternate = null; // Since this is conceptually a new fiber, schedule a Placement effect
21283  
21284          workInProgress.flags |= Placement;
21285        }
21286      }
21287    }
21288  
21289    function bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes) {
21290      if (current !== null) {
21291        // Reuse previous dependencies
21292        workInProgress.dependencies = current.dependencies;
21293      }
21294  
21295      {
21296        // Don't update "base" render times for bailouts.
21297        stopProfilerTimerIfRunning();
21298      }
21299  
21300      markSkippedUpdateLanes(workInProgress.lanes); // Check if the children have any pending work.
21301  
21302      if (!includesSomeLane(renderLanes, workInProgress.childLanes)) {
21303        // The children don't have any work either. We can skip them.
21304        // TODO: Once we add back resuming, we should check if the children are
21305        // a work-in-progress set. If so, we need to transfer their effects.
21306        {
21307          return null;
21308        }
21309      } // This fiber doesn't have work, but its subtree does. Clone the child
21310      // fibers and continue.
21311  
21312  
21313      cloneChildFibers(current, workInProgress);
21314      return workInProgress.child;
21315    }
21316  
21317    function remountFiber(current, oldWorkInProgress, newWorkInProgress) {
21318      {
21319        var returnFiber = oldWorkInProgress.return;
21320  
21321        if (returnFiber === null) {
21322          // eslint-disable-next-line react-internal/prod-error-codes
21323          throw new Error('Cannot swap the root fiber.');
21324        } // Disconnect from the old current.
21325        // It will get deleted.
21326  
21327  
21328        current.alternate = null;
21329        oldWorkInProgress.alternate = null; // Connect to the new tree.
21330  
21331        newWorkInProgress.index = oldWorkInProgress.index;
21332        newWorkInProgress.sibling = oldWorkInProgress.sibling;
21333        newWorkInProgress.return = oldWorkInProgress.return;
21334        newWorkInProgress.ref = oldWorkInProgress.ref; // Replace the child/sibling pointers above it.
21335  
21336        if (oldWorkInProgress === returnFiber.child) {
21337          returnFiber.child = newWorkInProgress;
21338        } else {
21339          var prevSibling = returnFiber.child;
21340  
21341          if (prevSibling === null) {
21342            // eslint-disable-next-line react-internal/prod-error-codes
21343            throw new Error('Expected parent to have a child.');
21344          }
21345  
21346          while (prevSibling.sibling !== oldWorkInProgress) {
21347            prevSibling = prevSibling.sibling;
21348  
21349            if (prevSibling === null) {
21350              // eslint-disable-next-line react-internal/prod-error-codes
21351              throw new Error('Expected to find the previous sibling.');
21352            }
21353          }
21354  
21355          prevSibling.sibling = newWorkInProgress;
21356        } // Delete the old fiber and place the new one.
21357        // Since the old fiber is disconnected, we have to schedule it manually.
21358  
21359  
21360        var deletions = returnFiber.deletions;
21361  
21362        if (deletions === null) {
21363          returnFiber.deletions = [current];
21364          returnFiber.flags |= ChildDeletion;
21365        } else {
21366          deletions.push(current);
21367        }
21368  
21369        newWorkInProgress.flags |= Placement; // Restart work from the new fiber.
21370  
21371        return newWorkInProgress;
21372      }
21373    }
21374  
21375    function checkScheduledUpdateOrContext(current, renderLanes) {
21376      // Before performing an early bailout, we must check if there are pending
21377      // updates or context.
21378      var updateLanes = current.lanes;
21379  
21380      if (includesSomeLane(updateLanes, renderLanes)) {
21381        return true;
21382      } // No pending update, but because context is propagated lazily, we need
21383  
21384      return false;
21385    }
21386  
21387    function attemptEarlyBailoutIfNoScheduledUpdate(current, workInProgress, renderLanes) {
21388      // This fiber does not have any pending work. Bailout without entering
21389      // the begin phase. There's still some bookkeeping we that needs to be done
21390      // in this optimized path, mostly pushing stuff onto the stack.
21391      switch (workInProgress.tag) {
21392        case HostRoot:
21393          pushHostRootContext(workInProgress);
21394          var root = workInProgress.stateNode;
21395  
21396          resetHydrationState();
21397          break;
21398  
21399        case HostComponent:
21400          pushHostContext(workInProgress);
21401          break;
21402  
21403        case ClassComponent:
21404          {
21405            var Component = workInProgress.type;
21406  
21407            if (isContextProvider(Component)) {
21408              pushContextProvider(workInProgress);
21409            }
21410  
21411            break;
21412          }
21413  
21414        case HostPortal:
21415          pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo);
21416          break;
21417  
21418        case ContextProvider:
21419          {
21420            var newValue = workInProgress.memoizedProps.value;
21421            var context = workInProgress.type._context;
21422            pushProvider(workInProgress, context, newValue);
21423            break;
21424          }
21425  
21426        case Profiler:
21427          {
21428            // Profiler should only call onRender when one of its descendants actually rendered.
21429            var hasChildWork = includesSomeLane(renderLanes, workInProgress.childLanes);
21430  
21431            if (hasChildWork) {
21432              workInProgress.flags |= Update;
21433            }
21434  
21435            {
21436              // Reset effect durations for the next eventual effect phase.
21437              // These are reset during render to allow the DevTools commit hook a chance to read them,
21438              var stateNode = workInProgress.stateNode;
21439              stateNode.effectDuration = 0;
21440              stateNode.passiveEffectDuration = 0;
21441            }
21442          }
21443  
21444          break;
21445  
21446        case SuspenseComponent:
21447          {
21448            var state = workInProgress.memoizedState;
21449  
21450            if (state !== null) {
21451              if (state.dehydrated !== null) {
21452                pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current)); // We know that this component will suspend again because if it has
21453                // been unsuspended it has committed as a resolved Suspense component.
21454                // If it needs to be retried, it should have work scheduled on it.
21455  
21456                workInProgress.flags |= DidCapture; // We should never render the children of a dehydrated boundary until we
21457                // upgrade it. We return null instead of bailoutOnAlreadyFinishedWork.
21458  
21459                return null;
21460              } // If this boundary is currently timed out, we need to decide
21461              // whether to retry the primary children, or to skip over it and
21462              // go straight to the fallback. Check the priority of the primary
21463              // child fragment.
21464  
21465  
21466              var primaryChildFragment = workInProgress.child;
21467              var primaryChildLanes = primaryChildFragment.childLanes;
21468  
21469              if (includesSomeLane(renderLanes, primaryChildLanes)) {
21470                // The primary children have pending work. Use the normal path
21471                // to attempt to render the primary children again.
21472                return updateSuspenseComponent(current, workInProgress, renderLanes);
21473              } else {
21474                // The primary child fragment does not have pending work marked
21475                // on it
21476                pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current)); // The primary children do not have pending work with sufficient
21477                // priority. Bailout.
21478  
21479                var child = bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
21480  
21481                if (child !== null) {
21482                  // The fallback children have pending work. Skip over the
21483                  // primary children and work on the fallback.
21484                  return child.sibling;
21485                } else {
21486                  // Note: We can return `null` here because we already checked
21487                  // whether there were nested context consumers, via the call to
21488                  // `bailoutOnAlreadyFinishedWork` above.
21489                  return null;
21490                }
21491              }
21492            } else {
21493              pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current));
21494            }
21495  
21496            break;
21497          }
21498  
21499        case SuspenseListComponent:
21500          {
21501            var didSuspendBefore = (current.flags & DidCapture) !== NoFlags;
21502  
21503            var _hasChildWork = includesSomeLane(renderLanes, workInProgress.childLanes);
21504  
21505            if (didSuspendBefore) {
21506              if (_hasChildWork) {
21507                // If something was in fallback state last time, and we have all the
21508                // same children then we're still in progressive loading state.
21509                // Something might get unblocked by state updates or retries in the
21510                // tree which will affect the tail. So we need to use the normal
21511                // path to compute the correct tail.
21512                return updateSuspenseListComponent(current, workInProgress, renderLanes);
21513              } // If none of the children had any work, that means that none of
21514              // them got retried so they'll still be blocked in the same way
21515              // as before. We can fast bail out.
21516  
21517  
21518              workInProgress.flags |= DidCapture;
21519            } // If nothing suspended before and we're rendering the same children,
21520            // then the tail doesn't matter. Anything new that suspends will work
21521            // in the "together" mode, so we can continue from the state we had.
21522  
21523  
21524            var renderState = workInProgress.memoizedState;
21525  
21526            if (renderState !== null) {
21527              // Reset to the "together" mode in case we've started a different
21528              // update in the past but didn't complete it.
21529              renderState.rendering = null;
21530              renderState.tail = null;
21531              renderState.lastEffect = null;
21532            }
21533  
21534            pushSuspenseContext(workInProgress, suspenseStackCursor.current);
21535  
21536            if (_hasChildWork) {
21537              break;
21538            } else {
21539              // If none of the children had any work, that means that none of
21540              // them got retried so they'll still be blocked in the same way
21541              // as before. We can fast bail out.
21542              return null;
21543            }
21544          }
21545  
21546        case OffscreenComponent:
21547        case LegacyHiddenComponent:
21548          {
21549            // Need to check if the tree still needs to be deferred. This is
21550            // almost identical to the logic used in the normal update path,
21551            // so we'll just enter that. The only difference is we'll bail out
21552            // at the next level instead of this one, because the child props
21553            // have not changed. Which is fine.
21554            // TODO: Probably should refactor `beginWork` to split the bailout
21555            // path from the normal path. I'm tempted to do a labeled break here
21556            // but I won't :)
21557            workInProgress.lanes = NoLanes;
21558            return updateOffscreenComponent(current, workInProgress, renderLanes);
21559          }
21560      }
21561  
21562      return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
21563    }
21564  
21565    function beginWork(current, workInProgress, renderLanes) {
21566      {
21567        if (workInProgress._debugNeedsRemount && current !== null) {
21568          // This will restart the begin phase with a new fiber.
21569          return remountFiber(current, workInProgress, createFiberFromTypeAndProps(workInProgress.type, workInProgress.key, workInProgress.pendingProps, workInProgress._debugOwner || null, workInProgress.mode, workInProgress.lanes));
21570        }
21571      }
21572  
21573      if (current !== null) {
21574        var oldProps = current.memoizedProps;
21575        var newProps = workInProgress.pendingProps;
21576  
21577        if (oldProps !== newProps || hasContextChanged() || ( // Force a re-render if the implementation changed due to hot reload:
21578         workInProgress.type !== current.type )) {
21579          // If props or context changed, mark the fiber as having performed work.
21580          // This may be unset if the props are determined to be equal later (memo).
21581          didReceiveUpdate = true;
21582        } else {
21583          // Neither props nor legacy context changes. Check if there's a pending
21584          // update or context change.
21585          var hasScheduledUpdateOrContext = checkScheduledUpdateOrContext(current, renderLanes);
21586  
21587          if (!hasScheduledUpdateOrContext && // If this is the second pass of an error or suspense boundary, there
21588          // may not be work scheduled on `current`, so we check for this flag.
21589          (workInProgress.flags & DidCapture) === NoFlags) {
21590            // No pending updates or context. Bail out now.
21591            didReceiveUpdate = false;
21592            return attemptEarlyBailoutIfNoScheduledUpdate(current, workInProgress, renderLanes);
21593          }
21594  
21595          if ((current.flags & ForceUpdateForLegacySuspense) !== NoFlags) {
21596            // This is a special case that only exists for legacy mode.
21597            // See https://github.com/facebook/react/pull/19216.
21598            didReceiveUpdate = true;
21599          } else {
21600            // An update was scheduled on this fiber, but there are no new props
21601            // nor legacy context. Set this to false. If an update queue or context
21602            // consumer produces a changed value, it will set this to true. Otherwise,
21603            // the component will assume the children have not changed and bail out.
21604            didReceiveUpdate = false;
21605          }
21606        }
21607      } else {
21608        didReceiveUpdate = false;
21609  
21610        if (getIsHydrating() && isForkedChild(workInProgress)) {
21611          // Check if this child belongs to a list of muliple children in
21612          // its parent.
21613          //
21614          // In a true multi-threaded implementation, we would render children on
21615          // parallel threads. This would represent the beginning of a new render
21616          // thread for this subtree.
21617          //
21618          // We only use this for id generation during hydration, which is why the
21619          // logic is located in this special branch.
21620          var slotIndex = workInProgress.index;
21621          var numberOfForks = getForksAtLevel();
21622          pushTreeId(workInProgress, numberOfForks, slotIndex);
21623        }
21624      } // Before entering the begin phase, clear pending update priority.
21625      // TODO: This assumes that we're about to evaluate the component and process
21626      // the update queue. However, there's an exception: SimpleMemoComponent
21627      // sometimes bails out later in the begin phase. This indicates that we should
21628      // move this assignment out of the common path and into each branch.
21629  
21630  
21631      workInProgress.lanes = NoLanes;
21632  
21633      switch (workInProgress.tag) {
21634        case IndeterminateComponent:
21635          {
21636            return mountIndeterminateComponent(current, workInProgress, workInProgress.type, renderLanes);
21637          }
21638  
21639        case LazyComponent:
21640          {
21641            var elementType = workInProgress.elementType;
21642            return mountLazyComponent(current, workInProgress, elementType, renderLanes);
21643          }
21644  
21645        case FunctionComponent:
21646          {
21647            var Component = workInProgress.type;
21648            var unresolvedProps = workInProgress.pendingProps;
21649            var resolvedProps = workInProgress.elementType === Component ? unresolvedProps : resolveDefaultProps(Component, unresolvedProps);
21650            return updateFunctionComponent(current, workInProgress, Component, resolvedProps, renderLanes);
21651          }
21652  
21653        case ClassComponent:
21654          {
21655            var _Component = workInProgress.type;
21656            var _unresolvedProps = workInProgress.pendingProps;
21657  
21658            var _resolvedProps = workInProgress.elementType === _Component ? _unresolvedProps : resolveDefaultProps(_Component, _unresolvedProps);
21659  
21660            return updateClassComponent(current, workInProgress, _Component, _resolvedProps, renderLanes);
21661          }
21662  
21663        case HostRoot:
21664          return updateHostRoot(current, workInProgress, renderLanes);
21665  
21666        case HostComponent:
21667          return updateHostComponent(current, workInProgress, renderLanes);
21668  
21669        case HostText:
21670          return updateHostText(current, workInProgress);
21671  
21672        case SuspenseComponent:
21673          return updateSuspenseComponent(current, workInProgress, renderLanes);
21674  
21675        case HostPortal:
21676          return updatePortalComponent(current, workInProgress, renderLanes);
21677  
21678        case ForwardRef:
21679          {
21680            var type = workInProgress.type;
21681            var _unresolvedProps2 = workInProgress.pendingProps;
21682  
21683            var _resolvedProps2 = workInProgress.elementType === type ? _unresolvedProps2 : resolveDefaultProps(type, _unresolvedProps2);
21684  
21685            return updateForwardRef(current, workInProgress, type, _resolvedProps2, renderLanes);
21686          }
21687  
21688        case Fragment:
21689          return updateFragment(current, workInProgress, renderLanes);
21690  
21691        case Mode:
21692          return updateMode(current, workInProgress, renderLanes);
21693  
21694        case Profiler:
21695          return updateProfiler(current, workInProgress, renderLanes);
21696  
21697        case ContextProvider:
21698          return updateContextProvider(current, workInProgress, renderLanes);
21699  
21700        case ContextConsumer:
21701          return updateContextConsumer(current, workInProgress, renderLanes);
21702  
21703        case MemoComponent:
21704          {
21705            var _type2 = workInProgress.type;
21706            var _unresolvedProps3 = workInProgress.pendingProps; // Resolve outer props first, then resolve inner props.
21707  
21708            var _resolvedProps3 = resolveDefaultProps(_type2, _unresolvedProps3);
21709  
21710            {
21711              if (workInProgress.type !== workInProgress.elementType) {
21712                var outerPropTypes = _type2.propTypes;
21713  
21714                if (outerPropTypes) {
21715                  checkPropTypes(outerPropTypes, _resolvedProps3, // Resolved for outer only
21716                  'prop', getComponentNameFromType(_type2));
21717                }
21718              }
21719            }
21720  
21721            _resolvedProps3 = resolveDefaultProps(_type2.type, _resolvedProps3);
21722            return updateMemoComponent(current, workInProgress, _type2, _resolvedProps3, renderLanes);
21723          }
21724  
21725        case SimpleMemoComponent:
21726          {
21727            return updateSimpleMemoComponent(current, workInProgress, workInProgress.type, workInProgress.pendingProps, renderLanes);
21728          }
21729  
21730        case IncompleteClassComponent:
21731          {
21732            var _Component2 = workInProgress.type;
21733            var _unresolvedProps4 = workInProgress.pendingProps;
21734  
21735            var _resolvedProps4 = workInProgress.elementType === _Component2 ? _unresolvedProps4 : resolveDefaultProps(_Component2, _unresolvedProps4);
21736  
21737            return mountIncompleteClassComponent(current, workInProgress, _Component2, _resolvedProps4, renderLanes);
21738          }
21739  
21740        case SuspenseListComponent:
21741          {
21742            return updateSuspenseListComponent(current, workInProgress, renderLanes);
21743          }
21744  
21745        case ScopeComponent:
21746          {
21747  
21748            break;
21749          }
21750  
21751        case OffscreenComponent:
21752          {
21753            return updateOffscreenComponent(current, workInProgress, renderLanes);
21754          }
21755      }
21756  
21757      throw new Error("Unknown unit of work tag (" + workInProgress.tag + "). This error is likely caused by a bug in " + 'React. Please file an issue.');
21758    }
21759  
21760    function markUpdate(workInProgress) {
21761      // Tag the fiber with an update effect. This turns a Placement into
21762      // a PlacementAndUpdate.
21763      workInProgress.flags |= Update;
21764    }
21765  
21766    function markRef$1(workInProgress) {
21767      workInProgress.flags |= Ref;
21768  
21769      {
21770        workInProgress.flags |= RefStatic;
21771      }
21772    }
21773  
21774    var appendAllChildren;
21775    var updateHostContainer;
21776    var updateHostComponent$1;
21777    var updateHostText$1;
21778  
21779    {
21780      // Mutation mode
21781      appendAllChildren = function (parent, workInProgress, needsVisibilityToggle, isHidden) {
21782        // We only have the top Fiber that was created but we need recurse down its
21783        // children to find all the terminal nodes.
21784        var node = workInProgress.child;
21785  
21786        while (node !== null) {
21787          if (node.tag === HostComponent || node.tag === HostText) {
21788            appendInitialChild(parent, node.stateNode);
21789          } else if (node.tag === HostPortal) ; else if (node.child !== null) {
21790            node.child.return = node;
21791            node = node.child;
21792            continue;
21793          }
21794  
21795          if (node === workInProgress) {
21796            return;
21797          }
21798  
21799          while (node.sibling === null) {
21800            if (node.return === null || node.return === workInProgress) {
21801              return;
21802            }
21803  
21804            node = node.return;
21805          }
21806  
21807          node.sibling.return = node.return;
21808          node = node.sibling;
21809        }
21810      };
21811  
21812      updateHostContainer = function (current, workInProgress) {// Noop
21813      };
21814  
21815      updateHostComponent$1 = function (current, workInProgress, type, newProps, rootContainerInstance) {
21816        // If we have an alternate, that means this is an update and we need to
21817        // schedule a side-effect to do the updates.
21818        var oldProps = current.memoizedProps;
21819  
21820        if (oldProps === newProps) {
21821          // In mutation mode, this is sufficient for a bailout because
21822          // we won't touch this node even if children changed.
21823          return;
21824        } // If we get updated because one of our children updated, we don't
21825        // have newProps so we'll have to reuse them.
21826        // TODO: Split the update API as separate for the props vs. children.
21827        // Even better would be if children weren't special cased at all tho.
21828  
21829  
21830        var instance = workInProgress.stateNode;
21831        var currentHostContext = getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
21832        // component is hitting the resume path. Figure out why. Possibly
21833        // related to `hidden`.
21834  
21835        var updatePayload = prepareUpdate(instance, type, oldProps, newProps, rootContainerInstance, currentHostContext); // TODO: Type this specific to this type of component.
21836  
21837        workInProgress.updateQueue = updatePayload; // If the update payload indicates that there is a change or if there
21838        // is a new ref we mark this as an update. All the work is done in commitWork.
21839  
21840        if (updatePayload) {
21841          markUpdate(workInProgress);
21842        }
21843      };
21844  
21845      updateHostText$1 = function (current, workInProgress, oldText, newText) {
21846        // If the text differs, mark it as an update. All the work in done in commitWork.
21847        if (oldText !== newText) {
21848          markUpdate(workInProgress);
21849        }
21850      };
21851    }
21852  
21853    function cutOffTailIfNeeded(renderState, hasRenderedATailFallback) {
21854      if (getIsHydrating()) {
21855        // If we're hydrating, we should consume as many items as we can
21856        // so we don't leave any behind.
21857        return;
21858      }
21859  
21860      switch (renderState.tailMode) {
21861        case 'hidden':
21862          {
21863            // Any insertions at the end of the tail list after this point
21864            // should be invisible. If there are already mounted boundaries
21865            // anything before them are not considered for collapsing.
21866            // Therefore we need to go through the whole tail to find if
21867            // there are any.
21868            var tailNode = renderState.tail;
21869            var lastTailNode = null;
21870  
21871            while (tailNode !== null) {
21872              if (tailNode.alternate !== null) {
21873                lastTailNode = tailNode;
21874              }
21875  
21876              tailNode = tailNode.sibling;
21877            } // Next we're simply going to delete all insertions after the
21878            // last rendered item.
21879  
21880  
21881            if (lastTailNode === null) {
21882              // All remaining items in the tail are insertions.
21883              renderState.tail = null;
21884            } else {
21885              // Detach the insertion after the last node that was already
21886              // inserted.
21887              lastTailNode.sibling = null;
21888            }
21889  
21890            break;
21891          }
21892  
21893        case 'collapsed':
21894          {
21895            // Any insertions at the end of the tail list after this point
21896            // should be invisible. If there are already mounted boundaries
21897            // anything before them are not considered for collapsing.
21898            // Therefore we need to go through the whole tail to find if
21899            // there are any.
21900            var _tailNode = renderState.tail;
21901            var _lastTailNode = null;
21902  
21903            while (_tailNode !== null) {
21904              if (_tailNode.alternate !== null) {
21905                _lastTailNode = _tailNode;
21906              }
21907  
21908              _tailNode = _tailNode.sibling;
21909            } // Next we're simply going to delete all insertions after the
21910            // last rendered item.
21911  
21912  
21913            if (_lastTailNode === null) {
21914              // All remaining items in the tail are insertions.
21915              if (!hasRenderedATailFallback && renderState.tail !== null) {
21916                // We suspended during the head. We want to show at least one
21917                // row at the tail. So we'll keep on and cut off the rest.
21918                renderState.tail.sibling = null;
21919              } else {
21920                renderState.tail = null;
21921              }
21922            } else {
21923              // Detach the insertion after the last node that was already
21924              // inserted.
21925              _lastTailNode.sibling = null;
21926            }
21927  
21928            break;
21929          }
21930      }
21931    }
21932  
21933    function bubbleProperties(completedWork) {
21934      var didBailout = completedWork.alternate !== null && completedWork.alternate.child === completedWork.child;
21935      var newChildLanes = NoLanes;
21936      var subtreeFlags = NoFlags;
21937  
21938      if (!didBailout) {
21939        // Bubble up the earliest expiration time.
21940        if ( (completedWork.mode & ProfileMode) !== NoMode) {
21941          // In profiling mode, resetChildExpirationTime is also used to reset
21942          // profiler durations.
21943          var actualDuration = completedWork.actualDuration;
21944          var treeBaseDuration = completedWork.selfBaseDuration;
21945          var child = completedWork.child;
21946  
21947          while (child !== null) {
21948            newChildLanes = mergeLanes(newChildLanes, mergeLanes(child.lanes, child.childLanes));
21949            subtreeFlags |= child.subtreeFlags;
21950            subtreeFlags |= child.flags; // When a fiber is cloned, its actualDuration is reset to 0. This value will
21951            // only be updated if work is done on the fiber (i.e. it doesn't bailout).
21952            // When work is done, it should bubble to the parent's actualDuration. If
21953            // the fiber has not been cloned though, (meaning no work was done), then
21954            // this value will reflect the amount of time spent working on a previous
21955            // render. In that case it should not bubble. We determine whether it was
21956            // cloned by comparing the child pointer.
21957  
21958            actualDuration += child.actualDuration;
21959            treeBaseDuration += child.treeBaseDuration;
21960            child = child.sibling;
21961          }
21962  
21963          completedWork.actualDuration = actualDuration;
21964          completedWork.treeBaseDuration = treeBaseDuration;
21965        } else {
21966          var _child = completedWork.child;
21967  
21968          while (_child !== null) {
21969            newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child.lanes, _child.childLanes));
21970            subtreeFlags |= _child.subtreeFlags;
21971            subtreeFlags |= _child.flags; // Update the return pointer so the tree is consistent. This is a code
21972            // smell because it assumes the commit phase is never concurrent with
21973            // the render phase. Will address during refactor to alternate model.
21974  
21975            _child.return = completedWork;
21976            _child = _child.sibling;
21977          }
21978        }
21979  
21980        completedWork.subtreeFlags |= subtreeFlags;
21981      } else {
21982        // Bubble up the earliest expiration time.
21983        if ( (completedWork.mode & ProfileMode) !== NoMode) {
21984          // In profiling mode, resetChildExpirationTime is also used to reset
21985          // profiler durations.
21986          var _treeBaseDuration = completedWork.selfBaseDuration;
21987          var _child2 = completedWork.child;
21988  
21989          while (_child2 !== null) {
21990            newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child2.lanes, _child2.childLanes)); // "Static" flags share the lifetime of the fiber/hook they belong to,
21991            // so we should bubble those up even during a bailout. All the other
21992            // flags have a lifetime only of a single render + commit, so we should
21993            // ignore them.
21994  
21995            subtreeFlags |= _child2.subtreeFlags & StaticMask;
21996            subtreeFlags |= _child2.flags & StaticMask;
21997            _treeBaseDuration += _child2.treeBaseDuration;
21998            _child2 = _child2.sibling;
21999          }
22000  
22001          completedWork.treeBaseDuration = _treeBaseDuration;
22002        } else {
22003          var _child3 = completedWork.child;
22004  
22005          while (_child3 !== null) {
22006            newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child3.lanes, _child3.childLanes)); // "Static" flags share the lifetime of the fiber/hook they belong to,
22007            // so we should bubble those up even during a bailout. All the other
22008            // flags have a lifetime only of a single render + commit, so we should
22009            // ignore them.
22010  
22011            subtreeFlags |= _child3.subtreeFlags & StaticMask;
22012            subtreeFlags |= _child3.flags & StaticMask; // Update the return pointer so the tree is consistent. This is a code
22013            // smell because it assumes the commit phase is never concurrent with
22014            // the render phase. Will address during refactor to alternate model.
22015  
22016            _child3.return = completedWork;
22017            _child3 = _child3.sibling;
22018          }
22019        }
22020  
22021        completedWork.subtreeFlags |= subtreeFlags;
22022      }
22023  
22024      completedWork.childLanes = newChildLanes;
22025      return didBailout;
22026    }
22027  
22028    function completeDehydratedSuspenseBoundary(current, workInProgress, nextState) {
22029      if (hasUnhydratedTailNodes() && (workInProgress.mode & ConcurrentMode) !== NoMode && (workInProgress.flags & DidCapture) === NoFlags) {
22030        warnIfUnhydratedTailNodes(workInProgress);
22031        resetHydrationState();
22032        workInProgress.flags |= ForceClientRender | Incomplete | ShouldCapture;
22033        return false;
22034      }
22035  
22036      var wasHydrated = popHydrationState(workInProgress);
22037  
22038      if (nextState !== null && nextState.dehydrated !== null) {
22039        // We might be inside a hydration state the first time we're picking up this
22040        // Suspense boundary, and also after we've reentered it for further hydration.
22041        if (current === null) {
22042          if (!wasHydrated) {
22043            throw new Error('A dehydrated suspense component was completed without a hydrated node. ' + 'This is probably a bug in React.');
22044          }
22045  
22046          prepareToHydrateHostSuspenseInstance(workInProgress);
22047          bubbleProperties(workInProgress);
22048  
22049          {
22050            if ((workInProgress.mode & ProfileMode) !== NoMode) {
22051              var isTimedOutSuspense = nextState !== null;
22052  
22053              if (isTimedOutSuspense) {
22054                // Don't count time spent in a timed out Suspense subtree as part of the base duration.
22055                var primaryChildFragment = workInProgress.child;
22056  
22057                if (primaryChildFragment !== null) {
22058                  // $FlowFixMe Flow doesn't support type casting in combination with the -= operator
22059                  workInProgress.treeBaseDuration -= primaryChildFragment.treeBaseDuration;
22060                }
22061              }
22062            }
22063          }
22064  
22065          return false;
22066        } else {
22067          // We might have reentered this boundary to hydrate it. If so, we need to reset the hydration
22068          // state since we're now exiting out of it. popHydrationState doesn't do that for us.
22069          resetHydrationState();
22070  
22071          if ((workInProgress.flags & DidCapture) === NoFlags) {
22072            // This boundary did not suspend so it's now hydrated and unsuspended.
22073            workInProgress.memoizedState = null;
22074          } // If nothing suspended, we need to schedule an effect to mark this boundary
22075          // as having hydrated so events know that they're free to be invoked.
22076          // It's also a signal to replay events and the suspense callback.
22077          // If something suspended, schedule an effect to attach retry listeners.
22078          // So we might as well always mark this.
22079  
22080  
22081          workInProgress.flags |= Update;
22082          bubbleProperties(workInProgress);
22083  
22084          {
22085            if ((workInProgress.mode & ProfileMode) !== NoMode) {
22086              var _isTimedOutSuspense = nextState !== null;
22087  
22088              if (_isTimedOutSuspense) {
22089                // Don't count time spent in a timed out Suspense subtree as part of the base duration.
22090                var _primaryChildFragment = workInProgress.child;
22091  
22092                if (_primaryChildFragment !== null) {
22093                  // $FlowFixMe Flow doesn't support type casting in combination with the -= operator
22094                  workInProgress.treeBaseDuration -= _primaryChildFragment.treeBaseDuration;
22095                }
22096              }
22097            }
22098          }
22099  
22100          return false;
22101        }
22102      } else {
22103        // Successfully completed this tree. If this was a forced client render,
22104        // there may have been recoverable errors during first hydration
22105        // attempt. If so, add them to a queue so we can log them in the
22106        // commit phase.
22107        upgradeHydrationErrorsToRecoverable(); // Fall through to normal Suspense path
22108  
22109        return true;
22110      }
22111    }
22112  
22113    function completeWork(current, workInProgress, renderLanes) {
22114      var newProps = workInProgress.pendingProps; // Note: This intentionally doesn't check if we're hydrating because comparing
22115      // to the current tree provider fiber is just as fast and less error-prone.
22116      // Ideally we would have a special version of the work loop only
22117      // for hydration.
22118  
22119      popTreeContext(workInProgress);
22120  
22121      switch (workInProgress.tag) {
22122        case IndeterminateComponent:
22123        case LazyComponent:
22124        case SimpleMemoComponent:
22125        case FunctionComponent:
22126        case ForwardRef:
22127        case Fragment:
22128        case Mode:
22129        case Profiler:
22130        case ContextConsumer:
22131        case MemoComponent:
22132          bubbleProperties(workInProgress);
22133          return null;
22134  
22135        case ClassComponent:
22136          {
22137            var Component = workInProgress.type;
22138  
22139            if (isContextProvider(Component)) {
22140              popContext(workInProgress);
22141            }
22142  
22143            bubbleProperties(workInProgress);
22144            return null;
22145          }
22146  
22147        case HostRoot:
22148          {
22149            var fiberRoot = workInProgress.stateNode;
22150            popHostContainer(workInProgress);
22151            popTopLevelContextObject(workInProgress);
22152            resetWorkInProgressVersions();
22153  
22154            if (fiberRoot.pendingContext) {
22155              fiberRoot.context = fiberRoot.pendingContext;
22156              fiberRoot.pendingContext = null;
22157            }
22158  
22159            if (current === null || current.child === null) {
22160              // If we hydrated, pop so that we can delete any remaining children
22161              // that weren't hydrated.
22162              var wasHydrated = popHydrationState(workInProgress);
22163  
22164              if (wasHydrated) {
22165                // If we hydrated, then we'll need to schedule an update for
22166                // the commit side-effects on the root.
22167                markUpdate(workInProgress);
22168              } else {
22169                if (current !== null) {
22170                  var prevState = current.memoizedState;
22171  
22172                  if ( // Check if this is a client root
22173                  !prevState.isDehydrated || // Check if we reverted to client rendering (e.g. due to an error)
22174                  (workInProgress.flags & ForceClientRender) !== NoFlags) {
22175                    // Schedule an effect to clear this container at the start of the
22176                    // next commit. This handles the case of React rendering into a
22177                    // container with previous children. It's also safe to do for
22178                    // updates too, because current.child would only be null if the
22179                    // previous render was null (so the container would already
22180                    // be empty).
22181                    workInProgress.flags |= Snapshot; // If this was a forced client render, there may have been
22182                    // recoverable errors during first hydration attempt. If so, add
22183                    // them to a queue so we can log them in the commit phase.
22184  
22185                    upgradeHydrationErrorsToRecoverable();
22186                  }
22187                }
22188              }
22189            }
22190  
22191            updateHostContainer(current, workInProgress);
22192            bubbleProperties(workInProgress);
22193  
22194            return null;
22195          }
22196  
22197        case HostComponent:
22198          {
22199            popHostContext(workInProgress);
22200            var rootContainerInstance = getRootHostContainer();
22201            var type = workInProgress.type;
22202  
22203            if (current !== null && workInProgress.stateNode != null) {
22204              updateHostComponent$1(current, workInProgress, type, newProps, rootContainerInstance);
22205  
22206              if (current.ref !== workInProgress.ref) {
22207                markRef$1(workInProgress);
22208              }
22209            } else {
22210              if (!newProps) {
22211                if (workInProgress.stateNode === null) {
22212                  throw new Error('We must have new props for new mounts. This error is likely ' + 'caused by a bug in React. Please file an issue.');
22213                } // This can happen when we abort work.
22214  
22215  
22216                bubbleProperties(workInProgress);
22217                return null;
22218              }
22219  
22220              var currentHostContext = getHostContext(); // TODO: Move createInstance to beginWork and keep it on a context
22221              // "stack" as the parent. Then append children as we go in beginWork
22222              // or completeWork depending on whether we want to add them top->down or
22223              // bottom->up. Top->down is faster in IE11.
22224  
22225              var _wasHydrated = popHydrationState(workInProgress);
22226  
22227              if (_wasHydrated) {
22228                // TODO: Move this and createInstance step into the beginPhase
22229                // to consolidate.
22230                if (prepareToHydrateHostInstance(workInProgress, rootContainerInstance, currentHostContext)) {
22231                  // If changes to the hydrated node need to be applied at the
22232                  // commit-phase we mark this as such.
22233                  markUpdate(workInProgress);
22234                }
22235              } else {
22236                var instance = createInstance(type, newProps, rootContainerInstance, currentHostContext, workInProgress);
22237                appendAllChildren(instance, workInProgress, false, false);
22238                workInProgress.stateNode = instance; // Certain renderers require commit-time effects for initial mount.
22239                // (eg DOM renderer supports auto-focus for certain elements).
22240                // Make sure such renderers get scheduled for later work.
22241  
22242                if (finalizeInitialChildren(instance, type, newProps, rootContainerInstance)) {
22243                  markUpdate(workInProgress);
22244                }
22245              }
22246  
22247              if (workInProgress.ref !== null) {
22248                // If there is a ref on a host node we need to schedule a callback
22249                markRef$1(workInProgress);
22250              }
22251            }
22252  
22253            bubbleProperties(workInProgress);
22254            return null;
22255          }
22256  
22257        case HostText:
22258          {
22259            var newText = newProps;
22260  
22261            if (current && workInProgress.stateNode != null) {
22262              var oldText = current.memoizedProps; // If we have an alternate, that means this is an update and we need
22263              // to schedule a side-effect to do the updates.
22264  
22265              updateHostText$1(current, workInProgress, oldText, newText);
22266            } else {
22267              if (typeof newText !== 'string') {
22268                if (workInProgress.stateNode === null) {
22269                  throw new Error('We must have new props for new mounts. This error is likely ' + 'caused by a bug in React. Please file an issue.');
22270                } // This can happen when we abort work.
22271  
22272              }
22273  
22274              var _rootContainerInstance = getRootHostContainer();
22275  
22276              var _currentHostContext = getHostContext();
22277  
22278              var _wasHydrated2 = popHydrationState(workInProgress);
22279  
22280              if (_wasHydrated2) {
22281                if (prepareToHydrateHostTextInstance(workInProgress)) {
22282                  markUpdate(workInProgress);
22283                }
22284              } else {
22285                workInProgress.stateNode = createTextInstance(newText, _rootContainerInstance, _currentHostContext, workInProgress);
22286              }
22287            }
22288  
22289            bubbleProperties(workInProgress);
22290            return null;
22291          }
22292  
22293        case SuspenseComponent:
22294          {
22295            popSuspenseContext(workInProgress);
22296            var nextState = workInProgress.memoizedState; // Special path for dehydrated boundaries. We may eventually move this
22297            // to its own fiber type so that we can add other kinds of hydration
22298            // boundaries that aren't associated with a Suspense tree. In anticipation
22299            // of such a refactor, all the hydration logic is contained in
22300            // this branch.
22301  
22302            if (current === null || current.memoizedState !== null && current.memoizedState.dehydrated !== null) {
22303              var fallthroughToNormalSuspensePath = completeDehydratedSuspenseBoundary(current, workInProgress, nextState);
22304  
22305              if (!fallthroughToNormalSuspensePath) {
22306                if (workInProgress.flags & ShouldCapture) {
22307                  // Special case. There were remaining unhydrated nodes. We treat
22308                  // this as a mismatch. Revert to client rendering.
22309                  return workInProgress;
22310                } else {
22311                  // Did not finish hydrating, either because this is the initial
22312                  // render or because something suspended.
22313                  return null;
22314                }
22315              } // Continue with the normal Suspense path.
22316  
22317            }
22318  
22319            if ((workInProgress.flags & DidCapture) !== NoFlags) {
22320              // Something suspended. Re-render with the fallback children.
22321              workInProgress.lanes = renderLanes; // Do not reset the effect list.
22322  
22323              if ( (workInProgress.mode & ProfileMode) !== NoMode) {
22324                transferActualDuration(workInProgress);
22325              } // Don't bubble properties in this case.
22326  
22327  
22328              return workInProgress;
22329            }
22330  
22331            var nextDidTimeout = nextState !== null;
22332            var prevDidTimeout = current !== null && current.memoizedState !== null;
22333            // a passive effect, which is when we process the transitions
22334  
22335  
22336            if (nextDidTimeout !== prevDidTimeout) {
22337              // an effect to toggle the subtree's visibility. When we switch from
22338              // fallback -> primary, the inner Offscreen fiber schedules this effect
22339              // as part of its normal complete phase. But when we switch from
22340              // primary -> fallback, the inner Offscreen fiber does not have a complete
22341              // phase. So we need to schedule its effect here.
22342              //
22343              // We also use this flag to connect/disconnect the effects, but the same
22344              // logic applies: when re-connecting, the Offscreen fiber's complete
22345              // phase will handle scheduling the effect. It's only when the fallback
22346              // is active that we have to do anything special.
22347  
22348  
22349              if (nextDidTimeout) {
22350                var _offscreenFiber2 = workInProgress.child;
22351                _offscreenFiber2.flags |= Visibility; // TODO: This will still suspend a synchronous tree if anything
22352                // in the concurrent tree already suspended during this render.
22353                // This is a known bug.
22354  
22355                if ((workInProgress.mode & ConcurrentMode) !== NoMode) {
22356                  // TODO: Move this back to throwException because this is too late
22357                  // if this is a large tree which is common for initial loads. We
22358                  // don't know if we should restart a render or not until we get
22359                  // this marker, and this is too late.
22360                  // If this render already had a ping or lower pri updates,
22361                  // and this is the first time we know we're going to suspend we
22362                  // should be able to immediately restart from within throwException.
22363                  var hasInvisibleChildContext = current === null && (workInProgress.memoizedProps.unstable_avoidThisFallback !== true || !enableSuspenseAvoidThisFallback);
22364  
22365                  if (hasInvisibleChildContext || hasSuspenseContext(suspenseStackCursor.current, InvisibleParentSuspenseContext)) {
22366                    // If this was in an invisible tree or a new render, then showing
22367                    // this boundary is ok.
22368                    renderDidSuspend();
22369                  } else {
22370                    // Otherwise, we're going to have to hide content so we should
22371                    // suspend for longer if possible.
22372                    renderDidSuspendDelayIfPossible();
22373                  }
22374                }
22375              }
22376            }
22377  
22378            var wakeables = workInProgress.updateQueue;
22379  
22380            if (wakeables !== null) {
22381              // Schedule an effect to attach a retry listener to the promise.
22382              // TODO: Move to passive phase
22383              workInProgress.flags |= Update;
22384            }
22385  
22386            bubbleProperties(workInProgress);
22387  
22388            {
22389              if ((workInProgress.mode & ProfileMode) !== NoMode) {
22390                if (nextDidTimeout) {
22391                  // Don't count time spent in a timed out Suspense subtree as part of the base duration.
22392                  var primaryChildFragment = workInProgress.child;
22393  
22394                  if (primaryChildFragment !== null) {
22395                    // $FlowFixMe Flow doesn't support type casting in combination with the -= operator
22396                    workInProgress.treeBaseDuration -= primaryChildFragment.treeBaseDuration;
22397                  }
22398                }
22399              }
22400            }
22401  
22402            return null;
22403          }
22404  
22405        case HostPortal:
22406          popHostContainer(workInProgress);
22407          updateHostContainer(current, workInProgress);
22408  
22409          if (current === null) {
22410            preparePortalMount(workInProgress.stateNode.containerInfo);
22411          }
22412  
22413          bubbleProperties(workInProgress);
22414          return null;
22415  
22416        case ContextProvider:
22417          // Pop provider fiber
22418          var context = workInProgress.type._context;
22419          popProvider(context, workInProgress);
22420          bubbleProperties(workInProgress);
22421          return null;
22422  
22423        case IncompleteClassComponent:
22424          {
22425            // Same as class component case. I put it down here so that the tags are
22426            // sequential to ensure this switch is compiled to a jump table.
22427            var _Component = workInProgress.type;
22428  
22429            if (isContextProvider(_Component)) {
22430              popContext(workInProgress);
22431            }
22432  
22433            bubbleProperties(workInProgress);
22434            return null;
22435          }
22436  
22437        case SuspenseListComponent:
22438          {
22439            popSuspenseContext(workInProgress);
22440            var renderState = workInProgress.memoizedState;
22441  
22442            if (renderState === null) {
22443              // We're running in the default, "independent" mode.
22444              // We don't do anything in this mode.
22445              bubbleProperties(workInProgress);
22446              return null;
22447            }
22448  
22449            var didSuspendAlready = (workInProgress.flags & DidCapture) !== NoFlags;
22450            var renderedTail = renderState.rendering;
22451  
22452            if (renderedTail === null) {
22453              // We just rendered the head.
22454              if (!didSuspendAlready) {
22455                // This is the first pass. We need to figure out if anything is still
22456                // suspended in the rendered set.
22457                // If new content unsuspended, but there's still some content that
22458                // didn't. Then we need to do a second pass that forces everything
22459                // to keep showing their fallbacks.
22460                // We might be suspended if something in this render pass suspended, or
22461                // something in the previous committed pass suspended. Otherwise,
22462                // there's no chance so we can skip the expensive call to
22463                // findFirstSuspended.
22464                var cannotBeSuspended = renderHasNotSuspendedYet() && (current === null || (current.flags & DidCapture) === NoFlags);
22465  
22466                if (!cannotBeSuspended) {
22467                  var row = workInProgress.child;
22468  
22469                  while (row !== null) {
22470                    var suspended = findFirstSuspended(row);
22471  
22472                    if (suspended !== null) {
22473                      didSuspendAlready = true;
22474                      workInProgress.flags |= DidCapture;
22475                      cutOffTailIfNeeded(renderState, false); // If this is a newly suspended tree, it might not get committed as
22476                      // part of the second pass. In that case nothing will subscribe to
22477                      // its thenables. Instead, we'll transfer its thenables to the
22478                      // SuspenseList so that it can retry if they resolve.
22479                      // There might be multiple of these in the list but since we're
22480                      // going to wait for all of them anyway, it doesn't really matter
22481                      // which ones gets to ping. In theory we could get clever and keep
22482                      // track of how many dependencies remain but it gets tricky because
22483                      // in the meantime, we can add/remove/change items and dependencies.
22484                      // We might bail out of the loop before finding any but that
22485                      // doesn't matter since that means that the other boundaries that
22486                      // we did find already has their listeners attached.
22487  
22488                      var newThenables = suspended.updateQueue;
22489  
22490                      if (newThenables !== null) {
22491                        workInProgress.updateQueue = newThenables;
22492                        workInProgress.flags |= Update;
22493                      } // Rerender the whole list, but this time, we'll force fallbacks
22494                      // to stay in place.
22495                      // Reset the effect flags before doing the second pass since that's now invalid.
22496                      // Reset the child fibers to their original state.
22497  
22498  
22499                      workInProgress.subtreeFlags = NoFlags;
22500                      resetChildFibers(workInProgress, renderLanes); // Set up the Suspense Context to force suspense and immediately
22501                      // rerender the children.
22502  
22503                      pushSuspenseContext(workInProgress, setShallowSuspenseContext(suspenseStackCursor.current, ForceSuspenseFallback)); // Don't bubble properties in this case.
22504  
22505                      return workInProgress.child;
22506                    }
22507  
22508                    row = row.sibling;
22509                  }
22510                }
22511  
22512                if (renderState.tail !== null && now() > getRenderTargetTime()) {
22513                  // We have already passed our CPU deadline but we still have rows
22514                  // left in the tail. We'll just give up further attempts to render
22515                  // the main content and only render fallbacks.
22516                  workInProgress.flags |= DidCapture;
22517                  didSuspendAlready = true;
22518                  cutOffTailIfNeeded(renderState, false); // Since nothing actually suspended, there will nothing to ping this
22519                  // to get it started back up to attempt the next item. While in terms
22520                  // of priority this work has the same priority as this current render,
22521                  // it's not part of the same transition once the transition has
22522                  // committed. If it's sync, we still want to yield so that it can be
22523                  // painted. Conceptually, this is really the same as pinging.
22524                  // We can use any RetryLane even if it's the one currently rendering
22525                  // since we're leaving it behind on this node.
22526  
22527                  workInProgress.lanes = SomeRetryLane;
22528                }
22529              } else {
22530                cutOffTailIfNeeded(renderState, false);
22531              } // Next we're going to render the tail.
22532  
22533            } else {
22534              // Append the rendered row to the child list.
22535              if (!didSuspendAlready) {
22536                var _suspended = findFirstSuspended(renderedTail);
22537  
22538                if (_suspended !== null) {
22539                  workInProgress.flags |= DidCapture;
22540                  didSuspendAlready = true; // Ensure we transfer the update queue to the parent so that it doesn't
22541                  // get lost if this row ends up dropped during a second pass.
22542  
22543                  var _newThenables = _suspended.updateQueue;
22544  
22545                  if (_newThenables !== null) {
22546                    workInProgress.updateQueue = _newThenables;
22547                    workInProgress.flags |= Update;
22548                  }
22549  
22550                  cutOffTailIfNeeded(renderState, true); // This might have been modified.
22551  
22552                  if (renderState.tail === null && renderState.tailMode === 'hidden' && !renderedTail.alternate && !getIsHydrating() // We don't cut it if we're hydrating.
22553                  ) {
22554                      // We're done.
22555                      bubbleProperties(workInProgress);
22556                      return null;
22557                    }
22558                } else if ( // The time it took to render last row is greater than the remaining
22559                // time we have to render. So rendering one more row would likely
22560                // exceed it.
22561                now() * 2 - renderState.renderingStartTime > getRenderTargetTime() && renderLanes !== OffscreenLane) {
22562                  // We have now passed our CPU deadline and we'll just give up further
22563                  // attempts to render the main content and only render fallbacks.
22564                  // The assumption is that this is usually faster.
22565                  workInProgress.flags |= DidCapture;
22566                  didSuspendAlready = true;
22567                  cutOffTailIfNeeded(renderState, false); // Since nothing actually suspended, there will nothing to ping this
22568                  // to get it started back up to attempt the next item. While in terms
22569                  // of priority this work has the same priority as this current render,
22570                  // it's not part of the same transition once the transition has
22571                  // committed. If it's sync, we still want to yield so that it can be
22572                  // painted. Conceptually, this is really the same as pinging.
22573                  // We can use any RetryLane even if it's the one currently rendering
22574                  // since we're leaving it behind on this node.
22575  
22576                  workInProgress.lanes = SomeRetryLane;
22577                }
22578              }
22579  
22580              if (renderState.isBackwards) {
22581                // The effect list of the backwards tail will have been added
22582                // to the end. This breaks the guarantee that life-cycles fire in
22583                // sibling order but that isn't a strong guarantee promised by React.
22584                // Especially since these might also just pop in during future commits.
22585                // Append to the beginning of the list.
22586                renderedTail.sibling = workInProgress.child;
22587                workInProgress.child = renderedTail;
22588              } else {
22589                var previousSibling = renderState.last;
22590  
22591                if (previousSibling !== null) {
22592                  previousSibling.sibling = renderedTail;
22593                } else {
22594                  workInProgress.child = renderedTail;
22595                }
22596  
22597                renderState.last = renderedTail;
22598              }
22599            }
22600  
22601            if (renderState.tail !== null) {
22602              // We still have tail rows to render.
22603              // Pop a row.
22604              var next = renderState.tail;
22605              renderState.rendering = next;
22606              renderState.tail = next.sibling;
22607              renderState.renderingStartTime = now();
22608              next.sibling = null; // Restore the context.
22609              // TODO: We can probably just avoid popping it instead and only
22610              // setting it the first time we go from not suspended to suspended.
22611  
22612              var suspenseContext = suspenseStackCursor.current;
22613  
22614              if (didSuspendAlready) {
22615                suspenseContext = setShallowSuspenseContext(suspenseContext, ForceSuspenseFallback);
22616              } else {
22617                suspenseContext = setDefaultShallowSuspenseContext(suspenseContext);
22618              }
22619  
22620              pushSuspenseContext(workInProgress, suspenseContext); // Do a pass over the next row.
22621              // Don't bubble properties in this case.
22622  
22623              return next;
22624            }
22625  
22626            bubbleProperties(workInProgress);
22627            return null;
22628          }
22629  
22630        case ScopeComponent:
22631          {
22632  
22633            break;
22634          }
22635  
22636        case OffscreenComponent:
22637        case LegacyHiddenComponent:
22638          {
22639            popRenderLanes(workInProgress);
22640            var _nextState = workInProgress.memoizedState;
22641            var nextIsHidden = _nextState !== null;
22642  
22643            if (current !== null) {
22644              var _prevState = current.memoizedState;
22645              var prevIsHidden = _prevState !== null;
22646  
22647              if (prevIsHidden !== nextIsHidden && ( // LegacyHidden doesn't do any hiding — it only pre-renders.
22648              !enableLegacyHidden )) {
22649                workInProgress.flags |= Visibility;
22650              }
22651            }
22652  
22653            if (!nextIsHidden || (workInProgress.mode & ConcurrentMode) === NoMode) {
22654              bubbleProperties(workInProgress);
22655            } else {
22656              // Don't bubble properties for hidden children unless we're rendering
22657              // at offscreen priority.
22658              if (includesSomeLane(subtreeRenderLanes, OffscreenLane)) {
22659                bubbleProperties(workInProgress);
22660  
22661                {
22662                  // Check if there was an insertion or update in the hidden subtree.
22663                  // If so, we need to hide those nodes in the commit phase, so
22664                  // schedule a visibility effect.
22665                  if ( workInProgress.subtreeFlags & (Placement | Update)) {
22666                    workInProgress.flags |= Visibility;
22667                  }
22668                }
22669              }
22670            }
22671            return null;
22672          }
22673  
22674        case CacheComponent:
22675          {
22676  
22677            return null;
22678          }
22679  
22680        case TracingMarkerComponent:
22681          {
22682  
22683            return null;
22684          }
22685      }
22686  
22687      throw new Error("Unknown unit of work tag (" + workInProgress.tag + "). This error is likely caused by a bug in " + 'React. Please file an issue.');
22688    }
22689  
22690    function unwindWork(current, workInProgress, renderLanes) {
22691      // Note: This intentionally doesn't check if we're hydrating because comparing
22692      // to the current tree provider fiber is just as fast and less error-prone.
22693      // Ideally we would have a special version of the work loop only
22694      // for hydration.
22695      popTreeContext(workInProgress);
22696  
22697      switch (workInProgress.tag) {
22698        case ClassComponent:
22699          {
22700            var Component = workInProgress.type;
22701  
22702            if (isContextProvider(Component)) {
22703              popContext(workInProgress);
22704            }
22705  
22706            var flags = workInProgress.flags;
22707  
22708            if (flags & ShouldCapture) {
22709              workInProgress.flags = flags & ~ShouldCapture | DidCapture;
22710  
22711              if ( (workInProgress.mode & ProfileMode) !== NoMode) {
22712                transferActualDuration(workInProgress);
22713              }
22714  
22715              return workInProgress;
22716            }
22717  
22718            return null;
22719          }
22720  
22721        case HostRoot:
22722          {
22723            var root = workInProgress.stateNode;
22724            popHostContainer(workInProgress);
22725            popTopLevelContextObject(workInProgress);
22726            resetWorkInProgressVersions();
22727            var _flags = workInProgress.flags;
22728  
22729            if ((_flags & ShouldCapture) !== NoFlags && (_flags & DidCapture) === NoFlags) {
22730              // There was an error during render that wasn't captured by a suspense
22731              // boundary. Do a second pass on the root to unmount the children.
22732              workInProgress.flags = _flags & ~ShouldCapture | DidCapture;
22733              return workInProgress;
22734            } // We unwound to the root without completing it. Exit.
22735  
22736  
22737            return null;
22738          }
22739  
22740        case HostComponent:
22741          {
22742            // TODO: popHydrationState
22743            popHostContext(workInProgress);
22744            return null;
22745          }
22746  
22747        case SuspenseComponent:
22748          {
22749            popSuspenseContext(workInProgress);
22750            var suspenseState = workInProgress.memoizedState;
22751  
22752            if (suspenseState !== null && suspenseState.dehydrated !== null) {
22753              if (workInProgress.alternate === null) {
22754                throw new Error('Threw in newly mounted dehydrated component. This is likely a bug in ' + 'React. Please file an issue.');
22755              }
22756  
22757              resetHydrationState();
22758            }
22759  
22760            var _flags2 = workInProgress.flags;
22761  
22762            if (_flags2 & ShouldCapture) {
22763              workInProgress.flags = _flags2 & ~ShouldCapture | DidCapture; // Captured a suspense effect. Re-render the boundary.
22764  
22765              if ( (workInProgress.mode & ProfileMode) !== NoMode) {
22766                transferActualDuration(workInProgress);
22767              }
22768  
22769              return workInProgress;
22770            }
22771  
22772            return null;
22773          }
22774  
22775        case SuspenseListComponent:
22776          {
22777            popSuspenseContext(workInProgress); // SuspenseList doesn't actually catch anything. It should've been
22778            // caught by a nested boundary. If not, it should bubble through.
22779  
22780            return null;
22781          }
22782  
22783        case HostPortal:
22784          popHostContainer(workInProgress);
22785          return null;
22786  
22787        case ContextProvider:
22788          var context = workInProgress.type._context;
22789          popProvider(context, workInProgress);
22790          return null;
22791  
22792        case OffscreenComponent:
22793        case LegacyHiddenComponent:
22794          popRenderLanes(workInProgress);
22795          return null;
22796  
22797        case CacheComponent:
22798  
22799          return null;
22800  
22801        default:
22802          return null;
22803      }
22804    }
22805  
22806    function unwindInterruptedWork(current, interruptedWork, renderLanes) {
22807      // Note: This intentionally doesn't check if we're hydrating because comparing
22808      // to the current tree provider fiber is just as fast and less error-prone.
22809      // Ideally we would have a special version of the work loop only
22810      // for hydration.
22811      popTreeContext(interruptedWork);
22812  
22813      switch (interruptedWork.tag) {
22814        case ClassComponent:
22815          {
22816            var childContextTypes = interruptedWork.type.childContextTypes;
22817  
22818            if (childContextTypes !== null && childContextTypes !== undefined) {
22819              popContext(interruptedWork);
22820            }
22821  
22822            break;
22823          }
22824  
22825        case HostRoot:
22826          {
22827            var root = interruptedWork.stateNode;
22828            popHostContainer(interruptedWork);
22829            popTopLevelContextObject(interruptedWork);
22830            resetWorkInProgressVersions();
22831            break;
22832          }
22833  
22834        case HostComponent:
22835          {
22836            popHostContext(interruptedWork);
22837            break;
22838          }
22839  
22840        case HostPortal:
22841          popHostContainer(interruptedWork);
22842          break;
22843  
22844        case SuspenseComponent:
22845          popSuspenseContext(interruptedWork);
22846          break;
22847  
22848        case SuspenseListComponent:
22849          popSuspenseContext(interruptedWork);
22850          break;
22851  
22852        case ContextProvider:
22853          var context = interruptedWork.type._context;
22854          popProvider(context, interruptedWork);
22855          break;
22856  
22857        case OffscreenComponent:
22858        case LegacyHiddenComponent:
22859          popRenderLanes(interruptedWork);
22860          break;
22861      }
22862    }
22863  
22864    var didWarnAboutUndefinedSnapshotBeforeUpdate = null;
22865  
22866    {
22867      didWarnAboutUndefinedSnapshotBeforeUpdate = new Set();
22868    } // Used during the commit phase to track the state of the Offscreen component stack.
22869    // Allows us to avoid traversing the return path to find the nearest Offscreen ancestor.
22870    // Only used when enableSuspenseLayoutEffectSemantics is enabled.
22871  
22872  
22873    var offscreenSubtreeIsHidden = false;
22874    var offscreenSubtreeWasHidden = false;
22875    var PossiblyWeakSet = typeof WeakSet === 'function' ? WeakSet : Set;
22876    var nextEffect = null; // Used for Profiling builds to track updaters.
22877  
22878    var inProgressLanes = null;
22879    var inProgressRoot = null;
22880    function reportUncaughtErrorInDEV(error) {
22881      // Wrapping each small part of the commit phase into a guarded
22882      // callback is a bit too slow (https://github.com/facebook/react/pull/21666).
22883      // But we rely on it to surface errors to DEV tools like overlays
22884      // (https://github.com/facebook/react/issues/21712).
22885      // As a compromise, rethrow only caught errors in a guard.
22886      {
22887        invokeGuardedCallback(null, function () {
22888          throw error;
22889        });
22890        clearCaughtError();
22891      }
22892    }
22893  
22894    var callComponentWillUnmountWithTimer = function (current, instance) {
22895      instance.props = current.memoizedProps;
22896      instance.state = current.memoizedState;
22897  
22898      if ( current.mode & ProfileMode) {
22899        try {
22900          startLayoutEffectTimer();
22901          instance.componentWillUnmount();
22902        } finally {
22903          recordLayoutEffectDuration(current);
22904        }
22905      } else {
22906        instance.componentWillUnmount();
22907      }
22908    }; // Capture errors so they don't interrupt mounting.
22909  
22910  
22911    function safelyCallCommitHookLayoutEffectListMount(current, nearestMountedAncestor) {
22912      try {
22913        commitHookEffectListMount(Layout, current);
22914      } catch (error) {
22915        captureCommitPhaseError(current, nearestMountedAncestor, error);
22916      }
22917    } // Capture errors so they don't interrupt unmounting.
22918  
22919  
22920    function safelyCallComponentWillUnmount(current, nearestMountedAncestor, instance) {
22921      try {
22922        callComponentWillUnmountWithTimer(current, instance);
22923      } catch (error) {
22924        captureCommitPhaseError(current, nearestMountedAncestor, error);
22925      }
22926    } // Capture errors so they don't interrupt mounting.
22927  
22928  
22929    function safelyCallComponentDidMount(current, nearestMountedAncestor, instance) {
22930      try {
22931        instance.componentDidMount();
22932      } catch (error) {
22933        captureCommitPhaseError(current, nearestMountedAncestor, error);
22934      }
22935    } // Capture errors so they don't interrupt mounting.
22936  
22937  
22938    function safelyAttachRef(current, nearestMountedAncestor) {
22939      try {
22940        commitAttachRef(current);
22941      } catch (error) {
22942        captureCommitPhaseError(current, nearestMountedAncestor, error);
22943      }
22944    }
22945  
22946    function safelyDetachRef(current, nearestMountedAncestor) {
22947      var ref = current.ref;
22948  
22949      if (ref !== null) {
22950        if (typeof ref === 'function') {
22951          var retVal;
22952  
22953          try {
22954            if (enableProfilerTimer && enableProfilerCommitHooks && current.mode & ProfileMode) {
22955              try {
22956                startLayoutEffectTimer();
22957                retVal = ref(null);
22958              } finally {
22959                recordLayoutEffectDuration(current);
22960              }
22961            } else {
22962              retVal = ref(null);
22963            }
22964          } catch (error) {
22965            captureCommitPhaseError(current, nearestMountedAncestor, error);
22966          }
22967  
22968          {
22969            if (typeof retVal === 'function') {
22970              error('Unexpected return value from a callback ref in %s. ' + 'A callback ref should not return a function.', getComponentNameFromFiber(current));
22971            }
22972          }
22973        } else {
22974          ref.current = null;
22975        }
22976      }
22977    }
22978  
22979    function safelyCallDestroy(current, nearestMountedAncestor, destroy) {
22980      try {
22981        destroy();
22982      } catch (error) {
22983        captureCommitPhaseError(current, nearestMountedAncestor, error);
22984      }
22985    }
22986  
22987    var focusedInstanceHandle = null;
22988    var shouldFireAfterActiveInstanceBlur = false;
22989    function commitBeforeMutationEffects(root, firstChild) {
22990      focusedInstanceHandle = prepareForCommit(root.containerInfo);
22991      nextEffect = firstChild;
22992      commitBeforeMutationEffects_begin(); // We no longer need to track the active instance fiber
22993  
22994      var shouldFire = shouldFireAfterActiveInstanceBlur;
22995      shouldFireAfterActiveInstanceBlur = false;
22996      focusedInstanceHandle = null;
22997      return shouldFire;
22998    }
22999  
23000    function commitBeforeMutationEffects_begin() {
23001      while (nextEffect !== null) {
23002        var fiber = nextEffect; // This phase is only used for beforeActiveInstanceBlur.
23003  
23004        var child = fiber.child;
23005  
23006        if ((fiber.subtreeFlags & BeforeMutationMask) !== NoFlags && child !== null) {
23007          child.return = fiber;
23008          nextEffect = child;
23009        } else {
23010          commitBeforeMutationEffects_complete();
23011        }
23012      }
23013    }
23014  
23015    function commitBeforeMutationEffects_complete() {
23016      while (nextEffect !== null) {
23017        var fiber = nextEffect;
23018        setCurrentFiber(fiber);
23019  
23020        try {
23021          commitBeforeMutationEffectsOnFiber(fiber);
23022        } catch (error) {
23023          captureCommitPhaseError(fiber, fiber.return, error);
23024        }
23025  
23026        resetCurrentFiber();
23027        var sibling = fiber.sibling;
23028  
23029        if (sibling !== null) {
23030          sibling.return = fiber.return;
23031          nextEffect = sibling;
23032          return;
23033        }
23034  
23035        nextEffect = fiber.return;
23036      }
23037    }
23038  
23039    function commitBeforeMutationEffectsOnFiber(finishedWork) {
23040      var current = finishedWork.alternate;
23041      var flags = finishedWork.flags;
23042  
23043      if ((flags & Snapshot) !== NoFlags) {
23044        setCurrentFiber(finishedWork);
23045  
23046        switch (finishedWork.tag) {
23047          case FunctionComponent:
23048          case ForwardRef:
23049          case SimpleMemoComponent:
23050            {
23051              break;
23052            }
23053  
23054          case ClassComponent:
23055            {
23056              if (current !== null) {
23057                var prevProps = current.memoizedProps;
23058                var prevState = current.memoizedState;
23059                var instance = finishedWork.stateNode; // We could update instance props and state here,
23060                // but instead we rely on them being set during last render.
23061                // TODO: revisit this when we implement resuming.
23062  
23063                {
23064                  if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
23065                    if (instance.props !== finishedWork.memoizedProps) {
23066                      error('Expected %s props to match memoized props before ' + 'getSnapshotBeforeUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
23067                    }
23068  
23069                    if (instance.state !== finishedWork.memoizedState) {
23070                      error('Expected %s state to match memoized state before ' + 'getSnapshotBeforeUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
23071                    }
23072                  }
23073                }
23074  
23075                var snapshot = instance.getSnapshotBeforeUpdate(finishedWork.elementType === finishedWork.type ? prevProps : resolveDefaultProps(finishedWork.type, prevProps), prevState);
23076  
23077                {
23078                  var didWarnSet = didWarnAboutUndefinedSnapshotBeforeUpdate;
23079  
23080                  if (snapshot === undefined && !didWarnSet.has(finishedWork.type)) {
23081                    didWarnSet.add(finishedWork.type);
23082  
23083                    error('%s.getSnapshotBeforeUpdate(): A snapshot value (or null) ' + 'must be returned. You have returned undefined.', getComponentNameFromFiber(finishedWork));
23084                  }
23085                }
23086  
23087                instance.__reactInternalSnapshotBeforeUpdate = snapshot;
23088              }
23089  
23090              break;
23091            }
23092  
23093          case HostRoot:
23094            {
23095              {
23096                var root = finishedWork.stateNode;
23097                clearContainer(root.containerInfo);
23098              }
23099  
23100              break;
23101            }
23102  
23103          case HostComponent:
23104          case HostText:
23105          case HostPortal:
23106          case IncompleteClassComponent:
23107            // Nothing to do for these component types
23108            break;
23109  
23110          default:
23111            {
23112              throw new Error('This unit of work tag should not have side-effects. This error is ' + 'likely caused by a bug in React. Please file an issue.');
23113            }
23114        }
23115  
23116        resetCurrentFiber();
23117      }
23118    }
23119  
23120    function commitHookEffectListUnmount(flags, finishedWork, nearestMountedAncestor) {
23121      var updateQueue = finishedWork.updateQueue;
23122      var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null;
23123  
23124      if (lastEffect !== null) {
23125        var firstEffect = lastEffect.next;
23126        var effect = firstEffect;
23127  
23128        do {
23129          if ((effect.tag & flags) === flags) {
23130            // Unmount
23131            var destroy = effect.destroy;
23132            effect.destroy = undefined;
23133  
23134            if (destroy !== undefined) {
23135              {
23136                if ((flags & Passive$1) !== NoFlags$1) {
23137                  markComponentPassiveEffectUnmountStarted(finishedWork);
23138                } else if ((flags & Layout) !== NoFlags$1) {
23139                  markComponentLayoutEffectUnmountStarted(finishedWork);
23140                }
23141              }
23142  
23143              {
23144                if ((flags & Insertion) !== NoFlags$1) {
23145                  setIsRunningInsertionEffect(true);
23146                }
23147              }
23148  
23149              safelyCallDestroy(finishedWork, nearestMountedAncestor, destroy);
23150  
23151              {
23152                if ((flags & Insertion) !== NoFlags$1) {
23153                  setIsRunningInsertionEffect(false);
23154                }
23155              }
23156  
23157              {
23158                if ((flags & Passive$1) !== NoFlags$1) {
23159                  markComponentPassiveEffectUnmountStopped();
23160                } else if ((flags & Layout) !== NoFlags$1) {
23161                  markComponentLayoutEffectUnmountStopped();
23162                }
23163              }
23164            }
23165          }
23166  
23167          effect = effect.next;
23168        } while (effect !== firstEffect);
23169      }
23170    }
23171  
23172    function commitHookEffectListMount(flags, finishedWork) {
23173      var updateQueue = finishedWork.updateQueue;
23174      var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null;
23175  
23176      if (lastEffect !== null) {
23177        var firstEffect = lastEffect.next;
23178        var effect = firstEffect;
23179  
23180        do {
23181          if ((effect.tag & flags) === flags) {
23182            {
23183              if ((flags & Passive$1) !== NoFlags$1) {
23184                markComponentPassiveEffectMountStarted(finishedWork);
23185              } else if ((flags & Layout) !== NoFlags$1) {
23186                markComponentLayoutEffectMountStarted(finishedWork);
23187              }
23188            } // Mount
23189  
23190  
23191            var create = effect.create;
23192  
23193            {
23194              if ((flags & Insertion) !== NoFlags$1) {
23195                setIsRunningInsertionEffect(true);
23196              }
23197            }
23198  
23199            effect.destroy = create();
23200  
23201            {
23202              if ((flags & Insertion) !== NoFlags$1) {
23203                setIsRunningInsertionEffect(false);
23204              }
23205            }
23206  
23207            {
23208              if ((flags & Passive$1) !== NoFlags$1) {
23209                markComponentPassiveEffectMountStopped();
23210              } else if ((flags & Layout) !== NoFlags$1) {
23211                markComponentLayoutEffectMountStopped();
23212              }
23213            }
23214  
23215            {
23216              var destroy = effect.destroy;
23217  
23218              if (destroy !== undefined && typeof destroy !== 'function') {
23219                var hookName = void 0;
23220  
23221                if ((effect.tag & Layout) !== NoFlags) {
23222                  hookName = 'useLayoutEffect';
23223                } else if ((effect.tag & Insertion) !== NoFlags) {
23224                  hookName = 'useInsertionEffect';
23225                } else {
23226                  hookName = 'useEffect';
23227                }
23228  
23229                var addendum = void 0;
23230  
23231                if (destroy === null) {
23232                  addendum = ' You returned null. If your effect does not require clean ' + 'up, return undefined (or nothing).';
23233                } else if (typeof destroy.then === 'function') {
23234                  addendum = '\n\nIt looks like you wrote ' + hookName + '(async () => ...) or returned a Promise. ' + 'Instead, write the async function inside your effect ' + 'and call it immediately:\n\n' + hookName + '(() => {\n' + '  async function fetchData() {\n' + '    // You can await here\n' + '    const response = await MyAPI.getData(someId);\n' + '    // ...\n' + '  }\n' + '  fetchData();\n' + "}, [someId]); // Or [] if effect doesn't need props or state\n\n" + 'Learn more about data fetching with Hooks: https://reactjs.org/link/hooks-data-fetching';
23235                } else {
23236                  addendum = ' You returned: ' + destroy;
23237                }
23238  
23239                error('%s must not return anything besides a function, ' + 'which is used for clean-up.%s', hookName, addendum);
23240              }
23241            }
23242          }
23243  
23244          effect = effect.next;
23245        } while (effect !== firstEffect);
23246      }
23247    }
23248  
23249    function commitPassiveEffectDurations(finishedRoot, finishedWork) {
23250      {
23251        // Only Profilers with work in their subtree will have an Update effect scheduled.
23252        if ((finishedWork.flags & Update) !== NoFlags) {
23253          switch (finishedWork.tag) {
23254            case Profiler:
23255              {
23256                var passiveEffectDuration = finishedWork.stateNode.passiveEffectDuration;
23257                var _finishedWork$memoize = finishedWork.memoizedProps,
23258                    id = _finishedWork$memoize.id,
23259                    onPostCommit = _finishedWork$memoize.onPostCommit; // This value will still reflect the previous commit phase.
23260                // It does not get reset until the start of the next commit phase.
23261  
23262                var commitTime = getCommitTime();
23263                var phase = finishedWork.alternate === null ? 'mount' : 'update';
23264  
23265                {
23266                  if (isCurrentUpdateNested()) {
23267                    phase = 'nested-update';
23268                  }
23269                }
23270  
23271                if (typeof onPostCommit === 'function') {
23272                  onPostCommit(id, phase, passiveEffectDuration, commitTime);
23273                } // Bubble times to the next nearest ancestor Profiler.
23274                // After we process that Profiler, we'll bubble further up.
23275  
23276  
23277                var parentFiber = finishedWork.return;
23278  
23279                outer: while (parentFiber !== null) {
23280                  switch (parentFiber.tag) {
23281                    case HostRoot:
23282                      var root = parentFiber.stateNode;
23283                      root.passiveEffectDuration += passiveEffectDuration;
23284                      break outer;
23285  
23286                    case Profiler:
23287                      var parentStateNode = parentFiber.stateNode;
23288                      parentStateNode.passiveEffectDuration += passiveEffectDuration;
23289                      break outer;
23290                  }
23291  
23292                  parentFiber = parentFiber.return;
23293                }
23294  
23295                break;
23296              }
23297          }
23298        }
23299      }
23300    }
23301  
23302    function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork, committedLanes) {
23303      if ((finishedWork.flags & LayoutMask) !== NoFlags) {
23304        switch (finishedWork.tag) {
23305          case FunctionComponent:
23306          case ForwardRef:
23307          case SimpleMemoComponent:
23308            {
23309              if ( !offscreenSubtreeWasHidden) {
23310                // At this point layout effects have already been destroyed (during mutation phase).
23311                // This is done to prevent sibling component effects from interfering with each other,
23312                // e.g. a destroy function in one component should never override a ref set
23313                // by a create function in another component during the same commit.
23314                if ( finishedWork.mode & ProfileMode) {
23315                  try {
23316                    startLayoutEffectTimer();
23317                    commitHookEffectListMount(Layout | HasEffect, finishedWork);
23318                  } finally {
23319                    recordLayoutEffectDuration(finishedWork);
23320                  }
23321                } else {
23322                  commitHookEffectListMount(Layout | HasEffect, finishedWork);
23323                }
23324              }
23325  
23326              break;
23327            }
23328  
23329          case ClassComponent:
23330            {
23331              var instance = finishedWork.stateNode;
23332  
23333              if (finishedWork.flags & Update) {
23334                if (!offscreenSubtreeWasHidden) {
23335                  if (current === null) {
23336                    // We could update instance props and state here,
23337                    // but instead we rely on them being set during last render.
23338                    // TODO: revisit this when we implement resuming.
23339                    {
23340                      if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
23341                        if (instance.props !== finishedWork.memoizedProps) {
23342                          error('Expected %s props to match memoized props before ' + 'componentDidMount. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
23343                        }
23344  
23345                        if (instance.state !== finishedWork.memoizedState) {
23346                          error('Expected %s state to match memoized state before ' + 'componentDidMount. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
23347                        }
23348                      }
23349                    }
23350  
23351                    if ( finishedWork.mode & ProfileMode) {
23352                      try {
23353                        startLayoutEffectTimer();
23354                        instance.componentDidMount();
23355                      } finally {
23356                        recordLayoutEffectDuration(finishedWork);
23357                      }
23358                    } else {
23359                      instance.componentDidMount();
23360                    }
23361                  } else {
23362                    var prevProps = finishedWork.elementType === finishedWork.type ? current.memoizedProps : resolveDefaultProps(finishedWork.type, current.memoizedProps);
23363                    var prevState = current.memoizedState; // We could update instance props and state here,
23364                    // but instead we rely on them being set during last render.
23365                    // TODO: revisit this when we implement resuming.
23366  
23367                    {
23368                      if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
23369                        if (instance.props !== finishedWork.memoizedProps) {
23370                          error('Expected %s props to match memoized props before ' + 'componentDidUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
23371                        }
23372  
23373                        if (instance.state !== finishedWork.memoizedState) {
23374                          error('Expected %s state to match memoized state before ' + 'componentDidUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
23375                        }
23376                      }
23377                    }
23378  
23379                    if ( finishedWork.mode & ProfileMode) {
23380                      try {
23381                        startLayoutEffectTimer();
23382                        instance.componentDidUpdate(prevProps, prevState, instance.__reactInternalSnapshotBeforeUpdate);
23383                      } finally {
23384                        recordLayoutEffectDuration(finishedWork);
23385                      }
23386                    } else {
23387                      instance.componentDidUpdate(prevProps, prevState, instance.__reactInternalSnapshotBeforeUpdate);
23388                    }
23389                  }
23390                }
23391              } // TODO: I think this is now always non-null by the time it reaches the
23392              // commit phase. Consider removing the type check.
23393  
23394  
23395              var updateQueue = finishedWork.updateQueue;
23396  
23397              if (updateQueue !== null) {
23398                {
23399                  if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
23400                    if (instance.props !== finishedWork.memoizedProps) {
23401                      error('Expected %s props to match memoized props before ' + 'processing the update queue. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
23402                    }
23403  
23404                    if (instance.state !== finishedWork.memoizedState) {
23405                      error('Expected %s state to match memoized state before ' + 'processing the update queue. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
23406                    }
23407                  }
23408                } // We could update instance props and state here,
23409                // but instead we rely on them being set during last render.
23410                // TODO: revisit this when we implement resuming.
23411  
23412  
23413                commitUpdateQueue(finishedWork, updateQueue, instance);
23414              }
23415  
23416              break;
23417            }
23418  
23419          case HostRoot:
23420            {
23421              // TODO: I think this is now always non-null by the time it reaches the
23422              // commit phase. Consider removing the type check.
23423              var _updateQueue = finishedWork.updateQueue;
23424  
23425              if (_updateQueue !== null) {
23426                var _instance = null;
23427  
23428                if (finishedWork.child !== null) {
23429                  switch (finishedWork.child.tag) {
23430                    case HostComponent:
23431                      _instance = getPublicInstance(finishedWork.child.stateNode);
23432                      break;
23433  
23434                    case ClassComponent:
23435                      _instance = finishedWork.child.stateNode;
23436                      break;
23437                  }
23438                }
23439  
23440                commitUpdateQueue(finishedWork, _updateQueue, _instance);
23441              }
23442  
23443              break;
23444            }
23445  
23446          case HostComponent:
23447            {
23448              var _instance2 = finishedWork.stateNode; // Renderers may schedule work to be done after host components are mounted
23449              // (eg DOM renderer may schedule auto-focus for inputs and form controls).
23450              // These effects should only be committed when components are first mounted,
23451              // aka when there is no current/alternate.
23452  
23453              if (current === null && finishedWork.flags & Update) {
23454                var type = finishedWork.type;
23455                var props = finishedWork.memoizedProps;
23456                commitMount(_instance2, type, props);
23457              }
23458  
23459              break;
23460            }
23461  
23462          case HostText:
23463            {
23464              // We have no life-cycles associated with text.
23465              break;
23466            }
23467  
23468          case HostPortal:
23469            {
23470              // We have no life-cycles associated with portals.
23471              break;
23472            }
23473  
23474          case Profiler:
23475            {
23476              {
23477                var _finishedWork$memoize2 = finishedWork.memoizedProps,
23478                    onCommit = _finishedWork$memoize2.onCommit,
23479                    onRender = _finishedWork$memoize2.onRender;
23480                var effectDuration = finishedWork.stateNode.effectDuration;
23481                var commitTime = getCommitTime();
23482                var phase = current === null ? 'mount' : 'update';
23483  
23484                {
23485                  if (isCurrentUpdateNested()) {
23486                    phase = 'nested-update';
23487                  }
23488                }
23489  
23490                if (typeof onRender === 'function') {
23491                  onRender(finishedWork.memoizedProps.id, phase, finishedWork.actualDuration, finishedWork.treeBaseDuration, finishedWork.actualStartTime, commitTime);
23492                }
23493  
23494                {
23495                  if (typeof onCommit === 'function') {
23496                    onCommit(finishedWork.memoizedProps.id, phase, effectDuration, commitTime);
23497                  } // Schedule a passive effect for this Profiler to call onPostCommit hooks.
23498                  // This effect should be scheduled even if there is no onPostCommit callback for this Profiler,
23499                  // because the effect is also where times bubble to parent Profilers.
23500  
23501  
23502                  enqueuePendingPassiveProfilerEffect(finishedWork); // Propagate layout effect durations to the next nearest Profiler ancestor.
23503                  // Do not reset these values until the next render so DevTools has a chance to read them first.
23504  
23505                  var parentFiber = finishedWork.return;
23506  
23507                  outer: while (parentFiber !== null) {
23508                    switch (parentFiber.tag) {
23509                      case HostRoot:
23510                        var root = parentFiber.stateNode;
23511                        root.effectDuration += effectDuration;
23512                        break outer;
23513  
23514                      case Profiler:
23515                        var parentStateNode = parentFiber.stateNode;
23516                        parentStateNode.effectDuration += effectDuration;
23517                        break outer;
23518                    }
23519  
23520                    parentFiber = parentFiber.return;
23521                  }
23522                }
23523              }
23524  
23525              break;
23526            }
23527  
23528          case SuspenseComponent:
23529            {
23530              commitSuspenseHydrationCallbacks(finishedRoot, finishedWork);
23531              break;
23532            }
23533  
23534          case SuspenseListComponent:
23535          case IncompleteClassComponent:
23536          case ScopeComponent:
23537          case OffscreenComponent:
23538          case LegacyHiddenComponent:
23539          case TracingMarkerComponent:
23540            {
23541              break;
23542            }
23543  
23544          default:
23545            throw new Error('This unit of work tag should not have side-effects. This error is ' + 'likely caused by a bug in React. Please file an issue.');
23546        }
23547      }
23548  
23549      if ( !offscreenSubtreeWasHidden) {
23550        {
23551          if (finishedWork.flags & Ref) {
23552            commitAttachRef(finishedWork);
23553          }
23554        }
23555      }
23556    }
23557  
23558    function reappearLayoutEffectsOnFiber(node) {
23559      // Turn on layout effects in a tree that previously disappeared.
23560      // TODO (Offscreen) Check: flags & LayoutStatic
23561      switch (node.tag) {
23562        case FunctionComponent:
23563        case ForwardRef:
23564        case SimpleMemoComponent:
23565          {
23566            if ( node.mode & ProfileMode) {
23567              try {
23568                startLayoutEffectTimer();
23569                safelyCallCommitHookLayoutEffectListMount(node, node.return);
23570              } finally {
23571                recordLayoutEffectDuration(node);
23572              }
23573            } else {
23574              safelyCallCommitHookLayoutEffectListMount(node, node.return);
23575            }
23576  
23577            break;
23578          }
23579  
23580        case ClassComponent:
23581          {
23582            var instance = node.stateNode;
23583  
23584            if (typeof instance.componentDidMount === 'function') {
23585              safelyCallComponentDidMount(node, node.return, instance);
23586            }
23587  
23588            safelyAttachRef(node, node.return);
23589            break;
23590          }
23591  
23592        case HostComponent:
23593          {
23594            safelyAttachRef(node, node.return);
23595            break;
23596          }
23597      }
23598    }
23599  
23600    function hideOrUnhideAllChildren(finishedWork, isHidden) {
23601      // Only hide or unhide the top-most host nodes.
23602      var hostSubtreeRoot = null;
23603  
23604      {
23605        // We only have the top Fiber that was inserted but we need to recurse down its
23606        // children to find all the terminal nodes.
23607        var node = finishedWork;
23608  
23609        while (true) {
23610          if (node.tag === HostComponent) {
23611            if (hostSubtreeRoot === null) {
23612              hostSubtreeRoot = node;
23613  
23614              try {
23615                var instance = node.stateNode;
23616  
23617                if (isHidden) {
23618                  hideInstance(instance);
23619                } else {
23620                  unhideInstance(node.stateNode, node.memoizedProps);
23621                }
23622              } catch (error) {
23623                captureCommitPhaseError(finishedWork, finishedWork.return, error);
23624              }
23625            }
23626          } else if (node.tag === HostText) {
23627            if (hostSubtreeRoot === null) {
23628              try {
23629                var _instance3 = node.stateNode;
23630  
23631                if (isHidden) {
23632                  hideTextInstance(_instance3);
23633                } else {
23634                  unhideTextInstance(_instance3, node.memoizedProps);
23635                }
23636              } catch (error) {
23637                captureCommitPhaseError(finishedWork, finishedWork.return, error);
23638              }
23639            }
23640          } else if ((node.tag === OffscreenComponent || node.tag === LegacyHiddenComponent) && node.memoizedState !== null && node !== finishedWork) ; else if (node.child !== null) {
23641            node.child.return = node;
23642            node = node.child;
23643            continue;
23644          }
23645  
23646          if (node === finishedWork) {
23647            return;
23648          }
23649  
23650          while (node.sibling === null) {
23651            if (node.return === null || node.return === finishedWork) {
23652              return;
23653            }
23654  
23655            if (hostSubtreeRoot === node) {
23656              hostSubtreeRoot = null;
23657            }
23658  
23659            node = node.return;
23660          }
23661  
23662          if (hostSubtreeRoot === node) {
23663            hostSubtreeRoot = null;
23664          }
23665  
23666          node.sibling.return = node.return;
23667          node = node.sibling;
23668        }
23669      }
23670    }
23671  
23672    function commitAttachRef(finishedWork) {
23673      var ref = finishedWork.ref;
23674  
23675      if (ref !== null) {
23676        var instance = finishedWork.stateNode;
23677        var instanceToUse;
23678  
23679        switch (finishedWork.tag) {
23680          case HostComponent:
23681            instanceToUse = getPublicInstance(instance);
23682            break;
23683  
23684          default:
23685            instanceToUse = instance;
23686        } // Moved outside to ensure DCE works with this flag
23687  
23688        if (typeof ref === 'function') {
23689          var retVal;
23690  
23691          if ( finishedWork.mode & ProfileMode) {
23692            try {
23693              startLayoutEffectTimer();
23694              retVal = ref(instanceToUse);
23695            } finally {
23696              recordLayoutEffectDuration(finishedWork);
23697            }
23698          } else {
23699            retVal = ref(instanceToUse);
23700          }
23701  
23702          {
23703            if (typeof retVal === 'function') {
23704              error('Unexpected return value from a callback ref in %s. ' + 'A callback ref should not return a function.', getComponentNameFromFiber(finishedWork));
23705            }
23706          }
23707        } else {
23708          {
23709            if (!ref.hasOwnProperty('current')) {
23710              error('Unexpected ref object provided for %s. ' + 'Use either a ref-setter function or React.createRef().', getComponentNameFromFiber(finishedWork));
23711            }
23712          }
23713  
23714          ref.current = instanceToUse;
23715        }
23716      }
23717    }
23718  
23719    function detachFiberMutation(fiber) {
23720      // Cut off the return pointer to disconnect it from the tree.
23721      // This enables us to detect and warn against state updates on an unmounted component.
23722      // It also prevents events from bubbling from within disconnected components.
23723      //
23724      // Ideally, we should also clear the child pointer of the parent alternate to let this
23725      // get GC:ed but we don't know which for sure which parent is the current
23726      // one so we'll settle for GC:ing the subtree of this child.
23727      // This child itself will be GC:ed when the parent updates the next time.
23728      //
23729      // Note that we can't clear child or sibling pointers yet.
23730      // They're needed for passive effects and for findDOMNode.
23731      // We defer those fields, and all other cleanup, to the passive phase (see detachFiberAfterEffects).
23732      //
23733      // Don't reset the alternate yet, either. We need that so we can detach the
23734      // alternate's fields in the passive phase. Clearing the return pointer is
23735      // sufficient for findDOMNode semantics.
23736      var alternate = fiber.alternate;
23737  
23738      if (alternate !== null) {
23739        alternate.return = null;
23740      }
23741  
23742      fiber.return = null;
23743    }
23744  
23745    function detachFiberAfterEffects(fiber) {
23746      var alternate = fiber.alternate;
23747  
23748      if (alternate !== null) {
23749        fiber.alternate = null;
23750        detachFiberAfterEffects(alternate);
23751      } // Note: Defensively using negation instead of < in case
23752      // `deletedTreeCleanUpLevel` is undefined.
23753  
23754  
23755      {
23756        // Clear cyclical Fiber fields. This level alone is designed to roughly
23757        // approximate the planned Fiber refactor. In that world, `setState` will be
23758        // bound to a special "instance" object instead of a Fiber. The Instance
23759        // object will not have any of these fields. It will only be connected to
23760        // the fiber tree via a single link at the root. So if this level alone is
23761        // sufficient to fix memory issues, that bodes well for our plans.
23762        fiber.child = null;
23763        fiber.deletions = null;
23764        fiber.sibling = null; // The `stateNode` is cyclical because on host nodes it points to the host
23765        // tree, which has its own pointers to children, parents, and siblings.
23766        // The other host nodes also point back to fibers, so we should detach that
23767        // one, too.
23768  
23769        if (fiber.tag === HostComponent) {
23770          var hostInstance = fiber.stateNode;
23771  
23772          if (hostInstance !== null) {
23773            detachDeletedInstance(hostInstance);
23774          }
23775        }
23776  
23777        fiber.stateNode = null; // I'm intentionally not clearing the `return` field in this level. We
23778        // already disconnect the `return` pointer at the root of the deleted
23779        // subtree (in `detachFiberMutation`). Besides, `return` by itself is not
23780        // cyclical — it's only cyclical when combined with `child`, `sibling`, and
23781        // `alternate`. But we'll clear it in the next level anyway, just in case.
23782  
23783        {
23784          fiber._debugOwner = null;
23785        }
23786  
23787        {
23788          // Theoretically, nothing in here should be necessary, because we already
23789          // disconnected the fiber from the tree. So even if something leaks this
23790          // particular fiber, it won't leak anything else
23791          //
23792          // The purpose of this branch is to be super aggressive so we can measure
23793          // if there's any difference in memory impact. If there is, that could
23794          // indicate a React leak we don't know about.
23795          fiber.return = null;
23796          fiber.dependencies = null;
23797          fiber.memoizedProps = null;
23798          fiber.memoizedState = null;
23799          fiber.pendingProps = null;
23800          fiber.stateNode = null; // TODO: Move to `commitPassiveUnmountInsideDeletedTreeOnFiber` instead.
23801  
23802          fiber.updateQueue = null;
23803        }
23804      }
23805    }
23806  
23807    function getHostParentFiber(fiber) {
23808      var parent = fiber.return;
23809  
23810      while (parent !== null) {
23811        if (isHostParent(parent)) {
23812          return parent;
23813        }
23814  
23815        parent = parent.return;
23816      }
23817  
23818      throw new Error('Expected to find a host parent. This error is likely caused by a bug ' + 'in React. Please file an issue.');
23819    }
23820  
23821    function isHostParent(fiber) {
23822      return fiber.tag === HostComponent || fiber.tag === HostRoot || fiber.tag === HostPortal;
23823    }
23824  
23825    function getHostSibling(fiber) {
23826      // We're going to search forward into the tree until we find a sibling host
23827      // node. Unfortunately, if multiple insertions are done in a row we have to
23828      // search past them. This leads to exponential search for the next sibling.
23829      // TODO: Find a more efficient way to do this.
23830      var node = fiber;
23831  
23832      siblings: while (true) {
23833        // If we didn't find anything, let's try the next sibling.
23834        while (node.sibling === null) {
23835          if (node.return === null || isHostParent(node.return)) {
23836            // If we pop out of the root or hit the parent the fiber we are the
23837            // last sibling.
23838            return null;
23839          }
23840  
23841          node = node.return;
23842        }
23843  
23844        node.sibling.return = node.return;
23845        node = node.sibling;
23846  
23847        while (node.tag !== HostComponent && node.tag !== HostText && node.tag !== DehydratedFragment) {
23848          // If it is not host node and, we might have a host node inside it.
23849          // Try to search down until we find one.
23850          if (node.flags & Placement) {
23851            // If we don't have a child, try the siblings instead.
23852            continue siblings;
23853          } // If we don't have a child, try the siblings instead.
23854          // We also skip portals because they are not part of this host tree.
23855  
23856  
23857          if (node.child === null || node.tag === HostPortal) {
23858            continue siblings;
23859          } else {
23860            node.child.return = node;
23861            node = node.child;
23862          }
23863        } // Check if this host node is stable or about to be placed.
23864  
23865  
23866        if (!(node.flags & Placement)) {
23867          // Found it!
23868          return node.stateNode;
23869        }
23870      }
23871    }
23872  
23873    function commitPlacement(finishedWork) {
23874  
23875  
23876      var parentFiber = getHostParentFiber(finishedWork); // Note: these two variables *must* always be updated together.
23877  
23878      switch (parentFiber.tag) {
23879        case HostComponent:
23880          {
23881            var parent = parentFiber.stateNode;
23882  
23883            if (parentFiber.flags & ContentReset) {
23884              // Reset the text content of the parent before doing any insertions
23885              resetTextContent(parent); // Clear ContentReset from the effect tag
23886  
23887              parentFiber.flags &= ~ContentReset;
23888            }
23889  
23890            var before = getHostSibling(finishedWork); // We only have the top Fiber that was inserted but we need to recurse down its
23891            // children to find all the terminal nodes.
23892  
23893            insertOrAppendPlacementNode(finishedWork, before, parent);
23894            break;
23895          }
23896  
23897        case HostRoot:
23898        case HostPortal:
23899          {
23900            var _parent = parentFiber.stateNode.containerInfo;
23901  
23902            var _before = getHostSibling(finishedWork);
23903  
23904            insertOrAppendPlacementNodeIntoContainer(finishedWork, _before, _parent);
23905            break;
23906          }
23907        // eslint-disable-next-line-no-fallthrough
23908  
23909        default:
23910          throw new Error('Invalid host parent fiber. This error is likely caused by a bug ' + 'in React. Please file an issue.');
23911      }
23912    }
23913  
23914    function insertOrAppendPlacementNodeIntoContainer(node, before, parent) {
23915      var tag = node.tag;
23916      var isHost = tag === HostComponent || tag === HostText;
23917  
23918      if (isHost) {
23919        var stateNode = node.stateNode;
23920  
23921        if (before) {
23922          insertInContainerBefore(parent, stateNode, before);
23923        } else {
23924          appendChildToContainer(parent, stateNode);
23925        }
23926      } else if (tag === HostPortal) ; else {
23927        var child = node.child;
23928  
23929        if (child !== null) {
23930          insertOrAppendPlacementNodeIntoContainer(child, before, parent);
23931          var sibling = child.sibling;
23932  
23933          while (sibling !== null) {
23934            insertOrAppendPlacementNodeIntoContainer(sibling, before, parent);
23935            sibling = sibling.sibling;
23936          }
23937        }
23938      }
23939    }
23940  
23941    function insertOrAppendPlacementNode(node, before, parent) {
23942      var tag = node.tag;
23943      var isHost = tag === HostComponent || tag === HostText;
23944  
23945      if (isHost) {
23946        var stateNode = node.stateNode;
23947  
23948        if (before) {
23949          insertBefore(parent, stateNode, before);
23950        } else {
23951          appendChild(parent, stateNode);
23952        }
23953      } else if (tag === HostPortal) ; else {
23954        var child = node.child;
23955  
23956        if (child !== null) {
23957          insertOrAppendPlacementNode(child, before, parent);
23958          var sibling = child.sibling;
23959  
23960          while (sibling !== null) {
23961            insertOrAppendPlacementNode(sibling, before, parent);
23962            sibling = sibling.sibling;
23963          }
23964        }
23965      }
23966    } // These are tracked on the stack as we recursively traverse a
23967    // deleted subtree.
23968    // TODO: Update these during the whole mutation phase, not just during
23969    // a deletion.
23970  
23971  
23972    var hostParent = null;
23973    var hostParentIsContainer = false;
23974  
23975    function commitDeletionEffects(root, returnFiber, deletedFiber) {
23976      {
23977        // We only have the top Fiber that was deleted but we need to recurse down its
23978        // children to find all the terminal nodes.
23979        // Recursively delete all host nodes from the parent, detach refs, clean
23980        // up mounted layout effects, and call componentWillUnmount.
23981        // We only need to remove the topmost host child in each branch. But then we
23982        // still need to keep traversing to unmount effects, refs, and cWU. TODO: We
23983        // could split this into two separate traversals functions, where the second
23984        // one doesn't include any removeChild logic. This is maybe the same
23985        // function as "disappearLayoutEffects" (or whatever that turns into after
23986        // the layout phase is refactored to use recursion).
23987        // Before starting, find the nearest host parent on the stack so we know
23988        // which instance/container to remove the children from.
23989        // TODO: Instead of searching up the fiber return path on every deletion, we
23990        // can track the nearest host component on the JS stack as we traverse the
23991        // tree during the commit phase. This would make insertions faster, too.
23992        var parent = returnFiber;
23993  
23994        findParent: while (parent !== null) {
23995          switch (parent.tag) {
23996            case HostComponent:
23997              {
23998                hostParent = parent.stateNode;
23999                hostParentIsContainer = false;
24000                break findParent;
24001              }
24002  
24003            case HostRoot:
24004              {
24005                hostParent = parent.stateNode.containerInfo;
24006                hostParentIsContainer = true;
24007                break findParent;
24008              }
24009  
24010            case HostPortal:
24011              {
24012                hostParent = parent.stateNode.containerInfo;
24013                hostParentIsContainer = true;
24014                break findParent;
24015              }
24016          }
24017  
24018          parent = parent.return;
24019        }
24020  
24021        if (hostParent === null) {
24022          throw new Error('Expected to find a host parent. This error is likely caused by ' + 'a bug in React. Please file an issue.');
24023        }
24024  
24025        commitDeletionEffectsOnFiber(root, returnFiber, deletedFiber);
24026        hostParent = null;
24027        hostParentIsContainer = false;
24028      }
24029  
24030      detachFiberMutation(deletedFiber);
24031    }
24032  
24033    function recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, parent) {
24034      // TODO: Use a static flag to skip trees that don't have unmount effects
24035      var child = parent.child;
24036  
24037      while (child !== null) {
24038        commitDeletionEffectsOnFiber(finishedRoot, nearestMountedAncestor, child);
24039        child = child.sibling;
24040      }
24041    }
24042  
24043    function commitDeletionEffectsOnFiber(finishedRoot, nearestMountedAncestor, deletedFiber) {
24044      onCommitUnmount(deletedFiber); // The cases in this outer switch modify the stack before they traverse
24045      // into their subtree. There are simpler cases in the inner switch
24046      // that don't modify the stack.
24047  
24048      switch (deletedFiber.tag) {
24049        case HostComponent:
24050          {
24051            if (!offscreenSubtreeWasHidden) {
24052              safelyDetachRef(deletedFiber, nearestMountedAncestor);
24053            } // Intentional fallthrough to next branch
24054  
24055          }
24056        // eslint-disable-next-line-no-fallthrough
24057  
24058        case HostText:
24059          {
24060            // We only need to remove the nearest host child. Set the host parent
24061            // to `null` on the stack to indicate that nested children don't
24062            // need to be removed.
24063            {
24064              var prevHostParent = hostParent;
24065              var prevHostParentIsContainer = hostParentIsContainer;
24066              hostParent = null;
24067              recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
24068              hostParent = prevHostParent;
24069              hostParentIsContainer = prevHostParentIsContainer;
24070  
24071              if (hostParent !== null) {
24072                // Now that all the child effects have unmounted, we can remove the
24073                // node from the tree.
24074                if (hostParentIsContainer) {
24075                  removeChildFromContainer(hostParent, deletedFiber.stateNode);
24076                } else {
24077                  removeChild(hostParent, deletedFiber.stateNode);
24078                }
24079              }
24080            }
24081  
24082            return;
24083          }
24084  
24085        case DehydratedFragment:
24086          {
24087            // Delete the dehydrated suspense boundary and all of its content.
24088  
24089  
24090            {
24091              if (hostParent !== null) {
24092                if (hostParentIsContainer) {
24093                  clearSuspenseBoundaryFromContainer(hostParent, deletedFiber.stateNode);
24094                } else {
24095                  clearSuspenseBoundary(hostParent, deletedFiber.stateNode);
24096                }
24097              }
24098            }
24099  
24100            return;
24101          }
24102  
24103        case HostPortal:
24104          {
24105            {
24106              // When we go into a portal, it becomes the parent to remove from.
24107              var _prevHostParent = hostParent;
24108              var _prevHostParentIsContainer = hostParentIsContainer;
24109              hostParent = deletedFiber.stateNode.containerInfo;
24110              hostParentIsContainer = true;
24111              recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
24112              hostParent = _prevHostParent;
24113              hostParentIsContainer = _prevHostParentIsContainer;
24114            }
24115  
24116            return;
24117          }
24118  
24119        case FunctionComponent:
24120        case ForwardRef:
24121        case MemoComponent:
24122        case SimpleMemoComponent:
24123          {
24124            if (!offscreenSubtreeWasHidden) {
24125              var updateQueue = deletedFiber.updateQueue;
24126  
24127              if (updateQueue !== null) {
24128                var lastEffect = updateQueue.lastEffect;
24129  
24130                if (lastEffect !== null) {
24131                  var firstEffect = lastEffect.next;
24132                  var effect = firstEffect;
24133  
24134                  do {
24135                    var _effect = effect,
24136                        destroy = _effect.destroy,
24137                        tag = _effect.tag;
24138  
24139                    if (destroy !== undefined) {
24140                      if ((tag & Insertion) !== NoFlags$1) {
24141                        safelyCallDestroy(deletedFiber, nearestMountedAncestor, destroy);
24142                      } else if ((tag & Layout) !== NoFlags$1) {
24143                        {
24144                          markComponentLayoutEffectUnmountStarted(deletedFiber);
24145                        }
24146  
24147                        if ( deletedFiber.mode & ProfileMode) {
24148                          startLayoutEffectTimer();
24149                          safelyCallDestroy(deletedFiber, nearestMountedAncestor, destroy);
24150                          recordLayoutEffectDuration(deletedFiber);
24151                        } else {
24152                          safelyCallDestroy(deletedFiber, nearestMountedAncestor, destroy);
24153                        }
24154  
24155                        {
24156                          markComponentLayoutEffectUnmountStopped();
24157                        }
24158                      }
24159                    }
24160  
24161                    effect = effect.next;
24162                  } while (effect !== firstEffect);
24163                }
24164              }
24165            }
24166  
24167            recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
24168            return;
24169          }
24170  
24171        case ClassComponent:
24172          {
24173            if (!offscreenSubtreeWasHidden) {
24174              safelyDetachRef(deletedFiber, nearestMountedAncestor);
24175              var instance = deletedFiber.stateNode;
24176  
24177              if (typeof instance.componentWillUnmount === 'function') {
24178                safelyCallComponentWillUnmount(deletedFiber, nearestMountedAncestor, instance);
24179              }
24180            }
24181  
24182            recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
24183            return;
24184          }
24185  
24186        case ScopeComponent:
24187          {
24188  
24189            recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
24190            return;
24191          }
24192  
24193        case OffscreenComponent:
24194          {
24195            if ( // TODO: Remove this dead flag
24196             deletedFiber.mode & ConcurrentMode) {
24197              // If this offscreen component is hidden, we already unmounted it. Before
24198              // deleting the children, track that it's already unmounted so that we
24199              // don't attempt to unmount the effects again.
24200              // TODO: If the tree is hidden, in most cases we should be able to skip
24201              // over the nested children entirely. An exception is we haven't yet found
24202              // the topmost host node to delete, which we already track on the stack.
24203              // But the other case is portals, which need to be detached no matter how
24204              // deeply they are nested. We should use a subtree flag to track whether a
24205              // subtree includes a nested portal.
24206              var prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden;
24207              offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden || deletedFiber.memoizedState !== null;
24208              recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
24209              offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden;
24210            } else {
24211              recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
24212            }
24213  
24214            break;
24215          }
24216  
24217        default:
24218          {
24219            recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
24220            return;
24221          }
24222      }
24223    }
24224  
24225    function commitSuspenseCallback(finishedWork) {
24226      // TODO: Move this to passive phase
24227      var newState = finishedWork.memoizedState;
24228    }
24229  
24230    function commitSuspenseHydrationCallbacks(finishedRoot, finishedWork) {
24231  
24232      var newState = finishedWork.memoizedState;
24233  
24234      if (newState === null) {
24235        var current = finishedWork.alternate;
24236  
24237        if (current !== null) {
24238          var prevState = current.memoizedState;
24239  
24240          if (prevState !== null) {
24241            var suspenseInstance = prevState.dehydrated;
24242  
24243            if (suspenseInstance !== null) {
24244              commitHydratedSuspenseInstance(suspenseInstance);
24245            }
24246          }
24247        }
24248      }
24249    }
24250  
24251    function attachSuspenseRetryListeners(finishedWork) {
24252      // If this boundary just timed out, then it will have a set of wakeables.
24253      // For each wakeable, attach a listener so that when it resolves, React
24254      // attempts to re-render the boundary in the primary (pre-timeout) state.
24255      var wakeables = finishedWork.updateQueue;
24256  
24257      if (wakeables !== null) {
24258        finishedWork.updateQueue = null;
24259        var retryCache = finishedWork.stateNode;
24260  
24261        if (retryCache === null) {
24262          retryCache = finishedWork.stateNode = new PossiblyWeakSet();
24263        }
24264  
24265        wakeables.forEach(function (wakeable) {
24266          // Memoize using the boundary fiber to prevent redundant listeners.
24267          var retry = resolveRetryWakeable.bind(null, finishedWork, wakeable);
24268  
24269          if (!retryCache.has(wakeable)) {
24270            retryCache.add(wakeable);
24271  
24272            {
24273              if (isDevToolsPresent) {
24274                if (inProgressLanes !== null && inProgressRoot !== null) {
24275                  // If we have pending work still, associate the original updaters with it.
24276                  restorePendingUpdaters(inProgressRoot, inProgressLanes);
24277                } else {
24278                  throw Error('Expected finished root and lanes to be set. This is a bug in React.');
24279                }
24280              }
24281            }
24282  
24283            wakeable.then(retry, retry);
24284          }
24285        });
24286      }
24287    } // This function detects when a Suspense boundary goes from visible to hidden.
24288    function commitMutationEffects(root, finishedWork, committedLanes) {
24289      inProgressLanes = committedLanes;
24290      inProgressRoot = root;
24291      setCurrentFiber(finishedWork);
24292      commitMutationEffectsOnFiber(finishedWork, root);
24293      setCurrentFiber(finishedWork);
24294      inProgressLanes = null;
24295      inProgressRoot = null;
24296    }
24297  
24298    function recursivelyTraverseMutationEffects(root, parentFiber, lanes) {
24299      // Deletions effects can be scheduled on any fiber type. They need to happen
24300      // before the children effects hae fired.
24301      var deletions = parentFiber.deletions;
24302  
24303      if (deletions !== null) {
24304        for (var i = 0; i < deletions.length; i++) {
24305          var childToDelete = deletions[i];
24306  
24307          try {
24308            commitDeletionEffects(root, parentFiber, childToDelete);
24309          } catch (error) {
24310            captureCommitPhaseError(childToDelete, parentFiber, error);
24311          }
24312        }
24313      }
24314  
24315      var prevDebugFiber = getCurrentFiber();
24316  
24317      if (parentFiber.subtreeFlags & MutationMask) {
24318        var child = parentFiber.child;
24319  
24320        while (child !== null) {
24321          setCurrentFiber(child);
24322          commitMutationEffectsOnFiber(child, root);
24323          child = child.sibling;
24324        }
24325      }
24326  
24327      setCurrentFiber(prevDebugFiber);
24328    }
24329  
24330    function commitMutationEffectsOnFiber(finishedWork, root, lanes) {
24331      var current = finishedWork.alternate;
24332      var flags = finishedWork.flags; // The effect flag should be checked *after* we refine the type of fiber,
24333      // because the fiber tag is more specific. An exception is any flag related
24334      // to reconcilation, because those can be set on all fiber types.
24335  
24336      switch (finishedWork.tag) {
24337        case FunctionComponent:
24338        case ForwardRef:
24339        case MemoComponent:
24340        case SimpleMemoComponent:
24341          {
24342            recursivelyTraverseMutationEffects(root, finishedWork);
24343            commitReconciliationEffects(finishedWork);
24344  
24345            if (flags & Update) {
24346              try {
24347                commitHookEffectListUnmount(Insertion | HasEffect, finishedWork, finishedWork.return);
24348                commitHookEffectListMount(Insertion | HasEffect, finishedWork);
24349              } catch (error) {
24350                captureCommitPhaseError(finishedWork, finishedWork.return, error);
24351              } // Layout effects are destroyed during the mutation phase so that all
24352              // destroy functions for all fibers are called before any create functions.
24353              // This prevents sibling component effects from interfering with each other,
24354              // e.g. a destroy function in one component should never override a ref set
24355              // by a create function in another component during the same commit.
24356  
24357  
24358              if ( finishedWork.mode & ProfileMode) {
24359                try {
24360                  startLayoutEffectTimer();
24361                  commitHookEffectListUnmount(Layout | HasEffect, finishedWork, finishedWork.return);
24362                } catch (error) {
24363                  captureCommitPhaseError(finishedWork, finishedWork.return, error);
24364                }
24365  
24366                recordLayoutEffectDuration(finishedWork);
24367              } else {
24368                try {
24369                  commitHookEffectListUnmount(Layout | HasEffect, finishedWork, finishedWork.return);
24370                } catch (error) {
24371                  captureCommitPhaseError(finishedWork, finishedWork.return, error);
24372                }
24373              }
24374            }
24375  
24376            return;
24377          }
24378  
24379        case ClassComponent:
24380          {
24381            recursivelyTraverseMutationEffects(root, finishedWork);
24382            commitReconciliationEffects(finishedWork);
24383  
24384            if (flags & Ref) {
24385              if (current !== null) {
24386                safelyDetachRef(current, current.return);
24387              }
24388            }
24389  
24390            return;
24391          }
24392  
24393        case HostComponent:
24394          {
24395            recursivelyTraverseMutationEffects(root, finishedWork);
24396            commitReconciliationEffects(finishedWork);
24397  
24398            if (flags & Ref) {
24399              if (current !== null) {
24400                safelyDetachRef(current, current.return);
24401              }
24402            }
24403  
24404            {
24405              // TODO: ContentReset gets cleared by the children during the commit
24406              // phase. This is a refactor hazard because it means we must read
24407              // flags the flags after `commitReconciliationEffects` has already run;
24408              // the order matters. We should refactor so that ContentReset does not
24409              // rely on mutating the flag during commit. Like by setting a flag
24410              // during the render phase instead.
24411              if (finishedWork.flags & ContentReset) {
24412                var instance = finishedWork.stateNode;
24413  
24414                try {
24415                  resetTextContent(instance);
24416                } catch (error) {
24417                  captureCommitPhaseError(finishedWork, finishedWork.return, error);
24418                }
24419              }
24420  
24421              if (flags & Update) {
24422                var _instance4 = finishedWork.stateNode;
24423  
24424                if (_instance4 != null) {
24425                  // Commit the work prepared earlier.
24426                  var newProps = finishedWork.memoizedProps; // For hydration we reuse the update path but we treat the oldProps
24427                  // as the newProps. The updatePayload will contain the real change in
24428                  // this case.
24429  
24430                  var oldProps = current !== null ? current.memoizedProps : newProps;
24431                  var type = finishedWork.type; // TODO: Type the updateQueue to be specific to host components.
24432  
24433                  var updatePayload = finishedWork.updateQueue;
24434                  finishedWork.updateQueue = null;
24435  
24436                  if (updatePayload !== null) {
24437                    try {
24438                      commitUpdate(_instance4, updatePayload, type, oldProps, newProps, finishedWork);
24439                    } catch (error) {
24440                      captureCommitPhaseError(finishedWork, finishedWork.return, error);
24441                    }
24442                  }
24443                }
24444              }
24445            }
24446  
24447            return;
24448          }
24449  
24450        case HostText:
24451          {
24452            recursivelyTraverseMutationEffects(root, finishedWork);
24453            commitReconciliationEffects(finishedWork);
24454  
24455            if (flags & Update) {
24456              {
24457                if (finishedWork.stateNode === null) {
24458                  throw new Error('This should have a text node initialized. This error is likely ' + 'caused by a bug in React. Please file an issue.');
24459                }
24460  
24461                var textInstance = finishedWork.stateNode;
24462                var newText = finishedWork.memoizedProps; // For hydration we reuse the update path but we treat the oldProps
24463                // as the newProps. The updatePayload will contain the real change in
24464                // this case.
24465  
24466                var oldText = current !== null ? current.memoizedProps : newText;
24467  
24468                try {
24469                  commitTextUpdate(textInstance, oldText, newText);
24470                } catch (error) {
24471                  captureCommitPhaseError(finishedWork, finishedWork.return, error);
24472                }
24473              }
24474            }
24475  
24476            return;
24477          }
24478  
24479        case HostRoot:
24480          {
24481            recursivelyTraverseMutationEffects(root, finishedWork);
24482            commitReconciliationEffects(finishedWork);
24483  
24484            if (flags & Update) {
24485              {
24486                if (current !== null) {
24487                  var prevRootState = current.memoizedState;
24488  
24489                  if (prevRootState.isDehydrated) {
24490                    try {
24491                      commitHydratedContainer(root.containerInfo);
24492                    } catch (error) {
24493                      captureCommitPhaseError(finishedWork, finishedWork.return, error);
24494                    }
24495                  }
24496                }
24497              }
24498            }
24499  
24500            return;
24501          }
24502  
24503        case HostPortal:
24504          {
24505            recursivelyTraverseMutationEffects(root, finishedWork);
24506            commitReconciliationEffects(finishedWork);
24507  
24508            return;
24509          }
24510  
24511        case SuspenseComponent:
24512          {
24513            recursivelyTraverseMutationEffects(root, finishedWork);
24514            commitReconciliationEffects(finishedWork);
24515            var offscreenFiber = finishedWork.child;
24516  
24517            if (offscreenFiber.flags & Visibility) {
24518              var offscreenInstance = offscreenFiber.stateNode;
24519              var newState = offscreenFiber.memoizedState;
24520              var isHidden = newState !== null; // Track the current state on the Offscreen instance so we can
24521              // read it during an event
24522  
24523              offscreenInstance.isHidden = isHidden;
24524  
24525              if (isHidden) {
24526                var wasHidden = offscreenFiber.alternate !== null && offscreenFiber.alternate.memoizedState !== null;
24527  
24528                if (!wasHidden) {
24529                  // TODO: Move to passive phase
24530                  markCommitTimeOfFallback();
24531                }
24532              }
24533            }
24534  
24535            if (flags & Update) {
24536              try {
24537                commitSuspenseCallback(finishedWork);
24538              } catch (error) {
24539                captureCommitPhaseError(finishedWork, finishedWork.return, error);
24540              }
24541  
24542              attachSuspenseRetryListeners(finishedWork);
24543            }
24544  
24545            return;
24546          }
24547  
24548        case OffscreenComponent:
24549          {
24550            var _wasHidden = current !== null && current.memoizedState !== null;
24551  
24552            if ( // TODO: Remove this dead flag
24553             finishedWork.mode & ConcurrentMode) {
24554              // Before committing the children, track on the stack whether this
24555              // offscreen subtree was already hidden, so that we don't unmount the
24556              // effects again.
24557              var prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden;
24558              offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden || _wasHidden;
24559              recursivelyTraverseMutationEffects(root, finishedWork);
24560              offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden;
24561            } else {
24562              recursivelyTraverseMutationEffects(root, finishedWork);
24563            }
24564  
24565            commitReconciliationEffects(finishedWork);
24566  
24567            if (flags & Visibility) {
24568              var _offscreenInstance = finishedWork.stateNode;
24569              var _newState = finishedWork.memoizedState;
24570  
24571              var _isHidden = _newState !== null;
24572  
24573              var offscreenBoundary = finishedWork; // Track the current state on the Offscreen instance so we can
24574              // read it during an event
24575  
24576              _offscreenInstance.isHidden = _isHidden;
24577  
24578              {
24579                if (_isHidden) {
24580                  if (!_wasHidden) {
24581                    if ((offscreenBoundary.mode & ConcurrentMode) !== NoMode) {
24582                      nextEffect = offscreenBoundary;
24583                      var offscreenChild = offscreenBoundary.child;
24584  
24585                      while (offscreenChild !== null) {
24586                        nextEffect = offscreenChild;
24587                        disappearLayoutEffects_begin(offscreenChild);
24588                        offscreenChild = offscreenChild.sibling;
24589                      }
24590                    }
24591                  }
24592                }
24593              }
24594  
24595              {
24596                // TODO: This needs to run whenever there's an insertion or update
24597                // inside a hidden Offscreen tree.
24598                hideOrUnhideAllChildren(offscreenBoundary, _isHidden);
24599              }
24600            }
24601  
24602            return;
24603          }
24604  
24605        case SuspenseListComponent:
24606          {
24607            recursivelyTraverseMutationEffects(root, finishedWork);
24608            commitReconciliationEffects(finishedWork);
24609  
24610            if (flags & Update) {
24611              attachSuspenseRetryListeners(finishedWork);
24612            }
24613  
24614            return;
24615          }
24616  
24617        case ScopeComponent:
24618          {
24619  
24620            return;
24621          }
24622  
24623        default:
24624          {
24625            recursivelyTraverseMutationEffects(root, finishedWork);
24626            commitReconciliationEffects(finishedWork);
24627            return;
24628          }
24629      }
24630    }
24631  
24632    function commitReconciliationEffects(finishedWork) {
24633      // Placement effects (insertions, reorders) can be scheduled on any fiber
24634      // type. They needs to happen after the children effects have fired, but
24635      // before the effects on this fiber have fired.
24636      var flags = finishedWork.flags;
24637  
24638      if (flags & Placement) {
24639        try {
24640          commitPlacement(finishedWork);
24641        } catch (error) {
24642          captureCommitPhaseError(finishedWork, finishedWork.return, error);
24643        } // Clear the "placement" from effect tag so that we know that this is
24644        // inserted, before any life-cycles like componentDidMount gets called.
24645        // TODO: findDOMNode doesn't rely on this any more but isMounted does
24646        // and isMounted is deprecated anyway so we should be able to kill this.
24647  
24648  
24649        finishedWork.flags &= ~Placement;
24650      }
24651  
24652      if (flags & Hydrating) {
24653        finishedWork.flags &= ~Hydrating;
24654      }
24655    }
24656  
24657    function commitLayoutEffects(finishedWork, root, committedLanes) {
24658      inProgressLanes = committedLanes;
24659      inProgressRoot = root;
24660      nextEffect = finishedWork;
24661      commitLayoutEffects_begin(finishedWork, root, committedLanes);
24662      inProgressLanes = null;
24663      inProgressRoot = null;
24664    }
24665  
24666    function commitLayoutEffects_begin(subtreeRoot, root, committedLanes) {
24667      // Suspense layout effects semantics don't change for legacy roots.
24668      var isModernRoot = (subtreeRoot.mode & ConcurrentMode) !== NoMode;
24669  
24670      while (nextEffect !== null) {
24671        var fiber = nextEffect;
24672        var firstChild = fiber.child;
24673  
24674        if ( fiber.tag === OffscreenComponent && isModernRoot) {
24675          // Keep track of the current Offscreen stack's state.
24676          var isHidden = fiber.memoizedState !== null;
24677          var newOffscreenSubtreeIsHidden = isHidden || offscreenSubtreeIsHidden;
24678  
24679          if (newOffscreenSubtreeIsHidden) {
24680            // The Offscreen tree is hidden. Skip over its layout effects.
24681            commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes);
24682            continue;
24683          } else {
24684            // TODO (Offscreen) Also check: subtreeFlags & LayoutMask
24685            var current = fiber.alternate;
24686            var wasHidden = current !== null && current.memoizedState !== null;
24687            var newOffscreenSubtreeWasHidden = wasHidden || offscreenSubtreeWasHidden;
24688            var prevOffscreenSubtreeIsHidden = offscreenSubtreeIsHidden;
24689            var prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden; // Traverse the Offscreen subtree with the current Offscreen as the root.
24690  
24691            offscreenSubtreeIsHidden = newOffscreenSubtreeIsHidden;
24692            offscreenSubtreeWasHidden = newOffscreenSubtreeWasHidden;
24693  
24694            if (offscreenSubtreeWasHidden && !prevOffscreenSubtreeWasHidden) {
24695              // This is the root of a reappearing boundary. Turn its layout effects
24696              // back on.
24697              nextEffect = fiber;
24698              reappearLayoutEffects_begin(fiber);
24699            }
24700  
24701            var child = firstChild;
24702  
24703            while (child !== null) {
24704              nextEffect = child;
24705              commitLayoutEffects_begin(child, // New root; bubble back up to here and stop.
24706              root, committedLanes);
24707              child = child.sibling;
24708            } // Restore Offscreen state and resume in our-progress traversal.
24709  
24710  
24711            nextEffect = fiber;
24712            offscreenSubtreeIsHidden = prevOffscreenSubtreeIsHidden;
24713            offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden;
24714            commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes);
24715            continue;
24716          }
24717        }
24718  
24719        if ((fiber.subtreeFlags & LayoutMask) !== NoFlags && firstChild !== null) {
24720          firstChild.return = fiber;
24721          nextEffect = firstChild;
24722        } else {
24723          commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes);
24724        }
24725      }
24726    }
24727  
24728    function commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes) {
24729      while (nextEffect !== null) {
24730        var fiber = nextEffect;
24731  
24732        if ((fiber.flags & LayoutMask) !== NoFlags) {
24733          var current = fiber.alternate;
24734          setCurrentFiber(fiber);
24735  
24736          try {
24737            commitLayoutEffectOnFiber(root, current, fiber, committedLanes);
24738          } catch (error) {
24739            captureCommitPhaseError(fiber, fiber.return, error);
24740          }
24741  
24742          resetCurrentFiber();
24743        }
24744  
24745        if (fiber === subtreeRoot) {
24746          nextEffect = null;
24747          return;
24748        }
24749  
24750        var sibling = fiber.sibling;
24751  
24752        if (sibling !== null) {
24753          sibling.return = fiber.return;
24754          nextEffect = sibling;
24755          return;
24756        }
24757  
24758        nextEffect = fiber.return;
24759      }
24760    }
24761  
24762    function disappearLayoutEffects_begin(subtreeRoot) {
24763      while (nextEffect !== null) {
24764        var fiber = nextEffect;
24765        var firstChild = fiber.child; // TODO (Offscreen) Check: flags & (RefStatic | LayoutStatic)
24766  
24767        switch (fiber.tag) {
24768          case FunctionComponent:
24769          case ForwardRef:
24770          case MemoComponent:
24771          case SimpleMemoComponent:
24772            {
24773              if ( fiber.mode & ProfileMode) {
24774                try {
24775                  startLayoutEffectTimer();
24776                  commitHookEffectListUnmount(Layout, fiber, fiber.return);
24777                } finally {
24778                  recordLayoutEffectDuration(fiber);
24779                }
24780              } else {
24781                commitHookEffectListUnmount(Layout, fiber, fiber.return);
24782              }
24783  
24784              break;
24785            }
24786  
24787          case ClassComponent:
24788            {
24789              // TODO (Offscreen) Check: flags & RefStatic
24790              safelyDetachRef(fiber, fiber.return);
24791              var instance = fiber.stateNode;
24792  
24793              if (typeof instance.componentWillUnmount === 'function') {
24794                safelyCallComponentWillUnmount(fiber, fiber.return, instance);
24795              }
24796  
24797              break;
24798            }
24799  
24800          case HostComponent:
24801            {
24802              safelyDetachRef(fiber, fiber.return);
24803              break;
24804            }
24805  
24806          case OffscreenComponent:
24807            {
24808              // Check if this is a
24809              var isHidden = fiber.memoizedState !== null;
24810  
24811              if (isHidden) {
24812                // Nested Offscreen tree is already hidden. Don't disappear
24813                // its effects.
24814                disappearLayoutEffects_complete(subtreeRoot);
24815                continue;
24816              }
24817  
24818              break;
24819            }
24820        } // TODO (Offscreen) Check: subtreeFlags & LayoutStatic
24821  
24822  
24823        if (firstChild !== null) {
24824          firstChild.return = fiber;
24825          nextEffect = firstChild;
24826        } else {
24827          disappearLayoutEffects_complete(subtreeRoot);
24828        }
24829      }
24830    }
24831  
24832    function disappearLayoutEffects_complete(subtreeRoot) {
24833      while (nextEffect !== null) {
24834        var fiber = nextEffect;
24835  
24836        if (fiber === subtreeRoot) {
24837          nextEffect = null;
24838          return;
24839        }
24840  
24841        var sibling = fiber.sibling;
24842  
24843        if (sibling !== null) {
24844          sibling.return = fiber.return;
24845          nextEffect = sibling;
24846          return;
24847        }
24848  
24849        nextEffect = fiber.return;
24850      }
24851    }
24852  
24853    function reappearLayoutEffects_begin(subtreeRoot) {
24854      while (nextEffect !== null) {
24855        var fiber = nextEffect;
24856        var firstChild = fiber.child;
24857  
24858        if (fiber.tag === OffscreenComponent) {
24859          var isHidden = fiber.memoizedState !== null;
24860  
24861          if (isHidden) {
24862            // Nested Offscreen tree is still hidden. Don't re-appear its effects.
24863            reappearLayoutEffects_complete(subtreeRoot);
24864            continue;
24865          }
24866        } // TODO (Offscreen) Check: subtreeFlags & LayoutStatic
24867  
24868  
24869        if (firstChild !== null) {
24870          // This node may have been reused from a previous render, so we can't
24871          // assume its return pointer is correct.
24872          firstChild.return = fiber;
24873          nextEffect = firstChild;
24874        } else {
24875          reappearLayoutEffects_complete(subtreeRoot);
24876        }
24877      }
24878    }
24879  
24880    function reappearLayoutEffects_complete(subtreeRoot) {
24881      while (nextEffect !== null) {
24882        var fiber = nextEffect; // TODO (Offscreen) Check: flags & LayoutStatic
24883  
24884        setCurrentFiber(fiber);
24885  
24886        try {
24887          reappearLayoutEffectsOnFiber(fiber);
24888        } catch (error) {
24889          captureCommitPhaseError(fiber, fiber.return, error);
24890        }
24891  
24892        resetCurrentFiber();
24893  
24894        if (fiber === subtreeRoot) {
24895          nextEffect = null;
24896          return;
24897        }
24898  
24899        var sibling = fiber.sibling;
24900  
24901        if (sibling !== null) {
24902          // This node may have been reused from a previous render, so we can't
24903          // assume its return pointer is correct.
24904          sibling.return = fiber.return;
24905          nextEffect = sibling;
24906          return;
24907        }
24908  
24909        nextEffect = fiber.return;
24910      }
24911    }
24912  
24913    function commitPassiveMountEffects(root, finishedWork, committedLanes, committedTransitions) {
24914      nextEffect = finishedWork;
24915      commitPassiveMountEffects_begin(finishedWork, root, committedLanes, committedTransitions);
24916    }
24917  
24918    function commitPassiveMountEffects_begin(subtreeRoot, root, committedLanes, committedTransitions) {
24919      while (nextEffect !== null) {
24920        var fiber = nextEffect;
24921        var firstChild = fiber.child;
24922  
24923        if ((fiber.subtreeFlags & PassiveMask) !== NoFlags && firstChild !== null) {
24924          firstChild.return = fiber;
24925          nextEffect = firstChild;
24926        } else {
24927          commitPassiveMountEffects_complete(subtreeRoot, root, committedLanes, committedTransitions);
24928        }
24929      }
24930    }
24931  
24932    function commitPassiveMountEffects_complete(subtreeRoot, root, committedLanes, committedTransitions) {
24933      while (nextEffect !== null) {
24934        var fiber = nextEffect;
24935  
24936        if ((fiber.flags & Passive) !== NoFlags) {
24937          setCurrentFiber(fiber);
24938  
24939          try {
24940            commitPassiveMountOnFiber(root, fiber, committedLanes, committedTransitions);
24941          } catch (error) {
24942            captureCommitPhaseError(fiber, fiber.return, error);
24943          }
24944  
24945          resetCurrentFiber();
24946        }
24947  
24948        if (fiber === subtreeRoot) {
24949          nextEffect = null;
24950          return;
24951        }
24952  
24953        var sibling = fiber.sibling;
24954  
24955        if (sibling !== null) {
24956          sibling.return = fiber.return;
24957          nextEffect = sibling;
24958          return;
24959        }
24960  
24961        nextEffect = fiber.return;
24962      }
24963    }
24964  
24965    function commitPassiveMountOnFiber(finishedRoot, finishedWork, committedLanes, committedTransitions) {
24966      switch (finishedWork.tag) {
24967        case FunctionComponent:
24968        case ForwardRef:
24969        case SimpleMemoComponent:
24970          {
24971            if ( finishedWork.mode & ProfileMode) {
24972              startPassiveEffectTimer();
24973  
24974              try {
24975                commitHookEffectListMount(Passive$1 | HasEffect, finishedWork);
24976              } finally {
24977                recordPassiveEffectDuration(finishedWork);
24978              }
24979            } else {
24980              commitHookEffectListMount(Passive$1 | HasEffect, finishedWork);
24981            }
24982  
24983            break;
24984          }
24985      }
24986    }
24987  
24988    function commitPassiveUnmountEffects(firstChild) {
24989      nextEffect = firstChild;
24990      commitPassiveUnmountEffects_begin();
24991    }
24992  
24993    function commitPassiveUnmountEffects_begin() {
24994      while (nextEffect !== null) {
24995        var fiber = nextEffect;
24996        var child = fiber.child;
24997  
24998        if ((nextEffect.flags & ChildDeletion) !== NoFlags) {
24999          var deletions = fiber.deletions;
25000  
25001          if (deletions !== null) {
25002            for (var i = 0; i < deletions.length; i++) {
25003              var fiberToDelete = deletions[i];
25004              nextEffect = fiberToDelete;
25005              commitPassiveUnmountEffectsInsideOfDeletedTree_begin(fiberToDelete, fiber);
25006            }
25007  
25008            {
25009              // A fiber was deleted from this parent fiber, but it's still part of
25010              // the previous (alternate) parent fiber's list of children. Because
25011              // children are a linked list, an earlier sibling that's still alive
25012              // will be connected to the deleted fiber via its `alternate`:
25013              //
25014              //   live fiber
25015              //   --alternate--> previous live fiber
25016              //   --sibling--> deleted fiber
25017              //
25018              // We can't disconnect `alternate` on nodes that haven't been deleted
25019              // yet, but we can disconnect the `sibling` and `child` pointers.
25020              var previousFiber = fiber.alternate;
25021  
25022              if (previousFiber !== null) {
25023                var detachedChild = previousFiber.child;
25024  
25025                if (detachedChild !== null) {
25026                  previousFiber.child = null;
25027  
25028                  do {
25029                    var detachedSibling = detachedChild.sibling;
25030                    detachedChild.sibling = null;
25031                    detachedChild = detachedSibling;
25032                  } while (detachedChild !== null);
25033                }
25034              }
25035            }
25036  
25037            nextEffect = fiber;
25038          }
25039        }
25040  
25041        if ((fiber.subtreeFlags & PassiveMask) !== NoFlags && child !== null) {
25042          child.return = fiber;
25043          nextEffect = child;
25044        } else {
25045          commitPassiveUnmountEffects_complete();
25046        }
25047      }
25048    }
25049  
25050    function commitPassiveUnmountEffects_complete() {
25051      while (nextEffect !== null) {
25052        var fiber = nextEffect;
25053  
25054        if ((fiber.flags & Passive) !== NoFlags) {
25055          setCurrentFiber(fiber);
25056          commitPassiveUnmountOnFiber(fiber);
25057          resetCurrentFiber();
25058        }
25059  
25060        var sibling = fiber.sibling;
25061  
25062        if (sibling !== null) {
25063          sibling.return = fiber.return;
25064          nextEffect = sibling;
25065          return;
25066        }
25067  
25068        nextEffect = fiber.return;
25069      }
25070    }
25071  
25072    function commitPassiveUnmountOnFiber(finishedWork) {
25073      switch (finishedWork.tag) {
25074        case FunctionComponent:
25075        case ForwardRef:
25076        case SimpleMemoComponent:
25077          {
25078            if ( finishedWork.mode & ProfileMode) {
25079              startPassiveEffectTimer();
25080              commitHookEffectListUnmount(Passive$1 | HasEffect, finishedWork, finishedWork.return);
25081              recordPassiveEffectDuration(finishedWork);
25082            } else {
25083              commitHookEffectListUnmount(Passive$1 | HasEffect, finishedWork, finishedWork.return);
25084            }
25085  
25086            break;
25087          }
25088      }
25089    }
25090  
25091    function commitPassiveUnmountEffectsInsideOfDeletedTree_begin(deletedSubtreeRoot, nearestMountedAncestor) {
25092      while (nextEffect !== null) {
25093        var fiber = nextEffect; // Deletion effects fire in parent -> child order
25094        // TODO: Check if fiber has a PassiveStatic flag
25095  
25096        setCurrentFiber(fiber);
25097        commitPassiveUnmountInsideDeletedTreeOnFiber(fiber, nearestMountedAncestor);
25098        resetCurrentFiber();
25099        var child = fiber.child; // TODO: Only traverse subtree if it has a PassiveStatic flag. (But, if we
25100        // do this, still need to handle `deletedTreeCleanUpLevel` correctly.)
25101  
25102        if (child !== null) {
25103          child.return = fiber;
25104          nextEffect = child;
25105        } else {
25106          commitPassiveUnmountEffectsInsideOfDeletedTree_complete(deletedSubtreeRoot);
25107        }
25108      }
25109    }
25110  
25111    function commitPassiveUnmountEffectsInsideOfDeletedTree_complete(deletedSubtreeRoot) {
25112      while (nextEffect !== null) {
25113        var fiber = nextEffect;
25114        var sibling = fiber.sibling;
25115        var returnFiber = fiber.return;
25116  
25117        {
25118          // Recursively traverse the entire deleted tree and clean up fiber fields.
25119          // This is more aggressive than ideal, and the long term goal is to only
25120          // have to detach the deleted tree at the root.
25121          detachFiberAfterEffects(fiber);
25122  
25123          if (fiber === deletedSubtreeRoot) {
25124            nextEffect = null;
25125            return;
25126          }
25127        }
25128  
25129        if (sibling !== null) {
25130          sibling.return = returnFiber;
25131          nextEffect = sibling;
25132          return;
25133        }
25134  
25135        nextEffect = returnFiber;
25136      }
25137    }
25138  
25139    function commitPassiveUnmountInsideDeletedTreeOnFiber(current, nearestMountedAncestor) {
25140      switch (current.tag) {
25141        case FunctionComponent:
25142        case ForwardRef:
25143        case SimpleMemoComponent:
25144          {
25145            if ( current.mode & ProfileMode) {
25146              startPassiveEffectTimer();
25147              commitHookEffectListUnmount(Passive$1, current, nearestMountedAncestor);
25148              recordPassiveEffectDuration(current);
25149            } else {
25150              commitHookEffectListUnmount(Passive$1, current, nearestMountedAncestor);
25151            }
25152  
25153            break;
25154          }
25155      }
25156    } // TODO: Reuse reappearLayoutEffects traversal here?
25157  
25158  
25159    function invokeLayoutEffectMountInDEV(fiber) {
25160      {
25161        // We don't need to re-check StrictEffectsMode here.
25162        // This function is only called if that check has already passed.
25163        switch (fiber.tag) {
25164          case FunctionComponent:
25165          case ForwardRef:
25166          case SimpleMemoComponent:
25167            {
25168              try {
25169                commitHookEffectListMount(Layout | HasEffect, fiber);
25170              } catch (error) {
25171                captureCommitPhaseError(fiber, fiber.return, error);
25172              }
25173  
25174              break;
25175            }
25176  
25177          case ClassComponent:
25178            {
25179              var instance = fiber.stateNode;
25180  
25181              try {
25182                instance.componentDidMount();
25183              } catch (error) {
25184                captureCommitPhaseError(fiber, fiber.return, error);
25185              }
25186  
25187              break;
25188            }
25189        }
25190      }
25191    }
25192  
25193    function invokePassiveEffectMountInDEV(fiber) {
25194      {
25195        // We don't need to re-check StrictEffectsMode here.
25196        // This function is only called if that check has already passed.
25197        switch (fiber.tag) {
25198          case FunctionComponent:
25199          case ForwardRef:
25200          case SimpleMemoComponent:
25201            {
25202              try {
25203                commitHookEffectListMount(Passive$1 | HasEffect, fiber);
25204              } catch (error) {
25205                captureCommitPhaseError(fiber, fiber.return, error);
25206              }
25207  
25208              break;
25209            }
25210        }
25211      }
25212    }
25213  
25214    function invokeLayoutEffectUnmountInDEV(fiber) {
25215      {
25216        // We don't need to re-check StrictEffectsMode here.
25217        // This function is only called if that check has already passed.
25218        switch (fiber.tag) {
25219          case FunctionComponent:
25220          case ForwardRef:
25221          case SimpleMemoComponent:
25222            {
25223              try {
25224                commitHookEffectListUnmount(Layout | HasEffect, fiber, fiber.return);
25225              } catch (error) {
25226                captureCommitPhaseError(fiber, fiber.return, error);
25227              }
25228  
25229              break;
25230            }
25231  
25232          case ClassComponent:
25233            {
25234              var instance = fiber.stateNode;
25235  
25236              if (typeof instance.componentWillUnmount === 'function') {
25237                safelyCallComponentWillUnmount(fiber, fiber.return, instance);
25238              }
25239  
25240              break;
25241            }
25242        }
25243      }
25244    }
25245  
25246    function invokePassiveEffectUnmountInDEV(fiber) {
25247      {
25248        // We don't need to re-check StrictEffectsMode here.
25249        // This function is only called if that check has already passed.
25250        switch (fiber.tag) {
25251          case FunctionComponent:
25252          case ForwardRef:
25253          case SimpleMemoComponent:
25254            {
25255              try {
25256                commitHookEffectListUnmount(Passive$1 | HasEffect, fiber, fiber.return);
25257              } catch (error) {
25258                captureCommitPhaseError(fiber, fiber.return, error);
25259              }
25260            }
25261        }
25262      }
25263    }
25264  
25265    var COMPONENT_TYPE = 0;
25266    var HAS_PSEUDO_CLASS_TYPE = 1;
25267    var ROLE_TYPE = 2;
25268    var TEST_NAME_TYPE = 3;
25269    var TEXT_TYPE = 4;
25270  
25271    if (typeof Symbol === 'function' && Symbol.for) {
25272      var symbolFor = Symbol.for;
25273      COMPONENT_TYPE = symbolFor('selector.component');
25274      HAS_PSEUDO_CLASS_TYPE = symbolFor('selector.has_pseudo_class');
25275      ROLE_TYPE = symbolFor('selector.role');
25276      TEST_NAME_TYPE = symbolFor('selector.test_id');
25277      TEXT_TYPE = symbolFor('selector.text');
25278    }
25279    var commitHooks = [];
25280    function onCommitRoot$1() {
25281      {
25282        commitHooks.forEach(function (commitHook) {
25283          return commitHook();
25284        });
25285      }
25286    }
25287  
25288    var ReactCurrentActQueue = ReactSharedInternals.ReactCurrentActQueue;
25289    function isLegacyActEnvironment(fiber) {
25290      {
25291        // Legacy mode. We preserve the behavior of React 17's act. It assumes an
25292        // act environment whenever `jest` is defined, but you can still turn off
25293        // spurious warnings by setting IS_REACT_ACT_ENVIRONMENT explicitly
25294        // to false.
25295        var isReactActEnvironmentGlobal = // $FlowExpectedError – Flow doesn't know about IS_REACT_ACT_ENVIRONMENT global
25296        typeof IS_REACT_ACT_ENVIRONMENT !== 'undefined' ? IS_REACT_ACT_ENVIRONMENT : undefined; // $FlowExpectedError - Flow doesn't know about jest
25297  
25298        var jestIsDefined = typeof jest !== 'undefined';
25299        return  jestIsDefined && isReactActEnvironmentGlobal !== false;
25300      }
25301    }
25302    function isConcurrentActEnvironment() {
25303      {
25304        var isReactActEnvironmentGlobal = // $FlowExpectedError – Flow doesn't know about IS_REACT_ACT_ENVIRONMENT global
25305        typeof IS_REACT_ACT_ENVIRONMENT !== 'undefined' ? IS_REACT_ACT_ENVIRONMENT : undefined;
25306  
25307        if (!isReactActEnvironmentGlobal && ReactCurrentActQueue.current !== null) {
25308          // TODO: Include link to relevant documentation page.
25309          error('The current testing environment is not configured to support ' + 'act(...)');
25310        }
25311  
25312        return isReactActEnvironmentGlobal;
25313      }
25314    }
25315  
25316    var ceil = Math.ceil;
25317    var ReactCurrentDispatcher$2 = ReactSharedInternals.ReactCurrentDispatcher,
25318        ReactCurrentOwner$2 = ReactSharedInternals.ReactCurrentOwner,
25319        ReactCurrentBatchConfig$3 = ReactSharedInternals.ReactCurrentBatchConfig,
25320        ReactCurrentActQueue$1 = ReactSharedInternals.ReactCurrentActQueue;
25321    var NoContext =
25322    /*             */
25323    0;
25324    var BatchedContext =
25325    /*               */
25326    1;
25327    var RenderContext =
25328    /*                */
25329    2;
25330    var CommitContext =
25331    /*                */
25332    4;
25333    var RootInProgress = 0;
25334    var RootFatalErrored = 1;
25335    var RootErrored = 2;
25336    var RootSuspended = 3;
25337    var RootSuspendedWithDelay = 4;
25338    var RootCompleted = 5;
25339    var RootDidNotComplete = 6; // Describes where we are in the React execution stack
25340  
25341    var executionContext = NoContext; // The root we're working on
25342  
25343    var workInProgressRoot = null; // The fiber we're working on
25344  
25345    var workInProgress = null; // The lanes we're rendering
25346  
25347    var workInProgressRootRenderLanes = NoLanes; // Stack that allows components to change the render lanes for its subtree
25348    // This is a superset of the lanes we started working on at the root. The only
25349    // case where it's different from `workInProgressRootRenderLanes` is when we
25350    // enter a subtree that is hidden and needs to be unhidden: Suspense and
25351    // Offscreen component.
25352    //
25353    // Most things in the work loop should deal with workInProgressRootRenderLanes.
25354    // Most things in begin/complete phases should deal with subtreeRenderLanes.
25355  
25356    var subtreeRenderLanes = NoLanes;
25357    var subtreeRenderLanesCursor = createCursor(NoLanes); // Whether to root completed, errored, suspended, etc.
25358  
25359    var workInProgressRootExitStatus = RootInProgress; // A fatal error, if one is thrown
25360  
25361    var workInProgressRootFatalError = null; // "Included" lanes refer to lanes that were worked on during this render. It's
25362    // slightly different than `renderLanes` because `renderLanes` can change as you
25363    // enter and exit an Offscreen tree. This value is the combination of all render
25364    // lanes for the entire render phase.
25365  
25366    var workInProgressRootIncludedLanes = NoLanes; // The work left over by components that were visited during this render. Only
25367    // includes unprocessed updates, not work in bailed out children.
25368  
25369    var workInProgressRootSkippedLanes = NoLanes; // Lanes that were updated (in an interleaved event) during this render.
25370  
25371    var workInProgressRootInterleavedUpdatedLanes = NoLanes; // Lanes that were updated during the render phase (*not* an interleaved event).
25372  
25373    var workInProgressRootPingedLanes = NoLanes; // Errors that are thrown during the render phase.
25374  
25375    var workInProgressRootConcurrentErrors = null; // These are errors that we recovered from without surfacing them to the UI.
25376    // We will log them once the tree commits.
25377  
25378    var workInProgressRootRecoverableErrors = null; // The most recent time we committed a fallback. This lets us ensure a train
25379    // model where we don't commit new loading states in too quick succession.
25380  
25381    var globalMostRecentFallbackTime = 0;
25382    var FALLBACK_THROTTLE_MS = 500; // The absolute time for when we should start giving up on rendering
25383    // more and prefer CPU suspense heuristics instead.
25384  
25385    var workInProgressRootRenderTargetTime = Infinity; // How long a render is supposed to take before we start following CPU
25386    // suspense heuristics and opt out of rendering more content.
25387  
25388    var RENDER_TIMEOUT_MS = 500;
25389    var workInProgressTransitions = null;
25390  
25391    function resetRenderTimer() {
25392      workInProgressRootRenderTargetTime = now() + RENDER_TIMEOUT_MS;
25393    }
25394  
25395    function getRenderTargetTime() {
25396      return workInProgressRootRenderTargetTime;
25397    }
25398    var hasUncaughtError = false;
25399    var firstUncaughtError = null;
25400    var legacyErrorBoundariesThatAlreadyFailed = null; // Only used when enableProfilerNestedUpdateScheduledHook is true;
25401    var rootDoesHavePassiveEffects = false;
25402    var rootWithPendingPassiveEffects = null;
25403    var pendingPassiveEffectsLanes = NoLanes;
25404    var pendingPassiveProfilerEffects = [];
25405    var pendingPassiveTransitions = null; // Use these to prevent an infinite loop of nested updates
25406  
25407    var NESTED_UPDATE_LIMIT = 50;
25408    var nestedUpdateCount = 0;
25409    var rootWithNestedUpdates = null;
25410    var isFlushingPassiveEffects = false;
25411    var didScheduleUpdateDuringPassiveEffects = false;
25412    var NESTED_PASSIVE_UPDATE_LIMIT = 50;
25413    var nestedPassiveUpdateCount = 0;
25414    var rootWithPassiveNestedUpdates = null; // If two updates are scheduled within the same event, we should treat their
25415    // event times as simultaneous, even if the actual clock time has advanced
25416    // between the first and second call.
25417  
25418    var currentEventTime = NoTimestamp;
25419    var currentEventTransitionLane = NoLanes;
25420    var isRunningInsertionEffect = false;
25421    function getWorkInProgressRoot() {
25422      return workInProgressRoot;
25423    }
25424    function requestEventTime() {
25425      if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
25426        // We're inside React, so it's fine to read the actual time.
25427        return now();
25428      } // We're not inside React, so we may be in the middle of a browser event.
25429  
25430  
25431      if (currentEventTime !== NoTimestamp) {
25432        // Use the same start time for all updates until we enter React again.
25433        return currentEventTime;
25434      } // This is the first update since React yielded. Compute a new start time.
25435  
25436  
25437      currentEventTime = now();
25438      return currentEventTime;
25439    }
25440    function requestUpdateLane(fiber) {
25441      // Special cases
25442      var mode = fiber.mode;
25443  
25444      if ((mode & ConcurrentMode) === NoMode) {
25445        return SyncLane;
25446      } else if ( (executionContext & RenderContext) !== NoContext && workInProgressRootRenderLanes !== NoLanes) {
25447        // This is a render phase update. These are not officially supported. The
25448        // old behavior is to give this the same "thread" (lanes) as
25449        // whatever is currently rendering. So if you call `setState` on a component
25450        // that happens later in the same render, it will flush. Ideally, we want to
25451        // remove the special case and treat them as if they came from an
25452        // interleaved event. Regardless, this pattern is not officially supported.
25453        // This behavior is only a fallback. The flag only exists until we can roll
25454        // out the setState warning, since existing code might accidentally rely on
25455        // the current behavior.
25456        return pickArbitraryLane(workInProgressRootRenderLanes);
25457      }
25458  
25459      var isTransition = requestCurrentTransition() !== NoTransition;
25460  
25461      if (isTransition) {
25462        if ( ReactCurrentBatchConfig$3.transition !== null) {
25463          var transition = ReactCurrentBatchConfig$3.transition;
25464  
25465          if (!transition._updatedFibers) {
25466            transition._updatedFibers = new Set();
25467          }
25468  
25469          transition._updatedFibers.add(fiber);
25470        } // The algorithm for assigning an update to a lane should be stable for all
25471        // updates at the same priority within the same event. To do this, the
25472        // inputs to the algorithm must be the same.
25473        //
25474        // The trick we use is to cache the first of each of these inputs within an
25475        // event. Then reset the cached values once we can be sure the event is
25476        // over. Our heuristic for that is whenever we enter a concurrent work loop.
25477  
25478  
25479        if (currentEventTransitionLane === NoLane) {
25480          // All transitions within the same event are assigned the same lane.
25481          currentEventTransitionLane = claimNextTransitionLane();
25482        }
25483  
25484        return currentEventTransitionLane;
25485      } // Updates originating inside certain React methods, like flushSync, have
25486      // their priority set by tracking it with a context variable.
25487      //
25488      // The opaque type returned by the host config is internally a lane, so we can
25489      // use that directly.
25490      // TODO: Move this type conversion to the event priority module.
25491  
25492  
25493      var updateLane = getCurrentUpdatePriority();
25494  
25495      if (updateLane !== NoLane) {
25496        return updateLane;
25497      } // This update originated outside React. Ask the host environment for an
25498      // appropriate priority, based on the type of event.
25499      //
25500      // The opaque type returned by the host config is internally a lane, so we can
25501      // use that directly.
25502      // TODO: Move this type conversion to the event priority module.
25503  
25504  
25505      var eventLane = getCurrentEventPriority();
25506      return eventLane;
25507    }
25508  
25509    function requestRetryLane(fiber) {
25510      // This is a fork of `requestUpdateLane` designed specifically for Suspense
25511      // "retries" — a special update that attempts to flip a Suspense boundary
25512      // from its placeholder state to its primary/resolved state.
25513      // Special cases
25514      var mode = fiber.mode;
25515  
25516      if ((mode & ConcurrentMode) === NoMode) {
25517        return SyncLane;
25518      }
25519  
25520      return claimNextRetryLane();
25521    }
25522  
25523    function scheduleUpdateOnFiber(root, fiber, lane, eventTime) {
25524      checkForNestedUpdates();
25525  
25526      {
25527        if (isRunningInsertionEffect) {
25528          error('useInsertionEffect must not schedule updates.');
25529        }
25530      }
25531  
25532      {
25533        if (isFlushingPassiveEffects) {
25534          didScheduleUpdateDuringPassiveEffects = true;
25535        }
25536      } // Mark that the root has a pending update.
25537  
25538  
25539      markRootUpdated(root, lane, eventTime);
25540  
25541      if ((executionContext & RenderContext) !== NoLanes && root === workInProgressRoot) {
25542        // This update was dispatched during the render phase. This is a mistake
25543        // if the update originates from user space (with the exception of local
25544        // hook updates, which are handled differently and don't reach this
25545        // function), but there are some internal React features that use this as
25546        // an implementation detail, like selective hydration.
25547        warnAboutRenderPhaseUpdatesInDEV(fiber); // Track lanes that were updated during the render phase
25548      } else {
25549        // This is a normal update, scheduled from outside the render phase. For
25550        // example, during an input event.
25551        {
25552          if (isDevToolsPresent) {
25553            addFiberToLanesMap(root, fiber, lane);
25554          }
25555        }
25556  
25557        warnIfUpdatesNotWrappedWithActDEV(fiber);
25558  
25559        if (root === workInProgressRoot) {
25560          // Received an update to a tree that's in the middle of rendering. Mark
25561          // that there was an interleaved update work on this root. Unless the
25562          // `deferRenderPhaseUpdateToNextBatch` flag is off and this is a render
25563          // phase update. In that case, we don't treat render phase updates as if
25564          // they were interleaved, for backwards compat reasons.
25565          if ( (executionContext & RenderContext) === NoContext) {
25566            workInProgressRootInterleavedUpdatedLanes = mergeLanes(workInProgressRootInterleavedUpdatedLanes, lane);
25567          }
25568  
25569          if (workInProgressRootExitStatus === RootSuspendedWithDelay) {
25570            // The root already suspended with a delay, which means this render
25571            // definitely won't finish. Since we have a new update, let's mark it as
25572            // suspended now, right before marking the incoming update. This has the
25573            // effect of interrupting the current render and switching to the update.
25574            // TODO: Make sure this doesn't override pings that happen while we've
25575            // already started rendering.
25576            markRootSuspended$1(root, workInProgressRootRenderLanes);
25577          }
25578        }
25579  
25580        ensureRootIsScheduled(root, eventTime);
25581  
25582        if (lane === SyncLane && executionContext === NoContext && (fiber.mode & ConcurrentMode) === NoMode && // Treat `act` as if it's inside `batchedUpdates`, even in legacy mode.
25583        !( ReactCurrentActQueue$1.isBatchingLegacy)) {
25584          // Flush the synchronous work now, unless we're already working or inside
25585          // a batch. This is intentionally inside scheduleUpdateOnFiber instead of
25586          // scheduleCallbackForFiber to preserve the ability to schedule a callback
25587          // without immediately flushing it. We only do this for user-initiated
25588          // updates, to preserve historical behavior of legacy mode.
25589          resetRenderTimer();
25590          flushSyncCallbacksOnlyInLegacyMode();
25591        }
25592      }
25593    }
25594    function scheduleInitialHydrationOnRoot(root, lane, eventTime) {
25595      // This is a special fork of scheduleUpdateOnFiber that is only used to
25596      // schedule the initial hydration of a root that has just been created. Most
25597      // of the stuff in scheduleUpdateOnFiber can be skipped.
25598      //
25599      // The main reason for this separate path, though, is to distinguish the
25600      // initial children from subsequent updates. In fully client-rendered roots
25601      // (createRoot instead of hydrateRoot), all top-level renders are modeled as
25602      // updates, but hydration roots are special because the initial render must
25603      // match what was rendered on the server.
25604      var current = root.current;
25605      current.lanes = lane;
25606      markRootUpdated(root, lane, eventTime);
25607      ensureRootIsScheduled(root, eventTime);
25608    }
25609    function isUnsafeClassRenderPhaseUpdate(fiber) {
25610      // Check if this is a render phase update. Only called by class components,
25611      // which special (deprecated) behavior for UNSAFE_componentWillReceive props.
25612      return (// TODO: Remove outdated deferRenderPhaseUpdateToNextBatch experiment. We
25613        // decided not to enable it.
25614         (executionContext & RenderContext) !== NoContext
25615      );
25616    } // Use this function to schedule a task for a root. There's only one task per
25617    // root; if a task was already scheduled, we'll check to make sure the priority
25618    // of the existing task is the same as the priority of the next level that the
25619    // root has work on. This function is called on every update, and right before
25620    // exiting a task.
25621  
25622    function ensureRootIsScheduled(root, currentTime) {
25623      var existingCallbackNode = root.callbackNode; // Check if any lanes are being starved by other work. If so, mark them as
25624      // expired so we know to work on those next.
25625  
25626      markStarvedLanesAsExpired(root, currentTime); // Determine the next lanes to work on, and their priority.
25627  
25628      var nextLanes = getNextLanes(root, root === workInProgressRoot ? workInProgressRootRenderLanes : NoLanes);
25629  
25630      if (nextLanes === NoLanes) {
25631        // Special case: There's nothing to work on.
25632        if (existingCallbackNode !== null) {
25633          cancelCallback$1(existingCallbackNode);
25634        }
25635  
25636        root.callbackNode = null;
25637        root.callbackPriority = NoLane;
25638        return;
25639      } // We use the highest priority lane to represent the priority of the callback.
25640  
25641  
25642      var newCallbackPriority = getHighestPriorityLane(nextLanes); // Check if there's an existing task. We may be able to reuse it.
25643  
25644      var existingCallbackPriority = root.callbackPriority;
25645  
25646      if (existingCallbackPriority === newCallbackPriority && // Special case related to `act`. If the currently scheduled task is a
25647      // Scheduler task, rather than an `act` task, cancel it and re-scheduled
25648      // on the `act` queue.
25649      !( ReactCurrentActQueue$1.current !== null && existingCallbackNode !== fakeActCallbackNode)) {
25650        {
25651          // If we're going to re-use an existing task, it needs to exist.
25652          // Assume that discrete update microtasks are non-cancellable and null.
25653          // TODO: Temporary until we confirm this warning is not fired.
25654          if (existingCallbackNode == null && existingCallbackPriority !== SyncLane) {
25655            error('Expected scheduled callback to exist. This error is likely caused by a bug in React. Please file an issue.');
25656          }
25657        } // The priority hasn't changed. We can reuse the existing task. Exit.
25658  
25659  
25660        return;
25661      }
25662  
25663      if (existingCallbackNode != null) {
25664        // Cancel the existing callback. We'll schedule a new one below.
25665        cancelCallback$1(existingCallbackNode);
25666      } // Schedule a new callback.
25667  
25668  
25669      var newCallbackNode;
25670  
25671      if (newCallbackPriority === SyncLane) {
25672        // Special case: Sync React callbacks are scheduled on a special
25673        // internal queue
25674        if (root.tag === LegacyRoot) {
25675          if ( ReactCurrentActQueue$1.isBatchingLegacy !== null) {
25676            ReactCurrentActQueue$1.didScheduleLegacyUpdate = true;
25677          }
25678  
25679          scheduleLegacySyncCallback(performSyncWorkOnRoot.bind(null, root));
25680        } else {
25681          scheduleSyncCallback(performSyncWorkOnRoot.bind(null, root));
25682        }
25683  
25684        {
25685          // Flush the queue in a microtask.
25686          if ( ReactCurrentActQueue$1.current !== null) {
25687            // Inside `act`, use our internal `act` queue so that these get flushed
25688            // at the end of the current scope even when using the sync version
25689            // of `act`.
25690            ReactCurrentActQueue$1.current.push(flushSyncCallbacks);
25691          } else {
25692            scheduleMicrotask(function () {
25693              // In Safari, appending an iframe forces microtasks to run.
25694              // https://github.com/facebook/react/issues/22459
25695              // We don't support running callbacks in the middle of render
25696              // or commit so we need to check against that.
25697              if ((executionContext & (RenderContext | CommitContext)) === NoContext) {
25698                // Note that this would still prematurely flush the callbacks
25699                // if this happens outside render or commit phase (e.g. in an event).
25700                flushSyncCallbacks();
25701              }
25702            });
25703          }
25704        }
25705  
25706        newCallbackNode = null;
25707      } else {
25708        var schedulerPriorityLevel;
25709  
25710        switch (lanesToEventPriority(nextLanes)) {
25711          case DiscreteEventPriority:
25712            schedulerPriorityLevel = ImmediatePriority;
25713            break;
25714  
25715          case ContinuousEventPriority:
25716            schedulerPriorityLevel = UserBlockingPriority;
25717            break;
25718  
25719          case DefaultEventPriority:
25720            schedulerPriorityLevel = NormalPriority;
25721            break;
25722  
25723          case IdleEventPriority:
25724            schedulerPriorityLevel = IdlePriority;
25725            break;
25726  
25727          default:
25728            schedulerPriorityLevel = NormalPriority;
25729            break;
25730        }
25731  
25732        newCallbackNode = scheduleCallback$1(schedulerPriorityLevel, performConcurrentWorkOnRoot.bind(null, root));
25733      }
25734  
25735      root.callbackPriority = newCallbackPriority;
25736      root.callbackNode = newCallbackNode;
25737    } // This is the entry point for every concurrent task, i.e. anything that
25738    // goes through Scheduler.
25739  
25740  
25741    function performConcurrentWorkOnRoot(root, didTimeout) {
25742      {
25743        resetNestedUpdateFlag();
25744      } // Since we know we're in a React event, we can clear the current
25745      // event time. The next update will compute a new event time.
25746  
25747  
25748      currentEventTime = NoTimestamp;
25749      currentEventTransitionLane = NoLanes;
25750  
25751      if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
25752        throw new Error('Should not already be working.');
25753      } // Flush any pending passive effects before deciding which lanes to work on,
25754      // in case they schedule additional work.
25755  
25756  
25757      var originalCallbackNode = root.callbackNode;
25758      var didFlushPassiveEffects = flushPassiveEffects();
25759  
25760      if (didFlushPassiveEffects) {
25761        // Something in the passive effect phase may have canceled the current task.
25762        // Check if the task node for this root was changed.
25763        if (root.callbackNode !== originalCallbackNode) {
25764          // The current task was canceled. Exit. We don't need to call
25765          // `ensureRootIsScheduled` because the check above implies either that
25766          // there's a new task, or that there's no remaining work on this root.
25767          return null;
25768        }
25769      } // Determine the next lanes to work on, using the fields stored
25770      // on the root.
25771  
25772  
25773      var lanes = getNextLanes(root, root === workInProgressRoot ? workInProgressRootRenderLanes : NoLanes);
25774  
25775      if (lanes === NoLanes) {
25776        // Defensive coding. This is never expected to happen.
25777        return null;
25778      } // We disable time-slicing in some cases: if the work has been CPU-bound
25779      // for too long ("expired" work, to prevent starvation), or we're in
25780      // sync-updates-by-default mode.
25781      // TODO: We only check `didTimeout` defensively, to account for a Scheduler
25782      // bug we're still investigating. Once the bug in Scheduler is fixed,
25783      // we can remove this, since we track expiration ourselves.
25784  
25785  
25786      var shouldTimeSlice = !includesBlockingLane(root, lanes) && !includesExpiredLane(root, lanes) && ( !didTimeout);
25787      var exitStatus = shouldTimeSlice ? renderRootConcurrent(root, lanes) : renderRootSync(root, lanes);
25788  
25789      if (exitStatus !== RootInProgress) {
25790        if (exitStatus === RootErrored) {
25791          // If something threw an error, try rendering one more time. We'll
25792          // render synchronously to block concurrent data mutations, and we'll
25793          // includes all pending updates are included. If it still fails after
25794          // the second attempt, we'll give up and commit the resulting tree.
25795          var errorRetryLanes = getLanesToRetrySynchronouslyOnError(root);
25796  
25797          if (errorRetryLanes !== NoLanes) {
25798            lanes = errorRetryLanes;
25799            exitStatus = recoverFromConcurrentError(root, errorRetryLanes);
25800          }
25801        }
25802  
25803        if (exitStatus === RootFatalErrored) {
25804          var fatalError = workInProgressRootFatalError;
25805          prepareFreshStack(root, NoLanes);
25806          markRootSuspended$1(root, lanes);
25807          ensureRootIsScheduled(root, now());
25808          throw fatalError;
25809        }
25810  
25811        if (exitStatus === RootDidNotComplete) {
25812          // The render unwound without completing the tree. This happens in special
25813          // cases where need to exit the current render without producing a
25814          // consistent tree or committing.
25815          //
25816          // This should only happen during a concurrent render, not a discrete or
25817          // synchronous update. We should have already checked for this when we
25818          // unwound the stack.
25819          markRootSuspended$1(root, lanes);
25820        } else {
25821          // The render completed.
25822          // Check if this render may have yielded to a concurrent event, and if so,
25823          // confirm that any newly rendered stores are consistent.
25824          // TODO: It's possible that even a concurrent render may never have yielded
25825          // to the main thread, if it was fast enough, or if it expired. We could
25826          // skip the consistency check in that case, too.
25827          var renderWasConcurrent = !includesBlockingLane(root, lanes);
25828          var finishedWork = root.current.alternate;
25829  
25830          if (renderWasConcurrent && !isRenderConsistentWithExternalStores(finishedWork)) {
25831            // A store was mutated in an interleaved event. Render again,
25832            // synchronously, to block further mutations.
25833            exitStatus = renderRootSync(root, lanes); // We need to check again if something threw
25834  
25835            if (exitStatus === RootErrored) {
25836              var _errorRetryLanes = getLanesToRetrySynchronouslyOnError(root);
25837  
25838              if (_errorRetryLanes !== NoLanes) {
25839                lanes = _errorRetryLanes;
25840                exitStatus = recoverFromConcurrentError(root, _errorRetryLanes); // We assume the tree is now consistent because we didn't yield to any
25841                // concurrent events.
25842              }
25843            }
25844  
25845            if (exitStatus === RootFatalErrored) {
25846              var _fatalError = workInProgressRootFatalError;
25847              prepareFreshStack(root, NoLanes);
25848              markRootSuspended$1(root, lanes);
25849              ensureRootIsScheduled(root, now());
25850              throw _fatalError;
25851            }
25852          } // We now have a consistent tree. The next step is either to commit it,
25853          // or, if something suspended, wait to commit it after a timeout.
25854  
25855  
25856          root.finishedWork = finishedWork;
25857          root.finishedLanes = lanes;
25858          finishConcurrentRender(root, exitStatus, lanes);
25859        }
25860      }
25861  
25862      ensureRootIsScheduled(root, now());
25863  
25864      if (root.callbackNode === originalCallbackNode) {
25865        // The task node scheduled for this root is the same one that's
25866        // currently executed. Need to return a continuation.
25867        return performConcurrentWorkOnRoot.bind(null, root);
25868      }
25869  
25870      return null;
25871    }
25872  
25873    function recoverFromConcurrentError(root, errorRetryLanes) {
25874      // If an error occurred during hydration, discard server response and fall
25875      // back to client side render.
25876      // Before rendering again, save the errors from the previous attempt.
25877      var errorsFromFirstAttempt = workInProgressRootConcurrentErrors;
25878  
25879      if (isRootDehydrated(root)) {
25880        // The shell failed to hydrate. Set a flag to force a client rendering
25881        // during the next attempt. To do this, we call prepareFreshStack now
25882        // to create the root work-in-progress fiber. This is a bit weird in terms
25883        // of factoring, because it relies on renderRootSync not calling
25884        // prepareFreshStack again in the call below, which happens because the
25885        // root and lanes haven't changed.
25886        //
25887        // TODO: I think what we should do is set ForceClientRender inside
25888        // throwException, like we do for nested Suspense boundaries. The reason
25889        // it's here instead is so we can switch to the synchronous work loop, too.
25890        // Something to consider for a future refactor.
25891        var rootWorkInProgress = prepareFreshStack(root, errorRetryLanes);
25892        rootWorkInProgress.flags |= ForceClientRender;
25893  
25894        {
25895          errorHydratingContainer(root.containerInfo);
25896        }
25897      }
25898  
25899      var exitStatus = renderRootSync(root, errorRetryLanes);
25900  
25901      if (exitStatus !== RootErrored) {
25902        // Successfully finished rendering on retry
25903        // The errors from the failed first attempt have been recovered. Add
25904        // them to the collection of recoverable errors. We'll log them in the
25905        // commit phase.
25906        var errorsFromSecondAttempt = workInProgressRootRecoverableErrors;
25907        workInProgressRootRecoverableErrors = errorsFromFirstAttempt; // The errors from the second attempt should be queued after the errors
25908        // from the first attempt, to preserve the causal sequence.
25909  
25910        if (errorsFromSecondAttempt !== null) {
25911          queueRecoverableErrors(errorsFromSecondAttempt);
25912        }
25913      }
25914  
25915      return exitStatus;
25916    }
25917  
25918    function queueRecoverableErrors(errors) {
25919      if (workInProgressRootRecoverableErrors === null) {
25920        workInProgressRootRecoverableErrors = errors;
25921      } else {
25922        workInProgressRootRecoverableErrors.push.apply(workInProgressRootRecoverableErrors, errors);
25923      }
25924    }
25925  
25926    function finishConcurrentRender(root, exitStatus, lanes) {
25927      switch (exitStatus) {
25928        case RootInProgress:
25929        case RootFatalErrored:
25930          {
25931            throw new Error('Root did not complete. This is a bug in React.');
25932          }
25933        // Flow knows about invariant, so it complains if I add a break
25934        // statement, but eslint doesn't know about invariant, so it complains
25935        // if I do. eslint-disable-next-line no-fallthrough
25936  
25937        case RootErrored:
25938          {
25939            // We should have already attempted to retry this tree. If we reached
25940            // this point, it errored again. Commit it.
25941            commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions);
25942            break;
25943          }
25944  
25945        case RootSuspended:
25946          {
25947            markRootSuspended$1(root, lanes); // We have an acceptable loading state. We need to figure out if we
25948            // should immediately commit it or wait a bit.
25949  
25950            if (includesOnlyRetries(lanes) && // do not delay if we're inside an act() scope
25951            !shouldForceFlushFallbacksInDEV()) {
25952              // This render only included retries, no updates. Throttle committing
25953              // retries so that we don't show too many loading states too quickly.
25954              var msUntilTimeout = globalMostRecentFallbackTime + FALLBACK_THROTTLE_MS - now(); // Don't bother with a very short suspense time.
25955  
25956              if (msUntilTimeout > 10) {
25957                var nextLanes = getNextLanes(root, NoLanes);
25958  
25959                if (nextLanes !== NoLanes) {
25960                  // There's additional work on this root.
25961                  break;
25962                }
25963  
25964                var suspendedLanes = root.suspendedLanes;
25965  
25966                if (!isSubsetOfLanes(suspendedLanes, lanes)) {
25967                  // We should prefer to render the fallback of at the last
25968                  // suspended level. Ping the last suspended level to try
25969                  // rendering it again.
25970                  // FIXME: What if the suspended lanes are Idle? Should not restart.
25971                  var eventTime = requestEventTime();
25972                  markRootPinged(root, suspendedLanes);
25973                  break;
25974                } // The render is suspended, it hasn't timed out, and there's no
25975                // lower priority work to do. Instead of committing the fallback
25976                // immediately, wait for more data to arrive.
25977  
25978  
25979                root.timeoutHandle = scheduleTimeout(commitRoot.bind(null, root, workInProgressRootRecoverableErrors, workInProgressTransitions), msUntilTimeout);
25980                break;
25981              }
25982            } // The work expired. Commit immediately.
25983  
25984  
25985            commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions);
25986            break;
25987          }
25988  
25989        case RootSuspendedWithDelay:
25990          {
25991            markRootSuspended$1(root, lanes);
25992  
25993            if (includesOnlyTransitions(lanes)) {
25994              // This is a transition, so we should exit without committing a
25995              // placeholder and without scheduling a timeout. Delay indefinitely
25996              // until we receive more data.
25997              break;
25998            }
25999  
26000            if (!shouldForceFlushFallbacksInDEV()) {
26001              // This is not a transition, but we did trigger an avoided state.
26002              // Schedule a placeholder to display after a short delay, using the Just
26003              // Noticeable Difference.
26004              // TODO: Is the JND optimization worth the added complexity? If this is
26005              // the only reason we track the event time, then probably not.
26006              // Consider removing.
26007              var mostRecentEventTime = getMostRecentEventTime(root, lanes);
26008              var eventTimeMs = mostRecentEventTime;
26009              var timeElapsedMs = now() - eventTimeMs;
26010  
26011              var _msUntilTimeout = jnd(timeElapsedMs) - timeElapsedMs; // Don't bother with a very short suspense time.
26012  
26013  
26014              if (_msUntilTimeout > 10) {
26015                // Instead of committing the fallback immediately, wait for more data
26016                // to arrive.
26017                root.timeoutHandle = scheduleTimeout(commitRoot.bind(null, root, workInProgressRootRecoverableErrors, workInProgressTransitions), _msUntilTimeout);
26018                break;
26019              }
26020            } // Commit the placeholder.
26021  
26022  
26023            commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions);
26024            break;
26025          }
26026  
26027        case RootCompleted:
26028          {
26029            // The work completed. Ready to commit.
26030            commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions);
26031            break;
26032          }
26033  
26034        default:
26035          {
26036            throw new Error('Unknown root exit status.');
26037          }
26038      }
26039    }
26040  
26041    function isRenderConsistentWithExternalStores(finishedWork) {
26042      // Search the rendered tree for external store reads, and check whether the
26043      // stores were mutated in a concurrent event. Intentionally using an iterative
26044      // loop instead of recursion so we can exit early.
26045      var node = finishedWork;
26046  
26047      while (true) {
26048        if (node.flags & StoreConsistency) {
26049          var updateQueue = node.updateQueue;
26050  
26051          if (updateQueue !== null) {
26052            var checks = updateQueue.stores;
26053  
26054            if (checks !== null) {
26055              for (var i = 0; i < checks.length; i++) {
26056                var check = checks[i];
26057                var getSnapshot = check.getSnapshot;
26058                var renderedValue = check.value;
26059  
26060                try {
26061                  if (!objectIs(getSnapshot(), renderedValue)) {
26062                    // Found an inconsistent store.
26063                    return false;
26064                  }
26065                } catch (error) {
26066                  // If `getSnapshot` throws, return `false`. This will schedule
26067                  // a re-render, and the error will be rethrown during render.
26068                  return false;
26069                }
26070              }
26071            }
26072          }
26073        }
26074  
26075        var child = node.child;
26076  
26077        if (node.subtreeFlags & StoreConsistency && child !== null) {
26078          child.return = node;
26079          node = child;
26080          continue;
26081        }
26082  
26083        if (node === finishedWork) {
26084          return true;
26085        }
26086  
26087        while (node.sibling === null) {
26088          if (node.return === null || node.return === finishedWork) {
26089            return true;
26090          }
26091  
26092          node = node.return;
26093        }
26094  
26095        node.sibling.return = node.return;
26096        node = node.sibling;
26097      } // Flow doesn't know this is unreachable, but eslint does
26098      // eslint-disable-next-line no-unreachable
26099  
26100  
26101      return true;
26102    }
26103  
26104    function markRootSuspended$1(root, suspendedLanes) {
26105      // When suspending, we should always exclude lanes that were pinged or (more
26106      // rarely, since we try to avoid it) updated during the render phase.
26107      // TODO: Lol maybe there's a better way to factor this besides this
26108      // obnoxiously named function :)
26109      suspendedLanes = removeLanes(suspendedLanes, workInProgressRootPingedLanes);
26110      suspendedLanes = removeLanes(suspendedLanes, workInProgressRootInterleavedUpdatedLanes);
26111      markRootSuspended(root, suspendedLanes);
26112    } // This is the entry point for synchronous tasks that don't go
26113    // through Scheduler
26114  
26115  
26116    function performSyncWorkOnRoot(root) {
26117      {
26118        syncNestedUpdateFlag();
26119      }
26120  
26121      if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
26122        throw new Error('Should not already be working.');
26123      }
26124  
26125      flushPassiveEffects();
26126      var lanes = getNextLanes(root, NoLanes);
26127  
26128      if (!includesSomeLane(lanes, SyncLane)) {
26129        // There's no remaining sync work left.
26130        ensureRootIsScheduled(root, now());
26131        return null;
26132      }
26133  
26134      var exitStatus = renderRootSync(root, lanes);
26135  
26136      if (root.tag !== LegacyRoot && exitStatus === RootErrored) {
26137        // If something threw an error, try rendering one more time. We'll render
26138        // synchronously to block concurrent data mutations, and we'll includes
26139        // all pending updates are included. If it still fails after the second
26140        // attempt, we'll give up and commit the resulting tree.
26141        var errorRetryLanes = getLanesToRetrySynchronouslyOnError(root);
26142  
26143        if (errorRetryLanes !== NoLanes) {
26144          lanes = errorRetryLanes;
26145          exitStatus = recoverFromConcurrentError(root, errorRetryLanes);
26146        }
26147      }
26148  
26149      if (exitStatus === RootFatalErrored) {
26150        var fatalError = workInProgressRootFatalError;
26151        prepareFreshStack(root, NoLanes);
26152        markRootSuspended$1(root, lanes);
26153        ensureRootIsScheduled(root, now());
26154        throw fatalError;
26155      }
26156  
26157      if (exitStatus === RootDidNotComplete) {
26158        throw new Error('Root did not complete. This is a bug in React.');
26159      } // We now have a consistent tree. Because this is a sync render, we
26160      // will commit it even if something suspended.
26161  
26162  
26163      var finishedWork = root.current.alternate;
26164      root.finishedWork = finishedWork;
26165      root.finishedLanes = lanes;
26166      commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions); // Before exiting, make sure there's a callback scheduled for the next
26167      // pending level.
26168  
26169      ensureRootIsScheduled(root, now());
26170      return null;
26171    }
26172  
26173    function flushRoot(root, lanes) {
26174      if (lanes !== NoLanes) {
26175        markRootEntangled(root, mergeLanes(lanes, SyncLane));
26176        ensureRootIsScheduled(root, now());
26177  
26178        if ((executionContext & (RenderContext | CommitContext)) === NoContext) {
26179          resetRenderTimer();
26180          flushSyncCallbacks();
26181        }
26182      }
26183    }
26184    function batchedUpdates$1(fn, a) {
26185      var prevExecutionContext = executionContext;
26186      executionContext |= BatchedContext;
26187  
26188      try {
26189        return fn(a);
26190      } finally {
26191        executionContext = prevExecutionContext; // If there were legacy sync updates, flush them at the end of the outer
26192        // most batchedUpdates-like method.
26193  
26194        if (executionContext === NoContext && // Treat `act` as if it's inside `batchedUpdates`, even in legacy mode.
26195        !( ReactCurrentActQueue$1.isBatchingLegacy)) {
26196          resetRenderTimer();
26197          flushSyncCallbacksOnlyInLegacyMode();
26198        }
26199      }
26200    }
26201    function discreteUpdates(fn, a, b, c, d) {
26202      var previousPriority = getCurrentUpdatePriority();
26203      var prevTransition = ReactCurrentBatchConfig$3.transition;
26204  
26205      try {
26206        ReactCurrentBatchConfig$3.transition = null;
26207        setCurrentUpdatePriority(DiscreteEventPriority);
26208        return fn(a, b, c, d);
26209      } finally {
26210        setCurrentUpdatePriority(previousPriority);
26211        ReactCurrentBatchConfig$3.transition = prevTransition;
26212  
26213        if (executionContext === NoContext) {
26214          resetRenderTimer();
26215        }
26216      }
26217    } // Overload the definition to the two valid signatures.
26218    // Warning, this opts-out of checking the function body.
26219  
26220    // eslint-disable-next-line no-redeclare
26221    function flushSync(fn) {
26222      // In legacy mode, we flush pending passive effects at the beginning of the
26223      // next event, not at the end of the previous one.
26224      if (rootWithPendingPassiveEffects !== null && rootWithPendingPassiveEffects.tag === LegacyRoot && (executionContext & (RenderContext | CommitContext)) === NoContext) {
26225        flushPassiveEffects();
26226      }
26227  
26228      var prevExecutionContext = executionContext;
26229      executionContext |= BatchedContext;
26230      var prevTransition = ReactCurrentBatchConfig$3.transition;
26231      var previousPriority = getCurrentUpdatePriority();
26232  
26233      try {
26234        ReactCurrentBatchConfig$3.transition = null;
26235        setCurrentUpdatePriority(DiscreteEventPriority);
26236  
26237        if (fn) {
26238          return fn();
26239        } else {
26240          return undefined;
26241        }
26242      } finally {
26243        setCurrentUpdatePriority(previousPriority);
26244        ReactCurrentBatchConfig$3.transition = prevTransition;
26245        executionContext = prevExecutionContext; // Flush the immediate callbacks that were scheduled during this batch.
26246        // Note that this will happen even if batchedUpdates is higher up
26247        // the stack.
26248  
26249        if ((executionContext & (RenderContext | CommitContext)) === NoContext) {
26250          flushSyncCallbacks();
26251        }
26252      }
26253    }
26254    function isAlreadyRendering() {
26255      // Used by the renderer to print a warning if certain APIs are called from
26256      // the wrong context.
26257      return  (executionContext & (RenderContext | CommitContext)) !== NoContext;
26258    }
26259    function pushRenderLanes(fiber, lanes) {
26260      push(subtreeRenderLanesCursor, subtreeRenderLanes, fiber);
26261      subtreeRenderLanes = mergeLanes(subtreeRenderLanes, lanes);
26262      workInProgressRootIncludedLanes = mergeLanes(workInProgressRootIncludedLanes, lanes);
26263    }
26264    function popRenderLanes(fiber) {
26265      subtreeRenderLanes = subtreeRenderLanesCursor.current;
26266      pop(subtreeRenderLanesCursor, fiber);
26267    }
26268  
26269    function prepareFreshStack(root, lanes) {
26270      root.finishedWork = null;
26271      root.finishedLanes = NoLanes;
26272      var timeoutHandle = root.timeoutHandle;
26273  
26274      if (timeoutHandle !== noTimeout) {
26275        // The root previous suspended and scheduled a timeout to commit a fallback
26276        // state. Now that we have additional work, cancel the timeout.
26277        root.timeoutHandle = noTimeout; // $FlowFixMe Complains noTimeout is not a TimeoutID, despite the check above
26278  
26279        cancelTimeout(timeoutHandle);
26280      }
26281  
26282      if (workInProgress !== null) {
26283        var interruptedWork = workInProgress.return;
26284  
26285        while (interruptedWork !== null) {
26286          var current = interruptedWork.alternate;
26287          unwindInterruptedWork(current, interruptedWork);
26288          interruptedWork = interruptedWork.return;
26289        }
26290      }
26291  
26292      workInProgressRoot = root;
26293      var rootWorkInProgress = createWorkInProgress(root.current, null);
26294      workInProgress = rootWorkInProgress;
26295      workInProgressRootRenderLanes = subtreeRenderLanes = workInProgressRootIncludedLanes = lanes;
26296      workInProgressRootExitStatus = RootInProgress;
26297      workInProgressRootFatalError = null;
26298      workInProgressRootSkippedLanes = NoLanes;
26299      workInProgressRootInterleavedUpdatedLanes = NoLanes;
26300      workInProgressRootPingedLanes = NoLanes;
26301      workInProgressRootConcurrentErrors = null;
26302      workInProgressRootRecoverableErrors = null;
26303      finishQueueingConcurrentUpdates();
26304  
26305      {
26306        ReactStrictModeWarnings.discardPendingWarnings();
26307      }
26308  
26309      return rootWorkInProgress;
26310    }
26311  
26312    function handleError(root, thrownValue) {
26313      do {
26314        var erroredWork = workInProgress;
26315  
26316        try {
26317          // Reset module-level state that was set during the render phase.
26318          resetContextDependencies();
26319          resetHooksAfterThrow();
26320          resetCurrentFiber(); // TODO: I found and added this missing line while investigating a
26321          // separate issue. Write a regression test using string refs.
26322  
26323          ReactCurrentOwner$2.current = null;
26324  
26325          if (erroredWork === null || erroredWork.return === null) {
26326            // Expected to be working on a non-root fiber. This is a fatal error
26327            // because there's no ancestor that can handle it; the root is
26328            // supposed to capture all errors that weren't caught by an error
26329            // boundary.
26330            workInProgressRootExitStatus = RootFatalErrored;
26331            workInProgressRootFatalError = thrownValue; // Set `workInProgress` to null. This represents advancing to the next
26332            // sibling, or the parent if there are no siblings. But since the root
26333            // has no siblings nor a parent, we set it to null. Usually this is
26334            // handled by `completeUnitOfWork` or `unwindWork`, but since we're
26335            // intentionally not calling those, we need set it here.
26336            // TODO: Consider calling `unwindWork` to pop the contexts.
26337  
26338            workInProgress = null;
26339            return;
26340          }
26341  
26342          if (enableProfilerTimer && erroredWork.mode & ProfileMode) {
26343            // Record the time spent rendering before an error was thrown. This
26344            // avoids inaccurate Profiler durations in the case of a
26345            // suspended render.
26346            stopProfilerTimerIfRunningAndRecordDelta(erroredWork, true);
26347          }
26348  
26349          if (enableSchedulingProfiler) {
26350            markComponentRenderStopped();
26351  
26352            if (thrownValue !== null && typeof thrownValue === 'object' && typeof thrownValue.then === 'function') {
26353              var wakeable = thrownValue;
26354              markComponentSuspended(erroredWork, wakeable, workInProgressRootRenderLanes);
26355            } else {
26356              markComponentErrored(erroredWork, thrownValue, workInProgressRootRenderLanes);
26357            }
26358          }
26359  
26360          throwException(root, erroredWork.return, erroredWork, thrownValue, workInProgressRootRenderLanes);
26361          completeUnitOfWork(erroredWork);
26362        } catch (yetAnotherThrownValue) {
26363          // Something in the return path also threw.
26364          thrownValue = yetAnotherThrownValue;
26365  
26366          if (workInProgress === erroredWork && erroredWork !== null) {
26367            // If this boundary has already errored, then we had trouble processing
26368            // the error. Bubble it to the next boundary.
26369            erroredWork = erroredWork.return;
26370            workInProgress = erroredWork;
26371          } else {
26372            erroredWork = workInProgress;
26373          }
26374  
26375          continue;
26376        } // Return to the normal work loop.
26377  
26378  
26379        return;
26380      } while (true);
26381    }
26382  
26383    function pushDispatcher() {
26384      var prevDispatcher = ReactCurrentDispatcher$2.current;
26385      ReactCurrentDispatcher$2.current = ContextOnlyDispatcher;
26386  
26387      if (prevDispatcher === null) {
26388        // The React isomorphic package does not include a default dispatcher.
26389        // Instead the first renderer will lazily attach one, in order to give
26390        // nicer error messages.
26391        return ContextOnlyDispatcher;
26392      } else {
26393        return prevDispatcher;
26394      }
26395    }
26396  
26397    function popDispatcher(prevDispatcher) {
26398      ReactCurrentDispatcher$2.current = prevDispatcher;
26399    }
26400  
26401    function markCommitTimeOfFallback() {
26402      globalMostRecentFallbackTime = now();
26403    }
26404    function markSkippedUpdateLanes(lane) {
26405      workInProgressRootSkippedLanes = mergeLanes(lane, workInProgressRootSkippedLanes);
26406    }
26407    function renderDidSuspend() {
26408      if (workInProgressRootExitStatus === RootInProgress) {
26409        workInProgressRootExitStatus = RootSuspended;
26410      }
26411    }
26412    function renderDidSuspendDelayIfPossible() {
26413      if (workInProgressRootExitStatus === RootInProgress || workInProgressRootExitStatus === RootSuspended || workInProgressRootExitStatus === RootErrored) {
26414        workInProgressRootExitStatus = RootSuspendedWithDelay;
26415      } // Check if there are updates that we skipped tree that might have unblocked
26416      // this render.
26417  
26418  
26419      if (workInProgressRoot !== null && (includesNonIdleWork(workInProgressRootSkippedLanes) || includesNonIdleWork(workInProgressRootInterleavedUpdatedLanes))) {
26420        // Mark the current render as suspended so that we switch to working on
26421        // the updates that were skipped. Usually we only suspend at the end of
26422        // the render phase.
26423        // TODO: We should probably always mark the root as suspended immediately
26424        // (inside this function), since by suspending at the end of the render
26425        // phase introduces a potential mistake where we suspend lanes that were
26426        // pinged or updated while we were rendering.
26427        markRootSuspended$1(workInProgressRoot, workInProgressRootRenderLanes);
26428      }
26429    }
26430    function renderDidError(error) {
26431      if (workInProgressRootExitStatus !== RootSuspendedWithDelay) {
26432        workInProgressRootExitStatus = RootErrored;
26433      }
26434  
26435      if (workInProgressRootConcurrentErrors === null) {
26436        workInProgressRootConcurrentErrors = [error];
26437      } else {
26438        workInProgressRootConcurrentErrors.push(error);
26439      }
26440    } // Called during render to determine if anything has suspended.
26441    // Returns false if we're not sure.
26442  
26443    function renderHasNotSuspendedYet() {
26444      // If something errored or completed, we can't really be sure,
26445      // so those are false.
26446      return workInProgressRootExitStatus === RootInProgress;
26447    }
26448  
26449    function renderRootSync(root, lanes) {
26450      var prevExecutionContext = executionContext;
26451      executionContext |= RenderContext;
26452      var prevDispatcher = pushDispatcher(); // If the root or lanes have changed, throw out the existing stack
26453      // and prepare a fresh one. Otherwise we'll continue where we left off.
26454  
26455      if (workInProgressRoot !== root || workInProgressRootRenderLanes !== lanes) {
26456        {
26457          if (isDevToolsPresent) {
26458            var memoizedUpdaters = root.memoizedUpdaters;
26459  
26460            if (memoizedUpdaters.size > 0) {
26461              restorePendingUpdaters(root, workInProgressRootRenderLanes);
26462              memoizedUpdaters.clear();
26463            } // At this point, move Fibers that scheduled the upcoming work from the Map to the Set.
26464            // If we bailout on this work, we'll move them back (like above).
26465            // It's important to move them now in case the work spawns more work at the same priority with different updaters.
26466            // That way we can keep the current update and future updates separate.
26467  
26468  
26469            movePendingFibersToMemoized(root, lanes);
26470          }
26471        }
26472  
26473        workInProgressTransitions = getTransitionsForLanes();
26474        prepareFreshStack(root, lanes);
26475      }
26476  
26477      {
26478        markRenderStarted(lanes);
26479      }
26480  
26481      do {
26482        try {
26483          workLoopSync();
26484          break;
26485        } catch (thrownValue) {
26486          handleError(root, thrownValue);
26487        }
26488      } while (true);
26489  
26490      resetContextDependencies();
26491      executionContext = prevExecutionContext;
26492      popDispatcher(prevDispatcher);
26493  
26494      if (workInProgress !== null) {
26495        // This is a sync render, so we should have finished the whole tree.
26496        throw new Error('Cannot commit an incomplete root. This error is likely caused by a ' + 'bug in React. Please file an issue.');
26497      }
26498  
26499      {
26500        markRenderStopped();
26501      } // Set this to null to indicate there's no in-progress render.
26502  
26503  
26504      workInProgressRoot = null;
26505      workInProgressRootRenderLanes = NoLanes;
26506      return workInProgressRootExitStatus;
26507    } // The work loop is an extremely hot path. Tell Closure not to inline it.
26508  
26509    /** @noinline */
26510  
26511  
26512    function workLoopSync() {
26513      // Already timed out, so perform work without checking if we need to yield.
26514      while (workInProgress !== null) {
26515        performUnitOfWork(workInProgress);
26516      }
26517    }
26518  
26519    function renderRootConcurrent(root, lanes) {
26520      var prevExecutionContext = executionContext;
26521      executionContext |= RenderContext;
26522      var prevDispatcher = pushDispatcher(); // If the root or lanes have changed, throw out the existing stack
26523      // and prepare a fresh one. Otherwise we'll continue where we left off.
26524  
26525      if (workInProgressRoot !== root || workInProgressRootRenderLanes !== lanes) {
26526        {
26527          if (isDevToolsPresent) {
26528            var memoizedUpdaters = root.memoizedUpdaters;
26529  
26530            if (memoizedUpdaters.size > 0) {
26531              restorePendingUpdaters(root, workInProgressRootRenderLanes);
26532              memoizedUpdaters.clear();
26533            } // At this point, move Fibers that scheduled the upcoming work from the Map to the Set.
26534            // If we bailout on this work, we'll move them back (like above).
26535            // It's important to move them now in case the work spawns more work at the same priority with different updaters.
26536            // That way we can keep the current update and future updates separate.
26537  
26538  
26539            movePendingFibersToMemoized(root, lanes);
26540          }
26541        }
26542  
26543        workInProgressTransitions = getTransitionsForLanes();
26544        resetRenderTimer();
26545        prepareFreshStack(root, lanes);
26546      }
26547  
26548      {
26549        markRenderStarted(lanes);
26550      }
26551  
26552      do {
26553        try {
26554          workLoopConcurrent();
26555          break;
26556        } catch (thrownValue) {
26557          handleError(root, thrownValue);
26558        }
26559      } while (true);
26560  
26561      resetContextDependencies();
26562      popDispatcher(prevDispatcher);
26563      executionContext = prevExecutionContext;
26564  
26565  
26566      if (workInProgress !== null) {
26567        // Still work remaining.
26568        {
26569          markRenderYielded();
26570        }
26571  
26572        return RootInProgress;
26573      } else {
26574        // Completed the tree.
26575        {
26576          markRenderStopped();
26577        } // Set this to null to indicate there's no in-progress render.
26578  
26579  
26580        workInProgressRoot = null;
26581        workInProgressRootRenderLanes = NoLanes; // Return the final exit status.
26582  
26583        return workInProgressRootExitStatus;
26584      }
26585    }
26586    /** @noinline */
26587  
26588  
26589    function workLoopConcurrent() {
26590      // Perform work until Scheduler asks us to yield
26591      while (workInProgress !== null && !shouldYield()) {
26592        performUnitOfWork(workInProgress);
26593      }
26594    }
26595  
26596    function performUnitOfWork(unitOfWork) {
26597      // The current, flushed, state of this fiber is the alternate. Ideally
26598      // nothing should rely on this, but relying on it here means that we don't
26599      // need an additional field on the work in progress.
26600      var current = unitOfWork.alternate;
26601      setCurrentFiber(unitOfWork);
26602      var next;
26603  
26604      if ( (unitOfWork.mode & ProfileMode) !== NoMode) {
26605        startProfilerTimer(unitOfWork);
26606        next = beginWork$1(current, unitOfWork, subtreeRenderLanes);
26607        stopProfilerTimerIfRunningAndRecordDelta(unitOfWork, true);
26608      } else {
26609        next = beginWork$1(current, unitOfWork, subtreeRenderLanes);
26610      }
26611  
26612      resetCurrentFiber();
26613      unitOfWork.memoizedProps = unitOfWork.pendingProps;
26614  
26615      if (next === null) {
26616        // If this doesn't spawn new work, complete the current work.
26617        completeUnitOfWork(unitOfWork);
26618      } else {
26619        workInProgress = next;
26620      }
26621  
26622      ReactCurrentOwner$2.current = null;
26623    }
26624  
26625    function completeUnitOfWork(unitOfWork) {
26626      // Attempt to complete the current unit of work, then move to the next
26627      // sibling. If there are no more siblings, return to the parent fiber.
26628      var completedWork = unitOfWork;
26629  
26630      do {
26631        // The current, flushed, state of this fiber is the alternate. Ideally
26632        // nothing should rely on this, but relying on it here means that we don't
26633        // need an additional field on the work in progress.
26634        var current = completedWork.alternate;
26635        var returnFiber = completedWork.return; // Check if the work completed or if something threw.
26636  
26637        if ((completedWork.flags & Incomplete) === NoFlags) {
26638          setCurrentFiber(completedWork);
26639          var next = void 0;
26640  
26641          if ( (completedWork.mode & ProfileMode) === NoMode) {
26642            next = completeWork(current, completedWork, subtreeRenderLanes);
26643          } else {
26644            startProfilerTimer(completedWork);
26645            next = completeWork(current, completedWork, subtreeRenderLanes); // Update render duration assuming we didn't error.
26646  
26647            stopProfilerTimerIfRunningAndRecordDelta(completedWork, false);
26648          }
26649  
26650          resetCurrentFiber();
26651  
26652          if (next !== null) {
26653            // Completing this fiber spawned new work. Work on that next.
26654            workInProgress = next;
26655            return;
26656          }
26657        } else {
26658          // This fiber did not complete because something threw. Pop values off
26659          // the stack without entering the complete phase. If this is a boundary,
26660          // capture values if possible.
26661          var _next = unwindWork(current, completedWork); // Because this fiber did not complete, don't reset its lanes.
26662  
26663  
26664          if (_next !== null) {
26665            // If completing this work spawned new work, do that next. We'll come
26666            // back here again.
26667            // Since we're restarting, remove anything that is not a host effect
26668            // from the effect tag.
26669            _next.flags &= HostEffectMask;
26670            workInProgress = _next;
26671            return;
26672          }
26673  
26674          if ( (completedWork.mode & ProfileMode) !== NoMode) {
26675            // Record the render duration for the fiber that errored.
26676            stopProfilerTimerIfRunningAndRecordDelta(completedWork, false); // Include the time spent working on failed children before continuing.
26677  
26678            var actualDuration = completedWork.actualDuration;
26679            var child = completedWork.child;
26680  
26681            while (child !== null) {
26682              actualDuration += child.actualDuration;
26683              child = child.sibling;
26684            }
26685  
26686            completedWork.actualDuration = actualDuration;
26687          }
26688  
26689          if (returnFiber !== null) {
26690            // Mark the parent fiber as incomplete and clear its subtree flags.
26691            returnFiber.flags |= Incomplete;
26692            returnFiber.subtreeFlags = NoFlags;
26693            returnFiber.deletions = null;
26694          } else {
26695            // We've unwound all the way to the root.
26696            workInProgressRootExitStatus = RootDidNotComplete;
26697            workInProgress = null;
26698            return;
26699          }
26700        }
26701  
26702        var siblingFiber = completedWork.sibling;
26703  
26704        if (siblingFiber !== null) {
26705          // If there is more work to do in this returnFiber, do that next.
26706          workInProgress = siblingFiber;
26707          return;
26708        } // Otherwise, return to the parent
26709  
26710  
26711        completedWork = returnFiber; // Update the next thing we're working on in case something throws.
26712  
26713        workInProgress = completedWork;
26714      } while (completedWork !== null); // We've reached the root.
26715  
26716  
26717      if (workInProgressRootExitStatus === RootInProgress) {
26718        workInProgressRootExitStatus = RootCompleted;
26719      }
26720    }
26721  
26722    function commitRoot(root, recoverableErrors, transitions) {
26723      // TODO: This no longer makes any sense. We already wrap the mutation and
26724      // layout phases. Should be able to remove.
26725      var previousUpdateLanePriority = getCurrentUpdatePriority();
26726      var prevTransition = ReactCurrentBatchConfig$3.transition;
26727  
26728      try {
26729        ReactCurrentBatchConfig$3.transition = null;
26730        setCurrentUpdatePriority(DiscreteEventPriority);
26731        commitRootImpl(root, recoverableErrors, transitions, previousUpdateLanePriority);
26732      } finally {
26733        ReactCurrentBatchConfig$3.transition = prevTransition;
26734        setCurrentUpdatePriority(previousUpdateLanePriority);
26735      }
26736  
26737      return null;
26738    }
26739  
26740    function commitRootImpl(root, recoverableErrors, transitions, renderPriorityLevel) {
26741      do {
26742        // `flushPassiveEffects` will call `flushSyncUpdateQueue` at the end, which
26743        // means `flushPassiveEffects` will sometimes result in additional
26744        // passive effects. So we need to keep flushing in a loop until there are
26745        // no more pending effects.
26746        // TODO: Might be better if `flushPassiveEffects` did not automatically
26747        // flush synchronous work at the end, to avoid factoring hazards like this.
26748        flushPassiveEffects();
26749      } while (rootWithPendingPassiveEffects !== null);
26750  
26751      flushRenderPhaseStrictModeWarningsInDEV();
26752  
26753      if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
26754        throw new Error('Should not already be working.');
26755      }
26756  
26757      var finishedWork = root.finishedWork;
26758      var lanes = root.finishedLanes;
26759  
26760      {
26761        markCommitStarted(lanes);
26762      }
26763  
26764      if (finishedWork === null) {
26765  
26766        {
26767          markCommitStopped();
26768        }
26769  
26770        return null;
26771      } else {
26772        {
26773          if (lanes === NoLanes) {
26774            error('root.finishedLanes should not be empty during a commit. This is a ' + 'bug in React.');
26775          }
26776        }
26777      }
26778  
26779      root.finishedWork = null;
26780      root.finishedLanes = NoLanes;
26781  
26782      if (finishedWork === root.current) {
26783        throw new Error('Cannot commit the same tree as before. This error is likely caused by ' + 'a bug in React. Please file an issue.');
26784      } // commitRoot never returns a continuation; it always finishes synchronously.
26785      // So we can clear these now to allow a new callback to be scheduled.
26786  
26787  
26788      root.callbackNode = null;
26789      root.callbackPriority = NoLane; // Update the first and last pending times on this root. The new first
26790      // pending time is whatever is left on the root fiber.
26791  
26792      var remainingLanes = mergeLanes(finishedWork.lanes, finishedWork.childLanes);
26793      markRootFinished(root, remainingLanes);
26794  
26795      if (root === workInProgressRoot) {
26796        // We can reset these now that they are finished.
26797        workInProgressRoot = null;
26798        workInProgress = null;
26799        workInProgressRootRenderLanes = NoLanes;
26800      } // If there are pending passive effects, schedule a callback to process them.
26801      // Do this as early as possible, so it is queued before anything else that
26802      // might get scheduled in the commit phase. (See #16714.)
26803      // TODO: Delete all other places that schedule the passive effect callback
26804      // They're redundant.
26805  
26806  
26807      if ((finishedWork.subtreeFlags & PassiveMask) !== NoFlags || (finishedWork.flags & PassiveMask) !== NoFlags) {
26808        if (!rootDoesHavePassiveEffects) {
26809          rootDoesHavePassiveEffects = true;
26810          // to store it in pendingPassiveTransitions until they get processed
26811          // We need to pass this through as an argument to commitRoot
26812          // because workInProgressTransitions might have changed between
26813          // the previous render and commit if we throttle the commit
26814          // with setTimeout
26815  
26816          pendingPassiveTransitions = transitions;
26817          scheduleCallback$1(NormalPriority, function () {
26818            flushPassiveEffects(); // This render triggered passive effects: release the root cache pool
26819            // *after* passive effects fire to avoid freeing a cache pool that may
26820            // be referenced by a node in the tree (HostRoot, Cache boundary etc)
26821  
26822            return null;
26823          });
26824        }
26825      } // Check if there are any effects in the whole tree.
26826      // TODO: This is left over from the effect list implementation, where we had
26827      // to check for the existence of `firstEffect` to satisfy Flow. I think the
26828      // only other reason this optimization exists is because it affects profiling.
26829      // Reconsider whether this is necessary.
26830  
26831  
26832      var subtreeHasEffects = (finishedWork.subtreeFlags & (BeforeMutationMask | MutationMask | LayoutMask | PassiveMask)) !== NoFlags;
26833      var rootHasEffect = (finishedWork.flags & (BeforeMutationMask | MutationMask | LayoutMask | PassiveMask)) !== NoFlags;
26834  
26835      if (subtreeHasEffects || rootHasEffect) {
26836        var prevTransition = ReactCurrentBatchConfig$3.transition;
26837        ReactCurrentBatchConfig$3.transition = null;
26838        var previousPriority = getCurrentUpdatePriority();
26839        setCurrentUpdatePriority(DiscreteEventPriority);
26840        var prevExecutionContext = executionContext;
26841        executionContext |= CommitContext; // Reset this to null before calling lifecycles
26842  
26843        ReactCurrentOwner$2.current = null; // The commit phase is broken into several sub-phases. We do a separate pass
26844        // of the effect list for each phase: all mutation effects come before all
26845        // layout effects, and so on.
26846        // The first phase a "before mutation" phase. We use this phase to read the
26847        // state of the host tree right before we mutate it. This is where
26848        // getSnapshotBeforeUpdate is called.
26849  
26850        var shouldFireAfterActiveInstanceBlur = commitBeforeMutationEffects(root, finishedWork);
26851  
26852        {
26853          // Mark the current commit time to be shared by all Profilers in this
26854          // batch. This enables them to be grouped later.
26855          recordCommitTime();
26856        }
26857  
26858  
26859        commitMutationEffects(root, finishedWork, lanes);
26860  
26861        resetAfterCommit(root.containerInfo); // The work-in-progress tree is now the current tree. This must come after
26862        // the mutation phase, so that the previous tree is still current during
26863        // componentWillUnmount, but before the layout phase, so that the finished
26864        // work is current during componentDidMount/Update.
26865  
26866        root.current = finishedWork; // The next phase is the layout phase, where we call effects that read
26867  
26868        {
26869          markLayoutEffectsStarted(lanes);
26870        }
26871  
26872        commitLayoutEffects(finishedWork, root, lanes);
26873  
26874        {
26875          markLayoutEffectsStopped();
26876        }
26877        // opportunity to paint.
26878  
26879  
26880        requestPaint();
26881        executionContext = prevExecutionContext; // Reset the priority to the previous non-sync value.
26882  
26883        setCurrentUpdatePriority(previousPriority);
26884        ReactCurrentBatchConfig$3.transition = prevTransition;
26885      } else {
26886        // No effects.
26887        root.current = finishedWork; // Measure these anyway so the flamegraph explicitly shows that there were
26888        // no effects.
26889        // TODO: Maybe there's a better way to report this.
26890  
26891        {
26892          recordCommitTime();
26893        }
26894      }
26895  
26896      var rootDidHavePassiveEffects = rootDoesHavePassiveEffects;
26897  
26898      if (rootDoesHavePassiveEffects) {
26899        // This commit has passive effects. Stash a reference to them. But don't
26900        // schedule a callback until after flushing layout work.
26901        rootDoesHavePassiveEffects = false;
26902        rootWithPendingPassiveEffects = root;
26903        pendingPassiveEffectsLanes = lanes;
26904      } else {
26905  
26906        {
26907          nestedPassiveUpdateCount = 0;
26908          rootWithPassiveNestedUpdates = null;
26909        }
26910      } // Read this again, since an effect might have updated it
26911  
26912  
26913      remainingLanes = root.pendingLanes; // Check if there's remaining work on this root
26914      // TODO: This is part of the `componentDidCatch` implementation. Its purpose
26915      // is to detect whether something might have called setState inside
26916      // `componentDidCatch`. The mechanism is known to be flawed because `setState`
26917      // inside `componentDidCatch` is itself flawed — that's why we recommend
26918      // `getDerivedStateFromError` instead. However, it could be improved by
26919      // checking if remainingLanes includes Sync work, instead of whether there's
26920      // any work remaining at all (which would also include stuff like Suspense
26921      // retries or transitions). It's been like this for a while, though, so fixing
26922      // it probably isn't that urgent.
26923  
26924      if (remainingLanes === NoLanes) {
26925        // If there's no remaining work, we can clear the set of already failed
26926        // error boundaries.
26927        legacyErrorBoundariesThatAlreadyFailed = null;
26928      }
26929  
26930      {
26931        if (!rootDidHavePassiveEffects) {
26932          commitDoubleInvokeEffectsInDEV(root.current, false);
26933        }
26934      }
26935  
26936      onCommitRoot(finishedWork.stateNode, renderPriorityLevel);
26937  
26938      {
26939        if (isDevToolsPresent) {
26940          root.memoizedUpdaters.clear();
26941        }
26942      }
26943  
26944      {
26945        onCommitRoot$1();
26946      } // Always call this before exiting `commitRoot`, to ensure that any
26947      // additional work on this root is scheduled.
26948  
26949  
26950      ensureRootIsScheduled(root, now());
26951  
26952      if (recoverableErrors !== null) {
26953        // There were errors during this render, but recovered from them without
26954        // needing to surface it to the UI. We log them here.
26955        var onRecoverableError = root.onRecoverableError;
26956  
26957        for (var i = 0; i < recoverableErrors.length; i++) {
26958          var recoverableError = recoverableErrors[i];
26959          var componentStack = recoverableError.stack;
26960          var digest = recoverableError.digest;
26961          onRecoverableError(recoverableError.value, {
26962            componentStack: componentStack,
26963            digest: digest
26964          });
26965        }
26966      }
26967  
26968      if (hasUncaughtError) {
26969        hasUncaughtError = false;
26970        var error$1 = firstUncaughtError;
26971        firstUncaughtError = null;
26972        throw error$1;
26973      } // If the passive effects are the result of a discrete render, flush them
26974      // synchronously at the end of the current task so that the result is
26975      // immediately observable. Otherwise, we assume that they are not
26976      // order-dependent and do not need to be observed by external systems, so we
26977      // can wait until after paint.
26978      // TODO: We can optimize this by not scheduling the callback earlier. Since we
26979      // currently schedule the callback in multiple places, will wait until those
26980      // are consolidated.
26981  
26982  
26983      if (includesSomeLane(pendingPassiveEffectsLanes, SyncLane) && root.tag !== LegacyRoot) {
26984        flushPassiveEffects();
26985      } // Read this again, since a passive effect might have updated it
26986  
26987  
26988      remainingLanes = root.pendingLanes;
26989  
26990      if (includesSomeLane(remainingLanes, SyncLane)) {
26991        {
26992          markNestedUpdateScheduled();
26993        } // Count the number of times the root synchronously re-renders without
26994        // finishing. If there are too many, it indicates an infinite update loop.
26995  
26996  
26997        if (root === rootWithNestedUpdates) {
26998          nestedUpdateCount++;
26999        } else {
27000          nestedUpdateCount = 0;
27001          rootWithNestedUpdates = root;
27002        }
27003      } else {
27004        nestedUpdateCount = 0;
27005      } // If layout work was scheduled, flush it now.
27006  
27007  
27008      flushSyncCallbacks();
27009  
27010      {
27011        markCommitStopped();
27012      }
27013  
27014      return null;
27015    }
27016  
27017    function flushPassiveEffects() {
27018      // Returns whether passive effects were flushed.
27019      // TODO: Combine this check with the one in flushPassiveEFfectsImpl. We should
27020      // probably just combine the two functions. I believe they were only separate
27021      // in the first place because we used to wrap it with
27022      // `Scheduler.runWithPriority`, which accepts a function. But now we track the
27023      // priority within React itself, so we can mutate the variable directly.
27024      if (rootWithPendingPassiveEffects !== null) {
27025        var renderPriority = lanesToEventPriority(pendingPassiveEffectsLanes);
27026        var priority = lowerEventPriority(DefaultEventPriority, renderPriority);
27027        var prevTransition = ReactCurrentBatchConfig$3.transition;
27028        var previousPriority = getCurrentUpdatePriority();
27029  
27030        try {
27031          ReactCurrentBatchConfig$3.transition = null;
27032          setCurrentUpdatePriority(priority);
27033          return flushPassiveEffectsImpl();
27034        } finally {
27035          setCurrentUpdatePriority(previousPriority);
27036          ReactCurrentBatchConfig$3.transition = prevTransition; // Once passive effects have run for the tree - giving components a
27037        }
27038      }
27039  
27040      return false;
27041    }
27042    function enqueuePendingPassiveProfilerEffect(fiber) {
27043      {
27044        pendingPassiveProfilerEffects.push(fiber);
27045  
27046        if (!rootDoesHavePassiveEffects) {
27047          rootDoesHavePassiveEffects = true;
27048          scheduleCallback$1(NormalPriority, function () {
27049            flushPassiveEffects();
27050            return null;
27051          });
27052        }
27053      }
27054    }
27055  
27056    function flushPassiveEffectsImpl() {
27057      if (rootWithPendingPassiveEffects === null) {
27058        return false;
27059      } // Cache and clear the transitions flag
27060  
27061  
27062      var transitions = pendingPassiveTransitions;
27063      pendingPassiveTransitions = null;
27064      var root = rootWithPendingPassiveEffects;
27065      var lanes = pendingPassiveEffectsLanes;
27066      rootWithPendingPassiveEffects = null; // TODO: This is sometimes out of sync with rootWithPendingPassiveEffects.
27067      // Figure out why and fix it. It's not causing any known issues (probably
27068      // because it's only used for profiling), but it's a refactor hazard.
27069  
27070      pendingPassiveEffectsLanes = NoLanes;
27071  
27072      if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
27073        throw new Error('Cannot flush passive effects while already rendering.');
27074      }
27075  
27076      {
27077        isFlushingPassiveEffects = true;
27078        didScheduleUpdateDuringPassiveEffects = false;
27079      }
27080  
27081      {
27082        markPassiveEffectsStarted(lanes);
27083      }
27084  
27085      var prevExecutionContext = executionContext;
27086      executionContext |= CommitContext;
27087      commitPassiveUnmountEffects(root.current);
27088      commitPassiveMountEffects(root, root.current, lanes, transitions); // TODO: Move to commitPassiveMountEffects
27089  
27090      {
27091        var profilerEffects = pendingPassiveProfilerEffects;
27092        pendingPassiveProfilerEffects = [];
27093  
27094        for (var i = 0; i < profilerEffects.length; i++) {
27095          var _fiber = profilerEffects[i];
27096          commitPassiveEffectDurations(root, _fiber);
27097        }
27098      }
27099  
27100      {
27101        markPassiveEffectsStopped();
27102      }
27103  
27104      {
27105        commitDoubleInvokeEffectsInDEV(root.current, true);
27106      }
27107  
27108      executionContext = prevExecutionContext;
27109      flushSyncCallbacks();
27110  
27111      {
27112        // If additional passive effects were scheduled, increment a counter. If this
27113        // exceeds the limit, we'll fire a warning.
27114        if (didScheduleUpdateDuringPassiveEffects) {
27115          if (root === rootWithPassiveNestedUpdates) {
27116            nestedPassiveUpdateCount++;
27117          } else {
27118            nestedPassiveUpdateCount = 0;
27119            rootWithPassiveNestedUpdates = root;
27120          }
27121        } else {
27122          nestedPassiveUpdateCount = 0;
27123        }
27124  
27125        isFlushingPassiveEffects = false;
27126        didScheduleUpdateDuringPassiveEffects = false;
27127      } // TODO: Move to commitPassiveMountEffects
27128  
27129  
27130      onPostCommitRoot(root);
27131  
27132      {
27133        var stateNode = root.current.stateNode;
27134        stateNode.effectDuration = 0;
27135        stateNode.passiveEffectDuration = 0;
27136      }
27137  
27138      return true;
27139    }
27140  
27141    function isAlreadyFailedLegacyErrorBoundary(instance) {
27142      return legacyErrorBoundariesThatAlreadyFailed !== null && legacyErrorBoundariesThatAlreadyFailed.has(instance);
27143    }
27144    function markLegacyErrorBoundaryAsFailed(instance) {
27145      if (legacyErrorBoundariesThatAlreadyFailed === null) {
27146        legacyErrorBoundariesThatAlreadyFailed = new Set([instance]);
27147      } else {
27148        legacyErrorBoundariesThatAlreadyFailed.add(instance);
27149      }
27150    }
27151  
27152    function prepareToThrowUncaughtError(error) {
27153      if (!hasUncaughtError) {
27154        hasUncaughtError = true;
27155        firstUncaughtError = error;
27156      }
27157    }
27158  
27159    var onUncaughtError = prepareToThrowUncaughtError;
27160  
27161    function captureCommitPhaseErrorOnRoot(rootFiber, sourceFiber, error) {
27162      var errorInfo = createCapturedValueAtFiber(error, sourceFiber);
27163      var update = createRootErrorUpdate(rootFiber, errorInfo, SyncLane);
27164      var root = enqueueUpdate(rootFiber, update, SyncLane);
27165      var eventTime = requestEventTime();
27166  
27167      if (root !== null) {
27168        markRootUpdated(root, SyncLane, eventTime);
27169        ensureRootIsScheduled(root, eventTime);
27170      }
27171    }
27172  
27173    function captureCommitPhaseError(sourceFiber, nearestMountedAncestor, error$1) {
27174      {
27175        reportUncaughtErrorInDEV(error$1);
27176        setIsRunningInsertionEffect(false);
27177      }
27178  
27179      if (sourceFiber.tag === HostRoot) {
27180        // Error was thrown at the root. There is no parent, so the root
27181        // itself should capture it.
27182        captureCommitPhaseErrorOnRoot(sourceFiber, sourceFiber, error$1);
27183        return;
27184      }
27185  
27186      var fiber = null;
27187  
27188      {
27189        fiber = nearestMountedAncestor;
27190      }
27191  
27192      while (fiber !== null) {
27193        if (fiber.tag === HostRoot) {
27194          captureCommitPhaseErrorOnRoot(fiber, sourceFiber, error$1);
27195          return;
27196        } else if (fiber.tag === ClassComponent) {
27197          var ctor = fiber.type;
27198          var instance = fiber.stateNode;
27199  
27200          if (typeof ctor.getDerivedStateFromError === 'function' || typeof instance.componentDidCatch === 'function' && !isAlreadyFailedLegacyErrorBoundary(instance)) {
27201            var errorInfo = createCapturedValueAtFiber(error$1, sourceFiber);
27202            var update = createClassErrorUpdate(fiber, errorInfo, SyncLane);
27203            var root = enqueueUpdate(fiber, update, SyncLane);
27204            var eventTime = requestEventTime();
27205  
27206            if (root !== null) {
27207              markRootUpdated(root, SyncLane, eventTime);
27208              ensureRootIsScheduled(root, eventTime);
27209            }
27210  
27211            return;
27212          }
27213        }
27214  
27215        fiber = fiber.return;
27216      }
27217  
27218      {
27219        // TODO: Until we re-land skipUnmountedBoundaries (see #20147), this warning
27220        // will fire for errors that are thrown by destroy functions inside deleted
27221        // trees. What it should instead do is propagate the error to the parent of
27222        // the deleted tree. In the meantime, do not add this warning to the
27223        // allowlist; this is only for our internal use.
27224        error('Internal React error: Attempted to capture a commit phase error ' + 'inside a detached tree. This indicates a bug in React. Likely ' + 'causes include deleting the same fiber more than once, committing an ' + 'already-finished tree, or an inconsistent return pointer.\n\n' + 'Error message:\n\n%s', error$1);
27225      }
27226    }
27227    function pingSuspendedRoot(root, wakeable, pingedLanes) {
27228      var pingCache = root.pingCache;
27229  
27230      if (pingCache !== null) {
27231        // The wakeable resolved, so we no longer need to memoize, because it will
27232        // never be thrown again.
27233        pingCache.delete(wakeable);
27234      }
27235  
27236      var eventTime = requestEventTime();
27237      markRootPinged(root, pingedLanes);
27238      warnIfSuspenseResolutionNotWrappedWithActDEV(root);
27239  
27240      if (workInProgressRoot === root && isSubsetOfLanes(workInProgressRootRenderLanes, pingedLanes)) {
27241        // Received a ping at the same priority level at which we're currently
27242        // rendering. We might want to restart this render. This should mirror
27243        // the logic of whether or not a root suspends once it completes.
27244        // TODO: If we're rendering sync either due to Sync, Batched or expired,
27245        // we should probably never restart.
27246        // If we're suspended with delay, or if it's a retry, we'll always suspend
27247        // so we can always restart.
27248        if (workInProgressRootExitStatus === RootSuspendedWithDelay || workInProgressRootExitStatus === RootSuspended && includesOnlyRetries(workInProgressRootRenderLanes) && now() - globalMostRecentFallbackTime < FALLBACK_THROTTLE_MS) {
27249          // Restart from the root.
27250          prepareFreshStack(root, NoLanes);
27251        } else {
27252          // Even though we can't restart right now, we might get an
27253          // opportunity later. So we mark this render as having a ping.
27254          workInProgressRootPingedLanes = mergeLanes(workInProgressRootPingedLanes, pingedLanes);
27255        }
27256      }
27257  
27258      ensureRootIsScheduled(root, eventTime);
27259    }
27260  
27261    function retryTimedOutBoundary(boundaryFiber, retryLane) {
27262      // The boundary fiber (a Suspense component or SuspenseList component)
27263      // previously was rendered in its fallback state. One of the promises that
27264      // suspended it has resolved, which means at least part of the tree was
27265      // likely unblocked. Try rendering again, at a new lanes.
27266      if (retryLane === NoLane) {
27267        // TODO: Assign this to `suspenseState.retryLane`? to avoid
27268        // unnecessary entanglement?
27269        retryLane = requestRetryLane(boundaryFiber);
27270      } // TODO: Special case idle priority?
27271  
27272  
27273      var eventTime = requestEventTime();
27274      var root = enqueueConcurrentRenderForLane(boundaryFiber, retryLane);
27275  
27276      if (root !== null) {
27277        markRootUpdated(root, retryLane, eventTime);
27278        ensureRootIsScheduled(root, eventTime);
27279      }
27280    }
27281  
27282    function retryDehydratedSuspenseBoundary(boundaryFiber) {
27283      var suspenseState = boundaryFiber.memoizedState;
27284      var retryLane = NoLane;
27285  
27286      if (suspenseState !== null) {
27287        retryLane = suspenseState.retryLane;
27288      }
27289  
27290      retryTimedOutBoundary(boundaryFiber, retryLane);
27291    }
27292    function resolveRetryWakeable(boundaryFiber, wakeable) {
27293      var retryLane = NoLane; // Default
27294  
27295      var retryCache;
27296  
27297      switch (boundaryFiber.tag) {
27298        case SuspenseComponent:
27299          retryCache = boundaryFiber.stateNode;
27300          var suspenseState = boundaryFiber.memoizedState;
27301  
27302          if (suspenseState !== null) {
27303            retryLane = suspenseState.retryLane;
27304          }
27305  
27306          break;
27307  
27308        case SuspenseListComponent:
27309          retryCache = boundaryFiber.stateNode;
27310          break;
27311  
27312        default:
27313          throw new Error('Pinged unknown suspense boundary type. ' + 'This is probably a bug in React.');
27314      }
27315  
27316      if (retryCache !== null) {
27317        // The wakeable resolved, so we no longer need to memoize, because it will
27318        // never be thrown again.
27319        retryCache.delete(wakeable);
27320      }
27321  
27322      retryTimedOutBoundary(boundaryFiber, retryLane);
27323    } // Computes the next Just Noticeable Difference (JND) boundary.
27324    // The theory is that a person can't tell the difference between small differences in time.
27325    // Therefore, if we wait a bit longer than necessary that won't translate to a noticeable
27326    // difference in the experience. However, waiting for longer might mean that we can avoid
27327    // showing an intermediate loading state. The longer we have already waited, the harder it
27328    // is to tell small differences in time. Therefore, the longer we've already waited,
27329    // the longer we can wait additionally. At some point we have to give up though.
27330    // We pick a train model where the next boundary commits at a consistent schedule.
27331    // These particular numbers are vague estimates. We expect to adjust them based on research.
27332  
27333    function jnd(timeElapsed) {
27334      return timeElapsed < 120 ? 120 : timeElapsed < 480 ? 480 : timeElapsed < 1080 ? 1080 : timeElapsed < 1920 ? 1920 : timeElapsed < 3000 ? 3000 : timeElapsed < 4320 ? 4320 : ceil(timeElapsed / 1960) * 1960;
27335    }
27336  
27337    function checkForNestedUpdates() {
27338      if (nestedUpdateCount > NESTED_UPDATE_LIMIT) {
27339        nestedUpdateCount = 0;
27340        rootWithNestedUpdates = null;
27341        throw new Error('Maximum update depth exceeded. This can happen when a component ' + 'repeatedly calls setState inside componentWillUpdate or ' + 'componentDidUpdate. React limits the number of nested updates to ' + 'prevent infinite loops.');
27342      }
27343  
27344      {
27345        if (nestedPassiveUpdateCount > NESTED_PASSIVE_UPDATE_LIMIT) {
27346          nestedPassiveUpdateCount = 0;
27347          rootWithPassiveNestedUpdates = null;
27348  
27349          error('Maximum update depth exceeded. This can happen when a component ' + "calls setState inside useEffect, but useEffect either doesn't " + 'have a dependency array, or one of the dependencies changes on ' + 'every render.');
27350        }
27351      }
27352    }
27353  
27354    function flushRenderPhaseStrictModeWarningsInDEV() {
27355      {
27356        ReactStrictModeWarnings.flushLegacyContextWarning();
27357  
27358        {
27359          ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings();
27360        }
27361      }
27362    }
27363  
27364    function commitDoubleInvokeEffectsInDEV(fiber, hasPassiveEffects) {
27365      {
27366        // TODO (StrictEffects) Should we set a marker on the root if it contains strict effects
27367        // so we don't traverse unnecessarily? similar to subtreeFlags but just at the root level.
27368        // Maybe not a big deal since this is DEV only behavior.
27369        setCurrentFiber(fiber);
27370        invokeEffectsInDev(fiber, MountLayoutDev, invokeLayoutEffectUnmountInDEV);
27371  
27372        if (hasPassiveEffects) {
27373          invokeEffectsInDev(fiber, MountPassiveDev, invokePassiveEffectUnmountInDEV);
27374        }
27375  
27376        invokeEffectsInDev(fiber, MountLayoutDev, invokeLayoutEffectMountInDEV);
27377  
27378        if (hasPassiveEffects) {
27379          invokeEffectsInDev(fiber, MountPassiveDev, invokePassiveEffectMountInDEV);
27380        }
27381  
27382        resetCurrentFiber();
27383      }
27384    }
27385  
27386    function invokeEffectsInDev(firstChild, fiberFlags, invokeEffectFn) {
27387      {
27388        // We don't need to re-check StrictEffectsMode here.
27389        // This function is only called if that check has already passed.
27390        var current = firstChild;
27391        var subtreeRoot = null;
27392  
27393        while (current !== null) {
27394          var primarySubtreeFlag = current.subtreeFlags & fiberFlags;
27395  
27396          if (current !== subtreeRoot && current.child !== null && primarySubtreeFlag !== NoFlags) {
27397            current = current.child;
27398          } else {
27399            if ((current.flags & fiberFlags) !== NoFlags) {
27400              invokeEffectFn(current);
27401            }
27402  
27403            if (current.sibling !== null) {
27404              current = current.sibling;
27405            } else {
27406              current = subtreeRoot = current.return;
27407            }
27408          }
27409        }
27410      }
27411    }
27412  
27413    var didWarnStateUpdateForNotYetMountedComponent = null;
27414    function warnAboutUpdateOnNotYetMountedFiberInDEV(fiber) {
27415      {
27416        if ((executionContext & RenderContext) !== NoContext) {
27417          // We let the other warning about render phase updates deal with this one.
27418          return;
27419        }
27420  
27421        if (!(fiber.mode & ConcurrentMode)) {
27422          return;
27423        }
27424  
27425        var tag = fiber.tag;
27426  
27427        if (tag !== IndeterminateComponent && tag !== HostRoot && tag !== ClassComponent && tag !== FunctionComponent && tag !== ForwardRef && tag !== MemoComponent && tag !== SimpleMemoComponent) {
27428          // Only warn for user-defined components, not internal ones like Suspense.
27429          return;
27430        } // We show the whole stack but dedupe on the top component's name because
27431        // the problematic code almost always lies inside that component.
27432  
27433  
27434        var componentName = getComponentNameFromFiber(fiber) || 'ReactComponent';
27435  
27436        if (didWarnStateUpdateForNotYetMountedComponent !== null) {
27437          if (didWarnStateUpdateForNotYetMountedComponent.has(componentName)) {
27438            return;
27439          }
27440  
27441          didWarnStateUpdateForNotYetMountedComponent.add(componentName);
27442        } else {
27443          didWarnStateUpdateForNotYetMountedComponent = new Set([componentName]);
27444        }
27445  
27446        var previousFiber = current;
27447  
27448        try {
27449          setCurrentFiber(fiber);
27450  
27451          error("Can't perform a React state update on a component that hasn't mounted yet. " + 'This indicates that you have a side-effect in your render function that ' + 'asynchronously later calls tries to update the component. Move this work to ' + 'useEffect instead.');
27452        } finally {
27453          if (previousFiber) {
27454            setCurrentFiber(fiber);
27455          } else {
27456            resetCurrentFiber();
27457          }
27458        }
27459      }
27460    }
27461    var beginWork$1;
27462  
27463    {
27464      var dummyFiber = null;
27465  
27466      beginWork$1 = function (current, unitOfWork, lanes) {
27467        // If a component throws an error, we replay it again in a synchronously
27468        // dispatched event, so that the debugger will treat it as an uncaught
27469        // error See ReactErrorUtils for more information.
27470        // Before entering the begin phase, copy the work-in-progress onto a dummy
27471        // fiber. If beginWork throws, we'll use this to reset the state.
27472        var originalWorkInProgressCopy = assignFiberPropertiesInDEV(dummyFiber, unitOfWork);
27473  
27474        try {
27475          return beginWork(current, unitOfWork, lanes);
27476        } catch (originalError) {
27477          if (didSuspendOrErrorWhileHydratingDEV() || originalError !== null && typeof originalError === 'object' && typeof originalError.then === 'function') {
27478            // Don't replay promises.
27479            // Don't replay errors if we are hydrating and have already suspended or handled an error
27480            throw originalError;
27481          } // Keep this code in sync with handleError; any changes here must have
27482          // corresponding changes there.
27483  
27484  
27485          resetContextDependencies();
27486          resetHooksAfterThrow(); // Don't reset current debug fiber, since we're about to work on the
27487          // same fiber again.
27488          // Unwind the failed stack frame
27489  
27490          unwindInterruptedWork(current, unitOfWork); // Restore the original properties of the fiber.
27491  
27492          assignFiberPropertiesInDEV(unitOfWork, originalWorkInProgressCopy);
27493  
27494          if ( unitOfWork.mode & ProfileMode) {
27495            // Reset the profiler timer.
27496            startProfilerTimer(unitOfWork);
27497          } // Run beginWork again.
27498  
27499  
27500          invokeGuardedCallback(null, beginWork, null, current, unitOfWork, lanes);
27501  
27502          if (hasCaughtError()) {
27503            var replayError = clearCaughtError();
27504  
27505            if (typeof replayError === 'object' && replayError !== null && replayError._suppressLogging && typeof originalError === 'object' && originalError !== null && !originalError._suppressLogging) {
27506              // If suppressed, let the flag carry over to the original error which is the one we'll rethrow.
27507              originalError._suppressLogging = true;
27508            }
27509          } // We always throw the original error in case the second render pass is not idempotent.
27510          // This can happen if a memoized function or CommonJS module doesn't throw after first invocation.
27511  
27512  
27513          throw originalError;
27514        }
27515      };
27516    }
27517  
27518    var didWarnAboutUpdateInRender = false;
27519    var didWarnAboutUpdateInRenderForAnotherComponent;
27520  
27521    {
27522      didWarnAboutUpdateInRenderForAnotherComponent = new Set();
27523    }
27524  
27525    function warnAboutRenderPhaseUpdatesInDEV(fiber) {
27526      {
27527        if (isRendering && !getIsUpdatingOpaqueValueInRenderPhaseInDEV()) {
27528          switch (fiber.tag) {
27529            case FunctionComponent:
27530            case ForwardRef:
27531            case SimpleMemoComponent:
27532              {
27533                var renderingComponentName = workInProgress && getComponentNameFromFiber(workInProgress) || 'Unknown'; // Dedupe by the rendering component because it's the one that needs to be fixed.
27534  
27535                var dedupeKey = renderingComponentName;
27536  
27537                if (!didWarnAboutUpdateInRenderForAnotherComponent.has(dedupeKey)) {
27538                  didWarnAboutUpdateInRenderForAnotherComponent.add(dedupeKey);
27539                  var setStateComponentName = getComponentNameFromFiber(fiber) || 'Unknown';
27540  
27541                  error('Cannot update a component (`%s`) while rendering a ' + 'different component (`%s`). To locate the bad setState() call inside `%s`, ' + 'follow the stack trace as described in https://reactjs.org/link/setstate-in-render', setStateComponentName, renderingComponentName, renderingComponentName);
27542                }
27543  
27544                break;
27545              }
27546  
27547            case ClassComponent:
27548              {
27549                if (!didWarnAboutUpdateInRender) {
27550                  error('Cannot update during an existing state transition (such as ' + 'within `render`). Render methods should be a pure ' + 'function of props and state.');
27551  
27552                  didWarnAboutUpdateInRender = true;
27553                }
27554  
27555                break;
27556              }
27557          }
27558        }
27559      }
27560    }
27561  
27562    function restorePendingUpdaters(root, lanes) {
27563      {
27564        if (isDevToolsPresent) {
27565          var memoizedUpdaters = root.memoizedUpdaters;
27566          memoizedUpdaters.forEach(function (schedulingFiber) {
27567            addFiberToLanesMap(root, schedulingFiber, lanes);
27568          }); // This function intentionally does not clear memoized updaters.
27569          // Those may still be relevant to the current commit
27570          // and a future one (e.g. Suspense).
27571        }
27572      }
27573    }
27574    var fakeActCallbackNode = {};
27575  
27576    function scheduleCallback$1(priorityLevel, callback) {
27577      {
27578        // If we're currently inside an `act` scope, bypass Scheduler and push to
27579        // the `act` queue instead.
27580        var actQueue = ReactCurrentActQueue$1.current;
27581  
27582        if (actQueue !== null) {
27583          actQueue.push(callback);
27584          return fakeActCallbackNode;
27585        } else {
27586          return scheduleCallback(priorityLevel, callback);
27587        }
27588      }
27589    }
27590  
27591    function cancelCallback$1(callbackNode) {
27592      if ( callbackNode === fakeActCallbackNode) {
27593        return;
27594      } // In production, always call Scheduler. This function will be stripped out.
27595  
27596  
27597      return cancelCallback(callbackNode);
27598    }
27599  
27600    function shouldForceFlushFallbacksInDEV() {
27601      // Never force flush in production. This function should get stripped out.
27602      return  ReactCurrentActQueue$1.current !== null;
27603    }
27604  
27605    function warnIfUpdatesNotWrappedWithActDEV(fiber) {
27606      {
27607        if (fiber.mode & ConcurrentMode) {
27608          if (!isConcurrentActEnvironment()) {
27609            // Not in an act environment. No need to warn.
27610            return;
27611          }
27612        } else {
27613          // Legacy mode has additional cases where we suppress a warning.
27614          if (!isLegacyActEnvironment()) {
27615            // Not in an act environment. No need to warn.
27616            return;
27617          }
27618  
27619          if (executionContext !== NoContext) {
27620            // Legacy mode doesn't warn if the update is batched, i.e.
27621            // batchedUpdates or flushSync.
27622            return;
27623          }
27624  
27625          if (fiber.tag !== FunctionComponent && fiber.tag !== ForwardRef && fiber.tag !== SimpleMemoComponent) {
27626            // For backwards compatibility with pre-hooks code, legacy mode only
27627            // warns for updates that originate from a hook.
27628            return;
27629          }
27630        }
27631  
27632        if (ReactCurrentActQueue$1.current === null) {
27633          var previousFiber = current;
27634  
27635          try {
27636            setCurrentFiber(fiber);
27637  
27638            error('An update to %s inside a test was not wrapped in act(...).\n\n' + 'When testing, code that causes React state updates should be ' + 'wrapped into act(...):\n\n' + 'act(() => {\n' + '  /* fire events that update state */\n' + '});\n' + '/* assert on the output */\n\n' + "This ensures that you're testing the behavior the user would see " + 'in the browser.' + ' Learn more at https://reactjs.org/link/wrap-tests-with-act', getComponentNameFromFiber(fiber));
27639          } finally {
27640            if (previousFiber) {
27641              setCurrentFiber(fiber);
27642            } else {
27643              resetCurrentFiber();
27644            }
27645          }
27646        }
27647      }
27648    }
27649  
27650    function warnIfSuspenseResolutionNotWrappedWithActDEV(root) {
27651      {
27652        if (root.tag !== LegacyRoot && isConcurrentActEnvironment() && ReactCurrentActQueue$1.current === null) {
27653          error('A suspended resource finished loading inside a test, but the event ' + 'was not wrapped in act(...).\n\n' + 'When testing, code that resolves suspended data should be wrapped ' + 'into act(...):\n\n' + 'act(() => {\n' + '  /* finish loading suspended data */\n' + '});\n' + '/* assert on the output */\n\n' + "This ensures that you're testing the behavior the user would see " + 'in the browser.' + ' Learn more at https://reactjs.org/link/wrap-tests-with-act');
27654        }
27655      }
27656    }
27657  
27658    function setIsRunningInsertionEffect(isRunning) {
27659      {
27660        isRunningInsertionEffect = isRunning;
27661      }
27662    }
27663  
27664    /* eslint-disable react-internal/prod-error-codes */
27665    var resolveFamily = null; // $FlowFixMe Flow gets confused by a WeakSet feature check below.
27666  
27667    var failedBoundaries = null;
27668    var setRefreshHandler = function (handler) {
27669      {
27670        resolveFamily = handler;
27671      }
27672    };
27673    function resolveFunctionForHotReloading(type) {
27674      {
27675        if (resolveFamily === null) {
27676          // Hot reloading is disabled.
27677          return type;
27678        }
27679  
27680        var family = resolveFamily(type);
27681  
27682        if (family === undefined) {
27683          return type;
27684        } // Use the latest known implementation.
27685  
27686  
27687        return family.current;
27688      }
27689    }
27690    function resolveClassForHotReloading(type) {
27691      // No implementation differences.
27692      return resolveFunctionForHotReloading(type);
27693    }
27694    function resolveForwardRefForHotReloading(type) {
27695      {
27696        if (resolveFamily === null) {
27697          // Hot reloading is disabled.
27698          return type;
27699        }
27700  
27701        var family = resolveFamily(type);
27702  
27703        if (family === undefined) {
27704          // Check if we're dealing with a real forwardRef. Don't want to crash early.
27705          if (type !== null && type !== undefined && typeof type.render === 'function') {
27706            // ForwardRef is special because its resolved .type is an object,
27707            // but it's possible that we only have its inner render function in the map.
27708            // If that inner render function is different, we'll build a new forwardRef type.
27709            var currentRender = resolveFunctionForHotReloading(type.render);
27710  
27711            if (type.render !== currentRender) {
27712              var syntheticType = {
27713                $$typeof: REACT_FORWARD_REF_TYPE,
27714                render: currentRender
27715              };
27716  
27717              if (type.displayName !== undefined) {
27718                syntheticType.displayName = type.displayName;
27719              }
27720  
27721              return syntheticType;
27722            }
27723          }
27724  
27725          return type;
27726        } // Use the latest known implementation.
27727  
27728  
27729        return family.current;
27730      }
27731    }
27732    function isCompatibleFamilyForHotReloading(fiber, element) {
27733      {
27734        if (resolveFamily === null) {
27735          // Hot reloading is disabled.
27736          return false;
27737        }
27738  
27739        var prevType = fiber.elementType;
27740        var nextType = element.type; // If we got here, we know types aren't === equal.
27741  
27742        var needsCompareFamilies = false;
27743        var $$typeofNextType = typeof nextType === 'object' && nextType !== null ? nextType.$$typeof : null;
27744  
27745        switch (fiber.tag) {
27746          case ClassComponent:
27747            {
27748              if (typeof nextType === 'function') {
27749                needsCompareFamilies = true;
27750              }
27751  
27752              break;
27753            }
27754  
27755          case FunctionComponent:
27756            {
27757              if (typeof nextType === 'function') {
27758                needsCompareFamilies = true;
27759              } else if ($$typeofNextType === REACT_LAZY_TYPE) {
27760                // We don't know the inner type yet.
27761                // We're going to assume that the lazy inner type is stable,
27762                // and so it is sufficient to avoid reconciling it away.
27763                // We're not going to unwrap or actually use the new lazy type.
27764                needsCompareFamilies = true;
27765              }
27766  
27767              break;
27768            }
27769  
27770          case ForwardRef:
27771            {
27772              if ($$typeofNextType === REACT_FORWARD_REF_TYPE) {
27773                needsCompareFamilies = true;
27774              } else if ($$typeofNextType === REACT_LAZY_TYPE) {
27775                needsCompareFamilies = true;
27776              }
27777  
27778              break;
27779            }
27780  
27781          case MemoComponent:
27782          case SimpleMemoComponent:
27783            {
27784              if ($$typeofNextType === REACT_MEMO_TYPE) {
27785                // TODO: if it was but can no longer be simple,
27786                // we shouldn't set this.
27787                needsCompareFamilies = true;
27788              } else if ($$typeofNextType === REACT_LAZY_TYPE) {
27789                needsCompareFamilies = true;
27790              }
27791  
27792              break;
27793            }
27794  
27795          default:
27796            return false;
27797        } // Check if both types have a family and it's the same one.
27798  
27799  
27800        if (needsCompareFamilies) {
27801          // Note: memo() and forwardRef() we'll compare outer rather than inner type.
27802          // This means both of them need to be registered to preserve state.
27803          // If we unwrapped and compared the inner types for wrappers instead,
27804          // then we would risk falsely saying two separate memo(Foo)
27805          // calls are equivalent because they wrap the same Foo function.
27806          var prevFamily = resolveFamily(prevType);
27807  
27808          if (prevFamily !== undefined && prevFamily === resolveFamily(nextType)) {
27809            return true;
27810          }
27811        }
27812  
27813        return false;
27814      }
27815    }
27816    function markFailedErrorBoundaryForHotReloading(fiber) {
27817      {
27818        if (resolveFamily === null) {
27819          // Hot reloading is disabled.
27820          return;
27821        }
27822  
27823        if (typeof WeakSet !== 'function') {
27824          return;
27825        }
27826  
27827        if (failedBoundaries === null) {
27828          failedBoundaries = new WeakSet();
27829        }
27830  
27831        failedBoundaries.add(fiber);
27832      }
27833    }
27834    var scheduleRefresh = function (root, update) {
27835      {
27836        if (resolveFamily === null) {
27837          // Hot reloading is disabled.
27838          return;
27839        }
27840  
27841        var staleFamilies = update.staleFamilies,
27842            updatedFamilies = update.updatedFamilies;
27843        flushPassiveEffects();
27844        flushSync(function () {
27845          scheduleFibersWithFamiliesRecursively(root.current, updatedFamilies, staleFamilies);
27846        });
27847      }
27848    };
27849    var scheduleRoot = function (root, element) {
27850      {
27851        if (root.context !== emptyContextObject) {
27852          // Super edge case: root has a legacy _renderSubtree context
27853          // but we don't know the parentComponent so we can't pass it.
27854          // Just ignore. We'll delete this with _renderSubtree code path later.
27855          return;
27856        }
27857  
27858        flushPassiveEffects();
27859        flushSync(function () {
27860          updateContainer(element, root, null, null);
27861        });
27862      }
27863    };
27864  
27865    function scheduleFibersWithFamiliesRecursively(fiber, updatedFamilies, staleFamilies) {
27866      {
27867        var alternate = fiber.alternate,
27868            child = fiber.child,
27869            sibling = fiber.sibling,
27870            tag = fiber.tag,
27871            type = fiber.type;
27872        var candidateType = null;
27873  
27874        switch (tag) {
27875          case FunctionComponent:
27876          case SimpleMemoComponent:
27877          case ClassComponent:
27878            candidateType = type;
27879            break;
27880  
27881          case ForwardRef:
27882            candidateType = type.render;
27883            break;
27884        }
27885  
27886        if (resolveFamily === null) {
27887          throw new Error('Expected resolveFamily to be set during hot reload.');
27888        }
27889  
27890        var needsRender = false;
27891        var needsRemount = false;
27892  
27893        if (candidateType !== null) {
27894          var family = resolveFamily(candidateType);
27895  
27896          if (family !== undefined) {
27897            if (staleFamilies.has(family)) {
27898              needsRemount = true;
27899            } else if (updatedFamilies.has(family)) {
27900              if (tag === ClassComponent) {
27901                needsRemount = true;
27902              } else {
27903                needsRender = true;
27904              }
27905            }
27906          }
27907        }
27908  
27909        if (failedBoundaries !== null) {
27910          if (failedBoundaries.has(fiber) || alternate !== null && failedBoundaries.has(alternate)) {
27911            needsRemount = true;
27912          }
27913        }
27914  
27915        if (needsRemount) {
27916          fiber._debugNeedsRemount = true;
27917        }
27918  
27919        if (needsRemount || needsRender) {
27920          var _root = enqueueConcurrentRenderForLane(fiber, SyncLane);
27921  
27922          if (_root !== null) {
27923            scheduleUpdateOnFiber(_root, fiber, SyncLane, NoTimestamp);
27924          }
27925        }
27926  
27927        if (child !== null && !needsRemount) {
27928          scheduleFibersWithFamiliesRecursively(child, updatedFamilies, staleFamilies);
27929        }
27930  
27931        if (sibling !== null) {
27932          scheduleFibersWithFamiliesRecursively(sibling, updatedFamilies, staleFamilies);
27933        }
27934      }
27935    }
27936  
27937    var findHostInstancesForRefresh = function (root, families) {
27938      {
27939        var hostInstances = new Set();
27940        var types = new Set(families.map(function (family) {
27941          return family.current;
27942        }));
27943        findHostInstancesForMatchingFibersRecursively(root.current, types, hostInstances);
27944        return hostInstances;
27945      }
27946    };
27947  
27948    function findHostInstancesForMatchingFibersRecursively(fiber, types, hostInstances) {
27949      {
27950        var child = fiber.child,
27951            sibling = fiber.sibling,
27952            tag = fiber.tag,
27953            type = fiber.type;
27954        var candidateType = null;
27955  
27956        switch (tag) {
27957          case FunctionComponent:
27958          case SimpleMemoComponent:
27959          case ClassComponent:
27960            candidateType = type;
27961            break;
27962  
27963          case ForwardRef:
27964            candidateType = type.render;
27965            break;
27966        }
27967  
27968        var didMatch = false;
27969  
27970        if (candidateType !== null) {
27971          if (types.has(candidateType)) {
27972            didMatch = true;
27973          }
27974        }
27975  
27976        if (didMatch) {
27977          // We have a match. This only drills down to the closest host components.
27978          // There's no need to search deeper because for the purpose of giving
27979          // visual feedback, "flashing" outermost parent rectangles is sufficient.
27980          findHostInstancesForFiberShallowly(fiber, hostInstances);
27981        } else {
27982          // If there's no match, maybe there will be one further down in the child tree.
27983          if (child !== null) {
27984            findHostInstancesForMatchingFibersRecursively(child, types, hostInstances);
27985          }
27986        }
27987  
27988        if (sibling !== null) {
27989          findHostInstancesForMatchingFibersRecursively(sibling, types, hostInstances);
27990        }
27991      }
27992    }
27993  
27994    function findHostInstancesForFiberShallowly(fiber, hostInstances) {
27995      {
27996        var foundHostInstances = findChildHostInstancesForFiberShallowly(fiber, hostInstances);
27997  
27998        if (foundHostInstances) {
27999          return;
28000        } // If we didn't find any host children, fallback to closest host parent.
28001  
28002  
28003        var node = fiber;
28004  
28005        while (true) {
28006          switch (node.tag) {
28007            case HostComponent:
28008              hostInstances.add(node.stateNode);
28009              return;
28010  
28011            case HostPortal:
28012              hostInstances.add(node.stateNode.containerInfo);
28013              return;
28014  
28015            case HostRoot:
28016              hostInstances.add(node.stateNode.containerInfo);
28017              return;
28018          }
28019  
28020          if (node.return === null) {
28021            throw new Error('Expected to reach root first.');
28022          }
28023  
28024          node = node.return;
28025        }
28026      }
28027    }
28028  
28029    function findChildHostInstancesForFiberShallowly(fiber, hostInstances) {
28030      {
28031        var node = fiber;
28032        var foundHostInstances = false;
28033  
28034        while (true) {
28035          if (node.tag === HostComponent) {
28036            // We got a match.
28037            foundHostInstances = true;
28038            hostInstances.add(node.stateNode); // There may still be more, so keep searching.
28039          } else if (node.child !== null) {
28040            node.child.return = node;
28041            node = node.child;
28042            continue;
28043          }
28044  
28045          if (node === fiber) {
28046            return foundHostInstances;
28047          }
28048  
28049          while (node.sibling === null) {
28050            if (node.return === null || node.return === fiber) {
28051              return foundHostInstances;
28052            }
28053  
28054            node = node.return;
28055          }
28056  
28057          node.sibling.return = node.return;
28058          node = node.sibling;
28059        }
28060      }
28061  
28062      return false;
28063    }
28064  
28065    var hasBadMapPolyfill;
28066  
28067    {
28068      hasBadMapPolyfill = false;
28069  
28070      try {
28071        var nonExtensibleObject = Object.preventExtensions({});
28072        /* eslint-disable no-new */
28073  
28074        new Map([[nonExtensibleObject, null]]);
28075        new Set([nonExtensibleObject]);
28076        /* eslint-enable no-new */
28077      } catch (e) {
28078        // TODO: Consider warning about bad polyfills
28079        hasBadMapPolyfill = true;
28080      }
28081    }
28082  
28083    function FiberNode(tag, pendingProps, key, mode) {
28084      // Instance
28085      this.tag = tag;
28086      this.key = key;
28087      this.elementType = null;
28088      this.type = null;
28089      this.stateNode = null; // Fiber
28090  
28091      this.return = null;
28092      this.child = null;
28093      this.sibling = null;
28094      this.index = 0;
28095      this.ref = null;
28096      this.pendingProps = pendingProps;
28097      this.memoizedProps = null;
28098      this.updateQueue = null;
28099      this.memoizedState = null;
28100      this.dependencies = null;
28101      this.mode = mode; // Effects
28102  
28103      this.flags = NoFlags;
28104      this.subtreeFlags = NoFlags;
28105      this.deletions = null;
28106      this.lanes = NoLanes;
28107      this.childLanes = NoLanes;
28108      this.alternate = null;
28109  
28110      {
28111        // Note: The following is done to avoid a v8 performance cliff.
28112        //
28113        // Initializing the fields below to smis and later updating them with
28114        // double values will cause Fibers to end up having separate shapes.
28115        // This behavior/bug has something to do with Object.preventExtension().
28116        // Fortunately this only impacts DEV builds.
28117        // Unfortunately it makes React unusably slow for some applications.
28118        // To work around this, initialize the fields below with doubles.
28119        //
28120        // Learn more about this here:
28121        // https://github.com/facebook/react/issues/14365
28122        // https://bugs.chromium.org/p/v8/issues/detail?id=8538
28123        this.actualDuration = Number.NaN;
28124        this.actualStartTime = Number.NaN;
28125        this.selfBaseDuration = Number.NaN;
28126        this.treeBaseDuration = Number.NaN; // It's okay to replace the initial doubles with smis after initialization.
28127        // This won't trigger the performance cliff mentioned above,
28128        // and it simplifies other profiler code (including DevTools).
28129  
28130        this.actualDuration = 0;
28131        this.actualStartTime = -1;
28132        this.selfBaseDuration = 0;
28133        this.treeBaseDuration = 0;
28134      }
28135  
28136      {
28137        // This isn't directly used but is handy for debugging internals:
28138        this._debugSource = null;
28139        this._debugOwner = null;
28140        this._debugNeedsRemount = false;
28141        this._debugHookTypes = null;
28142  
28143        if (!hasBadMapPolyfill && typeof Object.preventExtensions === 'function') {
28144          Object.preventExtensions(this);
28145        }
28146      }
28147    } // This is a constructor function, rather than a POJO constructor, still
28148    // please ensure we do the following:
28149    // 1) Nobody should add any instance methods on this. Instance methods can be
28150    //    more difficult to predict when they get optimized and they are almost
28151    //    never inlined properly in static compilers.
28152    // 2) Nobody should rely on `instanceof Fiber` for type testing. We should
28153    //    always know when it is a fiber.
28154    // 3) We might want to experiment with using numeric keys since they are easier
28155    //    to optimize in a non-JIT environment.
28156    // 4) We can easily go from a constructor to a createFiber object literal if that
28157    //    is faster.
28158    // 5) It should be easy to port this to a C struct and keep a C implementation
28159    //    compatible.
28160  
28161  
28162    var createFiber = function (tag, pendingProps, key, mode) {
28163      // $FlowFixMe: the shapes are exact here but Flow doesn't like constructors
28164      return new FiberNode(tag, pendingProps, key, mode);
28165    };
28166  
28167    function shouldConstruct$1(Component) {
28168      var prototype = Component.prototype;
28169      return !!(prototype && prototype.isReactComponent);
28170    }
28171  
28172    function isSimpleFunctionComponent(type) {
28173      return typeof type === 'function' && !shouldConstruct$1(type) && type.defaultProps === undefined;
28174    }
28175    function resolveLazyComponentTag(Component) {
28176      if (typeof Component === 'function') {
28177        return shouldConstruct$1(Component) ? ClassComponent : FunctionComponent;
28178      } else if (Component !== undefined && Component !== null) {
28179        var $$typeof = Component.$$typeof;
28180  
28181        if ($$typeof === REACT_FORWARD_REF_TYPE) {
28182          return ForwardRef;
28183        }
28184  
28185        if ($$typeof === REACT_MEMO_TYPE) {
28186          return MemoComponent;
28187        }
28188      }
28189  
28190      return IndeterminateComponent;
28191    } // This is used to create an alternate fiber to do work on.
28192  
28193    function createWorkInProgress(current, pendingProps) {
28194      var workInProgress = current.alternate;
28195  
28196      if (workInProgress === null) {
28197        // We use a double buffering pooling technique because we know that we'll
28198        // only ever need at most two versions of a tree. We pool the "other" unused
28199        // node that we're free to reuse. This is lazily created to avoid allocating
28200        // extra objects for things that are never updated. It also allow us to
28201        // reclaim the extra memory if needed.
28202        workInProgress = createFiber(current.tag, pendingProps, current.key, current.mode);
28203        workInProgress.elementType = current.elementType;
28204        workInProgress.type = current.type;
28205        workInProgress.stateNode = current.stateNode;
28206  
28207        {
28208          // DEV-only fields
28209          workInProgress._debugSource = current._debugSource;
28210          workInProgress._debugOwner = current._debugOwner;
28211          workInProgress._debugHookTypes = current._debugHookTypes;
28212        }
28213  
28214        workInProgress.alternate = current;
28215        current.alternate = workInProgress;
28216      } else {
28217        workInProgress.pendingProps = pendingProps; // Needed because Blocks store data on type.
28218  
28219        workInProgress.type = current.type; // We already have an alternate.
28220        // Reset the effect tag.
28221  
28222        workInProgress.flags = NoFlags; // The effects are no longer valid.
28223  
28224        workInProgress.subtreeFlags = NoFlags;
28225        workInProgress.deletions = null;
28226  
28227        {
28228          // We intentionally reset, rather than copy, actualDuration & actualStartTime.
28229          // This prevents time from endlessly accumulating in new commits.
28230          // This has the downside of resetting values for different priority renders,
28231          // But works for yielding (the common case) and should support resuming.
28232          workInProgress.actualDuration = 0;
28233          workInProgress.actualStartTime = -1;
28234        }
28235      } // Reset all effects except static ones.
28236      // Static effects are not specific to a render.
28237  
28238  
28239      workInProgress.flags = current.flags & StaticMask;
28240      workInProgress.childLanes = current.childLanes;
28241      workInProgress.lanes = current.lanes;
28242      workInProgress.child = current.child;
28243      workInProgress.memoizedProps = current.memoizedProps;
28244      workInProgress.memoizedState = current.memoizedState;
28245      workInProgress.updateQueue = current.updateQueue; // Clone the dependencies object. This is mutated during the render phase, so
28246      // it cannot be shared with the current fiber.
28247  
28248      var currentDependencies = current.dependencies;
28249      workInProgress.dependencies = currentDependencies === null ? null : {
28250        lanes: currentDependencies.lanes,
28251        firstContext: currentDependencies.firstContext
28252      }; // These will be overridden during the parent's reconciliation
28253  
28254      workInProgress.sibling = current.sibling;
28255      workInProgress.index = current.index;
28256      workInProgress.ref = current.ref;
28257  
28258      {
28259        workInProgress.selfBaseDuration = current.selfBaseDuration;
28260        workInProgress.treeBaseDuration = current.treeBaseDuration;
28261      }
28262  
28263      {
28264        workInProgress._debugNeedsRemount = current._debugNeedsRemount;
28265  
28266        switch (workInProgress.tag) {
28267          case IndeterminateComponent:
28268          case FunctionComponent:
28269          case SimpleMemoComponent:
28270            workInProgress.type = resolveFunctionForHotReloading(current.type);
28271            break;
28272  
28273          case ClassComponent:
28274            workInProgress.type = resolveClassForHotReloading(current.type);
28275            break;
28276  
28277          case ForwardRef:
28278            workInProgress.type = resolveForwardRefForHotReloading(current.type);
28279            break;
28280        }
28281      }
28282  
28283      return workInProgress;
28284    } // Used to reuse a Fiber for a second pass.
28285  
28286    function resetWorkInProgress(workInProgress, renderLanes) {
28287      // This resets the Fiber to what createFiber or createWorkInProgress would
28288      // have set the values to before during the first pass. Ideally this wouldn't
28289      // be necessary but unfortunately many code paths reads from the workInProgress
28290      // when they should be reading from current and writing to workInProgress.
28291      // We assume pendingProps, index, key, ref, return are still untouched to
28292      // avoid doing another reconciliation.
28293      // Reset the effect flags but keep any Placement tags, since that's something
28294      // that child fiber is setting, not the reconciliation.
28295      workInProgress.flags &= StaticMask | Placement; // The effects are no longer valid.
28296  
28297      var current = workInProgress.alternate;
28298  
28299      if (current === null) {
28300        // Reset to createFiber's initial values.
28301        workInProgress.childLanes = NoLanes;
28302        workInProgress.lanes = renderLanes;
28303        workInProgress.child = null;
28304        workInProgress.subtreeFlags = NoFlags;
28305        workInProgress.memoizedProps = null;
28306        workInProgress.memoizedState = null;
28307        workInProgress.updateQueue = null;
28308        workInProgress.dependencies = null;
28309        workInProgress.stateNode = null;
28310  
28311        {
28312          // Note: We don't reset the actualTime counts. It's useful to accumulate
28313          // actual time across multiple render passes.
28314          workInProgress.selfBaseDuration = 0;
28315          workInProgress.treeBaseDuration = 0;
28316        }
28317      } else {
28318        // Reset to the cloned values that createWorkInProgress would've.
28319        workInProgress.childLanes = current.childLanes;
28320        workInProgress.lanes = current.lanes;
28321        workInProgress.child = current.child;
28322        workInProgress.subtreeFlags = NoFlags;
28323        workInProgress.deletions = null;
28324        workInProgress.memoizedProps = current.memoizedProps;
28325        workInProgress.memoizedState = current.memoizedState;
28326        workInProgress.updateQueue = current.updateQueue; // Needed because Blocks store data on type.
28327  
28328        workInProgress.type = current.type; // Clone the dependencies object. This is mutated during the render phase, so
28329        // it cannot be shared with the current fiber.
28330  
28331        var currentDependencies = current.dependencies;
28332        workInProgress.dependencies = currentDependencies === null ? null : {
28333          lanes: currentDependencies.lanes,
28334          firstContext: currentDependencies.firstContext
28335        };
28336  
28337        {
28338          // Note: We don't reset the actualTime counts. It's useful to accumulate
28339          // actual time across multiple render passes.
28340          workInProgress.selfBaseDuration = current.selfBaseDuration;
28341          workInProgress.treeBaseDuration = current.treeBaseDuration;
28342        }
28343      }
28344  
28345      return workInProgress;
28346    }
28347    function createHostRootFiber(tag, isStrictMode, concurrentUpdatesByDefaultOverride) {
28348      var mode;
28349  
28350      if (tag === ConcurrentRoot) {
28351        mode = ConcurrentMode;
28352  
28353        if (isStrictMode === true) {
28354          mode |= StrictLegacyMode;
28355  
28356          {
28357            mode |= StrictEffectsMode;
28358          }
28359        }
28360      } else {
28361        mode = NoMode;
28362      }
28363  
28364      if ( isDevToolsPresent) {
28365        // Always collect profile timings when DevTools are present.
28366        // This enables DevTools to start capturing timing at any point–
28367        // Without some nodes in the tree having empty base times.
28368        mode |= ProfileMode;
28369      }
28370  
28371      return createFiber(HostRoot, null, null, mode);
28372    }
28373    function createFiberFromTypeAndProps(type, // React$ElementType
28374    key, pendingProps, owner, mode, lanes) {
28375      var fiberTag = IndeterminateComponent; // The resolved type is set if we know what the final type will be. I.e. it's not lazy.
28376  
28377      var resolvedType = type;
28378  
28379      if (typeof type === 'function') {
28380        if (shouldConstruct$1(type)) {
28381          fiberTag = ClassComponent;
28382  
28383          {
28384            resolvedType = resolveClassForHotReloading(resolvedType);
28385          }
28386        } else {
28387          {
28388            resolvedType = resolveFunctionForHotReloading(resolvedType);
28389          }
28390        }
28391      } else if (typeof type === 'string') {
28392        fiberTag = HostComponent;
28393      } else {
28394        getTag: switch (type) {
28395          case REACT_FRAGMENT_TYPE:
28396            return createFiberFromFragment(pendingProps.children, mode, lanes, key);
28397  
28398          case REACT_STRICT_MODE_TYPE:
28399            fiberTag = Mode;
28400            mode |= StrictLegacyMode;
28401  
28402            if ( (mode & ConcurrentMode) !== NoMode) {
28403              // Strict effects should never run on legacy roots
28404              mode |= StrictEffectsMode;
28405            }
28406  
28407            break;
28408  
28409          case REACT_PROFILER_TYPE:
28410            return createFiberFromProfiler(pendingProps, mode, lanes, key);
28411  
28412          case REACT_SUSPENSE_TYPE:
28413            return createFiberFromSuspense(pendingProps, mode, lanes, key);
28414  
28415          case REACT_SUSPENSE_LIST_TYPE:
28416            return createFiberFromSuspenseList(pendingProps, mode, lanes, key);
28417  
28418          case REACT_OFFSCREEN_TYPE:
28419            return createFiberFromOffscreen(pendingProps, mode, lanes, key);
28420  
28421          case REACT_LEGACY_HIDDEN_TYPE:
28422  
28423          // eslint-disable-next-line no-fallthrough
28424  
28425          case REACT_SCOPE_TYPE:
28426  
28427          // eslint-disable-next-line no-fallthrough
28428  
28429          case REACT_CACHE_TYPE:
28430  
28431          // eslint-disable-next-line no-fallthrough
28432  
28433          case REACT_TRACING_MARKER_TYPE:
28434  
28435          // eslint-disable-next-line no-fallthrough
28436  
28437          case REACT_DEBUG_TRACING_MODE_TYPE:
28438  
28439          // eslint-disable-next-line no-fallthrough
28440  
28441          default:
28442            {
28443              if (typeof type === 'object' && type !== null) {
28444                switch (type.$$typeof) {
28445                  case REACT_PROVIDER_TYPE:
28446                    fiberTag = ContextProvider;
28447                    break getTag;
28448  
28449                  case REACT_CONTEXT_TYPE:
28450                    // This is a consumer
28451                    fiberTag = ContextConsumer;
28452                    break getTag;
28453  
28454                  case REACT_FORWARD_REF_TYPE:
28455                    fiberTag = ForwardRef;
28456  
28457                    {
28458                      resolvedType = resolveForwardRefForHotReloading(resolvedType);
28459                    }
28460  
28461                    break getTag;
28462  
28463                  case REACT_MEMO_TYPE:
28464                    fiberTag = MemoComponent;
28465                    break getTag;
28466  
28467                  case REACT_LAZY_TYPE:
28468                    fiberTag = LazyComponent;
28469                    resolvedType = null;
28470                    break getTag;
28471                }
28472              }
28473  
28474              var info = '';
28475  
28476              {
28477                if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
28478                  info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and " + 'named imports.';
28479                }
28480  
28481                var ownerName = owner ? getComponentNameFromFiber(owner) : null;
28482  
28483                if (ownerName) {
28484                  info += '\n\nCheck the render method of `' + ownerName + '`.';
28485                }
28486              }
28487  
28488              throw new Error('Element type is invalid: expected a string (for built-in ' + 'components) or a class/function (for composite components) ' + ("but got: " + (type == null ? type : typeof type) + "." + info));
28489            }
28490        }
28491      }
28492  
28493      var fiber = createFiber(fiberTag, pendingProps, key, mode);
28494      fiber.elementType = type;
28495      fiber.type = resolvedType;
28496      fiber.lanes = lanes;
28497  
28498      {
28499        fiber._debugOwner = owner;
28500      }
28501  
28502      return fiber;
28503    }
28504    function createFiberFromElement(element, mode, lanes) {
28505      var owner = null;
28506  
28507      {
28508        owner = element._owner;
28509      }
28510  
28511      var type = element.type;
28512      var key = element.key;
28513      var pendingProps = element.props;
28514      var fiber = createFiberFromTypeAndProps(type, key, pendingProps, owner, mode, lanes);
28515  
28516      {
28517        fiber._debugSource = element._source;
28518        fiber._debugOwner = element._owner;
28519      }
28520  
28521      return fiber;
28522    }
28523    function createFiberFromFragment(elements, mode, lanes, key) {
28524      var fiber = createFiber(Fragment, elements, key, mode);
28525      fiber.lanes = lanes;
28526      return fiber;
28527    }
28528  
28529    function createFiberFromProfiler(pendingProps, mode, lanes, key) {
28530      {
28531        if (typeof pendingProps.id !== 'string') {
28532          error('Profiler must specify an "id" of type `string` as a prop. Received the type `%s` instead.', typeof pendingProps.id);
28533        }
28534      }
28535  
28536      var fiber = createFiber(Profiler, pendingProps, key, mode | ProfileMode);
28537      fiber.elementType = REACT_PROFILER_TYPE;
28538      fiber.lanes = lanes;
28539  
28540      {
28541        fiber.stateNode = {
28542          effectDuration: 0,
28543          passiveEffectDuration: 0
28544        };
28545      }
28546  
28547      return fiber;
28548    }
28549  
28550    function createFiberFromSuspense(pendingProps, mode, lanes, key) {
28551      var fiber = createFiber(SuspenseComponent, pendingProps, key, mode);
28552      fiber.elementType = REACT_SUSPENSE_TYPE;
28553      fiber.lanes = lanes;
28554      return fiber;
28555    }
28556    function createFiberFromSuspenseList(pendingProps, mode, lanes, key) {
28557      var fiber = createFiber(SuspenseListComponent, pendingProps, key, mode);
28558      fiber.elementType = REACT_SUSPENSE_LIST_TYPE;
28559      fiber.lanes = lanes;
28560      return fiber;
28561    }
28562    function createFiberFromOffscreen(pendingProps, mode, lanes, key) {
28563      var fiber = createFiber(OffscreenComponent, pendingProps, key, mode);
28564      fiber.elementType = REACT_OFFSCREEN_TYPE;
28565      fiber.lanes = lanes;
28566      var primaryChildInstance = {
28567        isHidden: false
28568      };
28569      fiber.stateNode = primaryChildInstance;
28570      return fiber;
28571    }
28572    function createFiberFromText(content, mode, lanes) {
28573      var fiber = createFiber(HostText, content, null, mode);
28574      fiber.lanes = lanes;
28575      return fiber;
28576    }
28577    function createFiberFromHostInstanceForDeletion() {
28578      var fiber = createFiber(HostComponent, null, null, NoMode);
28579      fiber.elementType = 'DELETED';
28580      return fiber;
28581    }
28582    function createFiberFromDehydratedFragment(dehydratedNode) {
28583      var fiber = createFiber(DehydratedFragment, null, null, NoMode);
28584      fiber.stateNode = dehydratedNode;
28585      return fiber;
28586    }
28587    function createFiberFromPortal(portal, mode, lanes) {
28588      var pendingProps = portal.children !== null ? portal.children : [];
28589      var fiber = createFiber(HostPortal, pendingProps, portal.key, mode);
28590      fiber.lanes = lanes;
28591      fiber.stateNode = {
28592        containerInfo: portal.containerInfo,
28593        pendingChildren: null,
28594        // Used by persistent updates
28595        implementation: portal.implementation
28596      };
28597      return fiber;
28598    } // Used for stashing WIP properties to replay failed work in DEV.
28599  
28600    function assignFiberPropertiesInDEV(target, source) {
28601      if (target === null) {
28602        // This Fiber's initial properties will always be overwritten.
28603        // We only use a Fiber to ensure the same hidden class so DEV isn't slow.
28604        target = createFiber(IndeterminateComponent, null, null, NoMode);
28605      } // This is intentionally written as a list of all properties.
28606      // We tried to use Object.assign() instead but this is called in
28607      // the hottest path, and Object.assign() was too slow:
28608      // https://github.com/facebook/react/issues/12502
28609      // This code is DEV-only so size is not a concern.
28610  
28611  
28612      target.tag = source.tag;
28613      target.key = source.key;
28614      target.elementType = source.elementType;
28615      target.type = source.type;
28616      target.stateNode = source.stateNode;
28617      target.return = source.return;
28618      target.child = source.child;
28619      target.sibling = source.sibling;
28620      target.index = source.index;
28621      target.ref = source.ref;
28622      target.pendingProps = source.pendingProps;
28623      target.memoizedProps = source.memoizedProps;
28624      target.updateQueue = source.updateQueue;
28625      target.memoizedState = source.memoizedState;
28626      target.dependencies = source.dependencies;
28627      target.mode = source.mode;
28628      target.flags = source.flags;
28629      target.subtreeFlags = source.subtreeFlags;
28630      target.deletions = source.deletions;
28631      target.lanes = source.lanes;
28632      target.childLanes = source.childLanes;
28633      target.alternate = source.alternate;
28634  
28635      {
28636        target.actualDuration = source.actualDuration;
28637        target.actualStartTime = source.actualStartTime;
28638        target.selfBaseDuration = source.selfBaseDuration;
28639        target.treeBaseDuration = source.treeBaseDuration;
28640      }
28641  
28642      target._debugSource = source._debugSource;
28643      target._debugOwner = source._debugOwner;
28644      target._debugNeedsRemount = source._debugNeedsRemount;
28645      target._debugHookTypes = source._debugHookTypes;
28646      return target;
28647    }
28648  
28649    function FiberRootNode(containerInfo, tag, hydrate, identifierPrefix, onRecoverableError) {
28650      this.tag = tag;
28651      this.containerInfo = containerInfo;
28652      this.pendingChildren = null;
28653      this.current = null;
28654      this.pingCache = null;
28655      this.finishedWork = null;
28656      this.timeoutHandle = noTimeout;
28657      this.context = null;
28658      this.pendingContext = null;
28659      this.callbackNode = null;
28660      this.callbackPriority = NoLane;
28661      this.eventTimes = createLaneMap(NoLanes);
28662      this.expirationTimes = createLaneMap(NoTimestamp);
28663      this.pendingLanes = NoLanes;
28664      this.suspendedLanes = NoLanes;
28665      this.pingedLanes = NoLanes;
28666      this.expiredLanes = NoLanes;
28667      this.mutableReadLanes = NoLanes;
28668      this.finishedLanes = NoLanes;
28669      this.entangledLanes = NoLanes;
28670      this.entanglements = createLaneMap(NoLanes);
28671      this.identifierPrefix = identifierPrefix;
28672      this.onRecoverableError = onRecoverableError;
28673  
28674      {
28675        this.mutableSourceEagerHydrationData = null;
28676      }
28677  
28678      {
28679        this.effectDuration = 0;
28680        this.passiveEffectDuration = 0;
28681      }
28682  
28683      {
28684        this.memoizedUpdaters = new Set();
28685        var pendingUpdatersLaneMap = this.pendingUpdatersLaneMap = [];
28686  
28687        for (var _i = 0; _i < TotalLanes; _i++) {
28688          pendingUpdatersLaneMap.push(new Set());
28689        }
28690      }
28691  
28692      {
28693        switch (tag) {
28694          case ConcurrentRoot:
28695            this._debugRootType = hydrate ? 'hydrateRoot()' : 'createRoot()';
28696            break;
28697  
28698          case LegacyRoot:
28699            this._debugRootType = hydrate ? 'hydrate()' : 'render()';
28700            break;
28701        }
28702      }
28703    }
28704  
28705    function createFiberRoot(containerInfo, tag, hydrate, initialChildren, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, // TODO: We have several of these arguments that are conceptually part of the
28706    // host config, but because they are passed in at runtime, we have to thread
28707    // them through the root constructor. Perhaps we should put them all into a
28708    // single type, like a DynamicHostConfig that is defined by the renderer.
28709    identifierPrefix, onRecoverableError, transitionCallbacks) {
28710      var root = new FiberRootNode(containerInfo, tag, hydrate, identifierPrefix, onRecoverableError);
28711      // stateNode is any.
28712  
28713  
28714      var uninitializedFiber = createHostRootFiber(tag, isStrictMode);
28715      root.current = uninitializedFiber;
28716      uninitializedFiber.stateNode = root;
28717  
28718      {
28719        var _initialState = {
28720          element: initialChildren,
28721          isDehydrated: hydrate,
28722          cache: null,
28723          // not enabled yet
28724          transitions: null,
28725          pendingSuspenseBoundaries: null
28726        };
28727        uninitializedFiber.memoizedState = _initialState;
28728      }
28729  
28730      initializeUpdateQueue(uninitializedFiber);
28731      return root;
28732    }
28733  
28734    var ReactVersion = '18.3.1';
28735  
28736    function createPortal(children, containerInfo, // TODO: figure out the API for cross-renderer implementation.
28737    implementation) {
28738      var key = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
28739  
28740      {
28741        checkKeyStringCoercion(key);
28742      }
28743  
28744      return {
28745        // This tag allow us to uniquely identify this as a React Portal
28746        $$typeof: REACT_PORTAL_TYPE,
28747        key: key == null ? null : '' + key,
28748        children: children,
28749        containerInfo: containerInfo,
28750        implementation: implementation
28751      };
28752    }
28753  
28754    var didWarnAboutNestedUpdates;
28755    var didWarnAboutFindNodeInStrictMode;
28756  
28757    {
28758      didWarnAboutNestedUpdates = false;
28759      didWarnAboutFindNodeInStrictMode = {};
28760    }
28761  
28762    function getContextForSubtree(parentComponent) {
28763      if (!parentComponent) {
28764        return emptyContextObject;
28765      }
28766  
28767      var fiber = get(parentComponent);
28768      var parentContext = findCurrentUnmaskedContext(fiber);
28769  
28770      if (fiber.tag === ClassComponent) {
28771        var Component = fiber.type;
28772  
28773        if (isContextProvider(Component)) {
28774          return processChildContext(fiber, Component, parentContext);
28775        }
28776      }
28777  
28778      return parentContext;
28779    }
28780  
28781    function findHostInstanceWithWarning(component, methodName) {
28782      {
28783        var fiber = get(component);
28784  
28785        if (fiber === undefined) {
28786          if (typeof component.render === 'function') {
28787            throw new Error('Unable to find node on an unmounted component.');
28788          } else {
28789            var keys = Object.keys(component).join(',');
28790            throw new Error("Argument appears to not be a ReactComponent. Keys: " + keys);
28791          }
28792        }
28793  
28794        var hostFiber = findCurrentHostFiber(fiber);
28795  
28796        if (hostFiber === null) {
28797          return null;
28798        }
28799  
28800        if (hostFiber.mode & StrictLegacyMode) {
28801          var componentName = getComponentNameFromFiber(fiber) || 'Component';
28802  
28803          if (!didWarnAboutFindNodeInStrictMode[componentName]) {
28804            didWarnAboutFindNodeInStrictMode[componentName] = true;
28805            var previousFiber = current;
28806  
28807            try {
28808              setCurrentFiber(hostFiber);
28809  
28810              if (fiber.mode & StrictLegacyMode) {
28811                error('%s is deprecated in StrictMode. ' + '%s was passed an instance of %s which is inside StrictMode. ' + 'Instead, add a ref directly to the element you want to reference. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-find-node', methodName, methodName, componentName);
28812              } else {
28813                error('%s is deprecated in StrictMode. ' + '%s was passed an instance of %s which renders StrictMode children. ' + 'Instead, add a ref directly to the element you want to reference. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-find-node', methodName, methodName, componentName);
28814              }
28815            } finally {
28816              // Ideally this should reset to previous but this shouldn't be called in
28817              // render and there's another warning for that anyway.
28818              if (previousFiber) {
28819                setCurrentFiber(previousFiber);
28820              } else {
28821                resetCurrentFiber();
28822              }
28823            }
28824          }
28825        }
28826  
28827        return hostFiber.stateNode;
28828      }
28829    }
28830  
28831    function createContainer(containerInfo, tag, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError, transitionCallbacks) {
28832      var hydrate = false;
28833      var initialChildren = null;
28834      return createFiberRoot(containerInfo, tag, hydrate, initialChildren, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError);
28835    }
28836    function createHydrationContainer(initialChildren, // TODO: Remove `callback` when we delete legacy mode.
28837    callback, containerInfo, tag, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError, transitionCallbacks) {
28838      var hydrate = true;
28839      var root = createFiberRoot(containerInfo, tag, hydrate, initialChildren, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError); // TODO: Move this to FiberRoot constructor
28840  
28841      root.context = getContextForSubtree(null); // Schedule the initial render. In a hydration root, this is different from
28842      // a regular update because the initial render must match was was rendered
28843      // on the server.
28844      // NOTE: This update intentionally doesn't have a payload. We're only using
28845      // the update to schedule work on the root fiber (and, for legacy roots, to
28846      // enqueue the callback if one is provided).
28847  
28848      var current = root.current;
28849      var eventTime = requestEventTime();
28850      var lane = requestUpdateLane(current);
28851      var update = createUpdate(eventTime, lane);
28852      update.callback = callback !== undefined && callback !== null ? callback : null;
28853      enqueueUpdate(current, update, lane);
28854      scheduleInitialHydrationOnRoot(root, lane, eventTime);
28855      return root;
28856    }
28857    function updateContainer(element, container, parentComponent, callback) {
28858      {
28859        onScheduleRoot(container, element);
28860      }
28861  
28862      var current$1 = container.current;
28863      var eventTime = requestEventTime();
28864      var lane = requestUpdateLane(current$1);
28865  
28866      {
28867        markRenderScheduled(lane);
28868      }
28869  
28870      var context = getContextForSubtree(parentComponent);
28871  
28872      if (container.context === null) {
28873        container.context = context;
28874      } else {
28875        container.pendingContext = context;
28876      }
28877  
28878      {
28879        if (isRendering && current !== null && !didWarnAboutNestedUpdates) {
28880          didWarnAboutNestedUpdates = true;
28881  
28882          error('Render methods should be a pure function of props and state; ' + 'triggering nested component updates from render is not allowed. ' + 'If necessary, trigger nested updates in componentDidUpdate.\n\n' + 'Check the render method of %s.', getComponentNameFromFiber(current) || 'Unknown');
28883        }
28884      }
28885  
28886      var update = createUpdate(eventTime, lane); // Caution: React DevTools currently depends on this property
28887      // being called "element".
28888  
28889      update.payload = {
28890        element: element
28891      };
28892      callback = callback === undefined ? null : callback;
28893  
28894      if (callback !== null) {
28895        {
28896          if (typeof callback !== 'function') {
28897            error('render(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callback);
28898          }
28899        }
28900  
28901        update.callback = callback;
28902      }
28903  
28904      var root = enqueueUpdate(current$1, update, lane);
28905  
28906      if (root !== null) {
28907        scheduleUpdateOnFiber(root, current$1, lane, eventTime);
28908        entangleTransitions(root, current$1, lane);
28909      }
28910  
28911      return lane;
28912    }
28913    function getPublicRootInstance(container) {
28914      var containerFiber = container.current;
28915  
28916      if (!containerFiber.child) {
28917        return null;
28918      }
28919  
28920      switch (containerFiber.child.tag) {
28921        case HostComponent:
28922          return getPublicInstance(containerFiber.child.stateNode);
28923  
28924        default:
28925          return containerFiber.child.stateNode;
28926      }
28927    }
28928    function attemptSynchronousHydration$1(fiber) {
28929      switch (fiber.tag) {
28930        case HostRoot:
28931          {
28932            var root = fiber.stateNode;
28933  
28934            if (isRootDehydrated(root)) {
28935              // Flush the first scheduled "update".
28936              var lanes = getHighestPriorityPendingLanes(root);
28937              flushRoot(root, lanes);
28938            }
28939  
28940            break;
28941          }
28942  
28943        case SuspenseComponent:
28944          {
28945            flushSync(function () {
28946              var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
28947  
28948              if (root !== null) {
28949                var eventTime = requestEventTime();
28950                scheduleUpdateOnFiber(root, fiber, SyncLane, eventTime);
28951              }
28952            }); // If we're still blocked after this, we need to increase
28953            // the priority of any promises resolving within this
28954            // boundary so that they next attempt also has higher pri.
28955  
28956            var retryLane = SyncLane;
28957            markRetryLaneIfNotHydrated(fiber, retryLane);
28958            break;
28959          }
28960      }
28961    }
28962  
28963    function markRetryLaneImpl(fiber, retryLane) {
28964      var suspenseState = fiber.memoizedState;
28965  
28966      if (suspenseState !== null && suspenseState.dehydrated !== null) {
28967        suspenseState.retryLane = higherPriorityLane(suspenseState.retryLane, retryLane);
28968      }
28969    } // Increases the priority of thenables when they resolve within this boundary.
28970  
28971  
28972    function markRetryLaneIfNotHydrated(fiber, retryLane) {
28973      markRetryLaneImpl(fiber, retryLane);
28974      var alternate = fiber.alternate;
28975  
28976      if (alternate) {
28977        markRetryLaneImpl(alternate, retryLane);
28978      }
28979    }
28980    function attemptContinuousHydration$1(fiber) {
28981      if (fiber.tag !== SuspenseComponent) {
28982        // We ignore HostRoots here because we can't increase
28983        // their priority and they should not suspend on I/O,
28984        // since you have to wrap anything that might suspend in
28985        // Suspense.
28986        return;
28987      }
28988  
28989      var lane = SelectiveHydrationLane;
28990      var root = enqueueConcurrentRenderForLane(fiber, lane);
28991  
28992      if (root !== null) {
28993        var eventTime = requestEventTime();
28994        scheduleUpdateOnFiber(root, fiber, lane, eventTime);
28995      }
28996  
28997      markRetryLaneIfNotHydrated(fiber, lane);
28998    }
28999    function attemptHydrationAtCurrentPriority$1(fiber) {
29000      if (fiber.tag !== SuspenseComponent) {
29001        // We ignore HostRoots here because we can't increase
29002        // their priority other than synchronously flush it.
29003        return;
29004      }
29005  
29006      var lane = requestUpdateLane(fiber);
29007      var root = enqueueConcurrentRenderForLane(fiber, lane);
29008  
29009      if (root !== null) {
29010        var eventTime = requestEventTime();
29011        scheduleUpdateOnFiber(root, fiber, lane, eventTime);
29012      }
29013  
29014      markRetryLaneIfNotHydrated(fiber, lane);
29015    }
29016    function findHostInstanceWithNoPortals(fiber) {
29017      var hostFiber = findCurrentHostFiberWithNoPortals(fiber);
29018  
29019      if (hostFiber === null) {
29020        return null;
29021      }
29022  
29023      return hostFiber.stateNode;
29024    }
29025  
29026    var shouldErrorImpl = function (fiber) {
29027      return null;
29028    };
29029  
29030    function shouldError(fiber) {
29031      return shouldErrorImpl(fiber);
29032    }
29033  
29034    var shouldSuspendImpl = function (fiber) {
29035      return false;
29036    };
29037  
29038    function shouldSuspend(fiber) {
29039      return shouldSuspendImpl(fiber);
29040    }
29041    var overrideHookState = null;
29042    var overrideHookStateDeletePath = null;
29043    var overrideHookStateRenamePath = null;
29044    var overrideProps = null;
29045    var overridePropsDeletePath = null;
29046    var overridePropsRenamePath = null;
29047    var scheduleUpdate = null;
29048    var setErrorHandler = null;
29049    var setSuspenseHandler = null;
29050  
29051    {
29052      var copyWithDeleteImpl = function (obj, path, index) {
29053        var key = path[index];
29054        var updated = isArray(obj) ? obj.slice() : assign({}, obj);
29055  
29056        if (index + 1 === path.length) {
29057          if (isArray(updated)) {
29058            updated.splice(key, 1);
29059          } else {
29060            delete updated[key];
29061          }
29062  
29063          return updated;
29064        } // $FlowFixMe number or string is fine here
29065  
29066  
29067        updated[key] = copyWithDeleteImpl(obj[key], path, index + 1);
29068        return updated;
29069      };
29070  
29071      var copyWithDelete = function (obj, path) {
29072        return copyWithDeleteImpl(obj, path, 0);
29073      };
29074  
29075      var copyWithRenameImpl = function (obj, oldPath, newPath, index) {
29076        var oldKey = oldPath[index];
29077        var updated = isArray(obj) ? obj.slice() : assign({}, obj);
29078  
29079        if (index + 1 === oldPath.length) {
29080          var newKey = newPath[index]; // $FlowFixMe number or string is fine here
29081  
29082          updated[newKey] = updated[oldKey];
29083  
29084          if (isArray(updated)) {
29085            updated.splice(oldKey, 1);
29086          } else {
29087            delete updated[oldKey];
29088          }
29089        } else {
29090          // $FlowFixMe number or string is fine here
29091          updated[oldKey] = copyWithRenameImpl( // $FlowFixMe number or string is fine here
29092          obj[oldKey], oldPath, newPath, index + 1);
29093        }
29094  
29095        return updated;
29096      };
29097  
29098      var copyWithRename = function (obj, oldPath, newPath) {
29099        if (oldPath.length !== newPath.length) {
29100          warn('copyWithRename() expects paths of the same length');
29101  
29102          return;
29103        } else {
29104          for (var i = 0; i < newPath.length - 1; i++) {
29105            if (oldPath[i] !== newPath[i]) {
29106              warn('copyWithRename() expects paths to be the same except for the deepest key');
29107  
29108              return;
29109            }
29110          }
29111        }
29112  
29113        return copyWithRenameImpl(obj, oldPath, newPath, 0);
29114      };
29115  
29116      var copyWithSetImpl = function (obj, path, index, value) {
29117        if (index >= path.length) {
29118          return value;
29119        }
29120  
29121        var key = path[index];
29122        var updated = isArray(obj) ? obj.slice() : assign({}, obj); // $FlowFixMe number or string is fine here
29123  
29124        updated[key] = copyWithSetImpl(obj[key], path, index + 1, value);
29125        return updated;
29126      };
29127  
29128      var copyWithSet = function (obj, path, value) {
29129        return copyWithSetImpl(obj, path, 0, value);
29130      };
29131  
29132      var findHook = function (fiber, id) {
29133        // For now, the "id" of stateful hooks is just the stateful hook index.
29134        // This may change in the future with e.g. nested hooks.
29135        var currentHook = fiber.memoizedState;
29136  
29137        while (currentHook !== null && id > 0) {
29138          currentHook = currentHook.next;
29139          id--;
29140        }
29141  
29142        return currentHook;
29143      }; // Support DevTools editable values for useState and useReducer.
29144  
29145  
29146      overrideHookState = function (fiber, id, path, value) {
29147        var hook = findHook(fiber, id);
29148  
29149        if (hook !== null) {
29150          var newState = copyWithSet(hook.memoizedState, path, value);
29151          hook.memoizedState = newState;
29152          hook.baseState = newState; // We aren't actually adding an update to the queue,
29153          // because there is no update we can add for useReducer hooks that won't trigger an error.
29154          // (There's no appropriate action type for DevTools overrides.)
29155          // As a result though, React will see the scheduled update as a noop and bailout.
29156          // Shallow cloning props works as a workaround for now to bypass the bailout check.
29157  
29158          fiber.memoizedProps = assign({}, fiber.memoizedProps);
29159          var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
29160  
29161          if (root !== null) {
29162            scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
29163          }
29164        }
29165      };
29166  
29167      overrideHookStateDeletePath = function (fiber, id, path) {
29168        var hook = findHook(fiber, id);
29169  
29170        if (hook !== null) {
29171          var newState = copyWithDelete(hook.memoizedState, path);
29172          hook.memoizedState = newState;
29173          hook.baseState = newState; // We aren't actually adding an update to the queue,
29174          // because there is no update we can add for useReducer hooks that won't trigger an error.
29175          // (There's no appropriate action type for DevTools overrides.)
29176          // As a result though, React will see the scheduled update as a noop and bailout.
29177          // Shallow cloning props works as a workaround for now to bypass the bailout check.
29178  
29179          fiber.memoizedProps = assign({}, fiber.memoizedProps);
29180          var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
29181  
29182          if (root !== null) {
29183            scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
29184          }
29185        }
29186      };
29187  
29188      overrideHookStateRenamePath = function (fiber, id, oldPath, newPath) {
29189        var hook = findHook(fiber, id);
29190  
29191        if (hook !== null) {
29192          var newState = copyWithRename(hook.memoizedState, oldPath, newPath);
29193          hook.memoizedState = newState;
29194          hook.baseState = newState; // We aren't actually adding an update to the queue,
29195          // because there is no update we can add for useReducer hooks that won't trigger an error.
29196          // (There's no appropriate action type for DevTools overrides.)
29197          // As a result though, React will see the scheduled update as a noop and bailout.
29198          // Shallow cloning props works as a workaround for now to bypass the bailout check.
29199  
29200          fiber.memoizedProps = assign({}, fiber.memoizedProps);
29201          var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
29202  
29203          if (root !== null) {
29204            scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
29205          }
29206        }
29207      }; // Support DevTools props for function components, forwardRef, memo, host components, etc.
29208  
29209  
29210      overrideProps = function (fiber, path, value) {
29211        fiber.pendingProps = copyWithSet(fiber.memoizedProps, path, value);
29212  
29213        if (fiber.alternate) {
29214          fiber.alternate.pendingProps = fiber.pendingProps;
29215        }
29216  
29217        var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
29218  
29219        if (root !== null) {
29220          scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
29221        }
29222      };
29223  
29224      overridePropsDeletePath = function (fiber, path) {
29225        fiber.pendingProps = copyWithDelete(fiber.memoizedProps, path);
29226  
29227        if (fiber.alternate) {
29228          fiber.alternate.pendingProps = fiber.pendingProps;
29229        }
29230  
29231        var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
29232  
29233        if (root !== null) {
29234          scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
29235        }
29236      };
29237  
29238      overridePropsRenamePath = function (fiber, oldPath, newPath) {
29239        fiber.pendingProps = copyWithRename(fiber.memoizedProps, oldPath, newPath);
29240  
29241        if (fiber.alternate) {
29242          fiber.alternate.pendingProps = fiber.pendingProps;
29243        }
29244  
29245        var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
29246  
29247        if (root !== null) {
29248          scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
29249        }
29250      };
29251  
29252      scheduleUpdate = function (fiber) {
29253        var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
29254  
29255        if (root !== null) {
29256          scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
29257        }
29258      };
29259  
29260      setErrorHandler = function (newShouldErrorImpl) {
29261        shouldErrorImpl = newShouldErrorImpl;
29262      };
29263  
29264      setSuspenseHandler = function (newShouldSuspendImpl) {
29265        shouldSuspendImpl = newShouldSuspendImpl;
29266      };
29267    }
29268  
29269    function findHostInstanceByFiber(fiber) {
29270      var hostFiber = findCurrentHostFiber(fiber);
29271  
29272      if (hostFiber === null) {
29273        return null;
29274      }
29275  
29276      return hostFiber.stateNode;
29277    }
29278  
29279    function emptyFindFiberByHostInstance(instance) {
29280      return null;
29281    }
29282  
29283    function getCurrentFiberForDevTools() {
29284      return current;
29285    }
29286  
29287    function injectIntoDevTools(devToolsConfig) {
29288      var findFiberByHostInstance = devToolsConfig.findFiberByHostInstance;
29289      var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
29290      return injectInternals({
29291        bundleType: devToolsConfig.bundleType,
29292        version: devToolsConfig.version,
29293        rendererPackageName: devToolsConfig.rendererPackageName,
29294        rendererConfig: devToolsConfig.rendererConfig,
29295        overrideHookState: overrideHookState,
29296        overrideHookStateDeletePath: overrideHookStateDeletePath,
29297        overrideHookStateRenamePath: overrideHookStateRenamePath,
29298        overrideProps: overrideProps,
29299        overridePropsDeletePath: overridePropsDeletePath,
29300        overridePropsRenamePath: overridePropsRenamePath,
29301        setErrorHandler: setErrorHandler,
29302        setSuspenseHandler: setSuspenseHandler,
29303        scheduleUpdate: scheduleUpdate,
29304        currentDispatcherRef: ReactCurrentDispatcher,
29305        findHostInstanceByFiber: findHostInstanceByFiber,
29306        findFiberByHostInstance: findFiberByHostInstance || emptyFindFiberByHostInstance,
29307        // React Refresh
29308        findHostInstancesForRefresh:  findHostInstancesForRefresh ,
29309        scheduleRefresh:  scheduleRefresh ,
29310        scheduleRoot:  scheduleRoot ,
29311        setRefreshHandler:  setRefreshHandler ,
29312        // Enables DevTools to append owner stacks to error messages in DEV mode.
29313        getCurrentFiber:  getCurrentFiberForDevTools ,
29314        // Enables DevTools to detect reconciler version rather than renderer version
29315        // which may not match for third party renderers.
29316        reconcilerVersion: ReactVersion
29317      });
29318    }
29319  
29320    /* global reportError */
29321  
29322    var defaultOnRecoverableError = typeof reportError === 'function' ? // In modern browsers, reportError will dispatch an error event,
29323    // emulating an uncaught JavaScript error.
29324    reportError : function (error) {
29325      // In older browsers and test environments, fallback to console.error.
29326      // eslint-disable-next-line react-internal/no-production-logging
29327      console['error'](error);
29328    };
29329  
29330    function ReactDOMRoot(internalRoot) {
29331      this._internalRoot = internalRoot;
29332    }
29333  
29334    ReactDOMHydrationRoot.prototype.render = ReactDOMRoot.prototype.render = function (children) {
29335      var root = this._internalRoot;
29336  
29337      if (root === null) {
29338        throw new Error('Cannot update an unmounted root.');
29339      }
29340  
29341      {
29342        if (typeof arguments[1] === 'function') {
29343          error('render(...): does not support the second callback argument. ' + 'To execute a side effect after rendering, declare it in a component body with useEffect().');
29344        } else if (isValidContainer(arguments[1])) {
29345          error('You passed a container to the second argument of root.render(...). ' + "You don't need to pass it again since you already passed it to create the root.");
29346        } else if (typeof arguments[1] !== 'undefined') {
29347          error('You passed a second argument to root.render(...) but it only accepts ' + 'one argument.');
29348        }
29349  
29350        var container = root.containerInfo;
29351  
29352        if (container.nodeType !== COMMENT_NODE) {
29353          var hostInstance = findHostInstanceWithNoPortals(root.current);
29354  
29355          if (hostInstance) {
29356            if (hostInstance.parentNode !== container) {
29357              error('render(...): It looks like the React-rendered content of the ' + 'root container was removed without using React. This is not ' + 'supported and will cause errors. Instead, call ' + "root.unmount() to empty a root's container.");
29358            }
29359          }
29360        }
29361      }
29362  
29363      updateContainer(children, root, null, null);
29364    };
29365  
29366    ReactDOMHydrationRoot.prototype.unmount = ReactDOMRoot.prototype.unmount = function () {
29367      {
29368        if (typeof arguments[0] === 'function') {
29369          error('unmount(...): does not support a callback argument. ' + 'To execute a side effect after rendering, declare it in a component body with useEffect().');
29370        }
29371      }
29372  
29373      var root = this._internalRoot;
29374  
29375      if (root !== null) {
29376        this._internalRoot = null;
29377        var container = root.containerInfo;
29378  
29379        {
29380          if (isAlreadyRendering()) {
29381            error('Attempted to synchronously unmount a root while React was already ' + 'rendering. React cannot finish unmounting the root until the ' + 'current render has completed, which may lead to a race condition.');
29382          }
29383        }
29384  
29385        flushSync(function () {
29386          updateContainer(null, root, null, null);
29387        });
29388        unmarkContainerAsRoot(container);
29389      }
29390    };
29391  
29392    function createRoot(container, options) {
29393      if (!isValidContainer(container)) {
29394        throw new Error('createRoot(...): Target container is not a DOM element.');
29395      }
29396  
29397      warnIfReactDOMContainerInDEV(container);
29398      var isStrictMode = false;
29399      var concurrentUpdatesByDefaultOverride = false;
29400      var identifierPrefix = '';
29401      var onRecoverableError = defaultOnRecoverableError;
29402      var transitionCallbacks = null;
29403  
29404      if (options !== null && options !== undefined) {
29405        {
29406          if (options.hydrate) {
29407            warn('hydrate through createRoot is deprecated. Use ReactDOMClient.hydrateRoot(container, <App />) instead.');
29408          } else {
29409            if (typeof options === 'object' && options !== null && options.$$typeof === REACT_ELEMENT_TYPE) {
29410              error('You passed a JSX element to createRoot. You probably meant to ' + 'call root.render instead. ' + 'Example usage:\n\n' + '  let root = createRoot(domContainer);\n' + '  root.render(<App />);');
29411            }
29412          }
29413        }
29414  
29415        if (options.unstable_strictMode === true) {
29416          isStrictMode = true;
29417        }
29418  
29419        if (options.identifierPrefix !== undefined) {
29420          identifierPrefix = options.identifierPrefix;
29421        }
29422  
29423        if (options.onRecoverableError !== undefined) {
29424          onRecoverableError = options.onRecoverableError;
29425        }
29426  
29427        if (options.transitionCallbacks !== undefined) {
29428          transitionCallbacks = options.transitionCallbacks;
29429        }
29430      }
29431  
29432      var root = createContainer(container, ConcurrentRoot, null, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError);
29433      markContainerAsRoot(root.current, container);
29434      var rootContainerElement = container.nodeType === COMMENT_NODE ? container.parentNode : container;
29435      listenToAllSupportedEvents(rootContainerElement);
29436      return new ReactDOMRoot(root);
29437    }
29438  
29439    function ReactDOMHydrationRoot(internalRoot) {
29440      this._internalRoot = internalRoot;
29441    }
29442  
29443    function scheduleHydration(target) {
29444      if (target) {
29445        queueExplicitHydrationTarget(target);
29446      }
29447    }
29448  
29449    ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = scheduleHydration;
29450    function hydrateRoot(container, initialChildren, options) {
29451      if (!isValidContainer(container)) {
29452        throw new Error('hydrateRoot(...): Target container is not a DOM element.');
29453      }
29454  
29455      warnIfReactDOMContainerInDEV(container);
29456  
29457      {
29458        if (initialChildren === undefined) {
29459          error('Must provide initial children as second argument to hydrateRoot. ' + 'Example usage: hydrateRoot(domContainer, <App />)');
29460        }
29461      } // For now we reuse the whole bag of options since they contain
29462      // the hydration callbacks.
29463  
29464  
29465      var hydrationCallbacks = options != null ? options : null; // TODO: Delete this option
29466  
29467      var mutableSources = options != null && options.hydratedSources || null;
29468      var isStrictMode = false;
29469      var concurrentUpdatesByDefaultOverride = false;
29470      var identifierPrefix = '';
29471      var onRecoverableError = defaultOnRecoverableError;
29472  
29473      if (options !== null && options !== undefined) {
29474        if (options.unstable_strictMode === true) {
29475          isStrictMode = true;
29476        }
29477  
29478        if (options.identifierPrefix !== undefined) {
29479          identifierPrefix = options.identifierPrefix;
29480        }
29481  
29482        if (options.onRecoverableError !== undefined) {
29483          onRecoverableError = options.onRecoverableError;
29484        }
29485      }
29486  
29487      var root = createHydrationContainer(initialChildren, null, container, ConcurrentRoot, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError);
29488      markContainerAsRoot(root.current, container); // This can't be a comment node since hydration doesn't work on comment nodes anyway.
29489  
29490      listenToAllSupportedEvents(container);
29491  
29492      if (mutableSources) {
29493        for (var i = 0; i < mutableSources.length; i++) {
29494          var mutableSource = mutableSources[i];
29495          registerMutableSourceForHydration(root, mutableSource);
29496        }
29497      }
29498  
29499      return new ReactDOMHydrationRoot(root);
29500    }
29501    function isValidContainer(node) {
29502      return !!(node && (node.nodeType === ELEMENT_NODE || node.nodeType === DOCUMENT_NODE || node.nodeType === DOCUMENT_FRAGMENT_NODE || !disableCommentsAsDOMContainers  ));
29503    } // TODO: Remove this function which also includes comment nodes.
29504    // We only use it in places that are currently more relaxed.
29505  
29506    function isValidContainerLegacy(node) {
29507      return !!(node && (node.nodeType === ELEMENT_NODE || node.nodeType === DOCUMENT_NODE || node.nodeType === DOCUMENT_FRAGMENT_NODE || node.nodeType === COMMENT_NODE && node.nodeValue === ' react-mount-point-unstable '));
29508    }
29509  
29510    function warnIfReactDOMContainerInDEV(container) {
29511      {
29512        if (container.nodeType === ELEMENT_NODE && container.tagName && container.tagName.toUpperCase() === 'BODY') {
29513          error('createRoot(): Creating roots directly with document.body is ' + 'discouraged, since its children are often manipulated by third-party ' + 'scripts and browser extensions. This may lead to subtle ' + 'reconciliation issues. Try using a container element created ' + 'for your app.');
29514        }
29515  
29516        if (isContainerMarkedAsRoot(container)) {
29517          if (container._reactRootContainer) {
29518            error('You are calling ReactDOMClient.createRoot() on a container that was previously ' + 'passed to ReactDOM.render(). This is not supported.');
29519          } else {
29520            error('You are calling ReactDOMClient.createRoot() on a container that ' + 'has already been passed to createRoot() before. Instead, call ' + 'root.render() on the existing root instead if you want to update it.');
29521          }
29522        }
29523      }
29524    }
29525  
29526    var ReactCurrentOwner$3 = ReactSharedInternals.ReactCurrentOwner;
29527    var topLevelUpdateWarnings;
29528  
29529    {
29530      topLevelUpdateWarnings = function (container) {
29531        if (container._reactRootContainer && container.nodeType !== COMMENT_NODE) {
29532          var hostInstance = findHostInstanceWithNoPortals(container._reactRootContainer.current);
29533  
29534          if (hostInstance) {
29535            if (hostInstance.parentNode !== container) {
29536              error('render(...): It looks like the React-rendered content of this ' + 'container was removed without using React. This is not ' + 'supported and will cause errors. Instead, call ' + 'ReactDOM.unmountComponentAtNode to empty a container.');
29537            }
29538          }
29539        }
29540  
29541        var isRootRenderedBySomeReact = !!container._reactRootContainer;
29542        var rootEl = getReactRootElementInContainer(container);
29543        var hasNonRootReactChild = !!(rootEl && getInstanceFromNode(rootEl));
29544  
29545        if (hasNonRootReactChild && !isRootRenderedBySomeReact) {
29546          error('render(...): Replacing React-rendered children with a new root ' + 'component. If you intended to update the children of this node, ' + 'you should instead have the existing children update their state ' + 'and render the new components instead of calling ReactDOM.render.');
29547        }
29548  
29549        if (container.nodeType === ELEMENT_NODE && container.tagName && container.tagName.toUpperCase() === 'BODY') {
29550          error('render(): Rendering components directly into document.body is ' + 'discouraged, since its children are often manipulated by third-party ' + 'scripts and browser extensions. This may lead to subtle ' + 'reconciliation issues. Try rendering into a container element created ' + 'for your app.');
29551        }
29552      };
29553    }
29554  
29555    function getReactRootElementInContainer(container) {
29556      if (!container) {
29557        return null;
29558      }
29559  
29560      if (container.nodeType === DOCUMENT_NODE) {
29561        return container.documentElement;
29562      } else {
29563        return container.firstChild;
29564      }
29565    }
29566  
29567    function noopOnRecoverableError() {// This isn't reachable because onRecoverableError isn't called in the
29568      // legacy API.
29569    }
29570  
29571    function legacyCreateRootFromDOMContainer(container, initialChildren, parentComponent, callback, isHydrationContainer) {
29572      if (isHydrationContainer) {
29573        if (typeof callback === 'function') {
29574          var originalCallback = callback;
29575  
29576          callback = function () {
29577            var instance = getPublicRootInstance(root);
29578            originalCallback.call(instance);
29579          };
29580        }
29581  
29582        var root = createHydrationContainer(initialChildren, callback, container, LegacyRoot, null, // hydrationCallbacks
29583        false, // isStrictMode
29584        false, // concurrentUpdatesByDefaultOverride,
29585        '', // identifierPrefix
29586        noopOnRecoverableError);
29587        container._reactRootContainer = root;
29588        markContainerAsRoot(root.current, container);
29589        var rootContainerElement = container.nodeType === COMMENT_NODE ? container.parentNode : container;
29590        listenToAllSupportedEvents(rootContainerElement);
29591        flushSync();
29592        return root;
29593      } else {
29594        // First clear any existing content.
29595        var rootSibling;
29596  
29597        while (rootSibling = container.lastChild) {
29598          container.removeChild(rootSibling);
29599        }
29600  
29601        if (typeof callback === 'function') {
29602          var _originalCallback = callback;
29603  
29604          callback = function () {
29605            var instance = getPublicRootInstance(_root);
29606  
29607            _originalCallback.call(instance);
29608          };
29609        }
29610  
29611        var _root = createContainer(container, LegacyRoot, null, // hydrationCallbacks
29612        false, // isStrictMode
29613        false, // concurrentUpdatesByDefaultOverride,
29614        '', // identifierPrefix
29615        noopOnRecoverableError);
29616  
29617        container._reactRootContainer = _root;
29618        markContainerAsRoot(_root.current, container);
29619  
29620        var _rootContainerElement = container.nodeType === COMMENT_NODE ? container.parentNode : container;
29621  
29622        listenToAllSupportedEvents(_rootContainerElement); // Initial mount should not be batched.
29623  
29624        flushSync(function () {
29625          updateContainer(initialChildren, _root, parentComponent, callback);
29626        });
29627        return _root;
29628      }
29629    }
29630  
29631    function warnOnInvalidCallback$1(callback, callerName) {
29632      {
29633        if (callback !== null && typeof callback !== 'function') {
29634          error('%s(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callerName, callback);
29635        }
29636      }
29637    }
29638  
29639    function legacyRenderSubtreeIntoContainer(parentComponent, children, container, forceHydrate, callback) {
29640      {
29641        topLevelUpdateWarnings(container);
29642        warnOnInvalidCallback$1(callback === undefined ? null : callback, 'render');
29643      }
29644  
29645      var maybeRoot = container._reactRootContainer;
29646      var root;
29647  
29648      if (!maybeRoot) {
29649        // Initial mount
29650        root = legacyCreateRootFromDOMContainer(container, children, parentComponent, callback, forceHydrate);
29651      } else {
29652        root = maybeRoot;
29653  
29654        if (typeof callback === 'function') {
29655          var originalCallback = callback;
29656  
29657          callback = function () {
29658            var instance = getPublicRootInstance(root);
29659            originalCallback.call(instance);
29660          };
29661        } // Update
29662  
29663  
29664        updateContainer(children, root, parentComponent, callback);
29665      }
29666  
29667      return getPublicRootInstance(root);
29668    }
29669  
29670    var didWarnAboutFindDOMNode = false;
29671    function findDOMNode(componentOrElement) {
29672      {
29673        if (!didWarnAboutFindDOMNode) {
29674          didWarnAboutFindDOMNode = true;
29675  
29676          error('findDOMNode is deprecated and will be removed in the next major ' + 'release. Instead, add a ref directly to the element you want ' + 'to reference. Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-find-node');
29677        }
29678  
29679        var owner = ReactCurrentOwner$3.current;
29680  
29681        if (owner !== null && owner.stateNode !== null) {
29682          var warnedAboutRefsInRender = owner.stateNode._warnedAboutRefsInRender;
29683  
29684          if (!warnedAboutRefsInRender) {
29685            error('%s is accessing findDOMNode inside its render(). ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', getComponentNameFromType(owner.type) || 'A component');
29686          }
29687  
29688          owner.stateNode._warnedAboutRefsInRender = true;
29689        }
29690      }
29691  
29692      if (componentOrElement == null) {
29693        return null;
29694      }
29695  
29696      if (componentOrElement.nodeType === ELEMENT_NODE) {
29697        return componentOrElement;
29698      }
29699  
29700      {
29701        return findHostInstanceWithWarning(componentOrElement, 'findDOMNode');
29702      }
29703    }
29704    function hydrate(element, container, callback) {
29705      {
29706        error('ReactDOM.hydrate is no longer supported in React 18. Use hydrateRoot ' + 'instead. Until you switch to the new API, your app will behave as ' + "if it's running React 17. Learn " + 'more: https://reactjs.org/link/switch-to-createroot');
29707      }
29708  
29709      if (!isValidContainerLegacy(container)) {
29710        throw new Error('Target container is not a DOM element.');
29711      }
29712  
29713      {
29714        var isModernRoot = isContainerMarkedAsRoot(container) && container._reactRootContainer === undefined;
29715  
29716        if (isModernRoot) {
29717          error('You are calling ReactDOM.hydrate() on a container that was previously ' + 'passed to ReactDOMClient.createRoot(). This is not supported. ' + 'Did you mean to call hydrateRoot(container, element)?');
29718        }
29719      } // TODO: throw or warn if we couldn't hydrate?
29720  
29721  
29722      return legacyRenderSubtreeIntoContainer(null, element, container, true, callback);
29723    }
29724    function render(element, container, callback) {
29725      {
29726        error('ReactDOM.render is no longer supported in React 18. Use createRoot ' + 'instead. Until you switch to the new API, your app will behave as ' + "if it's running React 17. Learn " + 'more: https://reactjs.org/link/switch-to-createroot');
29727      }
29728  
29729      if (!isValidContainerLegacy(container)) {
29730        throw new Error('Target container is not a DOM element.');
29731      }
29732  
29733      {
29734        var isModernRoot = isContainerMarkedAsRoot(container) && container._reactRootContainer === undefined;
29735  
29736        if (isModernRoot) {
29737          error('You are calling ReactDOM.render() on a container that was previously ' + 'passed to ReactDOMClient.createRoot(). This is not supported. ' + 'Did you mean to call root.render(element)?');
29738        }
29739      }
29740  
29741      return legacyRenderSubtreeIntoContainer(null, element, container, false, callback);
29742    }
29743    function unstable_renderSubtreeIntoContainer(parentComponent, element, containerNode, callback) {
29744      {
29745        error('ReactDOM.unstable_renderSubtreeIntoContainer() is no longer supported ' + 'in React 18. Consider using a portal instead. Until you switch to ' + "the createRoot API, your app will behave as if it's running React " + '17. Learn more: https://reactjs.org/link/switch-to-createroot');
29746      }
29747  
29748      if (!isValidContainerLegacy(containerNode)) {
29749        throw new Error('Target container is not a DOM element.');
29750      }
29751  
29752      if (parentComponent == null || !has(parentComponent)) {
29753        throw new Error('parentComponent must be a valid React Component');
29754      }
29755  
29756      return legacyRenderSubtreeIntoContainer(parentComponent, element, containerNode, false, callback);
29757    }
29758    var didWarnAboutUnmountComponentAtNode = false;
29759    function unmountComponentAtNode(container) {
29760      {
29761        if (!didWarnAboutUnmountComponentAtNode) {
29762          didWarnAboutUnmountComponentAtNode = true;
29763  
29764          error('unmountComponentAtNode is deprecated and will be removed in the ' + 'next major release. Switch to the createRoot API. Learn ' + 'more: https://reactjs.org/link/switch-to-createroot');
29765        }
29766      }
29767  
29768      if (!isValidContainerLegacy(container)) {
29769        throw new Error('unmountComponentAtNode(...): Target container is not a DOM element.');
29770      }
29771  
29772      {
29773        var isModernRoot = isContainerMarkedAsRoot(container) && container._reactRootContainer === undefined;
29774  
29775        if (isModernRoot) {
29776          error('You are calling ReactDOM.unmountComponentAtNode() on a container that was previously ' + 'passed to ReactDOMClient.createRoot(). This is not supported. Did you mean to call root.unmount()?');
29777        }
29778      }
29779  
29780      if (container._reactRootContainer) {
29781        {
29782          var rootEl = getReactRootElementInContainer(container);
29783          var renderedByDifferentReact = rootEl && !getInstanceFromNode(rootEl);
29784  
29785          if (renderedByDifferentReact) {
29786            error("unmountComponentAtNode(): The node you're attempting to unmount " + 'was rendered by another copy of React.');
29787          }
29788        } // Unmount should not be batched.
29789  
29790  
29791        flushSync(function () {
29792          legacyRenderSubtreeIntoContainer(null, null, container, false, function () {
29793            // $FlowFixMe This should probably use `delete container._reactRootContainer`
29794            container._reactRootContainer = null;
29795            unmarkContainerAsRoot(container);
29796          });
29797        }); // If you call unmountComponentAtNode twice in quick succession, you'll
29798        // get `true` twice. That's probably fine?
29799  
29800        return true;
29801      } else {
29802        {
29803          var _rootEl = getReactRootElementInContainer(container);
29804  
29805          var hasNonRootReactChild = !!(_rootEl && getInstanceFromNode(_rootEl)); // Check if the container itself is a React root node.
29806  
29807          var isContainerReactRoot = container.nodeType === ELEMENT_NODE && isValidContainerLegacy(container.parentNode) && !!container.parentNode._reactRootContainer;
29808  
29809          if (hasNonRootReactChild) {
29810            error("unmountComponentAtNode(): The node you're attempting to unmount " + 'was rendered by React and is not a top-level container. %s', isContainerReactRoot ? 'You may have accidentally passed in a React root node instead ' + 'of its container.' : 'Instead, have the parent component update its state and ' + 'rerender in order to remove this component.');
29811          }
29812        }
29813  
29814        return false;
29815      }
29816    }
29817  
29818    setAttemptSynchronousHydration(attemptSynchronousHydration$1);
29819    setAttemptContinuousHydration(attemptContinuousHydration$1);
29820    setAttemptHydrationAtCurrentPriority(attemptHydrationAtCurrentPriority$1);
29821    setGetCurrentUpdatePriority(getCurrentUpdatePriority);
29822    setAttemptHydrationAtPriority(runWithPriority);
29823  
29824    {
29825      if (typeof Map !== 'function' || // $FlowIssue Flow incorrectly thinks Map has no prototype
29826      Map.prototype == null || typeof Map.prototype.forEach !== 'function' || typeof Set !== 'function' || // $FlowIssue Flow incorrectly thinks Set has no prototype
29827      Set.prototype == null || typeof Set.prototype.clear !== 'function' || typeof Set.prototype.forEach !== 'function') {
29828        error('React depends on Map and Set built-in types. Make sure that you load a ' + 'polyfill in older browsers. https://reactjs.org/link/react-polyfills');
29829      }
29830    }
29831  
29832    setRestoreImplementation(restoreControlledState$3);
29833    setBatchingImplementation(batchedUpdates$1, discreteUpdates, flushSync);
29834  
29835    function createPortal$1(children, container) {
29836      var key = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
29837  
29838      if (!isValidContainer(container)) {
29839        throw new Error('Target container is not a DOM element.');
29840      } // TODO: pass ReactDOM portal implementation as third argument
29841      // $FlowFixMe The Flow type is opaque but there's no way to actually create it.
29842  
29843  
29844      return createPortal(children, container, null, key);
29845    }
29846  
29847    function renderSubtreeIntoContainer(parentComponent, element, containerNode, callback) {
29848      return unstable_renderSubtreeIntoContainer(parentComponent, element, containerNode, callback);
29849    }
29850  
29851    var Internals = {
29852      usingClientEntryPoint: false,
29853      // Keep in sync with ReactTestUtils.js.
29854      // This is an array for better minification.
29855      Events: [getInstanceFromNode, getNodeFromInstance, getFiberCurrentPropsFromNode, enqueueStateRestore, restoreStateIfNeeded, batchedUpdates$1]
29856    };
29857  
29858    function createRoot$1(container, options) {
29859      {
29860        if (!Internals.usingClientEntryPoint && !true) {
29861          error('You are importing createRoot from "react-dom" which is not supported. ' + 'You should instead import it from "react-dom/client".');
29862        }
29863      }
29864  
29865      return createRoot(container, options);
29866    }
29867  
29868    function hydrateRoot$1(container, initialChildren, options) {
29869      {
29870        if (!Internals.usingClientEntryPoint && !true) {
29871          error('You are importing hydrateRoot from "react-dom" which is not supported. ' + 'You should instead import it from "react-dom/client".');
29872        }
29873      }
29874  
29875      return hydrateRoot(container, initialChildren, options);
29876    } // Overload the definition to the two valid signatures.
29877    // Warning, this opts-out of checking the function body.
29878  
29879  
29880    // eslint-disable-next-line no-redeclare
29881    function flushSync$1(fn) {
29882      {
29883        if (isAlreadyRendering()) {
29884          error('flushSync was called from inside a lifecycle method. React cannot ' + 'flush when React is already rendering. Consider moving this call to ' + 'a scheduler task or micro task.');
29885        }
29886      }
29887  
29888      return flushSync(fn);
29889    }
29890    var foundDevTools = injectIntoDevTools({
29891      findFiberByHostInstance: getClosestInstanceFromNode,
29892      bundleType:  1 ,
29893      version: ReactVersion,
29894      rendererPackageName: 'react-dom'
29895    });
29896  
29897    {
29898      if (!foundDevTools && canUseDOM && window.top === window.self) {
29899        // If we're in Chrome or Firefox, provide a download link if not installed.
29900        if (navigator.userAgent.indexOf('Chrome') > -1 && navigator.userAgent.indexOf('Edge') === -1 || navigator.userAgent.indexOf('Firefox') > -1) {
29901          var protocol = window.location.protocol; // Don't warn in exotic cases like chrome-extension://.
29902  
29903          if (/^(https?|file):$/.test(protocol)) {
29904            // eslint-disable-next-line react-internal/no-production-logging
29905            console.info('%cDownload the React DevTools ' + 'for a better development experience: ' + 'https://reactjs.org/link/react-devtools' + (protocol === 'file:' ? '\nYou might need to use a local HTTP server (instead of file://): ' + 'https://reactjs.org/link/react-devtools-faq' : ''), 'font-weight:bold');
29906          }
29907        }
29908      }
29909    }
29910  
29911    exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
29912    exports.createPortal = createPortal$1;
29913    exports.createRoot = createRoot$1;
29914    exports.findDOMNode = findDOMNode;
29915    exports.flushSync = flushSync$1;
29916    exports.hydrate = hydrate;
29917    exports.hydrateRoot = hydrateRoot$1;
29918    exports.render = render;
29919    exports.unmountComponentAtNode = unmountComponentAtNode;
29920    exports.unstable_batchedUpdates = batchedUpdates$1;
29921    exports.unstable_renderSubtreeIntoContainer = renderSubtreeIntoContainer;
29922    exports.version = ReactVersion;
29923  
29924  })));