https://microfun.cn/react-code/react-dom-dev.js

135    registrationNameDependencies[registrationName] = dependencies;
136
137    {
138      var lowerCasedName = registrationName.toLowerCase();
139      possibleRegistrationNames[lowerCasedName] = registrationName;
140
141      if (registrationName === 'onDoubleClick') {
142        possibleRegistrationNames.ondblclick = registrationName;
143      }
144    }
145
146    for (var i = 0; i < dependencies.length; i++) {
147      allNativeEvents.add(dependencies[i]);
148    }
149  }
150
151  var canUseDOM = !!(typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined');
152
153  // A reserved attribute.
154  // It is handled by React separately and shouldn't be written to the DOM.
155  var RESERVED = 0; // A simple string attribute.
156  // Attributes that aren't in the filter are presumed to have this type.
157
158  var STRING = 1; // A string attribute that accepts booleans in React. In HTML, these are called
159  // "enumerated" attributes with "true" and "false" as possible values.
160  // When true, it should be set to a "true" string.
161  // When false, it should be set to a "false" string.
162
163  var BOOLEANISH_STRING = 2; // A real boolean attribute.
164  // When true, it should be present (set either to an empty string or its name).
165  // When false, it should be omitted.
166
167  var BOOLEAN = 3; // An attribute that can be used as a flag as well as with a value.
168  // When true, it should be present (set either to an empty string or its name).
169  // When false, it should be omitted.
170  // For any other value, should be present with that value.
171
172  var OVERLOADED_BOOLEAN = 4; // An attribute that must be numeric or parse as a numeric.
173  // When falsy, it should be removed.
174
175  var NUMERIC = 5; // An attribute that must be positive numeric or parse as a positive numeric.
176  // When falsy, it should be removed.
177
178  var POSITIVE_NUMERIC = 6;
179
180  /* eslint-disable max-len */
181  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";
182  /* eslint-enable max-len */
183
184  var ATTRIBUTE_NAME_CHAR = ATTRIBUTE_NAME_START_CHAR + "\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040";
185  var ROOT_ATTRIBUTE_NAME = 'data-reactroot';
186  var VALID_ATTRIBUTE_NAME_REGEX = new RegExp('^[' + ATTRIBUTE_NAME_START_CHAR + '][' + ATTRIBUTE_NAME_CHAR + ']*$');
187  var hasOwnProperty = Object.prototype.hasOwnProperty;
188  var illegalAttributeNameCache = {};
189  var validatedAttributeNameCache = {};
190  function isAttributeNameSafe(attributeName) {
191    if (hasOwnProperty.call(validatedAttributeNameCache, attributeName)) {
192      return true;
193    }
194
195    if (hasOwnProperty.call(illegalAttributeNameCache, attributeName)) {
196      return false;
197    }
198
199    if (VALID_ATTRIBUTE_NAME_REGEX.test(attributeName)) {
200      validatedAttributeNameCache[attributeName] = true;
201      return true;
202    }
203
204    illegalAttributeNameCache[attributeName] = true;
205
206    {
207      error('Invalid attribute name: `%s`', attributeName);
208    }
209
210    return false;
211  }
212  function shouldIgnoreAttribute(name, propertyInfo, isCustomComponentTag) {
213    if (propertyInfo !== null) {
214      return propertyInfo.type === RESERVED;
215    }
216
217    if (isCustomComponentTag) {
218      return false;
219    }
220
221    if (name.length > 2 && (name[0] === 'o' || name[0] === 'O') && (name[1] === 'n' || name[1] === 'N')) {
222      return true;
223    }
224
225    return false;
226  }
227  function shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag) {
228    if (propertyInfo !== null && propertyInfo.type === RESERVED) {
229      return false;
230    }
231
232    switch (typeof value) {
233      case 'function': // $FlowIssue symbol is perfectly valid here
234
235      case 'symbol':
236        // eslint-disable-line
237        return true;
238
239      case 'boolean':
240        {
241          if (isCustomComponentTag) {
242            return false;
243          }
244
245          if (propertyInfo !== null) {
246            return !propertyInfo.acceptsBooleans;
247          } else {
248            var prefix = name.toLowerCase().slice(0, 5);
249            return prefix !== 'data-' && prefix !== 'aria-';
250          }
251        }
252
253      default:
254        return false;

255    }
256  }
257  function shouldRemoveAttribute(name, value, propertyInfo, isCustomComponentTag) {
258    if (value === null || typeof value === 'undefined') {
259      return true;
260    }
261
262    if (shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag)) {
263      return true;
264    }
265
266    if (isCustomComponentTag) {
267      return false;
268    }
269
270    if (propertyInfo !== null) {
271
272      switch (propertyInfo.type) {
273        case BOOLEAN:
274          return !value;
275
276        case OVERLOADED_BOOLEAN:
277          return value === false;
278
279        case NUMERIC:
280          return isNaN(value);
281
282        case POSITIVE_NUMERIC:
283          return isNaN(value) || value < 1;
284      }
285    }
286
287    return false;
288  }
289  function getPropertyInfo(name) {
290    return properties.hasOwnProperty(name) ? properties[name] : null;
291  }
292
293  function PropertyInfoRecord(name, type, mustUseProperty, attributeName, attributeNamespace, sanitizeURL, removeEmptyString) {
294    this.acceptsBooleans = type === BOOLEANISH_STRING || type === BOOLEAN || type === OVERLOADED_BOOLEAN;
295    this.attributeName = attributeName;
296    this.attributeNamespace = attributeNamespace;
297    this.mustUseProperty = mustUseProperty;
298    this.propertyName = name;
299    this.type = type;
300    this.sanitizeURL = sanitizeURL;
301    this.removeEmptyString = removeEmptyString;
302  } // When adding attributes to this list, be sure to also add them to
303  // the `possibleStandardNames` module to ensure casing and incorrect
304  // name warnings.
305
306
307  var properties = {}; // These props are reserved by React. They shouldn't be written to the DOM.
308
309  var reservedProps = ['children', 'dangerouslySetInnerHTML', // TODO: This prevents the assignment of defaultValue to regular
310  // elements (not just inputs). Now that ReactDOMInput assigns to the
311  // defaultValue property -- do we need this?
312  'defaultValue', 'defaultChecked', 'innerHTML', 'suppressContentEditableWarning', 'suppressHydrationWarning', 'style'];
313  reservedProps.forEach(function (name) {
314    properties[name] = new PropertyInfoRecord(name, RESERVED, false, // mustUseProperty
315    name, // attributeName
316    null, // attributeNamespace
317    false, // sanitizeURL
318    false);
319  }); // A few React string attributes have a different name.
320  // This is a mapping from React prop names to the attribute names.
321
322  [['acceptCharset', 'accept-charset'], ['className', 'class'], ['htmlFor', 'for'], ['httpEquiv', 'http-equiv']].forEach(function (_ref) {
323    var name = _ref[0],
324        attributeName = _ref[1];
325    properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
326    attributeName, // attributeName
327    null, // attributeNamespace
328    false, // sanitizeURL
329    false);
330  }); // These are "enumerated" HTML attributes that accept "true" and "false".
331  // In React, we let users pass `true` and `false` even though technically
332  // these aren't boolean attributes (they are coerced to strings).
333
334  ['contentEditable', 'draggable', 'spellCheck', 'value'].forEach(function (name) {
335    properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty
336    name.toLowerCase(), // attributeName
337    null, // attributeNamespace
338    false, // sanitizeURL
339    false);
340  }); // These are "enumerated" SVG attributes that accept "true" and "false".
341  // In React, we let users pass `true` and `false` even though technically
342  // these aren't boolean attributes (they are coerced to strings).
343  // Since these are SVG attributes, their attribute names are case-sensitive.
344
345  ['autoReverse', 'externalResourcesRequired', 'focusable', 'preserveAlpha'].forEach(function (name) {
346    properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty
347    name, // attributeName
348    null, // attributeNamespace
349    false, // sanitizeURL
350    false);
351  }); // These are HTML boolean attributes.
352
353  ['allowFullScreen', 'async', // Note: there is a special case that prevents it from being written to the DOM
354  // on the client side because the browsers are inconsistent. Instead we call focus().
355  'autoFocus', 'autoPlay', 'controls', 'default', 'defer', 'disabled', 'disablePictureInPicture', 'disableRemotePlayback', 'formNoValidate', 'hidden', 'loop', 'noModule', 'noValidate', 'open', 'playsInline', 'readOnly', 'required', 'reversed', 'scoped', 'seamless', // Microdata
356  'itemScope'].forEach(function (name) {
357    properties[name] = new PropertyInfoRecord(name, BOOLEAN, false, // mustUseProperty
358    name.toLowerCase(), // attributeName
359    null, // attributeNamespace
360    false, // sanitizeURL
361    false);
362  }); // These are the few React props that we set as DOM properties
363  // rather than attributes. These are all booleans.
364
365  ['checked', // Note: `option.selected` is not updated if `select.multiple` is
366  // disabled with `removeAttribute`. We have special logic for handling this.
367  'multiple', 'muted', 'selected' // NOTE: if you add a camelCased prop to this list,
368  // you'll need to set attributeName to name.toLowerCase()
369  // instead in the assignment below.
370  ].forEach(function (name) {
371    properties[name] = new PropertyInfoRecord(name, BOOLEAN, true, // mustUseProperty
372    name, // attributeName
373    null, // attributeNamespace
374    false, // sanitizeURL
375    false);
376  }); // These are HTML attributes that are "overloaded booleans": they behave like
377  // booleans, but can also accept a string value.
378
379  ['capture', 'download' // NOTE: if you add a camelCased prop to this list,
380  // you'll need to set attributeName to name.toLowerCase()
381  // instead in the assignment below.
382  ].forEach(function (name) {
383    properties[name] = new PropertyInfoRecord(name, OVERLOADED_BOOLEAN, false, // mustUseProperty
384    name, // attributeName
385    null, // attributeNamespace
386    false, // sanitizeURL
387    false);
388  }); // These are HTML attributes that must be positive numbers.
389
390  ['cols', 'rows', 'size', 'span' // NOTE: if you add a camelCased prop to this list,
391  // you'll need to set attributeName to name.toLowerCase()
392  // instead in the assignment below.
393  ].forEach(function (name) {
394    properties[name] = new PropertyInfoRecord(name, POSITIVE_NUMERIC, false, // mustUseProperty
395    name, // attributeName
396    null, // attributeNamespace
397    false, // sanitizeURL
398    false);
399  }); // These are HTML attributes that must be numbers.
400
401  ['rowSpan', 'start'].forEach(function (name) {
402    properties[name] = new PropertyInfoRecord(name, NUMERIC, false, // mustUseProperty
403    name.toLowerCase(), // attributeName
404    null, // attributeNamespace
405    false, // sanitizeURL
406    false);
407  });
408  var CAMELIZE = /[\-\:]([a-z])/g;
409
410  var capitalize = function (token) {
411    return token[1].toUpperCase();
412  }; // This is a list of all SVG attributes that need special casing, namespacing,
413  // or boolean value assignment. Regular attributes that just accept strings
414  // and have the same names are omitted, just like in the HTML attribute filter.
415  // Some of these attributes can be hard to find. This list was created by
416  // scraping the MDN documentation.
417
418
419  ['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,
420  // you'll need to set attributeName to name.toLowerCase()
421  // instead in the assignment below.
422  ].forEach(function (attributeName) {
423    var name = attributeName.replace(CAMELIZE, capitalize);
424    properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
425    attributeName, null, // attributeNamespace
426    false, // sanitizeURL
427    false);
428  }); // String SVG attributes with the xlink namespace.
429
430  ['xlink:actuate', 'xlink:arcrole', 'xlink:role', 'xlink:show', 'xlink:title', 'xlink:type' // NOTE: if you add a camelCased prop to this list,
431  // you'll need to set attributeName to name.toLowerCase()
432  // instead in the assignment below.
433  ].forEach(function (attributeName) {
434    var name = attributeName.replace(CAMELIZE, capitalize);
435    properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
436    attributeName, 'http://www.w3.org/1999/xlink', false, // sanitizeURL
437    false);
438  }); // String SVG attributes with the xml namespace.
439
440  ['xml:base', 'xml:lang', 'xml:space' // NOTE: if you add a camelCased prop to this list,
441  // you'll need to set attributeName to name.toLowerCase()
442  // instead in the assignment below.
443  ].forEach(function (attributeName) {
444    var name = attributeName.replace(CAMELIZE, capitalize);
445    properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
446    attributeName, 'http://www.w3.org/XML/1998/namespace', false, // sanitizeURL
447    false);
448  }); // These attribute exists both in HTML and SVG.
449  // The attribute name is case-sensitive in SVG so we can't just use
450  // the React name like we do for attributes that exist only in HTML.
451
452  ['tabIndex', 'crossOrigin'].forEach(function (attributeName) {
453    properties[attributeName] = new PropertyInfoRecord(attributeName, STRING, false, // mustUseProperty
454    attributeName.toLowerCase(), // attributeName
455    null, // attributeNamespace
456    false, // sanitizeURL
457    false);
458  }); // These attributes accept URLs. These must not allow javascript: URLS.
459  // These will also need to accept Trusted Types object in the future.
460
461  var xlinkHref = 'xlinkHref';
462  properties[xlinkHref] = new PropertyInfoRecord('xlinkHref', STRING, false, // mustUseProperty
463  'xlink:href', 'http://www.w3.org/1999/xlink', true, // sanitizeURL
464  false);
465  ['src', 'href', 'action', 'formAction'].forEach(function (attributeName) {
466    properties[attributeName] = new PropertyInfoRecord(attributeName, STRING, false, // mustUseProperty
467    attributeName.toLowerCase(), // attributeName
468    null, // attributeNamespace
469    true, // sanitizeURL
470    true);
471  });
472
473  // and any newline or tab are filtered out as if they're not part of the URL.
474  // https://url.spec.whatwg.org/#url-parsing
475  // Tab or newline are defined as \r\n\t:
476  // https://infra.spec.whatwg.org/#ascii-tab-or-newline
477  // A C0 control is a code point in the range \u0000 NULL to \u001F
478  // INFORMATION SEPARATOR ONE, inclusive:
479  // https://infra.spec.whatwg.org/#c0-control-or-space
480
481  /* eslint-disable max-len */
482
483  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;
484  var didWarn = false;
485
486  function sanitizeURL(url) {
487    {
488      if (!didWarn && isJavaScriptProtocol.test(url)) {
489        didWarn = true;
490
491        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));
492      }
493    }
494  }
495
496  /**
497   * Get the value for a property on a node. Only used in DEV for SSR validation.
498   * The "expected" argument is used as a hint of what the expected value is.
499   * Some properties have multiple equivalent values.
500   */
501  function getValueForProperty(node, name, expected, propertyInfo) {
502    {
503      if (propertyInfo.mustUseProperty) {
504        var propertyName = propertyInfo.propertyName;
505        return node[propertyName];
506      } else {
507        if ( propertyInfo.sanitizeURL) {
508          // If we haven't fully disabled javascript: URLs, and if
509          // the hydration is successful of a javascript: URL, we
510          // still want to warn on the client.
511          sanitizeURL('' + expected);
512        }
513
514        var attributeName = propertyInfo.attributeName;
515        var stringValue = null;
516
517        if (propertyInfo.type === OVERLOADED_BOOLEAN) {
518          if (node.hasAttribute(attributeName)) {
519            var value = node.getAttribute(attributeName);
520
521            if (value === '') {
522              return true;
523            }
524
525            if (shouldRemoveAttribute(name, expected, propertyInfo, false)) {
526              return value;
527            }
528
529            if (value === '' + expected) {
530              return expected;
531            }
532
533            return value;
534          }
535        } else if (node.hasAttribute(attributeName)) {
536          if (shouldRemoveAttribute(name, expected, propertyInfo, false)) {
537            // We had an attribute but shouldn't have had one, so read it
538            // for the error message.
539            return node.getAttribute(attributeName);
540          }
541
542          if (propertyInfo.type === BOOLEAN) {
543            // If this was a boolean, it doesn't matter what the value is
544            // the fact that we have it is the same as the expected.
545            return expected;
546          } // Even if this property uses a namespace we use getAttribute
547          // because we assume its namespaced name is the same as our config.
548          // To use getAttributeNS we need the local name which we don't have
549          // in our config atm.
550
551

552          stringValue = node.getAttribute(attributeName);
553        }
554
555        if (shouldRemoveAttribute(name, expected, propertyInfo, false)) {
556          return stringValue === null ? expected : stringValue;
557        } else if (stringValue === '' + expected) {
558          return expected;
559        } else {
560          return stringValue;
561        }
562      }
563    }
564  }
565  /**
566   * Get the value for a attribute on a node. Only used in DEV for SSR validation.
567   * The third argument is used as a hint of what the expected value is. Some
568   * attributes have multiple equivalent values.
569   */
570
571  function getValueForAttribute(node, name, expected) {
572    {
573      if (!isAttributeNameSafe(name)) {
574        return;
575      } // If the object is an opaque reference ID, it's expected that
576      // the next prop is different than the server value, so just return
577      // expected
578
579
580      if (isOpaqueHydratingObject(expected)) {
581        return expected;
582      }
583
584      if (!node.hasAttribute(name)) {
585        return expected === undefined ? undefined : null;
586      }
587
588      var value = node.getAttribute(name);
589
590      if (value === '' + expected) {
591        return expected;
592      }
593
594      return value;
595    }
596  }
597  /**
598   * Sets the value for a property on a node.
599   *
600   * @param {DOMElement} node
601   * @param {string} name
602   * @param {*} value
603   */
604
605  function setValueForProperty(node, name, value, isCustomComponentTag) {
606    var propertyInfo = getPropertyInfo(name);
607
608    if (shouldIgnoreAttribute(name, propertyInfo, isCustomComponentTag)) {
609      return;
610    }
611
612    if (shouldRemoveAttribute(name, value, propertyInfo, isCustomComponentTag)) {
613      value = null;
614    } // If the prop isn't in the special list, treat it as a simple attribute.
615
616
617    if (isCustomComponentTag || propertyInfo === null) {
618      if (isAttributeNameSafe(name)) {
619        var _attributeName = name;
620
621        if (value === null) {
622          node.removeAttribute(_attributeName);
623        } else {
624          node.setAttribute(_attributeName,  '' + value);
625        }
626      }
627
628      return;
629    }
630
631    var mustUseProperty = propertyInfo.mustUseProperty;
632
633    if (mustUseProperty) {
634      var propertyName = propertyInfo.propertyName;
635
636      if (value === null) {
637        var type = propertyInfo.type;
638        node[propertyName] = type === BOOLEAN ? false : '';
639      } else {
640        // Contrary to `setAttribute`, object properties are properly
641        // `toString`ed by IE8/9.
642        node[propertyName] = value;
643      }
644
645      return;
646    } // The rest are treated as attributes with special cases.
647
648
649    var attributeName = propertyInfo.attributeName,
650        attributeNamespace = propertyInfo.attributeNamespace;
651
652    if (value === null) {
653      node.removeAttribute(attributeName);
654    } else {
655      var _type = propertyInfo.type;
656      var attributeValue;
657
658      if (_type === BOOLEAN || _type === OVERLOADED_BOOLEAN && value === true) {
659        // If attribute type is boolean, we know for sure it won't be an execution sink
660        // and we won't require Trusted Type here.
661        attributeValue = '';
662      } else {
663        // `setAttribute` with objects becomes only `[object]` in IE8/9,
664        // ('' + value) makes it output the correct toString()-value.
665        {
666          attributeValue = '' + value;
667        }
668
669        if (propertyInfo.sanitizeURL) {
670          sanitizeURL(attributeValue.toString());
671        }
672      }
673
674      if (attributeNamespace) {
675        node.setAttributeNS(attributeNamespace, attributeName, attributeValue);
676      } else {
677        node.setAttribute(attributeName, attributeValue);
678      }
679    }
680  }
681
682  var ReactInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
683  var _assign = ReactInternals.assign;
684
685  // ATTENTION
686  // When adding new symbols to this file,
687  // Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
688  // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
689  // nor polyfill, then a plain number is used for performance.
690  var REACT_ELEMENT_TYPE = 0xeac7;
691  var REACT_PORTAL_TYPE = 0xeaca;
692  var REACT_FRAGMENT_TYPE = 0xeacb;
693  var REACT_STRICT_MODE_TYPE = 0xeacc;
694  var REACT_PROFILER_TYPE = 0xead2;
695  var REACT_PROVIDER_TYPE = 0xeacd;
696  var REACT_CONTEXT_TYPE = 0xeace;
697  var REACT_FORWARD_REF_TYPE = 0xead0;
698  var REACT_SUSPENSE_TYPE = 0xead1;
699  var REACT_SUSPENSE_LIST_TYPE = 0xead8;
700  var REACT_MEMO_TYPE = 0xead3;
701  var REACT_LAZY_TYPE = 0xead4;
702  var REACT_BLOCK_TYPE = 0xead9;
703  var REACT_SERVER_BLOCK_TYPE = 0xeada;
704  var REACT_FUNDAMENTAL_TYPE = 0xead5;
705  var REACT_SCOPE_TYPE = 0xead7;
706  var REACT_OPAQUE_ID_TYPE = 0xeae0;
707  var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
708  var REACT_OFFSCREEN_TYPE = 0xeae2;
709  var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
710
711  if (typeof Symbol === 'function' && Symbol.for) {
712    var symbolFor = Symbol.for;
713    REACT_ELEMENT_TYPE = symbolFor('react.element');
714    REACT_PORTAL_TYPE = symbolFor('react.portal');
715    REACT_FRAGMENT_TYPE = symbolFor('react.fragment');
716    REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
717    REACT_PROFILER_TYPE = symbolFor('react.profiler');
718    REACT_PROVIDER_TYPE = symbolFor('react.provider');
719    REACT_CONTEXT_TYPE = symbolFor('react.context');
720    REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
721    REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
722    REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
723    REACT_MEMO_TYPE = symbolFor('react.memo');
724    REACT_LAZY_TYPE = symbolFor('react.lazy');
725    REACT_BLOCK_TYPE = symbolFor('react.block');
726    REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
727    REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
728    REACT_SCOPE_TYPE = symbolFor('react.scope');
729    REACT_OPAQUE_ID_TYPE = symbolFor('react.opaque.id');
730    REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
731    REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
732    REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
733  }
734
735  var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
736  var FAUX_ITERATOR_SYMBOL = '@@iterator';
737  function getIteratorFn(maybeIterable) {
738    if (maybeIterable === null || typeof maybeIterable !== 'object') {
739      return null;
740    }
741
742    var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
743
744    if (typeof maybeIterator === 'function') {
745      return maybeIterator;
746    }
747
748    return null;
749  }
750
751  // Helpers to patch console.logs to avoid logging during side-effect free
752  // replaying on render function. This currently only patches the object

753  // lazily which won't cover if the log function was extracted eagerly.
754  // We could also eagerly patch the method.
755  var disabledDepth = 0;
756  var prevLog;
757  var prevInfo;
758  var prevWarn;
759  var prevError;
760  var prevGroup;
761  var prevGroupCollapsed;
762  var prevGroupEnd;
763
764  function disabledLog() {}
765
766  disabledLog.__reactDisabledLog = true;
767  function disableLogs() {
768    {
769      if (disabledDepth === 0) {
770        /* eslint-disable react-internal/no-production-logging */
771        prevLog = console.log;
772        prevInfo = console.info;
773        prevWarn = console.warn;
774        prevError = console.error;
775        prevGroup = console.group;
776        prevGroupCollapsed = console.groupCollapsed;
777        prevGroupEnd = console.groupEnd; // https://github.com/facebook/react/issues/19099
778
779        var props = {
780          configurable: true,
781          enumerable: true,
782          value: disabledLog,
783          writable: true
784        }; // $FlowFixMe Flow thinks console is immutable.
785
786        Object.defineProperties(console, {
787          info: props,
788          log: props,
789          warn: props,
790          error: props,
791          group: props,
792          groupCollapsed: props,
793          groupEnd: props
794        });
795        /* eslint-enable react-internal/no-production-logging */
796      }
797
798      disabledDepth++;
799    }
800  }
801  function reenableLogs() {
802    {
803      disabledDepth--;
804
805      if (disabledDepth === 0) {
806        /* eslint-disable react-internal/no-production-logging */
807        var props = {
808          configurable: true,
809          enumerable: true,
810          writable: true
811        }; // $FlowFixMe Flow thinks console is immutable.
812
813        Object.defineProperties(console, {
814          log: _assign({}, props, {
815            value: prevLog
816          }),
817          info: _assign({}, props, {
818            value: prevInfo
819          }),
820          warn: _assign({}, props, {
821            value: prevWarn
822          }),
823          error: _assign({}, props, {
824            value: prevError
825          }),
826          group: _assign({}, props, {
827            value: prevGroup
828          }),
829          groupCollapsed: _assign({}, props, {
830            value: prevGroupCollapsed
831          }),
832          groupEnd: _assign({}, props, {
833            value: prevGroupEnd
834          })
835        });
836        /* eslint-enable react-internal/no-production-logging */
837      }
838
839      if (disabledDepth < 0) {
840        error('disabledDepth fell below zero. ' + 'This is a bug in React. Please file an issue.');
841      }
842    }
843  }
844
845  var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
846  var prefix;
847  function describeBuiltInComponentFrame(name, source, ownerFn) {
848    {
849      if (prefix === undefined) {
850        // Extract the VM specific prefix used by each line.
851        try {
852          throw Error();
853        } catch (x) {
854          var match = x.stack.trim().match(/\n( *(at )?)/);
855          prefix = match && match[1] || '';
856        }
857      } // We use the prefix to ensure our stacks line up with native stack frames.
858
859
860      return '\n' + prefix + name;
861    }
862  }
863  var reentry = false;
864  var componentFrameCache;
865
866  {
867    var PossiblyWeakMap = typeof WeakMap === 'function' ? WeakMap : Map;
868    componentFrameCache = new PossiblyWeakMap();
869  }
870
871  function describeNativeComponentFrame(fn, construct) {
872    // If something asked for a stack inside a fake render, it should get ignored.
873    if (!fn || reentry) {
874      return '';
875    }
876
877    {
878      var frame = componentFrameCache.get(fn);
879
880      if (frame !== undefined) {
881        return frame;
882      }
883    }
884
885    var control;
886    reentry = true;
887    var previousPrepareStackTrace = Error.prepareStackTrace; // $FlowFixMe It does accept undefined.
888
889    Error.prepareStackTrace = undefined;
890    var previousDispatcher;
891
892    {
893      previousDispatcher = ReactCurrentDispatcher.current; // Set the dispatcher in DEV because this might be call in the render function
894      // for warnings.
895
896      ReactCurrentDispatcher.current = null;
897      disableLogs();
898    }
899
900    try {
901      // This should throw.
902      if (construct) {
903        // Something should be setting the props in the constructor.
904        var Fake = function () {
905          throw Error();
906        }; // $FlowFixMe
907
908
909        Object.defineProperty(Fake.prototype, 'props', {
910          set: function () {
911            // We use a throwing setter instead of frozen or non-writable props
912            // because that won't throw in a non-strict mode function.
913            throw Error();
914          }
915        });
916
917        if (typeof Reflect === 'object' && Reflect.construct) {

918          // We construct a different control for this case to include any extra
919          // frames added by the construct call.
920          try {
921            Reflect.construct(Fake, []);
922          } catch (x) {
923            control = x;
924          }
925
926          Reflect.construct(fn, [], Fake);
927        } else {
928          try {
929            Fake.call();
930          } catch (x) {
931            control = x;
932          }
933
934          fn.call(Fake.prototype);
935        }
936      } else {
937        try {
938          throw Error();
939        } catch (x) {
940          control = x;
941        }
942
943        fn();
944      }
945    } catch (sample) {
946      // This is inlined manually because closure doesn't do it for us.
947      if (sample && control && typeof sample.stack === 'string') {
948        // This extracts the first frame from the sample that isn't also in the control.
949        // Skipping one frame that we assume is the frame that calls the two.
950        var sampleLines = sample.stack.split('\n');
951        var controlLines = control.stack.split('\n');
952        var s = sampleLines.length - 1;
953        var c = controlLines.length - 1;
954
955        while (s >= 1 && c >= 0 && sampleLines[s] !== controlLines[c]) {
956          // We expect at least one stack frame to be shared.
957          // Typically this will be the root most one. However, stack frames may be
958          // cut off due to maximum stack limits. In this case, one maybe cut off
959          // earlier than the other. We assume that the sample is longer or the same
960          // and there for cut off earlier. So we should find the root most frame in
961          // the sample somewhere in the control.
962          c--;
963        }
964
965        for (; s >= 1 && c >= 0; s--, c--) {
966          // Next we find the first one that isn't the same which should be the
967          // frame that called our sample function and the control.
968          if (sampleLines[s] !== controlLines[c]) {
969            // In V8, the first line is describing the message but other VMs don't.
970            // If we're about to return the first line, and the control is also on the same
971            // line, that's a pretty good indicator that our sample threw at same line as
972            // the control. I.e. before we entered the sample frame. So we ignore this result.
973            // This can happen if you passed a class to function component, or non-function.
974            if (s !== 1 || c !== 1) {
975              do {
976                s--;
977                c--; // We may still have similar intermediate frames from the construct call.
978                // The next one that isn't the same should be our match though.
979
980                if (c < 0 || sampleLines[s] !== controlLines[c]) {
981                  // V8 adds a "new" prefix for native classes. Let's remove it to make it prettier.
982                  var _frame = '\n' + sampleLines[s].replace(' at new ', ' at ');
983
984                  {
985                    if (typeof fn === 'function') {
986                      componentFrameCache.set(fn, _frame);
987                    }
988                  } // Return the line we found.
989
990
991                  return _frame;
992                }
993              } while (s >= 1 && c >= 0);
994            }
995
996            break;
997          }
998        }
999      }
1000    } finally {
1001      reentry = false;
1002
1003      {
1004        ReactCurrentDispatcher.current = previousDispatcher;
1005        reenableLogs();
1006      }
1007
1008      Error.prepareStackTrace = previousPrepareStackTrace;
1009    } // Fallback to just using the name if we couldn't make it throw.
1010
1011
1012    var name = fn ? fn.displayName || fn.name : '';
1013    var syntheticFrame = name ? describeBuiltInComponentFrame(name) : '';
1014
1015    {
1016      if (typeof fn === 'function') {
1017        componentFrameCache.set(fn, syntheticFrame);
1018      }
1019    }
1020
1021    return syntheticFrame;
1022  }
1023
1024  function describeClassComponentFrame(ctor, source, ownerFn) {
1025    {
1026      return describeNativeComponentFrame(ctor, true);
1027    }
1028  }
1029  function describeFunctionComponentFrame(fn, source, ownerFn) {
1030    {
1031      return describeNativeComponentFrame(fn, false);
1032    }
1033  }
1034
1035  function shouldConstruct(Component) {
1036    var prototype = Component.prototype;
1037    return !!(prototype && prototype.isReactComponent);
1038  }
1039
1040  function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) {
1041
1042    if (type == null) {
1043      return '';
1044    }
1045
1046    if (typeof type === 'function') {
1047      {
1048        return describeNativeComponentFrame(type, shouldConstruct(type));
1049      }
1050    }
1051
1052    if (typeof type === 'string') {
1053      return describeBuiltInComponentFrame(type);
1054    }
1055
1056    switch (type) {
1057      case REACT_SUSPENSE_TYPE:
1058        return describeBuiltInComponentFrame('Suspense');
1059
1060      case REACT_SUSPENSE_LIST_TYPE:
1061        return describeBuiltInComponentFrame('SuspenseList');
1062    }
1063
1064    if (typeof type === 'object') {
1065      switch (type.$$typeof) {
1066        case REACT_FORWARD_REF_TYPE:
1067          return describeFunctionComponentFrame(type.render);
1068
1069        case REACT_MEMO_TYPE:
1070          // Memo may contain any component type so we recursively resolve it.
1071          return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn);
1072
1073        case REACT_BLOCK_TYPE:
1074          return describeFunctionComponentFrame(type._render);
1075
1076        case REACT_LAZY_TYPE:
1077          {
1078            var lazyComponent = type;
1079            var payload = lazyComponent._payload;
1080            var init = lazyComponent._init;
1081
1082            try {
1083              // Lazy may contain any component type so we recursively resolve it.
1084              return describeUnknownElementTypeFrameInDEV(init(payload), source, ownerFn);
1085            } catch (x) {}
1086          }
1087      }
1088    }
1089
1090    return '';
1091  }
1092
1093  function describeFiber(fiber) {
1094    var owner =  fiber._debugOwner ? fiber._debugOwner.type : null ;
1095    var source =  fiber._debugSource ;
1096
1097    switch (fiber.tag) {
1098      case HostComponent:
1099        return describeBuiltInComponentFrame(fiber.type);
1100
1101      case LazyComponent:
1102        return describeBuiltInComponentFrame('Lazy');
1103
1104      case SuspenseComponent:
1105        return describeBuiltInComponentFrame('Suspense');
1106
1107      case SuspenseListComponent:
1108        return describeBuiltInComponentFrame('SuspenseList');
1109
1110      case FunctionComponent:
1111      case IndeterminateComponent:
1112      case SimpleMemoComponent:
1113        return describeFunctionComponentFrame(fiber.type);
1114
1115      case ForwardRef:
1116        return describeFunctionComponentFrame(fiber.type.render);
1117
1118      case Block:
1119        return describeFunctionComponentFrame(fiber.type._render);
1120
1121      case ClassComponent:
1122        return describeClassComponentFrame(fiber.type);
1123
1124      default:
1125        return '';
1126    }
1127  }
1128
1129  function getStackByFiberInDevAndProd(workInProgress) {
1130    try {
1131      var info = '';
1132      var node = workInProgress;
1133
1134      do {
1135        info += describeFiber(node);
1136        node = node.return;
1137      } while (node);
1138
1139      return info;
1140    } catch (x) {
1141      return '\nError generating stack: ' + x.message + '\n' + x.stack;
1142    }
1143  }
1144
1145  function getWrappedName(outerType, innerType, wrapperName) {
1146    var functionName = innerType.displayName || innerType.name || '';
1147    return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
1148  }
1149
1150  function getContextName(type) {
1151    return type.displayName || 'Context';
1152  }
1153
1154  function getComponentName(type) {
1155    if (type == null) {
1156      // Host root, text node or just invalid type.
1157      return null;
1158    }
1159
1160    {
1161      if (typeof type.tag === 'number') {
1162        error('Received an unexpected object in getComponentName(). ' + 'This is likely a bug in React. Please file an issue.');
1163      }
1164    }
1165
1166    if (typeof type === 'function') {
1167      return type.displayName || type.name || null;
1168    }
1169
1170    if (typeof type === 'string') {
1171      return type;
1172    }
1173
1174    switch (type) {
1175      case REACT_FRAGMENT_TYPE:
1176        return 'Fragment';
1177
1178      case REACT_PORTAL_TYPE:
1179        return 'Portal';
1180
1181      case REACT_PROFILER_TYPE:
1182        return 'Profiler';
1183
1184      case REACT_STRICT_MODE_TYPE:
1185        return 'StrictMode';
1186
1187      case REACT_SUSPENSE_TYPE:
1188        return 'Suspense';
1189
1190      case REACT_SUSPENSE_LIST_TYPE:
1191        return 'SuspenseList';
1192    }
1193
1194    if (typeof type === 'object') {
1195      switch (type.$$typeof) {
1196        case REACT_CONTEXT_TYPE:
1197          var context = type;
1198          return getContextName(context) + '.Consumer';
1199
1200        case REACT_PROVIDER_TYPE:
1201          var provider = type;
1202          return getContextName(provider._context) + '.Provider';
1203
1204        case REACT_FORWARD_REF_TYPE:
1205          return getWrappedName(type, type.render, 'ForwardRef');
1206
1207        case REACT_MEMO_TYPE:
1208          return getComponentName(type.type);
1209
1210        case REACT_BLOCK_TYPE:
1211          return getComponentName(type._render);
1212
1213        case REACT_LAZY_TYPE:
1214          {
1215            var lazyComponent = type;
1216            var payload = lazyComponent._payload;
1217            var init = lazyComponent._init;
1218
1219            try {
1220              return getComponentName(init(payload));
1221            } catch (x) {
1222              return null;
1223            }
1224          }
1225      }
1226    }
1227
1228    return null;
1229  }
1230
1231  var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
1232  var current = null;
1233  var isRendering = false;
1234  function getCurrentFiberOwnerNameInDevOrNull() {
1235    {
1236      if (current === null) {
1237        return null;
1238      }
1239
1240      var owner = current._debugOwner;
1241
1242      if (owner !== null && typeof owner !== 'undefined') {
1243        return getComponentName(owner.type);
1244      }
1245    }
1246
1247    return null;
1248  }
1249
1250  function getCurrentFiberStackInDev() {
1251    {
1252      if (current === null) {
1253        return '';
1254      } // Safe because if current fiber exists, we are reconciling,
1255      // and it is guaranteed to be the work-in-progress version.
1256
1257
1258      return getStackByFiberInDevAndProd(current);
1259    }
1260  }
1261
1262  function resetCurrentFiber() {
1263    {
1264      ReactDebugCurrentFrame.getCurrentStack = null;
1265      current = null;
1266      isRendering = false;
1267    }
1268  }
1269  function setCurrentFiber(fiber) {
1270    {
1271      ReactDebugCurrentFrame.getCurrentStack = getCurrentFiberStackInDev;
1272      current = fiber;
1273      isRendering = false;
1274    }
1275  }
1276  function setIsRendering(rendering) {
1277    {
1278      isRendering = rendering;
1279    }
1280  }
1281  function getIsRendering() {
1282    {
1283      return isRendering;
1284    }
1285  }
1286
1287  // Flow does not allow string concatenation of most non-string types. To work
1288  // around this limitation, we use an opaque type that can only be obtained by
1289  // passing the value through getToStringValue first.
1290  function toString(value) {
1291    return '' + value;
1292  }
1293  function getToStringValue(value) {
1294    switch (typeof value) {
1295      case 'boolean':
1296      case 'number':
1297      case 'object':
1298      case 'string':
1299      case 'undefined':
1300        return value;
1301
1302      default:
1303        // function, symbol are assigned as empty strings
1304        return '';
1305    }
1306  }
1307
1308  var hasReadOnlyValue = {
1309    button: true,
1310    checkbox: true,
1311    image: true,
1312    hidden: true,
1313    radio: true,
1314    reset: true,
1315    submit: true
1316  };
1317  function checkControlledValueProps(tagName, props) {
1318    {
1319      if (!(hasReadOnlyValue[props.type] || props.onChange || props.onInput || props.readOnly || props.disabled || props.value == null)) {
1320        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`.');
1321      }
1322
1323      if (!(props.onChange || props.readOnly || props.disabled || props.checked == null)) {
1324        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`.');
1325      }
1326    }
1327  }
1328
1329  function isCheckable(elem) {
1330    var type = elem.type;
1331    var nodeName = elem.nodeName;
1332    return nodeName && nodeName.toLowerCase() === 'input' && (type === 'checkbox' || type === 'radio');
1333  }
1334
1335  function getTracker(node) {
1336    return node._valueTracker;
1337  }
1338
1339  function detachTracker(node) {
1340    node._valueTracker = null;
1341  }
1342
1343  function getValueFromNode(node) {
1344    var value = '';
1345
1346    if (!node) {
1347      return value;
1348    }
1349
1350    if (isCheckable(node)) {
1351      value = node.checked ? 'true' : 'false';
1352    } else {
1353      value = node.value;
1354    }
1355
1356    return value;
1357  }
1358
1359  function trackValueOnNode(node) {
1360    var valueField = isCheckable(node) ? 'checked' : 'value';
1361    var descriptor = Object.getOwnPropertyDescriptor(node.constructor.prototype, valueField);
1362    var currentValue = '' + node[valueField]; // if someone has already defined a value or Safari, then bail
1363    // and don't track value will cause over reporting of changes,
1364    // but it's better then a hard failure
1365    // (needed for certain tests that spyOn input values and Safari)
1366
1367    if (node.hasOwnProperty(valueField) || typeof descriptor === 'undefined' || typeof descriptor.get !== 'function' || typeof descriptor.set !== 'function') {
1368      return;
1369    }
1370
1371    var get = descriptor.get,
1372        set = descriptor.set;
1373    Object.defineProperty(node, valueField, {
1374      configurable: true,
1375      get: function () {
1376        return get.call(this);
1377      },
1378      set: function (value) {
1379        currentValue = '' + value;
1380        set.call(this, value);
1381      }
1382    }); // We could've passed this the first time
1383    // but it triggers a bug in IE11 and Edge 14/15.
1384    // Calling defineProperty() again should be equivalent.
1385    // https://github.com/facebook/react/issues/11768
1386
1387    Object.defineProperty(node, valueField, {
1388      enumerable: descriptor.enumerable
1389    });
1390    var tracker = {
1391      getValue: function () {
1392        return currentValue;
1393      },
1394      setValue: function (value) {
1395        currentValue = '' + value;
1396      },
1397      stopTracking: function () {
1398        detachTracker(node);
1399        delete node[valueField];
1400      }
1401    };
1402    return tracker;
1403  }
1404
1405  function track(node) {
1406    if (getTracker(node)) {
1407      return;
1408    } // TODO: Once it's just Fiber we can move this to node._wrapperState
1409
1410
1411    node._valueTracker = trackValueOnNode(node);
1412  }
1413  function updateValueIfChanged(node) {
1414    if (!node) {
1415      return false;

1416    }
1417
1418    var tracker = getTracker(node); // if there is no tracker at this point it's unlikely
1419    // that trying again will succeed
1420
1421    if (!tracker) {
1422      return true;
1423    }
1424
1425    var lastValue = tracker.getValue();
1426    var nextValue = getValueFromNode(node);
1427
1428    if (nextValue !== lastValue) {
1429      tracker.setValue(nextValue);
1430      return true;
1431    }
1432
1433    return false;
1434  }
1435
1436  function getActiveElement(doc) {
1437    doc = doc || (typeof document !== 'undefined' ? document : undefined);
1438
1439    if (typeof doc === 'undefined') {
1440      return null;
1441    }
1442
1443    try {
1444      return doc.activeElement || doc.body;
1445    } catch (e) {
1446      return doc.body;
1447    }
1448  }
1449
1450  var didWarnValueDefaultValue = false;
1451  var didWarnCheckedDefaultChecked = false;
1452  var didWarnControlledToUncontrolled = false;
1453  var didWarnUncontrolledToControlled = false;
1454
1455  function isControlled(props) {
1456    var usesChecked = props.type === 'checkbox' || props.type === 'radio';
1457    return usesChecked ? props.checked != null : props.value != null;
1458  }
1459  /**
1460   * Implements an <input> host component that allows setting these optional
1461   * props: `checked`, `value`, `defaultChecked`, and `defaultValue`.
1462   *
1463   * If `checked` or `value` are not supplied (or null/undefined), user actions
1464   * that affect the checked state or value will trigger updates to the element.
1465   *
1466   * If they are supplied (and not null/undefined), the rendered element will not
1467   * trigger updates to the element. Instead, the props must change in order for
1468   * the rendered element to be updated.
1469   *
1470   * The rendered element will be initialized as unchecked (or `defaultChecked`)
1471   * with an empty value (or `defaultValue`).
1472   *
1473   * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
1474   */
1475
1476
1477  function getHostProps(element, props) {
1478    var node = element;
1479    var checked = props.checked;
1480
1481    var hostProps = _assign({}, props, {
1482      defaultChecked: undefined,
1483      defaultValue: undefined,
1484      value: undefined,
1485      checked: checked != null ? checked : node._wrapperState.initialChecked
1486    });
1487
1488    return hostProps;
1489  }
1490  function initWrapperState(element, props) {
1491    {
1492      checkControlledValueProps('input', props);
1493
1494      if (props.checked !== undefined && props.defaultChecked !== undefined && !didWarnCheckedDefaultChecked) {
1495        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);
1496
1497        didWarnCheckedDefaultChecked = true;
1498      }
1499
1500      if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue) {
1501        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);
1502
1503        didWarnValueDefaultValue = true;
1504      }
1505    }
1506
1507    var node = element;
1508    var defaultValue = props.defaultValue == null ? '' : props.defaultValue;
1509    node._wrapperState = {
1510      initialChecked: props.checked != null ? props.checked : props.defaultChecked,
1511      initialValue: getToStringValue(props.value != null ? props.value : defaultValue),
1512      controlled: isControlled(props)
1513    };
1514  }
1515  function updateChecked(element, props) {
1516    var node = element;
1517    var checked = props.checked;
1518
1519    if (checked != null) {
1520      setValueForProperty(node, 'checked', checked, false);
1521    }
1522  }
1523  function updateWrapper(element, props) {
1524    var node = element;
1525
1526    {
1527      var controlled = isControlled(props);
1528
1529      if (!node._wrapperState.controlled && controlled && !didWarnUncontrolledToControlled) {
1530        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');
1531
1532        didWarnUncontrolledToControlled = true;
1533      }
1534
1535      if (node._wrapperState.controlled && !controlled && !didWarnControlledToUncontrolled) {
1536        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');
1537
1538        didWarnControlledToUncontrolled = true;
1539      }
1540    }
1541
1542    updateChecked(element, props);
1543    var value = getToStringValue(props.value);
1544    var type = props.type;
1545
1546    if (value != null) {
1547      if (type === 'number') {
1548        if (value === 0 && node.value === '' || // We explicitly want to coerce to number here if possible.
1549        // eslint-disable-next-line
1550        node.value != value) {
1551          node.value = toString(value);
1552        }
1553      } else if (node.value !== toString(value)) {
1554        node.value = toString(value);
1555      }
1556    } else if (type === 'submit' || type === 'reset') {
1557      // Submit/reset inputs need the attribute removed completely to avoid
1558      // blank-text buttons.
1559      node.removeAttribute('value');
1560      return;
1561    }
1562
1563    {
1564      // When syncing the value attribute, the value comes from a cascade of
1565      // properties:
1566      //  1. The value React property
1567      //  2. The defaultValue React property
1568      //  3. Otherwise there should be no change
1569      if (props.hasOwnProperty('value')) {
1570        setDefaultValue(node, props.type, value);
1571      } else if (props.hasOwnProperty('defaultValue')) {
1572        setDefaultValue(node, props.type, getToStringValue(props.defaultValue));
1573      }
1574    }
1575
1576    {
1577      // When syncing the checked attribute, it only changes when it needs
1578      // to be removed, such as transitioning from a checkbox into a text input
1579      if (props.checked == null && props.defaultChecked != null) {
1580        node.defaultChecked = !!props.defaultChecked;
1581      }
1582    }
1583  }
1584  function postMountWrapper(element, props, isHydrating) {
1585    var node = element; // Do not assign value if it is already set. This prevents user text input
1586    // from being lost during SSR hydration.
1587
1588    if (props.hasOwnProperty('value') || props.hasOwnProperty('defaultValue')) {
1589      var type = props.type;
1590      var isButton = type === 'submit' || type === 'reset'; // Avoid setting value attribute on submit/reset inputs as it overrides the
1591      // default value provided by the browser. See: #12872
1592
1593      if (isButton && (props.value === undefined || props.value === null)) {
1594        return;
1595      }
1596
1597      var initialValue = toString(node._wrapperState.initialValue); // Do not assign value if it is already set. This prevents user text input
1598      // from being lost during SSR hydration.
1599
1600      if (!isHydrating) {
1601        {
1602          // When syncing the value attribute, the value property should use
1603          // the wrapperState._initialValue property. This uses:
1604          //
1605          //   1. The value React property when present
1606          //   2. The defaultValue React property when present
1607          //   3. An empty string
1608          if (initialValue !== node.value) {
1609            node.value = initialValue;
1610          }
1611        }
1612      }
1613
1614      {
1615        // Otherwise, the value attribute is synchronized to the property,
1616        // so we assign defaultValue to the same thing as the value property
1617        // assignment step above.
1618        node.defaultValue = initialValue;
1619      }
1620    } // Normally, we'd just do `node.checked = node.checked` upon initial mount, less this bug
1621    // this is needed to work around a chrome bug where setting defaultChecked
1622    // will sometimes influence the value of checked (even after detachment).
1623    // Reference: https://bugs.chromium.org/p/chromium/issues/detail?id=608416
1624    // We need to temporarily unset name to avoid disrupting radio button groups.
1625
1626
1627    var name = node.name;
1628
1629    if (name !== '') {
1630      node.name = '';
1631    }
1632
1633    {
1634      // When syncing the checked attribute, both the checked property and
1635      // attribute are assigned at the same time using defaultChecked. This uses:
1636      //
1637      //   1. The checked React property when present
1638      //   2. The defaultChecked React property when present
1639      //   3. Otherwise, false
1640      node.defaultChecked = !node.defaultChecked;
1641      node.defaultChecked = !!node._wrapperState.initialChecked;
1642    }
1643
1644    if (name !== '') {
1645      node.name = name;
1646    }
1647  }
1648  function restoreControlledState(element, props) {
1649    var node = element;
1650    updateWrapper(node, props);
1651    updateNamedCousins(node, props);
1652  }
1653
1654  function updateNamedCousins(rootNode, props) {
1655    var name = props.name;
1656
1657    if (props.type === 'radio' && name != null) {
1658      var queryRoot = rootNode;
1659
1660      while (queryRoot.parentNode) {
1661        queryRoot = queryRoot.parentNode;
1662      } // If `rootNode.form` was non-null, then we could try `form.elements`,
1663      // but that sometimes behaves strangely in IE8. We could also try using
1664      // `form.getElementsByName`, but that will only return direct children
1665      // and won't include inputs that use the HTML5 `form=` attribute. Since
1666      // the input might not even be in a form. It might not even be in the
1667      // document. Let's just use the local `querySelectorAll` to ensure we don't
1668      // miss anything.
1669
1670
1671      var group = queryRoot.querySelectorAll('input[name=' + JSON.stringify('' + name) + '][type="radio"]');
1672
1673      for (var i = 0; i < group.length; i++) {
1674        var otherNode = group[i];
1675
1676        if (otherNode === rootNode || otherNode.form !== rootNode.form) {
1677          continue;
1678        } // This will throw if radio buttons rendered by different copies of React
1679        // and the same name are rendered into the same form (same as #1939).
1680        // That's probably okay; we don't support it just as we don't support
1681        // mixing React radio buttons with non-React ones.
1682
1683
1684        var otherProps = getFiberCurrentPropsFromNode(otherNode);
1685
1686        if (!otherProps) {
1687          {
1688            throw Error( "ReactDOMInput: Mixing React and non-React radio inputs with the same `name` is not supported." );
1689          }
1690        } // We need update the tracked value on the named cousin since the value
1691        // was changed but the input saw no event or value set
1692
1693
1694        updateValueIfChanged(otherNode); // If this is a controlled radio button group, forcing the input that
1695        // was previously checked to update will cause it to be come re-checked
1696        // as appropriate.
1697
1698        updateWrapper(otherNode, otherProps);
1699      }
1700    }
1701  } // In Chrome, assigning defaultValue to certain input types triggers input validation.
1702  // For number inputs, the display value loses trailing decimal points. For email inputs,
1703  // Chrome raises "The specified value <x> is not a valid email address".
1704  //
1705  // Here we check to see if the defaultValue has actually changed, avoiding these problems
1706  // when the user is inputting text
1707  //
1708  // https://github.com/facebook/react/issues/7253
1709
1710
1711  function setDefaultValue(node, type, value) {
1712    if ( // Focused number inputs synchronize on blur. See ChangeEventPlugin.js
1713    type !== 'number' || getActiveElement(node.ownerDocument) !== node) {
1714      if (value == null) {
1715        node.defaultValue = toString(node._wrapperState.initialValue);
1716      } else if (node.defaultValue !== toString(value)) {
1717        node.defaultValue = toString(value);
1718      }
1719    }
1720  }
1721
1722  var didWarnSelectedSetOnOption = false;
1723  var didWarnInvalidChild = false;
1724
1725  function flattenChildren(children) {
1726    var content = ''; // Flatten children. We'll warn if they are invalid
1727    // during validateProps() which runs for hydration too.
1728    // Note that this would throw on non-element objects.
1729    // Elements are stringified (which is normally irrelevant
1730    // but matters for <fbt>).
1731
1732    React.Children.forEach(children, function (child) {
1733      if (child == null) {
1734        return;
1735      }
1736
1737      content += child; // Note: we don't warn about invalid children here.
1738      // Instead, this is done separately below so that
1739      // it happens during the hydration code path too.
1740    });
1741    return content;
1742  }
1743  /**
1744   * Implements an <option> host component that warns when `selected` is set.
1745   */
1746
1747
1748  function validateProps(element, props) {
1749    {
1750      // This mirrors the code path above, but runs for hydration too.
1751      // Warn about invalid children here so that client and hydration are consistent.
1752      // TODO: this seems like it could cause a DEV-only throw for hydration
1753      // if children contains a non-element object. We should try to avoid that.
1754      if (typeof props.children === 'object' && props.children !== null) {
1755        React.Children.forEach(props.children, function (child) {
1756          if (child == null) {
1757            return;
1758          }
1759
1760          if (typeof child === 'string' || typeof child === 'number') {
1761            return;
1762          }
1763
1764          if (typeof child.type !== 'string') {
1765            return;
1766          }
1767
1768          if (!didWarnInvalidChild) {
1769            didWarnInvalidChild = true;
1770
1771            error('Only strings and numbers are supported as <option> children.');
1772          }
1773        });
1774      } // TODO: Remove support for `selected` in <option>.
1775
1776
1777      if (props.selected != null && !didWarnSelectedSetOnOption) {
1778        error('Use the `defaultValue` or `value` props on <select> instead of ' + 'setting `selected` on <option>.');
1779
1780        didWarnSelectedSetOnOption = true;
1781      }
1782    }
1783  }
1784  function postMountWrapper$1(element, props) {
1785    // value="" should make a value attribute (#6219)
1786    if (props.value != null) {
1787      element.setAttribute('value', toString(getToStringValue(props.value)));
1788    }
1789  }
1790  function getHostProps$1(element, props) {
1791    var hostProps = _assign({
1792      children: undefined
1793    }, props);
1794
1795    var content = flattenChildren(props.children);
1796
1797    if (content) {
1798      hostProps.children = content;
1799    }
1800
1801    return hostProps;
1802  }
1803
1804  var didWarnValueDefaultValue$1;
1805
1806  {
1807    didWarnValueDefaultValue$1 = false;
1808  }
1809
1810  function getDeclarationErrorAddendum() {
1811    var ownerName = getCurrentFiberOwnerNameInDevOrNull();
1812
1813    if (ownerName) {
1814      return '\n\nCheck the render method of `' + ownerName + '`.';
1815    }
1816
1817    return '';
1818  }
1819
1820  var valuePropNames = ['value', 'defaultValue'];
1821  /**
1822   * Validation function for `value` and `defaultValue`.
1823   */
1824
1825  function checkSelectPropTypes(props) {
1826    {
1827      checkControlledValueProps('select', props);
1828
1829      for (var i = 0; i < valuePropNames.length; i++) {
1830        var propName = valuePropNames[i];
1831
1832        if (props[propName] == null) {
1833          continue;
1834        }
1835
1836        var isArray = Array.isArray(props[propName]);
1837
1838        if (props.multiple && !isArray) {
1839          error('The `%s` prop supplied to <select> must be an array if ' + '`multiple` is true.%s', propName, getDeclarationErrorAddendum());
1840        } else if (!props.multiple && isArray) {
1841          error('The `%s` prop supplied to <select> must be a scalar ' + 'value if `multiple` is false.%s', propName, getDeclarationErrorAddendum());
1842        }
1843      }
1844    }
1845  }
1846
1847  function updateOptions(node, multiple, propValue, setDefaultSelected) {
1848    var options = node.options;
1849
1850    if (multiple) {
1851      var selectedValues = propValue;
1852      var selectedValue = {};
1853
1854      for (var i = 0; i < selectedValues.length; i++) {
1855        // Prefix to avoid chaos with special keys.
1856        selectedValue['$' + selectedValues[i]] = true;
1857      }
1858
1859      for (var _i = 0; _i < options.length; _i++) {
1860        var selected = selectedValue.hasOwnProperty('$' + options[_i].value);
1861
1862        if (options[_i].selected !== selected) {
1863          options[_i].selected = selected;
1864        }
1865
1866        if (selected && setDefaultSelected) {
1867          options[_i].defaultSelected = true;
1868        }
1869      }
1870    } else {
1871      // Do not set `select.value` as exact behavior isn't consistent across all
1872      // browsers for all cases.
1873      var _selectedValue = toString(getToStringValue(propValue));
1874
1875      var defaultSelected = null;
1876
1877      for (var _i2 = 0; _i2 < options.length; _i2++) {
1878        if (options[_i2].value === _selectedValue) {
1879          options[_i2].selected = true;
1880
1881          if (setDefaultSelected) {
1882            options[_i2].defaultSelected = true;
1883          }
1884
1885          return;
1886        }
1887
1888        if (defaultSelected === null && !options[_i2].disabled) {
1889          defaultSelected = options[_i2];
1890        }
1891      }
1892
1893      if (defaultSelected !== null) {
1894        defaultSelected.selected = true;
1895      }
1896    }
1897  }
1898  /**
1899   * Implements a <select> host component that allows optionally setting the
1900   * props `value` and `defaultValue`. If `multiple` is false, the prop must be a
1901   * stringable. If `multiple` is true, the prop must be an array of stringables.
1902   *
1903   * If `value` is not supplied (or null/undefined), user actions that change the
1904   * selected option will trigger updates to the rendered options.
1905   *
1906   * If it is supplied (and not null/undefined), the rendered options will not
1907   * update in response to user actions. Instead, the `value` prop must change in
1908   * order for the rendered options to update.
1909   *
1910   * If `defaultValue` is provided, any options with the supplied values will be
1911   * selected.
1912   */
1913
1914
1915  function getHostProps$2(element, props) {
1916    return _assign({}, props, {
1917      value: undefined
1918    });
1919  }
1920  function initWrapperState$1(element, props) {
1921    var node = element;
1922
1923    {
1924      checkSelectPropTypes(props);
1925    }
1926
1927    node._wrapperState = {
1928      wasMultiple: !!props.multiple
1929    };
1930
1931    {
1932      if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue$1) {
1933        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');
1934
1935        didWarnValueDefaultValue$1 = true;
1936      }
1937    }
1938  }
1939  function postMountWrapper$2(element, props) {
1940    var node = element;
1941    node.multiple = !!props.multiple;
1942    var value = props.value;
1943
1944    if (value != null) {
1945      updateOptions(node, !!props.multiple, value, false);
1946    } else if (props.defaultValue != null) {
1947      updateOptions(node, !!props.multiple, props.defaultValue, true);
1948    }
1949  }
1950  function postUpdateWrapper(element, props) {
1951    var node = element;
1952    var wasMultiple = node._wrapperState.wasMultiple;
1953    node._wrapperState.wasMultiple = !!props.multiple;
1954    var value = props.value;
1955
1956    if (value != null) {
1957      updateOptions(node, !!props.multiple, value, false);
1958    } else if (wasMultiple !== !!props.multiple) {
1959      // For simplicity, reapply `defaultValue` if `multiple` is toggled.
1960      if (props.defaultValue != null) {
1961        updateOptions(node, !!props.multiple, props.defaultValue, true);
1962      } else {
1963        // Revert the select back to its default unselected state.
1964        updateOptions(node, !!props.multiple, props.multiple ? [] : '', false);
1965      }
1966    }
1967  }
1968  function restoreControlledState$1(element, props) {
1969    var node = element;
1970    var value = props.value;
1971
1972    if (value != null) {
1973      updateOptions(node, !!props.multiple, value, false);
1974    }
1975  }
1976
1977  var didWarnValDefaultVal = false;
1978
1979  /**
1980   * Implements a <textarea> host component that allows setting `value`, and
1981   * `defaultValue`. This differs from the traditional DOM API because value is
1982   * usually set as PCDATA children.
1983   *
1984   * If `value` is not supplied (or null/undefined), user actions that affect the
1985   * value will trigger updates to the element.
1986   *
1987   * If `value` is supplied (and not null/undefined), the rendered element will
1988   * not trigger updates to the element. Instead, the `value` prop must change in
1989   * order for the rendered element to be updated.
1990   *
1991   * The rendered element will be initialized with an empty value, the prop
1992   * `defaultValue` if specified, or the children content (deprecated).
1993   */
1994  function getHostProps$3(element, props) {
1995    var node = element;
1996
1997    if (!(props.dangerouslySetInnerHTML == null)) {
1998      {
1999        throw Error( "`dangerouslySetInnerHTML` does not make sense on <textarea>." );
2000      }
2001    } // Always set children to the same thing. In IE9, the selection range will
2002    // get reset if `textContent` is mutated.  We could add a check in setTextContent
2003    // to only set the value if/when the value differs from the node value (which would
2004    // completely solve this IE9 bug), but Sebastian+Sophie seemed to like this
2005    // solution. The value can be a boolean or object so that's why it's forced
2006    // to be a string.
2007
2008
2009    var hostProps = _assign({}, props, {
2010      value: undefined,
2011      defaultValue: undefined,
2012      children: toString(node._wrapperState.initialValue)
2013    });
2014
2015    return hostProps;
2016  }
2017  function initWrapperState$2(element, props) {
2018    var node = element;
2019
2020    {
2021      checkControlledValueProps('textarea', props);
2022
2023      if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValDefaultVal) {
2024        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');
2025
2026        didWarnValDefaultVal = true;
2027      }
2028    }
2029
2030    var initialValue = props.value; // Only bother fetching default value if we're going to use it
2031
2032    if (initialValue == null) {
2033      var children = props.children,
2034          defaultValue = props.defaultValue;
2035
2036      if (children != null) {
2037        {
2038          error('Use the `defaultValue` or `value` props instead of setting ' + 'children on <textarea>.');
2039        }
2040
2041        {
2042          if (!(defaultValue == null)) {
2043            {
2044              throw Error( "If you supply `defaultValue` on a <textarea>, do not pass children." );
2045            }
2046          }
2047
2048          if (Array.isArray(children)) {
2049            if (!(children.length <= 1)) {
2050              {
2051                throw Error( "<textarea> can only have at most one child." );
2052              }
2053            }
2054
2055            children = children[0];
2056          }
2057
2058          defaultValue = children;
2059        }
2060      }
2061
2062      if (defaultValue == null) {
2063        defaultValue = '';
2064      }
2065
2066      initialValue = defaultValue;
2067    }
2068
2069    node._wrapperState = {
2070      initialValue: getToStringValue(initialValue)
2071    };
2072  }
2073  function updateWrapper$1(element, props) {
2074    var node = element;
2075    var value = getToStringValue(props.value);
2076    var defaultValue = getToStringValue(props.defaultValue);
2077
2078    if (value != null) {
2079      // Cast `value` to a string to ensure the value is set correctly. While
2080      // browsers typically do this as necessary, jsdom doesn't.
2081      var newValue = toString(value); // To avoid side effects (such as losing text selection), only set value if changed
2082
2083      if (newValue !== node.value) {
2084        node.value = newValue;
2085      }
2086
2087      if (props.defaultValue == null && node.defaultValue !== newValue) {
2088        node.defaultValue = newValue;
2089      }
2090    }
2091
2092    if (defaultValue != null) {
2093      node.defaultValue = toString(defaultValue);
2094    }
2095  }
2096  function postMountWrapper$3(element, props) {
2097    var node = element; // This is in postMount because we need access to the DOM node, which is not
2098    // available until after the component has mounted.
2099
2100    var textContent = node.textContent; // Only set node.value if textContent is equal to the expected
2101    // initial value. In IE10/IE11 there is a bug where the placeholder attribute
2102    // will populate textContent as well.
2103    // https://developer.microsoft.com/microsoft-edge/platform/issues/101525/
2104
2105    if (textContent === node._wrapperState.initialValue) {
2106      if (textContent !== '' && textContent !== null) {
2107        node.value = textContent;
2108      }
2109    }
2110  }
2111  function restoreControlledState$2(element, props) {
2112    // DOM component is still mounted; update
2113    updateWrapper$1(element, props);
2114  }
2115
2116  var HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
2117  var MATH_NAMESPACE = 'http://www.w3.org/1998/Math/MathML';
2118  var SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
2119  var Namespaces = {
2120    html: HTML_NAMESPACE,
2121    mathml: MATH_NAMESPACE,
2122    svg: SVG_NAMESPACE
2123  }; // Assumes there is no parent namespace.
2124
2125  function getIntrinsicNamespace(type) {
2126    switch (type) {
2127      case 'svg':
2128        return SVG_NAMESPACE;
2129
2130      case 'math':
2131        return MATH_NAMESPACE;
2132
2133      default:
2134        return HTML_NAMESPACE;
2135    }
2136  }
2137  function getChildNamespace(parentNamespace, type) {
2138    if (parentNamespace == null || parentNamespace === HTML_NAMESPACE) {
2139      // No (or default) parent namespace: potential entry point.
2140      return getIntrinsicNamespace(type);
2141    }
2142
2143    if (parentNamespace === SVG_NAMESPACE && type === 'foreignObject') {
2144      // We're leaving SVG.
2145      return HTML_NAMESPACE;
2146    } // By default, pass namespace below.
2147
2148
2149    return parentNamespace;
2150  }
2151
2152  /* globals MSApp */
2153
2154  /**
2155   * Create a function which has 'unsafe' privileges (required by windows8 apps)
2156   */
2157  var createMicrosoftUnsafeLocalFunction = function (func) {
2158    if (typeof MSApp !== 'undefined' && MSApp.execUnsafeLocalFunction) {
2159      return function (arg0, arg1, arg2, arg3) {
2160        MSApp.execUnsafeLocalFunction(function () {
2161          return func(arg0, arg1, arg2, arg3);
2162        });
2163      };
2164    } else {
2165      return func;
2166    }
2167  };
2168
2169  var reusableSVGContainer;
2170  /**
2171   * Set the innerHTML property of a node
2172   *
2173   * @param {DOMElement} node
2174   * @param {string} html
2175   * @internal
2176   */
2177
2178  var setInnerHTML = createMicrosoftUnsafeLocalFunction(function (node, html) {
2179    if (node.namespaceURI === Namespaces.svg) {
2180
2181      if (!('innerHTML' in node)) {
2182        // IE does not have innerHTML for SVG nodes, so instead we inject the
2183        // new markup in a temp node and then move the child nodes across into
2184        // the target node
2185        reusableSVGContainer = reusableSVGContainer || document.createElement('div');
2186        reusableSVGContainer.innerHTML = '<svg>' + html.valueOf().toString() + '</svg>';
2187        var svgNode = reusableSVGContainer.firstChild;
2188
2189        while (node.firstChild) {
2190          node.removeChild(node.firstChild);
2191        }
2192
2193        while (svgNode.firstChild) {
2194          node.appendChild(svgNode.firstChild);
2195        }
2196
2197        return;
2198      }
2199    }
2200
2201    node.innerHTML = html;
2202  });
2203
2204  /**
2205   * HTML nodeType values that represent the type of the node
2206   */
2207  var ELEMENT_NODE = 1;
2208  var TEXT_NODE = 3;
2209  var COMMENT_NODE = 8;
2210  var DOCUMENT_NODE = 9;
2211  var DOCUMENT_FRAGMENT_NODE = 11;
2212
2213  /**
2214   * Set the textContent property of a node. For text updates, it's faster
2215   * to set the `nodeValue` of the Text node directly instead of using
2216   * `.textContent` which will remove the existing node and create a new one.
2217   *
2218   * @param {DOMElement} node
2219   * @param {string} text
2220   * @internal
2221   */
2222
2223  var setTextContent = function (node, text) {
2224    if (text) {
2225      var firstChild = node.firstChild;
2226
2227      if (firstChild && firstChild === node.lastChild && firstChild.nodeType === TEXT_NODE) {
2228        firstChild.nodeValue = text;
2229        return;
2230      }
2231    }
2232
2233    node.textContent = text;
2234  };
2235
2236  // List derived from Gecko source code:
2237  // https://github.com/mozilla/gecko-dev/blob/4e638efc71/layout/style/test/property_database.js
2238  var shorthandToLonghand = {
2239    animation: ['animationDelay', 'animationDirection', 'animationDuration', 'animationFillMode', 'animationIterationCount', 'animationName', 'animationPlayState', 'animationTimingFunction'],
2240    background: ['backgroundAttachment', 'backgroundClip', 'backgroundColor', 'backgroundImage', 'backgroundOrigin', 'backgroundPositionX', 'backgroundPositionY', 'backgroundRepeat', 'backgroundSize'],
2241    backgroundPosition: ['backgroundPositionX', 'backgroundPositionY'],
2242    border: ['borderBottomColor', 'borderBottomStyle', 'borderBottomWidth', 'borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth', 'borderLeftColor', 'borderLeftStyle', 'borderLeftWidth', 'borderRightColor', 'borderRightStyle', 'borderRightWidth', 'borderTopColor', 'borderTopStyle', 'borderTopWidth'],
2243    borderBlockEnd: ['borderBlockEndColor', 'borderBlockEndStyle', 'borderBlockEndWidth'],
2244    borderBlockStart: ['borderBlockStartColor', 'borderBlockStartStyle', 'borderBlockStartWidth'],
2245    borderBottom: ['borderBottomColor', 'borderBottomStyle', 'borderBottomWidth'],
2246    borderColor: ['borderBottomColor', 'borderLeftColor', 'borderRightColor', 'borderTopColor'],
2247    borderImage: ['borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth'],
2248    borderInlineEnd: ['borderInlineEndColor', 'borderInlineEndStyle', 'borderInlineEndWidth'],
2249    borderInlineStart: ['borderInlineStartColor', 'borderInlineStartStyle', 'borderInlineStartWidth'],
2250    borderLeft: ['borderLeftColor', 'borderLeftStyle', 'borderLeftWidth'],
2251    borderRadius: ['borderBottomLeftRadius', 'borderBottomRightRadius', 'borderTopLeftRadius', 'borderTopRightRadius'],
2252    borderRight: ['borderRightColor', 'borderRightStyle', 'borderRightWidth'],
2253    borderStyle: ['borderBottomStyle', 'borderLeftStyle', 'borderRightStyle', 'borderTopStyle'],
2254    borderTop: ['borderTopColor', 'borderTopStyle', 'borderTopWidth'],
2255    borderWidth: ['borderBottomWidth', 'borderLeftWidth', 'borderRightWidth', 'borderTopWidth'],
2256    columnRule: ['columnRuleColor', 'columnRuleStyle', 'columnRuleWidth'],
2257    columns: ['columnCount', 'columnWidth'],
2258    flex: ['flexBasis', 'flexGrow', 'flexShrink'],
2259    flexFlow: ['flexDirection', 'flexWrap'],
2260    font: ['fontFamily', 'fontFeatureSettings', 'fontKerning', 'fontLanguageOverride', 'fontSize', 'fontSizeAdjust', 'fontStretch', 'fontStyle', 'fontVariant', 'fontVariantAlternates', 'fontVariantCaps', 'fontVariantEastAsian', 'fontVariantLigatures', 'fontVariantNumeric', 'fontVariantPosition', 'fontWeight', 'lineHeight'],
2261    fontVariant: ['fontVariantAlternates', 'fontVariantCaps', 'fontVariantEastAsian', 'fontVariantLigatures', 'fontVariantNumeric', 'fontVariantPosition'],
2262    gap: ['columnGap', 'rowGap'],
2263    grid: ['gridAutoColumns', 'gridAutoFlow', 'gridAutoRows', 'gridTemplateAreas', 'gridTemplateColumns', 'gridTemplateRows'],
2264    gridArea: ['gridColumnEnd', 'gridColumnStart', 'gridRowEnd', 'gridRowStart'],
2265    gridColumn: ['gridColumnEnd', 'gridColumnStart'],
2266    gridColumnGap: ['columnGap'],
2267    gridGap: ['columnGap', 'rowGap'],
2268    gridRow: ['gridRowEnd', 'gridRowStart'],
2269    gridRowGap: ['rowGap'],
2270    gridTemplate: ['gridTemplateAreas', 'gridTemplateColumns', 'gridTemplateRows'],
2271    listStyle: ['listStyleImage', 'listStylePosition', 'listStyleType'],
2272    margin: ['marginBottom', 'marginLeft', 'marginRight', 'marginTop'],
2273    marker: ['markerEnd', 'markerMid', 'markerStart'],
2274    mask: ['maskClip', 'maskComposite', 'maskImage', 'maskMode', 'maskOrigin', 'maskPositionX', 'maskPositionY', 'maskRepeat', 'maskSize'],
2275    maskPosition: ['maskPositionX', 'maskPositionY'],
2276    outline: ['outlineColor', 'outlineStyle', 'outlineWidth'],
2277    overflow: ['overflowX', 'overflowY'],
2278    padding: ['paddingBottom', 'paddingLeft', 'paddingRight', 'paddingTop'],
2279    placeContent: ['alignContent', 'justifyContent'],
2280    placeItems: ['alignItems', 'justifyItems'],
2281    placeSelf: ['alignSelf', 'justifySelf'],
2282    textDecoration: ['textDecorationColor', 'textDecorationLine', 'textDecorationStyle'],
2283    textEmphasis: ['textEmphasisColor', 'textEmphasisStyle'],
2284    transition: ['transitionDelay', 'transitionDuration', 'transitionProperty', 'transitionTimingFunction'],
2285    wordWrap: ['overflowWrap']
2286  };
2287
2288  /**
2289   * CSS properties which accept numbers but are not in units of "px".
2290   */
2291  var isUnitlessNumber = {
2292    animationIterationCount: true,
2293    borderImageOutset: true,
2294    borderImageSlice: true,
2295    borderImageWidth: true,
2296    boxFlex: true,
2297    boxFlexGroup: true,
2298    boxOrdinalGroup: true,
2299    columnCount: true,
2300    columns: true,
2301    flex: true,
2302    flexGrow: true,
2303    flexPositive: true,
2304    flexShrink: true,
2305    flexNegative: true,
2306    flexOrder: true,
2307    gridArea: true,
2308    gridRow: true,
2309    gridRowEnd: true,
2310    gridRowSpan: true,
2311    gridRowStart: true,
2312    gridColumn: true,
2313    gridColumnEnd: true,
2314    gridColumnSpan: true,
2315    gridColumnStart: true,
2316    fontWeight: true,
2317    lineClamp: true,
2318    lineHeight: true,
2319    opacity: true,
2320    order: true,
2321    orphans: true,
2322    tabSize: true,
2323    widows: true,
2324    zIndex: true,
2325    zoom: true,
2326    // SVG-related properties
2327    fillOpacity: true,
2328    floodOpacity: true,
2329    stopOpacity: true,
2330    strokeDasharray: true,
2331    strokeDashoffset: true,
2332    strokeMiterlimit: true,
2333    strokeOpacity: true,
2334    strokeWidth: true
2335  };
2336  /**
2337   * @param {string} prefix vendor-specific prefix, eg: Webkit
2338   * @param {string} key style name, eg: transitionDuration
2339   * @return {string} style name prefixed with `prefix`, properly camelCased, eg:
2340   * WebkitTransitionDuration
2341   */
2342
2343  function prefixKey(prefix, key) {
2344    return prefix + key.charAt(0).toUpperCase() + key.substring(1);
2345  }
2346  /**
2347   * Support style names that may come passed in prefixed by adding permutations
2348   * of vendor prefixes.
2349   */
2350
2351
2352  var prefixes = ['Webkit', 'ms', 'Moz', 'O']; // Using Object.keys here, or else the vanilla for-in loop makes IE8 go into an
2353  // infinite loop, because it iterates over the newly added props too.
2354
2355  Object.keys(isUnitlessNumber).forEach(function (prop) {
2356    prefixes.forEach(function (prefix) {
2357      isUnitlessNumber[prefixKey(prefix, prop)] = isUnitlessNumber[prop];
2358    });
2359  });
2360
2361  /**
2362   * Convert a value into the proper css writable value. The style name `name`
2363   * should be logical (no hyphens), as specified
2364   * in `CSSProperty.isUnitlessNumber`.
2365   *
2366   * @param {string} name CSS property name such as `topMargin`.
2367   * @param {*} value CSS property value such as `10px`.
2368   * @return {string} Normalized style value with dimensions applied.
2369   */
2370
2371  function dangerousStyleValue(name, value, isCustomProperty) {
2372    // Note that we've removed escapeTextForBrowser() calls here since the
2373    // whole string will be escaped when the attribute is injected into
2374    // the markup. If you provide unsafe user data here they can inject
2375    // arbitrary CSS which may be problematic (I couldn't repro this):
2376    // https://www.owasp.org/index.php/XSS_Filter_Evasion_Cheat_Sheet
2377    // http://www.thespanner.co.uk/2007/11/26/ultimate-xss-css-injection/
2378    // This is not an XSS hole but instead a potential CSS injection issue
2379    // which has lead to a greater discussion about how we're going to
2380    // trust URLs moving forward. See #2115901
2381    var isEmpty = value == null || typeof value === 'boolean' || value === '';
2382
2383    if (isEmpty) {
2384      return '';
2385    }
2386
2387    if (!isCustomProperty && typeof value === 'number' && value !== 0 && !(isUnitlessNumber.hasOwnProperty(name) && isUnitlessNumber[name])) {
2388      return value + 'px'; // Presumes implicit 'px' suffix for unitless numbers
2389    }
2390
2391    return ('' + value).trim();
2392  }
2393
2394  var uppercasePattern = /([A-Z])/g;
2395  var msPattern = /^ms-/;
2396  /**
2397   * Hyphenates a camelcased CSS property name, for example:
2398   *
2399   *   > hyphenateStyleName('backgroundColor')
2400   *   < "background-color"
2401   *   > hyphenateStyleName('MozTransition')
2402   *   < "-moz-transition"
2403   *   > hyphenateStyleName('msTransition')
2404   *   < "-ms-transition"
2405   *
2406   * As Modernizr suggests (http://modernizr.com/docs/#prefixed), an `ms` prefix
2407   * is converted to `-ms-`.
2408   */
2409
2410  function hyphenateStyleName(name) {
2411    return name.replace(uppercasePattern, '-$1').toLowerCase().replace(msPattern, '-ms-');
2412  }
2413
2414  var warnValidStyle = function () {};
2415
2416  {
2417    // 'msTransform' is correct, but the other prefixes should be capitalized
2418    var badVendoredStyleNamePattern = /^(?:webkit|moz|o)[A-Z]/;
2419    var msPattern$1 = /^-ms-/;
2420    var hyphenPattern = /-(.)/g; // style values shouldn't contain a semicolon
2421
2422    var badStyleValueWithSemicolonPattern = /;\s*$/;
2423    var warnedStyleNames = {};
2424    var warnedStyleValues = {};
2425    var warnedForNaNValue = false;
2426    var warnedForInfinityValue = false;
2427
2428    var camelize = function (string) {
2429      return string.replace(hyphenPattern, function (_, character) {
2430        return character.toUpperCase();
2431      });
2432    };
2433
2434    var warnHyphenatedStyleName = function (name) {
2435      if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) {
2436        return;
2437      }
2438
2439      warnedStyleNames[name] = true;
2440
2441      error('Unsupported style property %s. Did you mean %s?', name, // As Andi Smith suggests
2442      // (http://www.andismith.com/blog/2012/02/modernizr-prefixed/), an `-ms` prefix
2443      // is converted to lowercase `ms`.
2444      camelize(name.replace(msPattern$1, 'ms-')));
2445    };
2446
2447    var warnBadVendoredStyleName = function (name) {
2448      if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) {
2449        return;
2450      }
2451
2452      warnedStyleNames[name] = true;
2453
2454      error('Unsupported vendor-prefixed style property %s. Did you mean %s?', name, name.charAt(0).toUpperCase() + name.slice(1));
2455    };
2456
2457    var warnStyleValueWithSemicolon = function (name, value) {
2458      if (warnedStyleValues.hasOwnProperty(value) && warnedStyleValues[value]) {
2459        return;
2460      }
2461
2462      warnedStyleValues[value] = true;
2463
2464      error("Style property values shouldn't contain a semicolon. " + 'Try "%s: %s" instead.', name, value.replace(badStyleValueWithSemicolonPattern, ''));
2465    };
2466
2467    var warnStyleValueIsNaN = function (name, value) {
2468      if (warnedForNaNValue) {
2469        return;
2470      }
2471
2472      warnedForNaNValue = true;
2473
2474      error('`NaN` is an invalid value for the `%s` css style property.', name);
2475    };
2476
2477    var warnStyleValueIsInfinity = function (name, value) {
2478      if (warnedForInfinityValue) {
2479        return;
2480      }
2481
2482      warnedForInfinityValue = true;
2483
2484      error('`Infinity` is an invalid value for the `%s` css style property.', name);
2485    };
2486
2487    warnValidStyle = function (name, value) {
2488      if (name.indexOf('-') > -1) {
2489        warnHyphenatedStyleName(name);
2490      } else if (badVendoredStyleNamePattern.test(name)) {
2491        warnBadVendoredStyleName(name);
2492      } else if (badStyleValueWithSemicolonPattern.test(value)) {
2493        warnStyleValueWithSemicolon(name, value);
2494      }
2495
2496      if (typeof value === 'number') {
2497        if (isNaN(value)) {
2498          warnStyleValueIsNaN(name, value);
2499        } else if (!isFinite(value)) {
2500          warnStyleValueIsInfinity(name, value);
2501        }
2502      }
2503    };
2504  }
2505
2506  var warnValidStyle$1 = warnValidStyle;
2507
2508  /**
2509   * Operations for dealing with CSS properties.
2510   */
2511
2512  /**
2513   * This creates a string that is expected to be equivalent to the style
2514   * attribute generated by server-side rendering. It by-passes warnings and
2515   * security checks so it's not safe to use this value for anything other than
2516   * comparison. It is only used in DEV for SSR validation.
2517   */
2518
2519  function createDangerousStringForStyles(styles) {
2520    {
2521      var serialized = '';
2522      var delimiter = '';
2523
2524      for (var styleName in styles) {
2525        if (!styles.hasOwnProperty(styleName)) {
2526          continue;
2527        }
2528
2529        var styleValue = styles[styleName];
2530
2531        if (styleValue != null) {
2532          var isCustomProperty = styleName.indexOf('--') === 0;
2533          serialized += delimiter + (isCustomProperty ? styleName : hyphenateStyleName(styleName)) + ':';
2534          serialized += dangerousStyleValue(styleName, styleValue, isCustomProperty);
2535          delimiter = ';';
2536        }
2537      }
2538
2539      return serialized || null;
2540    }
2541  }
2542  /**
2543   * Sets the value for multiple styles on a node.  If a value is specified as
2544   * '' (empty string), the corresponding style property will be unset.
2545   *
2546   * @param {DOMElement} node
2547   * @param {object} styles
2548   */
2549
2550  function setValueForStyles(node, styles) {
2551    var style = node.style;
2552
2553    for (var styleName in styles) {
2554      if (!styles.hasOwnProperty(styleName)) {
2555        continue;
2556      }
2557
2558      var isCustomProperty = styleName.indexOf('--') === 0;
2559
2560      {
2561        if (!isCustomProperty) {
2562          warnValidStyle$1(styleName, styles[styleName]);
2563        }
2564      }
2565
2566      var styleValue = dangerousStyleValue(styleName, styles[styleName], isCustomProperty);
2567
2568      if (styleName === 'float') {
2569        styleName = 'cssFloat';
2570      }
2571
2572      if (isCustomProperty) {
2573        style.setProperty(styleName, styleValue);
2574      } else {
2575        style[styleName] = styleValue;
2576      }
2577    }
2578  }
2579
2580  function isValueEmpty(value) {
2581    return value == null || typeof value === 'boolean' || value === '';
2582  }
2583  /**
2584   * Given {color: 'red', overflow: 'hidden'} returns {
2585   *   color: 'color',
2586   *   overflowX: 'overflow',
2587   *   overflowY: 'overflow',
2588   * }. This can be read as "the overflowY property was set by the overflow
2589   * shorthand". That is, the values are the property that each was derived from.
2590   */
2591
2592
2593  function expandShorthandMap(styles) {
2594    var expanded = {};
2595
2596    for (var key in styles) {
2597      var longhands = shorthandToLonghand[key] || [key];
2598
2599      for (var i = 0; i < longhands.length; i++) {
2600        expanded[longhands[i]] = key;
2601      }
2602    }
2603
2604    return expanded;
2605  }
2606  /**
2607   * When mixing shorthand and longhand property names, we warn during updates if
2608   * we expect an incorrect result to occur. In particular, we warn for:
2609   *
2610   * Updating a shorthand property (longhand gets overwritten):
2611   *   {font: 'foo', fontVariant: 'bar'} -> {font: 'baz', fontVariant: 'bar'}
2612   *   becomes .style.font = 'baz'
2613   * Removing a shorthand property (longhand gets lost too):
2614   *   {font: 'foo', fontVariant: 'bar'} -> {fontVariant: 'bar'}
2615   *   becomes .style.font = ''
2616   * Removing a longhand property (should revert to shorthand; doesn't):
2617   *   {font: 'foo', fontVariant: 'bar'} -> {font: 'foo'}
2618   *   becomes .style.fontVariant = ''
2619   */
2620
2621
2622  function validateShorthandPropertyCollisionInDev(styleUpdates, nextStyles) {
2623    {
2624      if (!nextStyles) {
2625        return;
2626      }
2627
2628      var expandedUpdates = expandShorthandMap(styleUpdates);
2629      var expandedStyles = expandShorthandMap(nextStyles);
2630      var warnedAbout = {};
2631
2632      for (var key in expandedUpdates) {
2633        var originalKey = expandedUpdates[key];
2634        var correctOriginalKey = expandedStyles[key];
2635
2636        if (correctOriginalKey && originalKey !== correctOriginalKey) {
2637          var warningKey = originalKey + ',' + correctOriginalKey;
2638
2639          if (warnedAbout[warningKey]) {
2640            continue;
2641          }
2642
2643          warnedAbout[warningKey] = true;
2644
2645          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);
2646        }
2647      }
2648    }
2649  }
2650
2651  // For HTML, certain tags should omit their close tag. We keep a list for
2652  // those special-case tags.
2653  var omittedCloseTags = {
2654    area: true,
2655    base: true,
2656    br: true,
2657    col: true,
2658    embed: true,
2659    hr: true,
2660    img: true,
2661    input: true,
2662    keygen: true,
2663    link: true,
2664    meta: true,
2665    param: true,
2666    source: true,
2667    track: true,
2668    wbr: true // NOTE: menuitem's close tag should be omitted, but that causes problems.
2669
2670  };
2671
2672  // `omittedCloseTags` except that `menuitem` should still have its closing tag.
2673
2674  var voidElementTags = _assign({
2675    menuitem: true
2676  }, omittedCloseTags);
2677
2678  var HTML = '__html';
2679
2680  function assertValidProps(tag, props) {
2681    if (!props) {
2682      return;
2683    } // Note the use of `==` which checks for null or undefined.
2684
2685
2686    if (voidElementTags[tag]) {
2687      if (!(props.children == null && props.dangerouslySetInnerHTML == null)) {
2688        {
2689          throw Error( tag + " is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`." );
2690        }
2691      }
2692    }
2693
2694    if (props.dangerouslySetInnerHTML != null) {
2695      if (!(props.children == null)) {
2696        {
2697          throw Error( "Can only set one of `children` or `props.dangerouslySetInnerHTML`." );
2698        }
2699      }
2700
2701      if (!(typeof props.dangerouslySetInnerHTML === 'object' && HTML in props.dangerouslySetInnerHTML)) {
2702        {
2703          throw Error( "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. Please visit https://reactjs.org/link/dangerously-set-inner-html for more information." );
2704        }
2705      }
2706    }
2707
2708    {
2709      if (!props.suppressContentEditableWarning && props.contentEditable && props.children != null) {
2710        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.');
2711      }
2712    }
2713
2714    if (!(props.style == null || typeof props.style === 'object')) {
2715      {
2716        throw Error( "The `style` prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + 'em'}} when using JSX." );
2717      }
2718    }
2719  }
2720
2721  function isCustomComponent(tagName, props) {
2722    if (tagName.indexOf('-') === -1) {
2723      return typeof props.is === 'string';
2724    }
2725
2726    switch (tagName) {
2727      // These are reserved SVG and MathML elements.
2728      // We don't mind this list too much because we expect it to never grow.
2729      // The alternative is to track the namespace in a few places which is convoluted.
2730      // https://w3c.github.io/webcomponents/spec/custom/#custom-elements-core-concepts
2731      case 'annotation-xml':
2732      case 'color-profile':
2733      case 'font-face':
2734      case 'font-face-src':
2735      case 'font-face-uri':
2736      case 'font-face-format':
2737      case 'font-face-name':
2738      case 'missing-glyph':
2739        return false;
2740
2741      default:
2742        return true;
2743    }
2744  }
2745
2746  // When adding attributes to the HTML or SVG allowed attribute list, be sure to
2747  // also add them to this module to ensure casing and incorrect name
2748  // warnings.
2749  var possibleStandardNames = {
2750    // HTML
2751    accept: 'accept',
2752    acceptcharset: 'acceptCharset',
2753    'accept-charset': 'acceptCharset',
2754    accesskey: 'accessKey',
2755    action: 'action',
2756    allowfullscreen: 'allowFullScreen',
2757    alt: 'alt',
2758    as: 'as',
2759    async: 'async',
2760    autocapitalize: 'autoCapitalize',
2761    autocomplete: 'autoComplete',
2762    autocorrect: 'autoCorrect',