github.com/jgarto/itcv@v0.0.0-20180826224514-4eea09c1aa0d/internal/dev/dev.inc.js (about) 1 (function(e, a) { for(var i in a) e[i] = a[i]; }(this, /******/ (function(modules) { // webpackBootstrap 2 /******/ // The module cache 3 /******/ var installedModules = {}; 4 /******/ 5 /******/ // The require function 6 /******/ function __webpack_require__(moduleId) { 7 /******/ 8 /******/ // Check if module is in cache 9 /******/ if(installedModules[moduleId]) { 10 /******/ return installedModules[moduleId].exports; 11 /******/ } 12 /******/ // Create a new module (and put it into the cache) 13 /******/ var module = installedModules[moduleId] = { 14 /******/ i: moduleId, 15 /******/ l: false, 16 /******/ exports: {} 17 /******/ }; 18 /******/ 19 /******/ // Execute the module function 20 /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 21 /******/ 22 /******/ // Flag the module as loaded 23 /******/ module.l = true; 24 /******/ 25 /******/ // Return the exports of the module 26 /******/ return module.exports; 27 /******/ } 28 /******/ 29 /******/ 30 /******/ // expose the modules object (__webpack_modules__) 31 /******/ __webpack_require__.m = modules; 32 /******/ 33 /******/ // expose the module cache 34 /******/ __webpack_require__.c = installedModules; 35 /******/ 36 /******/ // define getter function for harmony exports 37 /******/ __webpack_require__.d = function(exports, name, getter) { 38 /******/ if(!__webpack_require__.o(exports, name)) { 39 /******/ Object.defineProperty(exports, name, { 40 /******/ configurable: false, 41 /******/ enumerable: true, 42 /******/ get: getter 43 /******/ }); 44 /******/ } 45 /******/ }; 46 /******/ 47 /******/ // getDefaultExport function for compatibility with non-harmony modules 48 /******/ __webpack_require__.n = function(module) { 49 /******/ var getter = module && module.__esModule ? 50 /******/ function getDefault() { return module['default']; } : 51 /******/ function getModuleExports() { return module; }; 52 /******/ __webpack_require__.d(getter, 'a', getter); 53 /******/ return getter; 54 /******/ }; 55 /******/ 56 /******/ // Object.prototype.hasOwnProperty.call 57 /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; 58 /******/ 59 /******/ // __webpack_public_path__ 60 /******/ __webpack_require__.p = ""; 61 /******/ 62 /******/ // Load entry module and return exports 63 /******/ return __webpack_require__(__webpack_require__.s = 14); 64 /******/ }) 65 /************************************************************************/ 66 /******/ ([ 67 /* 0 */ 68 /***/ (function(module, exports) { 69 70 // shim for using process in browser 71 var process = module.exports = {}; 72 73 // cached from whatever global is present so that test runners that stub it 74 // don't break things. But we need to wrap it in a try catch in case it is 75 // wrapped in strict mode code which doesn't define any globals. It's inside a 76 // function because try/catches deoptimize in certain engines. 77 78 var cachedSetTimeout; 79 var cachedClearTimeout; 80 81 function defaultSetTimout() { 82 throw new Error('setTimeout has not been defined'); 83 } 84 function defaultClearTimeout () { 85 throw new Error('clearTimeout has not been defined'); 86 } 87 (function () { 88 try { 89 if (typeof setTimeout === 'function') { 90 cachedSetTimeout = setTimeout; 91 } else { 92 cachedSetTimeout = defaultSetTimout; 93 } 94 } catch (e) { 95 cachedSetTimeout = defaultSetTimout; 96 } 97 try { 98 if (typeof clearTimeout === 'function') { 99 cachedClearTimeout = clearTimeout; 100 } else { 101 cachedClearTimeout = defaultClearTimeout; 102 } 103 } catch (e) { 104 cachedClearTimeout = defaultClearTimeout; 105 } 106 } ()) 107 function runTimeout(fun) { 108 if (cachedSetTimeout === setTimeout) { 109 //normal enviroments in sane situations 110 return setTimeout(fun, 0); 111 } 112 // if setTimeout wasn't available but was latter defined 113 if ((cachedSetTimeout === defaultSetTimout || !cachedSetTimeout) && setTimeout) { 114 cachedSetTimeout = setTimeout; 115 return setTimeout(fun, 0); 116 } 117 try { 118 // when when somebody has screwed with setTimeout but no I.E. maddness 119 return cachedSetTimeout(fun, 0); 120 } catch(e){ 121 try { 122 // When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally 123 return cachedSetTimeout.call(null, fun, 0); 124 } catch(e){ 125 // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error 126 return cachedSetTimeout.call(this, fun, 0); 127 } 128 } 129 130 131 } 132 function runClearTimeout(marker) { 133 if (cachedClearTimeout === clearTimeout) { 134 //normal enviroments in sane situations 135 return clearTimeout(marker); 136 } 137 // if clearTimeout wasn't available but was latter defined 138 if ((cachedClearTimeout === defaultClearTimeout || !cachedClearTimeout) && clearTimeout) { 139 cachedClearTimeout = clearTimeout; 140 return clearTimeout(marker); 141 } 142 try { 143 // when when somebody has screwed with setTimeout but no I.E. maddness 144 return cachedClearTimeout(marker); 145 } catch (e){ 146 try { 147 // When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally 148 return cachedClearTimeout.call(null, marker); 149 } catch (e){ 150 // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error. 151 // Some versions of I.E. have different rules for clearTimeout vs setTimeout 152 return cachedClearTimeout.call(this, marker); 153 } 154 } 155 156 157 158 } 159 var queue = []; 160 var draining = false; 161 var currentQueue; 162 var queueIndex = -1; 163 164 function cleanUpNextTick() { 165 if (!draining || !currentQueue) { 166 return; 167 } 168 draining = false; 169 if (currentQueue.length) { 170 queue = currentQueue.concat(queue); 171 } else { 172 queueIndex = -1; 173 } 174 if (queue.length) { 175 drainQueue(); 176 } 177 } 178 179 function drainQueue() { 180 if (draining) { 181 return; 182 } 183 var timeout = runTimeout(cleanUpNextTick); 184 draining = true; 185 186 var len = queue.length; 187 while(len) { 188 currentQueue = queue; 189 queue = []; 190 while (++queueIndex < len) { 191 if (currentQueue) { 192 currentQueue[queueIndex].run(); 193 } 194 } 195 queueIndex = -1; 196 len = queue.length; 197 } 198 currentQueue = null; 199 draining = false; 200 runClearTimeout(timeout); 201 } 202 203 process.nextTick = function (fun) { 204 var args = new Array(arguments.length - 1); 205 if (arguments.length > 1) { 206 for (var i = 1; i < arguments.length; i++) { 207 args[i - 1] = arguments[i]; 208 } 209 } 210 queue.push(new Item(fun, args)); 211 if (queue.length === 1 && !draining) { 212 runTimeout(drainQueue); 213 } 214 }; 215 216 // v8 likes predictible objects 217 function Item(fun, array) { 218 this.fun = fun; 219 this.array = array; 220 } 221 Item.prototype.run = function () { 222 this.fun.apply(null, this.array); 223 }; 224 process.title = 'browser'; 225 process.browser = true; 226 process.env = {}; 227 process.argv = []; 228 process.version = ''; // empty string to avoid regexp issues 229 process.versions = {}; 230 231 function noop() {} 232 233 process.on = noop; 234 process.addListener = noop; 235 process.once = noop; 236 process.off = noop; 237 process.removeListener = noop; 238 process.removeAllListeners = noop; 239 process.emit = noop; 240 process.prependListener = noop; 241 process.prependOnceListener = noop; 242 243 process.listeners = function (name) { return [] } 244 245 process.binding = function (name) { 246 throw new Error('process.binding is not supported'); 247 }; 248 249 process.cwd = function () { return '/' }; 250 process.chdir = function (dir) { 251 throw new Error('process.chdir is not supported'); 252 }; 253 process.umask = function() { return 0; }; 254 255 256 /***/ }), 257 /* 1 */ 258 /***/ (function(module, exports, __webpack_require__) { 259 260 "use strict"; 261 262 263 /** 264 * Copyright (c) 2013-present, Facebook, Inc. 265 * 266 * This source code is licensed under the MIT license found in the 267 * LICENSE file in the root directory of this source tree. 268 * 269 * 270 */ 271 272 function makeEmptyFunction(arg) { 273 return function () { 274 return arg; 275 }; 276 } 277 278 /** 279 * This function accepts and discards inputs; it has no side effects. This is 280 * primarily useful idiomatically for overridable function endpoints which 281 * always need to be callable, since JS lacks a null-call idiom ala Cocoa. 282 */ 283 var emptyFunction = function emptyFunction() {}; 284 285 emptyFunction.thatReturns = makeEmptyFunction; 286 emptyFunction.thatReturnsFalse = makeEmptyFunction(false); 287 emptyFunction.thatReturnsTrue = makeEmptyFunction(true); 288 emptyFunction.thatReturnsNull = makeEmptyFunction(null); 289 emptyFunction.thatReturnsThis = function () { 290 return this; 291 }; 292 emptyFunction.thatReturnsArgument = function (arg) { 293 return arg; 294 }; 295 296 module.exports = emptyFunction; 297 298 /***/ }), 299 /* 2 */ 300 /***/ (function(module, exports, __webpack_require__) { 301 302 "use strict"; 303 /* 304 object-assign 305 (c) Sindre Sorhus 306 @license MIT 307 */ 308 309 310 /* eslint-disable no-unused-vars */ 311 var getOwnPropertySymbols = Object.getOwnPropertySymbols; 312 var hasOwnProperty = Object.prototype.hasOwnProperty; 313 var propIsEnumerable = Object.prototype.propertyIsEnumerable; 314 315 function toObject(val) { 316 if (val === null || val === undefined) { 317 throw new TypeError('Object.assign cannot be called with null or undefined'); 318 } 319 320 return Object(val); 321 } 322 323 function shouldUseNative() { 324 try { 325 if (!Object.assign) { 326 return false; 327 } 328 329 // Detect buggy property enumeration order in older V8 versions. 330 331 // https://bugs.chromium.org/p/v8/issues/detail?id=4118 332 var test1 = new String('abc'); // eslint-disable-line no-new-wrappers 333 test1[5] = 'de'; 334 if (Object.getOwnPropertyNames(test1)[0] === '5') { 335 return false; 336 } 337 338 // https://bugs.chromium.org/p/v8/issues/detail?id=3056 339 var test2 = {}; 340 for (var i = 0; i < 10; i++) { 341 test2['_' + String.fromCharCode(i)] = i; 342 } 343 var order2 = Object.getOwnPropertyNames(test2).map(function (n) { 344 return test2[n]; 345 }); 346 if (order2.join('') !== '0123456789') { 347 return false; 348 } 349 350 // https://bugs.chromium.org/p/v8/issues/detail?id=3056 351 var test3 = {}; 352 'abcdefghijklmnopqrst'.split('').forEach(function (letter) { 353 test3[letter] = letter; 354 }); 355 if (Object.keys(Object.assign({}, test3)).join('') !== 356 'abcdefghijklmnopqrst') { 357 return false; 358 } 359 360 return true; 361 } catch (err) { 362 // We don't expect any of the above to throw, but better to be safe. 363 return false; 364 } 365 } 366 367 module.exports = shouldUseNative() ? Object.assign : function (target, source) { 368 var from; 369 var to = toObject(target); 370 var symbols; 371 372 for (var s = 1; s < arguments.length; s++) { 373 from = Object(arguments[s]); 374 375 for (var key in from) { 376 if (hasOwnProperty.call(from, key)) { 377 to[key] = from[key]; 378 } 379 } 380 381 if (getOwnPropertySymbols) { 382 symbols = getOwnPropertySymbols(from); 383 for (var i = 0; i < symbols.length; i++) { 384 if (propIsEnumerable.call(from, symbols[i])) { 385 to[symbols[i]] = from[symbols[i]]; 386 } 387 } 388 } 389 } 390 391 return to; 392 }; 393 394 395 /***/ }), 396 /* 3 */ 397 /***/ (function(module, exports, __webpack_require__) { 398 399 "use strict"; 400 /* WEBPACK VAR INJECTION */(function(process) {/** 401 * Copyright (c) 2013-present, Facebook, Inc. 402 * 403 * This source code is licensed under the MIT license found in the 404 * LICENSE file in the root directory of this source tree. 405 * 406 */ 407 408 409 410 var emptyObject = {}; 411 412 if (process.env.NODE_ENV !== 'production') { 413 Object.freeze(emptyObject); 414 } 415 416 module.exports = emptyObject; 417 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 418 419 /***/ }), 420 /* 4 */ 421 /***/ (function(module, exports, __webpack_require__) { 422 423 "use strict"; 424 /* WEBPACK VAR INJECTION */(function(process) { 425 426 if (process.env.NODE_ENV === 'production') { 427 module.exports = __webpack_require__(15); 428 } else { 429 module.exports = __webpack_require__(16); 430 } 431 432 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 433 434 /***/ }), 435 /* 5 */ 436 /***/ (function(module, exports, __webpack_require__) { 437 438 "use strict"; 439 /* WEBPACK VAR INJECTION */(function(process) {/** 440 * Copyright (c) 2013-present, Facebook, Inc. 441 * 442 * This source code is licensed under the MIT license found in the 443 * LICENSE file in the root directory of this source tree. 444 * 445 */ 446 447 448 449 /** 450 * Use invariant() to assert state which your program assumes to be true. 451 * 452 * Provide sprintf-style format (only %s is supported) and arguments 453 * to provide information about what broke and what you were 454 * expecting. 455 * 456 * The invariant message will be stripped in production, but the invariant 457 * will remain to ensure logic does not differ in production. 458 */ 459 460 var validateFormat = function validateFormat(format) {}; 461 462 if (process.env.NODE_ENV !== 'production') { 463 validateFormat = function validateFormat(format) { 464 if (format === undefined) { 465 throw new Error('invariant requires an error message argument'); 466 } 467 }; 468 } 469 470 function invariant(condition, format, a, b, c, d, e, f) { 471 validateFormat(format); 472 473 if (!condition) { 474 var error; 475 if (format === undefined) { 476 error = new Error('Minified exception occurred; use the non-minified dev environment ' + 'for the full error message and additional helpful warnings.'); 477 } else { 478 var args = [a, b, c, d, e, f]; 479 var argIndex = 0; 480 error = new Error(format.replace(/%s/g, function () { 481 return args[argIndex++]; 482 })); 483 error.name = 'Invariant Violation'; 484 } 485 486 error.framesToPop = 1; // we don't care about invariant's own frame 487 throw error; 488 } 489 } 490 491 module.exports = invariant; 492 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 493 494 /***/ }), 495 /* 6 */ 496 /***/ (function(module, exports, __webpack_require__) { 497 498 "use strict"; 499 /* WEBPACK VAR INJECTION */(function(process) {/** 500 * Copyright (c) 2014-present, Facebook, Inc. 501 * 502 * This source code is licensed under the MIT license found in the 503 * LICENSE file in the root directory of this source tree. 504 * 505 */ 506 507 508 509 var emptyFunction = __webpack_require__(1); 510 511 /** 512 * Similar to invariant but only logs a warning if the condition is not met. 513 * This can be used to log issues in development environments in critical 514 * paths. Removing the logging code for production environments will keep the 515 * same logic and follow the same code paths. 516 */ 517 518 var warning = emptyFunction; 519 520 if (process.env.NODE_ENV !== 'production') { 521 var printWarning = function printWarning(format) { 522 for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { 523 args[_key - 1] = arguments[_key]; 524 } 525 526 var argIndex = 0; 527 var message = 'Warning: ' + format.replace(/%s/g, function () { 528 return args[argIndex++]; 529 }); 530 if (typeof console !== 'undefined') { 531 console.error(message); 532 } 533 try { 534 // --- Welcome to debugging React --- 535 // This error was thrown as a convenience so that you can use this stack 536 // to find the callsite that caused this warning to fire. 537 throw new Error(message); 538 } catch (x) {} 539 }; 540 541 warning = function warning(condition, format) { 542 if (format === undefined) { 543 throw new Error('`warning(condition, format, ...args)` requires a warning ' + 'message argument'); 544 } 545 546 if (format.indexOf('Failed Composite propType: ') === 0) { 547 return; // Ignore CompositeComponent proptype check. 548 } 549 550 if (!condition) { 551 for (var _len2 = arguments.length, args = Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) { 552 args[_key2 - 2] = arguments[_key2]; 553 } 554 555 printWarning.apply(undefined, [format].concat(args)); 556 } 557 }; 558 } 559 560 module.exports = warning; 561 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 562 563 /***/ }), 564 /* 7 */ 565 /***/ (function(module, exports, __webpack_require__) { 566 567 "use strict"; 568 /* WEBPACK VAR INJECTION */(function(process) {/** 569 * Copyright (c) 2013-present, Facebook, Inc. 570 * 571 * This source code is licensed under the MIT license found in the 572 * LICENSE file in the root directory of this source tree. 573 */ 574 575 576 577 if (process.env.NODE_ENV !== 'production') { 578 var invariant = __webpack_require__(5); 579 var warning = __webpack_require__(6); 580 var ReactPropTypesSecret = __webpack_require__(17); 581 var loggedTypeFailures = {}; 582 } 583 584 /** 585 * Assert that the values match with the type specs. 586 * Error messages are memorized and will only be shown once. 587 * 588 * @param {object} typeSpecs Map of name to a ReactPropType 589 * @param {object} values Runtime values that need to be type-checked 590 * @param {string} location e.g. "prop", "context", "child context" 591 * @param {string} componentName Name of the component for error messages. 592 * @param {?Function} getStack Returns the component stack. 593 * @private 594 */ 595 function checkPropTypes(typeSpecs, values, location, componentName, getStack) { 596 if (process.env.NODE_ENV !== 'production') { 597 for (var typeSpecName in typeSpecs) { 598 if (typeSpecs.hasOwnProperty(typeSpecName)) { 599 var error; 600 // Prop type validation may throw. In case they do, we don't want to 601 // fail the render phase where it didn't fail before. So we log it. 602 // After these have been cleaned up, we'll let them throw. 603 try { 604 // This is intentionally an invariant that gets caught. It's the same 605 // behavior as without this statement except with a better message. 606 invariant(typeof typeSpecs[typeSpecName] === 'function', '%s: %s type `%s` is invalid; it must be a function, usually from ' + 'the `prop-types` package, but received `%s`.', componentName || 'React class', location, typeSpecName, typeof typeSpecs[typeSpecName]); 607 error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret); 608 } catch (ex) { 609 error = ex; 610 } 611 warning(!error || error instanceof Error, '%s: type specification of %s `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error); 612 if (error instanceof Error && !(error.message in loggedTypeFailures)) { 613 // Only monitor this failure once because there tends to be a lot of the 614 // same error. 615 loggedTypeFailures[error.message] = true; 616 617 var stack = getStack ? getStack() : ''; 618 619 warning(false, 'Failed %s type: %s%s', location, error.message, stack != null ? stack : ''); 620 } 621 } 622 } 623 } 624 } 625 626 module.exports = checkPropTypes; 627 628 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 629 630 /***/ }), 631 /* 8 */ 632 /***/ (function(module, exports, __webpack_require__) { 633 634 "use strict"; 635 /** 636 * Copyright (c) 2013-present, Facebook, Inc. 637 * 638 * This source code is licensed under the MIT license found in the 639 * LICENSE file in the root directory of this source tree. 640 * 641 */ 642 643 644 645 var canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement); 646 647 /** 648 * Simple, lightweight module assisting with the detection and context of 649 * Worker. Helps avoid circular dependencies and allows code to reason about 650 * whether or not they are in a Worker, even if they never include the main 651 * `ReactWorker` dependency. 652 */ 653 var ExecutionEnvironment = { 654 655 canUseDOM: canUseDOM, 656 657 canUseWorkers: typeof Worker !== 'undefined', 658 659 canUseEventListeners: canUseDOM && !!(window.addEventListener || window.attachEvent), 660 661 canUseViewport: canUseDOM && !!window.screen, 662 663 isInWorker: !canUseDOM // For now, this is true - might change in the future. 664 665 }; 666 667 module.exports = ExecutionEnvironment; 668 669 /***/ }), 670 /* 9 */ 671 /***/ (function(module, exports, __webpack_require__) { 672 673 "use strict"; 674 /* WEBPACK VAR INJECTION */(function(process) { 675 676 /** 677 * Copyright (c) 2013-present, Facebook, Inc. 678 * 679 * This source code is licensed under the MIT license found in the 680 * LICENSE file in the root directory of this source tree. 681 * 682 * @typechecks 683 */ 684 685 var emptyFunction = __webpack_require__(1); 686 687 /** 688 * Upstream version of event listener. Does not take into account specific 689 * nature of platform. 690 */ 691 var EventListener = { 692 /** 693 * Listen to DOM events during the bubble phase. 694 * 695 * @param {DOMEventTarget} target DOM element to register listener on. 696 * @param {string} eventType Event type, e.g. 'click' or 'mouseover'. 697 * @param {function} callback Callback function. 698 * @return {object} Object with a `remove` method. 699 */ 700 listen: function listen(target, eventType, callback) { 701 if (target.addEventListener) { 702 target.addEventListener(eventType, callback, false); 703 return { 704 remove: function remove() { 705 target.removeEventListener(eventType, callback, false); 706 } 707 }; 708 } else if (target.attachEvent) { 709 target.attachEvent('on' + eventType, callback); 710 return { 711 remove: function remove() { 712 target.detachEvent('on' + eventType, callback); 713 } 714 }; 715 } 716 }, 717 718 /** 719 * Listen to DOM events during the capture phase. 720 * 721 * @param {DOMEventTarget} target DOM element to register listener on. 722 * @param {string} eventType Event type, e.g. 'click' or 'mouseover'. 723 * @param {function} callback Callback function. 724 * @return {object} Object with a `remove` method. 725 */ 726 capture: function capture(target, eventType, callback) { 727 if (target.addEventListener) { 728 target.addEventListener(eventType, callback, true); 729 return { 730 remove: function remove() { 731 target.removeEventListener(eventType, callback, true); 732 } 733 }; 734 } else { 735 if (process.env.NODE_ENV !== 'production') { 736 console.error('Attempted to listen to events during the capture phase on a ' + 'browser that does not support the capture phase. Your application ' + 'will not receive some events.'); 737 } 738 return { 739 remove: emptyFunction 740 }; 741 } 742 }, 743 744 registerDefault: function registerDefault() {} 745 }; 746 747 module.exports = EventListener; 748 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 749 750 /***/ }), 751 /* 10 */ 752 /***/ (function(module, exports, __webpack_require__) { 753 754 "use strict"; 755 756 757 /** 758 * Copyright (c) 2013-present, Facebook, Inc. 759 * 760 * This source code is licensed under the MIT license found in the 761 * LICENSE file in the root directory of this source tree. 762 * 763 * @typechecks 764 */ 765 766 /* eslint-disable fb-www/typeof-undefined */ 767 768 /** 769 * Same as document.activeElement but wraps in a try-catch block. In IE it is 770 * not safe to call document.activeElement if there is nothing focused. 771 * 772 * The activeElement will be null only if the document or document body is not 773 * yet defined. 774 * 775 * @param {?DOMDocument} doc Defaults to current document. 776 * @return {?DOMElement} 777 */ 778 function getActiveElement(doc) /*?DOMElement*/{ 779 doc = doc || (typeof document !== 'undefined' ? document : undefined); 780 if (typeof doc === 'undefined') { 781 return null; 782 } 783 try { 784 return doc.activeElement || doc.body; 785 } catch (e) { 786 return doc.body; 787 } 788 } 789 790 module.exports = getActiveElement; 791 792 /***/ }), 793 /* 11 */ 794 /***/ (function(module, exports, __webpack_require__) { 795 796 "use strict"; 797 /** 798 * Copyright (c) 2013-present, Facebook, Inc. 799 * 800 * This source code is licensed under the MIT license found in the 801 * LICENSE file in the root directory of this source tree. 802 * 803 * @typechecks 804 * 805 */ 806 807 /*eslint-disable no-self-compare */ 808 809 810 811 var hasOwnProperty = Object.prototype.hasOwnProperty; 812 813 /** 814 * inlined Object.is polyfill to avoid requiring consumers ship their own 815 * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is 816 */ 817 function is(x, y) { 818 // SameValue algorithm 819 if (x === y) { 820 // Steps 1-5, 7-10 821 // Steps 6.b-6.e: +0 != -0 822 // Added the nonzero y check to make Flow happy, but it is redundant 823 return x !== 0 || y !== 0 || 1 / x === 1 / y; 824 } else { 825 // Step 6.a: NaN == NaN 826 return x !== x && y !== y; 827 } 828 } 829 830 /** 831 * Performs equality by iterating through keys on an object and returning false 832 * when any key has values which are not strictly equal between the arguments. 833 * Returns true when the values of all keys are strictly equal. 834 */ 835 function shallowEqual(objA, objB) { 836 if (is(objA, objB)) { 837 return true; 838 } 839 840 if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) { 841 return false; 842 } 843 844 var keysA = Object.keys(objA); 845 var keysB = Object.keys(objB); 846 847 if (keysA.length !== keysB.length) { 848 return false; 849 } 850 851 // Test for A's keys different from B. 852 for (var i = 0; i < keysA.length; i++) { 853 if (!hasOwnProperty.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) { 854 return false; 855 } 856 } 857 858 return true; 859 } 860 861 module.exports = shallowEqual; 862 863 /***/ }), 864 /* 12 */ 865 /***/ (function(module, exports, __webpack_require__) { 866 867 "use strict"; 868 869 870 /** 871 * Copyright (c) 2013-present, Facebook, Inc. 872 * 873 * This source code is licensed under the MIT license found in the 874 * LICENSE file in the root directory of this source tree. 875 * 876 * 877 */ 878 879 var isTextNode = __webpack_require__(20); 880 881 /*eslint-disable no-bitwise */ 882 883 /** 884 * Checks if a given DOM node contains or is another DOM node. 885 */ 886 function containsNode(outerNode, innerNode) { 887 if (!outerNode || !innerNode) { 888 return false; 889 } else if (outerNode === innerNode) { 890 return true; 891 } else if (isTextNode(outerNode)) { 892 return false; 893 } else if (isTextNode(innerNode)) { 894 return containsNode(outerNode, innerNode.parentNode); 895 } else if ('contains' in outerNode) { 896 return outerNode.contains(innerNode); 897 } else if (outerNode.compareDocumentPosition) { 898 return !!(outerNode.compareDocumentPosition(innerNode) & 16); 899 } else { 900 return false; 901 } 902 } 903 904 module.exports = containsNode; 905 906 /***/ }), 907 /* 13 */ 908 /***/ (function(module, exports, __webpack_require__) { 909 910 "use strict"; 911 /** 912 * Copyright (c) 2013-present, Facebook, Inc. 913 * 914 * This source code is licensed under the MIT license found in the 915 * LICENSE file in the root directory of this source tree. 916 * 917 */ 918 919 920 921 /** 922 * @param {DOMElement} node input/textarea to focus 923 */ 924 925 function focusNode(node) { 926 // IE8 can throw "Can't move focus to the control because it is invisible, 927 // not enabled, or of a type that does not accept the focus." for all kinds of 928 // reasons that are too expensive and fragile to test. 929 try { 930 node.focus(); 931 } catch (e) {} 932 } 933 934 module.exports = focusNode; 935 936 /***/ }), 937 /* 14 */ 938 /***/ (function(module, exports, __webpack_require__) { 939 940 window.React = __webpack_require__(4); 941 window.ReactDOM = __webpack_require__(18); 942 window.React.createClass = __webpack_require__(27); 943 944 945 /***/ }), 946 /* 15 */ 947 /***/ (function(module, exports, __webpack_require__) { 948 949 "use strict"; 950 /** @license React v16.2.0 951 * react.production.min.js 952 * 953 * Copyright (c) 2013-present, Facebook, Inc. 954 * 955 * This source code is licensed under the MIT license found in the 956 * LICENSE file in the root directory of this source tree. 957 */ 958 959 var m=__webpack_require__(2),n=__webpack_require__(3),p=__webpack_require__(1),q="function"===typeof Symbol&&Symbol["for"],r=q?Symbol["for"]("react.element"):60103,t=q?Symbol["for"]("react.call"):60104,u=q?Symbol["for"]("react.return"):60105,v=q?Symbol["for"]("react.portal"):60106,w=q?Symbol["for"]("react.fragment"):60107,x="function"===typeof Symbol&&Symbol.iterator; 960 function y(a){for(var b=arguments.length-1,e="Minified React error #"+a+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant\x3d"+a,c=0;c<b;c++)e+="\x26args[]\x3d"+encodeURIComponent(arguments[c+1]);b=Error(e+" for the full message or use the non-minified dev environment for full errors and additional helpful warnings.");b.name="Invariant Violation";b.framesToPop=1;throw b;} 961 var z={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}};function A(a,b,e){this.props=a;this.context=b;this.refs=n;this.updater=e||z}A.prototype.isReactComponent={};A.prototype.setState=function(a,b){"object"!==typeof a&&"function"!==typeof a&&null!=a?y("85"):void 0;this.updater.enqueueSetState(this,a,b,"setState")};A.prototype.forceUpdate=function(a){this.updater.enqueueForceUpdate(this,a,"forceUpdate")}; 962 function B(a,b,e){this.props=a;this.context=b;this.refs=n;this.updater=e||z}function C(){}C.prototype=A.prototype;var D=B.prototype=new C;D.constructor=B;m(D,A.prototype);D.isPureReactComponent=!0;function E(a,b,e){this.props=a;this.context=b;this.refs=n;this.updater=e||z}var F=E.prototype=new C;F.constructor=E;m(F,A.prototype);F.unstable_isAsyncReactComponent=!0;F.render=function(){return this.props.children};var G={current:null},H=Object.prototype.hasOwnProperty,I={key:!0,ref:!0,__self:!0,__source:!0}; 963 function J(a,b,e){var c,d={},g=null,k=null;if(null!=b)for(c in void 0!==b.ref&&(k=b.ref),void 0!==b.key&&(g=""+b.key),b)H.call(b,c)&&!I.hasOwnProperty(c)&&(d[c]=b[c]);var f=arguments.length-2;if(1===f)d.children=e;else if(1<f){for(var h=Array(f),l=0;l<f;l++)h[l]=arguments[l+2];d.children=h}if(a&&a.defaultProps)for(c in f=a.defaultProps,f)void 0===d[c]&&(d[c]=f[c]);return{$$typeof:r,type:a,key:g,ref:k,props:d,_owner:G.current}}function K(a){return"object"===typeof a&&null!==a&&a.$$typeof===r} 964 function escape(a){var b={"\x3d":"\x3d0",":":"\x3d2"};return"$"+(""+a).replace(/[=:]/g,function(a){return b[a]})}var L=/\/+/g,M=[];function N(a,b,e,c){if(M.length){var d=M.pop();d.result=a;d.keyPrefix=b;d.func=e;d.context=c;d.count=0;return d}return{result:a,keyPrefix:b,func:e,context:c,count:0}}function O(a){a.result=null;a.keyPrefix=null;a.func=null;a.context=null;a.count=0;10>M.length&&M.push(a)} 965 function P(a,b,e,c){var d=typeof a;if("undefined"===d||"boolean"===d)a=null;var g=!1;if(null===a)g=!0;else switch(d){case "string":case "number":g=!0;break;case "object":switch(a.$$typeof){case r:case t:case u:case v:g=!0}}if(g)return e(c,a,""===b?"."+Q(a,0):b),1;g=0;b=""===b?".":b+":";if(Array.isArray(a))for(var k=0;k<a.length;k++){d=a[k];var f=b+Q(d,k);g+=P(d,f,e,c)}else if(null===a||"undefined"===typeof a?f=null:(f=x&&a[x]||a["@@iterator"],f="function"===typeof f?f:null),"function"===typeof f)for(a= 966 f.call(a),k=0;!(d=a.next()).done;)d=d.value,f=b+Q(d,k++),g+=P(d,f,e,c);else"object"===d&&(e=""+a,y("31","[object Object]"===e?"object with keys {"+Object.keys(a).join(", ")+"}":e,""));return g}function Q(a,b){return"object"===typeof a&&null!==a&&null!=a.key?escape(a.key):b.toString(36)}function R(a,b){a.func.call(a.context,b,a.count++)} 967 function S(a,b,e){var c=a.result,d=a.keyPrefix;a=a.func.call(a.context,b,a.count++);Array.isArray(a)?T(a,c,e,p.thatReturnsArgument):null!=a&&(K(a)&&(b=d+(!a.key||b&&b.key===a.key?"":(""+a.key).replace(L,"$\x26/")+"/")+e,a={$$typeof:r,type:a.type,key:b,ref:a.ref,props:a.props,_owner:a._owner}),c.push(a))}function T(a,b,e,c,d){var g="";null!=e&&(g=(""+e).replace(L,"$\x26/")+"/");b=N(b,g,c,d);null==a||P(a,"",S,b);O(b)} 968 var U={Children:{map:function(a,b,e){if(null==a)return a;var c=[];T(a,c,null,b,e);return c},forEach:function(a,b,e){if(null==a)return a;b=N(null,null,b,e);null==a||P(a,"",R,b);O(b)},count:function(a){return null==a?0:P(a,"",p.thatReturnsNull,null)},toArray:function(a){var b=[];T(a,b,null,p.thatReturnsArgument);return b},only:function(a){K(a)?void 0:y("143");return a}},Component:A,PureComponent:B,unstable_AsyncComponent:E,Fragment:w,createElement:J,cloneElement:function(a,b,e){var c=m({},a.props), 969 d=a.key,g=a.ref,k=a._owner;if(null!=b){void 0!==b.ref&&(g=b.ref,k=G.current);void 0!==b.key&&(d=""+b.key);if(a.type&&a.type.defaultProps)var f=a.type.defaultProps;for(h in b)H.call(b,h)&&!I.hasOwnProperty(h)&&(c[h]=void 0===b[h]&&void 0!==f?f[h]:b[h])}var h=arguments.length-2;if(1===h)c.children=e;else if(1<h){f=Array(h);for(var l=0;l<h;l++)f[l]=arguments[l+2];c.children=f}return{$$typeof:r,type:a.type,key:d,ref:g,props:c,_owner:k}},createFactory:function(a){var b=J.bind(null,a);b.type=a;return b}, 970 isValidElement:K,version:"16.2.0",__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:{ReactCurrentOwner:G,assign:m}},V=Object.freeze({default:U}),W=V&&U||V;module.exports=W["default"]?W["default"]:W; 971 972 973 /***/ }), 974 /* 16 */ 975 /***/ (function(module, exports, __webpack_require__) { 976 977 "use strict"; 978 /* WEBPACK VAR INJECTION */(function(process) {/** @license React v16.2.0 979 * react.development.js 980 * 981 * Copyright (c) 2013-present, Facebook, Inc. 982 * 983 * This source code is licensed under the MIT license found in the 984 * LICENSE file in the root directory of this source tree. 985 */ 986 987 988 989 990 991 if (process.env.NODE_ENV !== "production") { 992 (function() { 993 'use strict'; 994 995 var _assign = __webpack_require__(2); 996 var emptyObject = __webpack_require__(3); 997 var invariant = __webpack_require__(5); 998 var warning = __webpack_require__(6); 999 var emptyFunction = __webpack_require__(1); 1000 var checkPropTypes = __webpack_require__(7); 1001 1002 // TODO: this is special because it gets imported during build. 1003 1004 var ReactVersion = '16.2.0'; 1005 1006 // The Symbol used to tag the ReactElement-like types. If there is no native Symbol 1007 // nor polyfill, then a plain number is used for performance. 1008 var hasSymbol = typeof Symbol === 'function' && Symbol['for']; 1009 1010 var REACT_ELEMENT_TYPE = hasSymbol ? Symbol['for']('react.element') : 0xeac7; 1011 var REACT_CALL_TYPE = hasSymbol ? Symbol['for']('react.call') : 0xeac8; 1012 var REACT_RETURN_TYPE = hasSymbol ? Symbol['for']('react.return') : 0xeac9; 1013 var REACT_PORTAL_TYPE = hasSymbol ? Symbol['for']('react.portal') : 0xeaca; 1014 var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol['for']('react.fragment') : 0xeacb; 1015 1016 var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator; 1017 var FAUX_ITERATOR_SYMBOL = '@@iterator'; 1018 1019 function getIteratorFn(maybeIterable) { 1020 if (maybeIterable === null || typeof maybeIterable === 'undefined') { 1021 return null; 1022 } 1023 var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]; 1024 if (typeof maybeIterator === 'function') { 1025 return maybeIterator; 1026 } 1027 return null; 1028 } 1029 1030 /** 1031 * WARNING: DO NOT manually require this module. 1032 * This is a replacement for `invariant(...)` used by the error code system 1033 * and will _only_ be required by the corresponding babel pass. 1034 * It always throws. 1035 */ 1036 1037 /** 1038 * Forked from fbjs/warning: 1039 * https://github.com/facebook/fbjs/blob/e66ba20ad5be433eb54423f2b097d829324d9de6/packages/fbjs/src/__forks__/warning.js 1040 * 1041 * Only change is we use console.warn instead of console.error, 1042 * and do nothing when 'console' is not supported. 1043 * This really simplifies the code. 1044 * --- 1045 * Similar to invariant but only logs a warning if the condition is not met. 1046 * This can be used to log issues in development environments in critical 1047 * paths. Removing the logging code for production environments will keep the 1048 * same logic and follow the same code paths. 1049 */ 1050 1051 var lowPriorityWarning = function () {}; 1052 1053 { 1054 var printWarning = function (format) { 1055 for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { 1056 args[_key - 1] = arguments[_key]; 1057 } 1058 1059 var argIndex = 0; 1060 var message = 'Warning: ' + format.replace(/%s/g, function () { 1061 return args[argIndex++]; 1062 }); 1063 if (typeof console !== 'undefined') { 1064 console.warn(message); 1065 } 1066 try { 1067 // --- Welcome to debugging React --- 1068 // This error was thrown as a convenience so that you can use this stack 1069 // to find the callsite that caused this warning to fire. 1070 throw new Error(message); 1071 } catch (x) {} 1072 }; 1073 1074 lowPriorityWarning = function (condition, format) { 1075 if (format === undefined) { 1076 throw new Error('`warning(condition, format, ...args)` requires a warning ' + 'message argument'); 1077 } 1078 if (!condition) { 1079 for (var _len2 = arguments.length, args = Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) { 1080 args[_key2 - 2] = arguments[_key2]; 1081 } 1082 1083 printWarning.apply(undefined, [format].concat(args)); 1084 } 1085 }; 1086 } 1087 1088 var lowPriorityWarning$1 = lowPriorityWarning; 1089 1090 var didWarnStateUpdateForUnmountedComponent = {}; 1091 1092 function warnNoop(publicInstance, callerName) { 1093 { 1094 var constructor = publicInstance.constructor; 1095 var componentName = constructor && (constructor.displayName || constructor.name) || 'ReactClass'; 1096 var warningKey = componentName + '.' + callerName; 1097 if (didWarnStateUpdateForUnmountedComponent[warningKey]) { 1098 return; 1099 } 1100 warning(false, '%s(...): Can only update a mounted or mounting component. ' + 'This usually means you called %s() on an unmounted component. ' + 'This is a no-op.\n\nPlease check the code for the %s component.', callerName, callerName, componentName); 1101 didWarnStateUpdateForUnmountedComponent[warningKey] = true; 1102 } 1103 } 1104 1105 /** 1106 * This is the abstract API for an update queue. 1107 */ 1108 var ReactNoopUpdateQueue = { 1109 /** 1110 * Checks whether or not this composite component is mounted. 1111 * @param {ReactClass} publicInstance The instance we want to test. 1112 * @return {boolean} True if mounted, false otherwise. 1113 * @protected 1114 * @final 1115 */ 1116 isMounted: function (publicInstance) { 1117 return false; 1118 }, 1119 1120 /** 1121 * Forces an update. This should only be invoked when it is known with 1122 * certainty that we are **not** in a DOM transaction. 1123 * 1124 * You may want to call this when you know that some deeper aspect of the 1125 * component's state has changed but `setState` was not called. 1126 * 1127 * This will not invoke `shouldComponentUpdate`, but it will invoke 1128 * `componentWillUpdate` and `componentDidUpdate`. 1129 * 1130 * @param {ReactClass} publicInstance The instance that should rerender. 1131 * @param {?function} callback Called after component is updated. 1132 * @param {?string} callerName name of the calling function in the public API. 1133 * @internal 1134 */ 1135 enqueueForceUpdate: function (publicInstance, callback, callerName) { 1136 warnNoop(publicInstance, 'forceUpdate'); 1137 }, 1138 1139 /** 1140 * Replaces all of the state. Always use this or `setState` to mutate state. 1141 * You should treat `this.state` as immutable. 1142 * 1143 * There is no guarantee that `this.state` will be immediately updated, so 1144 * accessing `this.state` after calling this method may return the old value. 1145 * 1146 * @param {ReactClass} publicInstance The instance that should rerender. 1147 * @param {object} completeState Next state. 1148 * @param {?function} callback Called after component is updated. 1149 * @param {?string} callerName name of the calling function in the public API. 1150 * @internal 1151 */ 1152 enqueueReplaceState: function (publicInstance, completeState, callback, callerName) { 1153 warnNoop(publicInstance, 'replaceState'); 1154 }, 1155 1156 /** 1157 * Sets a subset of the state. This only exists because _pendingState is 1158 * internal. This provides a merging strategy that is not available to deep 1159 * properties which is confusing. TODO: Expose pendingState or don't use it 1160 * during the merge. 1161 * 1162 * @param {ReactClass} publicInstance The instance that should rerender. 1163 * @param {object} partialState Next partial state to be merged with state. 1164 * @param {?function} callback Called after component is updated. 1165 * @param {?string} Name of the calling function in the public API. 1166 * @internal 1167 */ 1168 enqueueSetState: function (publicInstance, partialState, callback, callerName) { 1169 warnNoop(publicInstance, 'setState'); 1170 } 1171 }; 1172 1173 /** 1174 * Base class helpers for the updating state of a component. 1175 */ 1176 function Component(props, context, updater) { 1177 this.props = props; 1178 this.context = context; 1179 this.refs = emptyObject; 1180 // We initialize the default updater but the real one gets injected by the 1181 // renderer. 1182 this.updater = updater || ReactNoopUpdateQueue; 1183 } 1184 1185 Component.prototype.isReactComponent = {}; 1186 1187 /** 1188 * Sets a subset of the state. Always use this to mutate 1189 * state. You should treat `this.state` as immutable. 1190 * 1191 * There is no guarantee that `this.state` will be immediately updated, so 1192 * accessing `this.state` after calling this method may return the old value. 1193 * 1194 * There is no guarantee that calls to `setState` will run synchronously, 1195 * as they may eventually be batched together. You can provide an optional 1196 * callback that will be executed when the call to setState is actually 1197 * completed. 1198 * 1199 * When a function is provided to setState, it will be called at some point in 1200 * the future (not synchronously). It will be called with the up to date 1201 * component arguments (state, props, context). These values can be different 1202 * from this.* because your function may be called after receiveProps but before 1203 * shouldComponentUpdate, and this new state, props, and context will not yet be 1204 * assigned to this. 1205 * 1206 * @param {object|function} partialState Next partial state or function to 1207 * produce next partial state to be merged with current state. 1208 * @param {?function} callback Called after state is updated. 1209 * @final 1210 * @protected 1211 */ 1212 Component.prototype.setState = function (partialState, callback) { 1213 !(typeof partialState === 'object' || typeof partialState === 'function' || partialState == null) ? invariant(false, 'setState(...): takes an object of state variables to update or a function which returns an object of state variables.') : void 0; 1214 this.updater.enqueueSetState(this, partialState, callback, 'setState'); 1215 }; 1216 1217 /** 1218 * Forces an update. This should only be invoked when it is known with 1219 * certainty that we are **not** in a DOM transaction. 1220 * 1221 * You may want to call this when you know that some deeper aspect of the 1222 * component's state has changed but `setState` was not called. 1223 * 1224 * This will not invoke `shouldComponentUpdate`, but it will invoke 1225 * `componentWillUpdate` and `componentDidUpdate`. 1226 * 1227 * @param {?function} callback Called after update is complete. 1228 * @final 1229 * @protected 1230 */ 1231 Component.prototype.forceUpdate = function (callback) { 1232 this.updater.enqueueForceUpdate(this, callback, 'forceUpdate'); 1233 }; 1234 1235 /** 1236 * Deprecated APIs. These APIs used to exist on classic React classes but since 1237 * we would like to deprecate them, we're not going to move them over to this 1238 * modern base class. Instead, we define a getter that warns if it's accessed. 1239 */ 1240 { 1241 var deprecatedAPIs = { 1242 isMounted: ['isMounted', 'Instead, make sure to clean up subscriptions and pending requests in ' + 'componentWillUnmount to prevent memory leaks.'], 1243 replaceState: ['replaceState', 'Refactor your code to use setState instead (see ' + 'https://github.com/facebook/react/issues/3236).'] 1244 }; 1245 var defineDeprecationWarning = function (methodName, info) { 1246 Object.defineProperty(Component.prototype, methodName, { 1247 get: function () { 1248 lowPriorityWarning$1(false, '%s(...) is deprecated in plain JavaScript React classes. %s', info[0], info[1]); 1249 return undefined; 1250 } 1251 }); 1252 }; 1253 for (var fnName in deprecatedAPIs) { 1254 if (deprecatedAPIs.hasOwnProperty(fnName)) { 1255 defineDeprecationWarning(fnName, deprecatedAPIs[fnName]); 1256 } 1257 } 1258 } 1259 1260 /** 1261 * Base class helpers for the updating state of a component. 1262 */ 1263 function PureComponent(props, context, updater) { 1264 // Duplicated from Component. 1265 this.props = props; 1266 this.context = context; 1267 this.refs = emptyObject; 1268 // We initialize the default updater but the real one gets injected by the 1269 // renderer. 1270 this.updater = updater || ReactNoopUpdateQueue; 1271 } 1272 1273 function ComponentDummy() {} 1274 ComponentDummy.prototype = Component.prototype; 1275 var pureComponentPrototype = PureComponent.prototype = new ComponentDummy(); 1276 pureComponentPrototype.constructor = PureComponent; 1277 // Avoid an extra prototype jump for these methods. 1278 _assign(pureComponentPrototype, Component.prototype); 1279 pureComponentPrototype.isPureReactComponent = true; 1280 1281 function AsyncComponent(props, context, updater) { 1282 // Duplicated from Component. 1283 this.props = props; 1284 this.context = context; 1285 this.refs = emptyObject; 1286 // We initialize the default updater but the real one gets injected by the 1287 // renderer. 1288 this.updater = updater || ReactNoopUpdateQueue; 1289 } 1290 1291 var asyncComponentPrototype = AsyncComponent.prototype = new ComponentDummy(); 1292 asyncComponentPrototype.constructor = AsyncComponent; 1293 // Avoid an extra prototype jump for these methods. 1294 _assign(asyncComponentPrototype, Component.prototype); 1295 asyncComponentPrototype.unstable_isAsyncReactComponent = true; 1296 asyncComponentPrototype.render = function () { 1297 return this.props.children; 1298 }; 1299 1300 /** 1301 * Keeps track of the current owner. 1302 * 1303 * The current owner is the component who should own any components that are 1304 * currently being constructed. 1305 */ 1306 var ReactCurrentOwner = { 1307 /** 1308 * @internal 1309 * @type {ReactComponent} 1310 */ 1311 current: null 1312 }; 1313 1314 var hasOwnProperty = Object.prototype.hasOwnProperty; 1315 1316 var RESERVED_PROPS = { 1317 key: true, 1318 ref: true, 1319 __self: true, 1320 __source: true 1321 }; 1322 1323 var specialPropKeyWarningShown; 1324 var specialPropRefWarningShown; 1325 1326 function hasValidRef(config) { 1327 { 1328 if (hasOwnProperty.call(config, 'ref')) { 1329 var getter = Object.getOwnPropertyDescriptor(config, 'ref').get; 1330 if (getter && getter.isReactWarning) { 1331 return false; 1332 } 1333 } 1334 } 1335 return config.ref !== undefined; 1336 } 1337 1338 function hasValidKey(config) { 1339 { 1340 if (hasOwnProperty.call(config, 'key')) { 1341 var getter = Object.getOwnPropertyDescriptor(config, 'key').get; 1342 if (getter && getter.isReactWarning) { 1343 return false; 1344 } 1345 } 1346 } 1347 return config.key !== undefined; 1348 } 1349 1350 function defineKeyPropWarningGetter(props, displayName) { 1351 var warnAboutAccessingKey = function () { 1352 if (!specialPropKeyWarningShown) { 1353 specialPropKeyWarningShown = true; 1354 warning(false, '%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://fb.me/react-special-props)', displayName); 1355 } 1356 }; 1357 warnAboutAccessingKey.isReactWarning = true; 1358 Object.defineProperty(props, 'key', { 1359 get: warnAboutAccessingKey, 1360 configurable: true 1361 }); 1362 } 1363 1364 function defineRefPropWarningGetter(props, displayName) { 1365 var warnAboutAccessingRef = function () { 1366 if (!specialPropRefWarningShown) { 1367 specialPropRefWarningShown = true; 1368 warning(false, '%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://fb.me/react-special-props)', displayName); 1369 } 1370 }; 1371 warnAboutAccessingRef.isReactWarning = true; 1372 Object.defineProperty(props, 'ref', { 1373 get: warnAboutAccessingRef, 1374 configurable: true 1375 }); 1376 } 1377 1378 /** 1379 * Factory method to create a new React element. This no longer adheres to 1380 * the class pattern, so do not use new to call it. Also, no instanceof check 1381 * will work. Instead test $$typeof field against Symbol.for('react.element') to check 1382 * if something is a React Element. 1383 * 1384 * @param {*} type 1385 * @param {*} key 1386 * @param {string|object} ref 1387 * @param {*} self A *temporary* helper to detect places where `this` is 1388 * different from the `owner` when React.createElement is called, so that we 1389 * can warn. We want to get rid of owner and replace string `ref`s with arrow 1390 * functions, and as long as `this` and owner are the same, there will be no 1391 * change in behavior. 1392 * @param {*} source An annotation object (added by a transpiler or otherwise) 1393 * indicating filename, line number, and/or other information. 1394 * @param {*} owner 1395 * @param {*} props 1396 * @internal 1397 */ 1398 var ReactElement = function (type, key, ref, self, source, owner, props) { 1399 var element = { 1400 // This tag allow us to uniquely identify this as a React Element 1401 $$typeof: REACT_ELEMENT_TYPE, 1402 1403 // Built-in properties that belong on the element 1404 type: type, 1405 key: key, 1406 ref: ref, 1407 props: props, 1408 1409 // Record the component responsible for creating this element. 1410 _owner: owner 1411 }; 1412 1413 { 1414 // The validation flag is currently mutative. We put it on 1415 // an external backing store so that we can freeze the whole object. 1416 // This can be replaced with a WeakMap once they are implemented in 1417 // commonly used development environments. 1418 element._store = {}; 1419 1420 // To make comparing ReactElements easier for testing purposes, we make 1421 // the validation flag non-enumerable (where possible, which should 1422 // include every environment we run tests in), so the test framework 1423 // ignores it. 1424 Object.defineProperty(element._store, 'validated', { 1425 configurable: false, 1426 enumerable: false, 1427 writable: true, 1428 value: false 1429 }); 1430 // self and source are DEV only properties. 1431 Object.defineProperty(element, '_self', { 1432 configurable: false, 1433 enumerable: false, 1434 writable: false, 1435 value: self 1436 }); 1437 // Two elements created in two different places should be considered 1438 // equal for testing purposes and therefore we hide it from enumeration. 1439 Object.defineProperty(element, '_source', { 1440 configurable: false, 1441 enumerable: false, 1442 writable: false, 1443 value: source 1444 }); 1445 if (Object.freeze) { 1446 Object.freeze(element.props); 1447 Object.freeze(element); 1448 } 1449 } 1450 1451 return element; 1452 }; 1453 1454 /** 1455 * Create and return a new ReactElement of the given type. 1456 * See https://reactjs.org/docs/react-api.html#createelement 1457 */ 1458 function createElement(type, config, children) { 1459 var propName; 1460 1461 // Reserved names are extracted 1462 var props = {}; 1463 1464 var key = null; 1465 var ref = null; 1466 var self = null; 1467 var source = null; 1468 1469 if (config != null) { 1470 if (hasValidRef(config)) { 1471 ref = config.ref; 1472 } 1473 if (hasValidKey(config)) { 1474 key = '' + config.key; 1475 } 1476 1477 self = config.__self === undefined ? null : config.__self; 1478 source = config.__source === undefined ? null : config.__source; 1479 // Remaining properties are added to a new props object 1480 for (propName in config) { 1481 if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) { 1482 props[propName] = config[propName]; 1483 } 1484 } 1485 } 1486 1487 // Children can be more than one argument, and those are transferred onto 1488 // the newly allocated props object. 1489 var childrenLength = arguments.length - 2; 1490 if (childrenLength === 1) { 1491 props.children = children; 1492 } else if (childrenLength > 1) { 1493 var childArray = Array(childrenLength); 1494 for (var i = 0; i < childrenLength; i++) { 1495 childArray[i] = arguments[i + 2]; 1496 } 1497 { 1498 if (Object.freeze) { 1499 Object.freeze(childArray); 1500 } 1501 } 1502 props.children = childArray; 1503 } 1504 1505 // Resolve default props 1506 if (type && type.defaultProps) { 1507 var defaultProps = type.defaultProps; 1508 for (propName in defaultProps) { 1509 if (props[propName] === undefined) { 1510 props[propName] = defaultProps[propName]; 1511 } 1512 } 1513 } 1514 { 1515 if (key || ref) { 1516 if (typeof props.$$typeof === 'undefined' || props.$$typeof !== REACT_ELEMENT_TYPE) { 1517 var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type; 1518 if (key) { 1519 defineKeyPropWarningGetter(props, displayName); 1520 } 1521 if (ref) { 1522 defineRefPropWarningGetter(props, displayName); 1523 } 1524 } 1525 } 1526 } 1527 return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props); 1528 } 1529 1530 /** 1531 * Return a function that produces ReactElements of a given type. 1532 * See https://reactjs.org/docs/react-api.html#createfactory 1533 */ 1534 1535 1536 function cloneAndReplaceKey(oldElement, newKey) { 1537 var newElement = ReactElement(oldElement.type, newKey, oldElement.ref, oldElement._self, oldElement._source, oldElement._owner, oldElement.props); 1538 1539 return newElement; 1540 } 1541 1542 /** 1543 * Clone and return a new ReactElement using element as the starting point. 1544 * See https://reactjs.org/docs/react-api.html#cloneelement 1545 */ 1546 function cloneElement(element, config, children) { 1547 var propName; 1548 1549 // Original props are copied 1550 var props = _assign({}, element.props); 1551 1552 // Reserved names are extracted 1553 var key = element.key; 1554 var ref = element.ref; 1555 // Self is preserved since the owner is preserved. 1556 var self = element._self; 1557 // Source is preserved since cloneElement is unlikely to be targeted by a 1558 // transpiler, and the original source is probably a better indicator of the 1559 // true owner. 1560 var source = element._source; 1561 1562 // Owner will be preserved, unless ref is overridden 1563 var owner = element._owner; 1564 1565 if (config != null) { 1566 if (hasValidRef(config)) { 1567 // Silently steal the ref from the parent. 1568 ref = config.ref; 1569 owner = ReactCurrentOwner.current; 1570 } 1571 if (hasValidKey(config)) { 1572 key = '' + config.key; 1573 } 1574 1575 // Remaining properties override existing props 1576 var defaultProps; 1577 if (element.type && element.type.defaultProps) { 1578 defaultProps = element.type.defaultProps; 1579 } 1580 for (propName in config) { 1581 if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) { 1582 if (config[propName] === undefined && defaultProps !== undefined) { 1583 // Resolve default props 1584 props[propName] = defaultProps[propName]; 1585 } else { 1586 props[propName] = config[propName]; 1587 } 1588 } 1589 } 1590 } 1591 1592 // Children can be more than one argument, and those are transferred onto 1593 // the newly allocated props object. 1594 var childrenLength = arguments.length - 2; 1595 if (childrenLength === 1) { 1596 props.children = children; 1597 } else if (childrenLength > 1) { 1598 var childArray = Array(childrenLength); 1599 for (var i = 0; i < childrenLength; i++) { 1600 childArray[i] = arguments[i + 2]; 1601 } 1602 props.children = childArray; 1603 } 1604 1605 return ReactElement(element.type, key, ref, self, source, owner, props); 1606 } 1607 1608 /** 1609 * Verifies the object is a ReactElement. 1610 * See https://reactjs.org/docs/react-api.html#isvalidelement 1611 * @param {?object} object 1612 * @return {boolean} True if `object` is a valid component. 1613 * @final 1614 */ 1615 function isValidElement(object) { 1616 return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE; 1617 } 1618 1619 var ReactDebugCurrentFrame = {}; 1620 1621 { 1622 // Component that is being worked on 1623 ReactDebugCurrentFrame.getCurrentStack = null; 1624 1625 ReactDebugCurrentFrame.getStackAddendum = function () { 1626 var impl = ReactDebugCurrentFrame.getCurrentStack; 1627 if (impl) { 1628 return impl(); 1629 } 1630 return null; 1631 }; 1632 } 1633 1634 var SEPARATOR = '.'; 1635 var SUBSEPARATOR = ':'; 1636 1637 /** 1638 * Escape and wrap key so it is safe to use as a reactid 1639 * 1640 * @param {string} key to be escaped. 1641 * @return {string} the escaped key. 1642 */ 1643 function escape(key) { 1644 var escapeRegex = /[=:]/g; 1645 var escaperLookup = { 1646 '=': '=0', 1647 ':': '=2' 1648 }; 1649 var escapedString = ('' + key).replace(escapeRegex, function (match) { 1650 return escaperLookup[match]; 1651 }); 1652 1653 return '$' + escapedString; 1654 } 1655 1656 /** 1657 * TODO: Test that a single child and an array with one item have the same key 1658 * pattern. 1659 */ 1660 1661 var didWarnAboutMaps = false; 1662 1663 var userProvidedKeyEscapeRegex = /\/+/g; 1664 function escapeUserProvidedKey(text) { 1665 return ('' + text).replace(userProvidedKeyEscapeRegex, '$&/'); 1666 } 1667 1668 var POOL_SIZE = 10; 1669 var traverseContextPool = []; 1670 function getPooledTraverseContext(mapResult, keyPrefix, mapFunction, mapContext) { 1671 if (traverseContextPool.length) { 1672 var traverseContext = traverseContextPool.pop(); 1673 traverseContext.result = mapResult; 1674 traverseContext.keyPrefix = keyPrefix; 1675 traverseContext.func = mapFunction; 1676 traverseContext.context = mapContext; 1677 traverseContext.count = 0; 1678 return traverseContext; 1679 } else { 1680 return { 1681 result: mapResult, 1682 keyPrefix: keyPrefix, 1683 func: mapFunction, 1684 context: mapContext, 1685 count: 0 1686 }; 1687 } 1688 } 1689 1690 function releaseTraverseContext(traverseContext) { 1691 traverseContext.result = null; 1692 traverseContext.keyPrefix = null; 1693 traverseContext.func = null; 1694 traverseContext.context = null; 1695 traverseContext.count = 0; 1696 if (traverseContextPool.length < POOL_SIZE) { 1697 traverseContextPool.push(traverseContext); 1698 } 1699 } 1700 1701 /** 1702 * @param {?*} children Children tree container. 1703 * @param {!string} nameSoFar Name of the key path so far. 1704 * @param {!function} callback Callback to invoke with each child found. 1705 * @param {?*} traverseContext Used to pass information throughout the traversal 1706 * process. 1707 * @return {!number} The number of children in this subtree. 1708 */ 1709 function traverseAllChildrenImpl(children, nameSoFar, callback, traverseContext) { 1710 var type = typeof children; 1711 1712 if (type === 'undefined' || type === 'boolean') { 1713 // All of the above are perceived as null. 1714 children = null; 1715 } 1716 1717 var invokeCallback = false; 1718 1719 if (children === null) { 1720 invokeCallback = true; 1721 } else { 1722 switch (type) { 1723 case 'string': 1724 case 'number': 1725 invokeCallback = true; 1726 break; 1727 case 'object': 1728 switch (children.$$typeof) { 1729 case REACT_ELEMENT_TYPE: 1730 case REACT_CALL_TYPE: 1731 case REACT_RETURN_TYPE: 1732 case REACT_PORTAL_TYPE: 1733 invokeCallback = true; 1734 } 1735 } 1736 } 1737 1738 if (invokeCallback) { 1739 callback(traverseContext, children, 1740 // If it's the only child, treat the name as if it was wrapped in an array 1741 // so that it's consistent if the number of children grows. 1742 nameSoFar === '' ? SEPARATOR + getComponentKey(children, 0) : nameSoFar); 1743 return 1; 1744 } 1745 1746 var child; 1747 var nextName; 1748 var subtreeCount = 0; // Count of children found in the current subtree. 1749 var nextNamePrefix = nameSoFar === '' ? SEPARATOR : nameSoFar + SUBSEPARATOR; 1750 1751 if (Array.isArray(children)) { 1752 for (var i = 0; i < children.length; i++) { 1753 child = children[i]; 1754 nextName = nextNamePrefix + getComponentKey(child, i); 1755 subtreeCount += traverseAllChildrenImpl(child, nextName, callback, traverseContext); 1756 } 1757 } else { 1758 var iteratorFn = getIteratorFn(children); 1759 if (typeof iteratorFn === 'function') { 1760 { 1761 // Warn about using Maps as children 1762 if (iteratorFn === children.entries) { 1763 warning(didWarnAboutMaps, 'Using Maps as children is unsupported and will likely yield ' + 'unexpected results. Convert it to a sequence/iterable of keyed ' + 'ReactElements instead.%s', ReactDebugCurrentFrame.getStackAddendum()); 1764 didWarnAboutMaps = true; 1765 } 1766 } 1767 1768 var iterator = iteratorFn.call(children); 1769 var step; 1770 var ii = 0; 1771 while (!(step = iterator.next()).done) { 1772 child = step.value; 1773 nextName = nextNamePrefix + getComponentKey(child, ii++); 1774 subtreeCount += traverseAllChildrenImpl(child, nextName, callback, traverseContext); 1775 } 1776 } else if (type === 'object') { 1777 var addendum = ''; 1778 { 1779 addendum = ' If you meant to render a collection of children, use an array ' + 'instead.' + ReactDebugCurrentFrame.getStackAddendum(); 1780 } 1781 var childrenString = '' + children; 1782 invariant(false, 'Objects are not valid as a React child (found: %s).%s', childrenString === '[object Object]' ? 'object with keys {' + Object.keys(children).join(', ') + '}' : childrenString, addendum); 1783 } 1784 } 1785 1786 return subtreeCount; 1787 } 1788 1789 /** 1790 * Traverses children that are typically specified as `props.children`, but 1791 * might also be specified through attributes: 1792 * 1793 * - `traverseAllChildren(this.props.children, ...)` 1794 * - `traverseAllChildren(this.props.leftPanelChildren, ...)` 1795 * 1796 * The `traverseContext` is an optional argument that is passed through the 1797 * entire traversal. It can be used to store accumulations or anything else that 1798 * the callback might find relevant. 1799 * 1800 * @param {?*} children Children tree object. 1801 * @param {!function} callback To invoke upon traversing each child. 1802 * @param {?*} traverseContext Context for traversal. 1803 * @return {!number} The number of children in this subtree. 1804 */ 1805 function traverseAllChildren(children, callback, traverseContext) { 1806 if (children == null) { 1807 return 0; 1808 } 1809 1810 return traverseAllChildrenImpl(children, '', callback, traverseContext); 1811 } 1812 1813 /** 1814 * Generate a key string that identifies a component within a set. 1815 * 1816 * @param {*} component A component that could contain a manual key. 1817 * @param {number} index Index that is used if a manual key is not provided. 1818 * @return {string} 1819 */ 1820 function getComponentKey(component, index) { 1821 // Do some typechecking here since we call this blindly. We want to ensure 1822 // that we don't block potential future ES APIs. 1823 if (typeof component === 'object' && component !== null && component.key != null) { 1824 // Explicit key 1825 return escape(component.key); 1826 } 1827 // Implicit key determined by the index in the set 1828 return index.toString(36); 1829 } 1830 1831 function forEachSingleChild(bookKeeping, child, name) { 1832 var func = bookKeeping.func, 1833 context = bookKeeping.context; 1834 1835 func.call(context, child, bookKeeping.count++); 1836 } 1837 1838 /** 1839 * Iterates through children that are typically specified as `props.children`. 1840 * 1841 * See https://reactjs.org/docs/react-api.html#react.children.foreach 1842 * 1843 * The provided forEachFunc(child, index) will be called for each 1844 * leaf child. 1845 * 1846 * @param {?*} children Children tree container. 1847 * @param {function(*, int)} forEachFunc 1848 * @param {*} forEachContext Context for forEachContext. 1849 */ 1850 function forEachChildren(children, forEachFunc, forEachContext) { 1851 if (children == null) { 1852 return children; 1853 } 1854 var traverseContext = getPooledTraverseContext(null, null, forEachFunc, forEachContext); 1855 traverseAllChildren(children, forEachSingleChild, traverseContext); 1856 releaseTraverseContext(traverseContext); 1857 } 1858 1859 function mapSingleChildIntoContext(bookKeeping, child, childKey) { 1860 var result = bookKeeping.result, 1861 keyPrefix = bookKeeping.keyPrefix, 1862 func = bookKeeping.func, 1863 context = bookKeeping.context; 1864 1865 1866 var mappedChild = func.call(context, child, bookKeeping.count++); 1867 if (Array.isArray(mappedChild)) { 1868 mapIntoWithKeyPrefixInternal(mappedChild, result, childKey, emptyFunction.thatReturnsArgument); 1869 } else if (mappedChild != null) { 1870 if (isValidElement(mappedChild)) { 1871 mappedChild = cloneAndReplaceKey(mappedChild, 1872 // Keep both the (mapped) and old keys if they differ, just as 1873 // traverseAllChildren used to do for objects as children 1874 keyPrefix + (mappedChild.key && (!child || child.key !== mappedChild.key) ? escapeUserProvidedKey(mappedChild.key) + '/' : '') + childKey); 1875 } 1876 result.push(mappedChild); 1877 } 1878 } 1879 1880 function mapIntoWithKeyPrefixInternal(children, array, prefix, func, context) { 1881 var escapedPrefix = ''; 1882 if (prefix != null) { 1883 escapedPrefix = escapeUserProvidedKey(prefix) + '/'; 1884 } 1885 var traverseContext = getPooledTraverseContext(array, escapedPrefix, func, context); 1886 traverseAllChildren(children, mapSingleChildIntoContext, traverseContext); 1887 releaseTraverseContext(traverseContext); 1888 } 1889 1890 /** 1891 * Maps children that are typically specified as `props.children`. 1892 * 1893 * See https://reactjs.org/docs/react-api.html#react.children.map 1894 * 1895 * The provided mapFunction(child, key, index) will be called for each 1896 * leaf child. 1897 * 1898 * @param {?*} children Children tree container. 1899 * @param {function(*, int)} func The map function. 1900 * @param {*} context Context for mapFunction. 1901 * @return {object} Object containing the ordered map of results. 1902 */ 1903 function mapChildren(children, func, context) { 1904 if (children == null) { 1905 return children; 1906 } 1907 var result = []; 1908 mapIntoWithKeyPrefixInternal(children, result, null, func, context); 1909 return result; 1910 } 1911 1912 /** 1913 * Count the number of children that are typically specified as 1914 * `props.children`. 1915 * 1916 * See https://reactjs.org/docs/react-api.html#react.children.count 1917 * 1918 * @param {?*} children Children tree container. 1919 * @return {number} The number of children. 1920 */ 1921 function countChildren(children, context) { 1922 return traverseAllChildren(children, emptyFunction.thatReturnsNull, null); 1923 } 1924 1925 /** 1926 * Flatten a children object (typically specified as `props.children`) and 1927 * return an array with appropriately re-keyed children. 1928 * 1929 * See https://reactjs.org/docs/react-api.html#react.children.toarray 1930 */ 1931 function toArray(children) { 1932 var result = []; 1933 mapIntoWithKeyPrefixInternal(children, result, null, emptyFunction.thatReturnsArgument); 1934 return result; 1935 } 1936 1937 /** 1938 * Returns the first child in a collection of children and verifies that there 1939 * is only one child in the collection. 1940 * 1941 * See https://reactjs.org/docs/react-api.html#react.children.only 1942 * 1943 * The current implementation of this function assumes that a single child gets 1944 * passed without a wrapper, but the purpose of this helper function is to 1945 * abstract away the particular structure of children. 1946 * 1947 * @param {?object} children Child collection structure. 1948 * @return {ReactElement} The first and only `ReactElement` contained in the 1949 * structure. 1950 */ 1951 function onlyChild(children) { 1952 !isValidElement(children) ? invariant(false, 'React.Children.only expected to receive a single React element child.') : void 0; 1953 return children; 1954 } 1955 1956 var describeComponentFrame = function (name, source, ownerName) { 1957 return '\n in ' + (name || 'Unknown') + (source ? ' (at ' + source.fileName.replace(/^.*[\\\/]/, '') + ':' + source.lineNumber + ')' : ownerName ? ' (created by ' + ownerName + ')' : ''); 1958 }; 1959 1960 function getComponentName(fiber) { 1961 var type = fiber.type; 1962 1963 if (typeof type === 'string') { 1964 return type; 1965 } 1966 if (typeof type === 'function') { 1967 return type.displayName || type.name; 1968 } 1969 return null; 1970 } 1971 1972 /** 1973 * ReactElementValidator provides a wrapper around a element factory 1974 * which validates the props passed to the element. This is intended to be 1975 * used only in DEV and could be replaced by a static type checker for languages 1976 * that support it. 1977 */ 1978 1979 { 1980 var currentlyValidatingElement = null; 1981 1982 var propTypesMisspellWarningShown = false; 1983 1984 var getDisplayName = function (element) { 1985 if (element == null) { 1986 return '#empty'; 1987 } else if (typeof element === 'string' || typeof element === 'number') { 1988 return '#text'; 1989 } else if (typeof element.type === 'string') { 1990 return element.type; 1991 } else if (element.type === REACT_FRAGMENT_TYPE) { 1992 return 'React.Fragment'; 1993 } else { 1994 return element.type.displayName || element.type.name || 'Unknown'; 1995 } 1996 }; 1997 1998 var getStackAddendum = function () { 1999 var stack = ''; 2000 if (currentlyValidatingElement) { 2001 var name = getDisplayName(currentlyValidatingElement); 2002 var owner = currentlyValidatingElement._owner; 2003 stack += describeComponentFrame(name, currentlyValidatingElement._source, owner && getComponentName(owner)); 2004 } 2005 stack += ReactDebugCurrentFrame.getStackAddendum() || ''; 2006 return stack; 2007 }; 2008 2009 var VALID_FRAGMENT_PROPS = new Map([['children', true], ['key', true]]); 2010 } 2011 2012 function getDeclarationErrorAddendum() { 2013 if (ReactCurrentOwner.current) { 2014 var name = getComponentName(ReactCurrentOwner.current); 2015 if (name) { 2016 return '\n\nCheck the render method of `' + name + '`.'; 2017 } 2018 } 2019 return ''; 2020 } 2021 2022 function getSourceInfoErrorAddendum(elementProps) { 2023 if (elementProps !== null && elementProps !== undefined && elementProps.__source !== undefined) { 2024 var source = elementProps.__source; 2025 var fileName = source.fileName.replace(/^.*[\\\/]/, ''); 2026 var lineNumber = source.lineNumber; 2027 return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.'; 2028 } 2029 return ''; 2030 } 2031 2032 /** 2033 * Warn if there's no key explicitly set on dynamic arrays of children or 2034 * object keys are not valid. This allows us to keep track of children between 2035 * updates. 2036 */ 2037 var ownerHasKeyUseWarning = {}; 2038 2039 function getCurrentComponentErrorInfo(parentType) { 2040 var info = getDeclarationErrorAddendum(); 2041 2042 if (!info) { 2043 var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name; 2044 if (parentName) { 2045 info = '\n\nCheck the top-level render call using <' + parentName + '>.'; 2046 } 2047 } 2048 return info; 2049 } 2050 2051 /** 2052 * Warn if the element doesn't have an explicit key assigned to it. 2053 * This element is in an array. The array could grow and shrink or be 2054 * reordered. All children that haven't already been validated are required to 2055 * have a "key" property assigned to it. Error statuses are cached so a warning 2056 * will only be shown once. 2057 * 2058 * @internal 2059 * @param {ReactElement} element Element that requires a key. 2060 * @param {*} parentType element's parent's type. 2061 */ 2062 function validateExplicitKey(element, parentType) { 2063 if (!element._store || element._store.validated || element.key != null) { 2064 return; 2065 } 2066 element._store.validated = true; 2067 2068 var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType); 2069 if (ownerHasKeyUseWarning[currentComponentErrorInfo]) { 2070 return; 2071 } 2072 ownerHasKeyUseWarning[currentComponentErrorInfo] = true; 2073 2074 // Usually the current owner is the offender, but if it accepts children as a 2075 // property, it may be the creator of the child that's responsible for 2076 // assigning it a key. 2077 var childOwner = ''; 2078 if (element && element._owner && element._owner !== ReactCurrentOwner.current) { 2079 // Give the component that originally created this child. 2080 childOwner = ' It was passed a child from ' + getComponentName(element._owner) + '.'; 2081 } 2082 2083 currentlyValidatingElement = element; 2084 { 2085 warning(false, 'Each child in an array or iterator should have a unique "key" prop.' + '%s%s See https://fb.me/react-warning-keys for more information.%s', currentComponentErrorInfo, childOwner, getStackAddendum()); 2086 } 2087 currentlyValidatingElement = null; 2088 } 2089 2090 /** 2091 * Ensure that every element either is passed in a static location, in an 2092 * array with an explicit keys property defined, or in an object literal 2093 * with valid key property. 2094 * 2095 * @internal 2096 * @param {ReactNode} node Statically passed child of any type. 2097 * @param {*} parentType node's parent's type. 2098 */ 2099 function validateChildKeys(node, parentType) { 2100 if (typeof node !== 'object') { 2101 return; 2102 } 2103 if (Array.isArray(node)) { 2104 for (var i = 0; i < node.length; i++) { 2105 var child = node[i]; 2106 if (isValidElement(child)) { 2107 validateExplicitKey(child, parentType); 2108 } 2109 } 2110 } else if (isValidElement(node)) { 2111 // This element was passed in a valid location. 2112 if (node._store) { 2113 node._store.validated = true; 2114 } 2115 } else if (node) { 2116 var iteratorFn = getIteratorFn(node); 2117 if (typeof iteratorFn === 'function') { 2118 // Entry iterators used to provide implicit keys, 2119 // but now we print a separate warning for them later. 2120 if (iteratorFn !== node.entries) { 2121 var iterator = iteratorFn.call(node); 2122 var step; 2123 while (!(step = iterator.next()).done) { 2124 if (isValidElement(step.value)) { 2125 validateExplicitKey(step.value, parentType); 2126 } 2127 } 2128 } 2129 } 2130 } 2131 } 2132 2133 /** 2134 * Given an element, validate that its props follow the propTypes definition, 2135 * provided by the type. 2136 * 2137 * @param {ReactElement} element 2138 */ 2139 function validatePropTypes(element) { 2140 var componentClass = element.type; 2141 if (typeof componentClass !== 'function') { 2142 return; 2143 } 2144 var name = componentClass.displayName || componentClass.name; 2145 var propTypes = componentClass.propTypes; 2146 if (propTypes) { 2147 currentlyValidatingElement = element; 2148 checkPropTypes(propTypes, element.props, 'prop', name, getStackAddendum); 2149 currentlyValidatingElement = null; 2150 } else if (componentClass.PropTypes !== undefined && !propTypesMisspellWarningShown) { 2151 propTypesMisspellWarningShown = true; 2152 warning(false, 'Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', name || 'Unknown'); 2153 } 2154 if (typeof componentClass.getDefaultProps === 'function') { 2155 warning(componentClass.getDefaultProps.isReactClassApproved, 'getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.'); 2156 } 2157 } 2158 2159 /** 2160 * Given a fragment, validate that it can only be provided with fragment props 2161 * @param {ReactElement} fragment 2162 */ 2163 function validateFragmentProps(fragment) { 2164 currentlyValidatingElement = fragment; 2165 2166 var _iteratorNormalCompletion = true; 2167 var _didIteratorError = false; 2168 var _iteratorError = undefined; 2169 2170 try { 2171 for (var _iterator = Object.keys(fragment.props)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { 2172 var key = _step.value; 2173 2174 if (!VALID_FRAGMENT_PROPS.has(key)) { 2175 warning(false, 'Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.%s', key, getStackAddendum()); 2176 break; 2177 } 2178 } 2179 } catch (err) { 2180 _didIteratorError = true; 2181 _iteratorError = err; 2182 } finally { 2183 try { 2184 if (!_iteratorNormalCompletion && _iterator['return']) { 2185 _iterator['return'](); 2186 } 2187 } finally { 2188 if (_didIteratorError) { 2189 throw _iteratorError; 2190 } 2191 } 2192 } 2193 2194 if (fragment.ref !== null) { 2195 warning(false, 'Invalid attribute `ref` supplied to `React.Fragment`.%s', getStackAddendum()); 2196 } 2197 2198 currentlyValidatingElement = null; 2199 } 2200 2201 function createElementWithValidation(type, props, children) { 2202 var validType = typeof type === 'string' || typeof type === 'function' || typeof type === 'symbol' || typeof type === 'number'; 2203 // We warn in this case but don't throw. We expect the element creation to 2204 // succeed and there will likely be errors in render. 2205 if (!validType) { 2206 var info = ''; 2207 if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) { 2208 info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports."; 2209 } 2210 2211 var sourceInfo = getSourceInfoErrorAddendum(props); 2212 if (sourceInfo) { 2213 info += sourceInfo; 2214 } else { 2215 info += getDeclarationErrorAddendum(); 2216 } 2217 2218 info += getStackAddendum() || ''; 2219 2220 warning(false, 'React.createElement: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', type == null ? type : typeof type, info); 2221 } 2222 2223 var element = createElement.apply(this, arguments); 2224 2225 // The result can be nullish if a mock or a custom function is used. 2226 // TODO: Drop this when these are no longer allowed as the type argument. 2227 if (element == null) { 2228 return element; 2229 } 2230 2231 // Skip key warning if the type isn't valid since our key validation logic 2232 // doesn't expect a non-string/function type and can throw confusing errors. 2233 // We don't want exception behavior to differ between dev and prod. 2234 // (Rendering will throw with a helpful message and as soon as the type is 2235 // fixed, the key warnings will appear.) 2236 if (validType) { 2237 for (var i = 2; i < arguments.length; i++) { 2238 validateChildKeys(arguments[i], type); 2239 } 2240 } 2241 2242 if (typeof type === 'symbol' && type === REACT_FRAGMENT_TYPE) { 2243 validateFragmentProps(element); 2244 } else { 2245 validatePropTypes(element); 2246 } 2247 2248 return element; 2249 } 2250 2251 function createFactoryWithValidation(type) { 2252 var validatedFactory = createElementWithValidation.bind(null, type); 2253 // Legacy hook TODO: Warn if this is accessed 2254 validatedFactory.type = type; 2255 2256 { 2257 Object.defineProperty(validatedFactory, 'type', { 2258 enumerable: false, 2259 get: function () { 2260 lowPriorityWarning$1(false, 'Factory.type is deprecated. Access the class directly ' + 'before passing it to createFactory.'); 2261 Object.defineProperty(this, 'type', { 2262 value: type 2263 }); 2264 return type; 2265 } 2266 }); 2267 } 2268 2269 return validatedFactory; 2270 } 2271 2272 function cloneElementWithValidation(element, props, children) { 2273 var newElement = cloneElement.apply(this, arguments); 2274 for (var i = 2; i < arguments.length; i++) { 2275 validateChildKeys(arguments[i], newElement.type); 2276 } 2277 validatePropTypes(newElement); 2278 return newElement; 2279 } 2280 2281 var React = { 2282 Children: { 2283 map: mapChildren, 2284 forEach: forEachChildren, 2285 count: countChildren, 2286 toArray: toArray, 2287 only: onlyChild 2288 }, 2289 2290 Component: Component, 2291 PureComponent: PureComponent, 2292 unstable_AsyncComponent: AsyncComponent, 2293 2294 Fragment: REACT_FRAGMENT_TYPE, 2295 2296 createElement: createElementWithValidation, 2297 cloneElement: cloneElementWithValidation, 2298 createFactory: createFactoryWithValidation, 2299 isValidElement: isValidElement, 2300 2301 version: ReactVersion, 2302 2303 __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: { 2304 ReactCurrentOwner: ReactCurrentOwner, 2305 // Used by renderers to avoid bundling object-assign twice in UMD bundles: 2306 assign: _assign 2307 } 2308 }; 2309 2310 { 2311 _assign(React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, { 2312 // These should not be included in production. 2313 ReactDebugCurrentFrame: ReactDebugCurrentFrame, 2314 // Shim for React DOM 16.0.0 which still destructured (but not used) this. 2315 // TODO: remove in React 17.0. 2316 ReactComponentTreeHook: {} 2317 }); 2318 } 2319 2320 2321 2322 var React$2 = Object.freeze({ 2323 default: React 2324 }); 2325 2326 var React$3 = ( React$2 && React ) || React$2; 2327 2328 // TODO: decide on the top-level export form. 2329 // This is hacky but makes it work with both Rollup and Jest. 2330 var react = React$3['default'] ? React$3['default'] : React$3; 2331 2332 module.exports = react; 2333 })(); 2334 } 2335 2336 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 2337 2338 /***/ }), 2339 /* 17 */ 2340 /***/ (function(module, exports, __webpack_require__) { 2341 2342 "use strict"; 2343 /** 2344 * Copyright (c) 2013-present, Facebook, Inc. 2345 * 2346 * This source code is licensed under the MIT license found in the 2347 * LICENSE file in the root directory of this source tree. 2348 */ 2349 2350 2351 2352 var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED'; 2353 2354 module.exports = ReactPropTypesSecret; 2355 2356 2357 /***/ }), 2358 /* 18 */ 2359 /***/ (function(module, exports, __webpack_require__) { 2360 2361 "use strict"; 2362 /* WEBPACK VAR INJECTION */(function(process) { 2363 2364 function checkDCE() { 2365 /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ 2366 if ( 2367 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined' || 2368 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE !== 'function' 2369 ) { 2370 return; 2371 } 2372 if (process.env.NODE_ENV !== 'production') { 2373 // This branch is unreachable because this function is only called 2374 // in production, but the condition is true only in development. 2375 // Therefore if the branch is still here, dead code elimination wasn't 2376 // properly applied. 2377 // Don't change the message. React DevTools relies on it. Also make sure 2378 // this message doesn't occur elsewhere in this function, or it will cause 2379 // a false positive. 2380 throw new Error('^_^'); 2381 } 2382 try { 2383 // Verify that the code above has been dead code eliminated (DCE'd). 2384 __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(checkDCE); 2385 } catch (err) { 2386 // DevTools shouldn't crash React, no matter what. 2387 // We should still report in case we break this code. 2388 console.error(err); 2389 } 2390 } 2391 2392 if (process.env.NODE_ENV === 'production') { 2393 // DCE check should happen before ReactDOM bundle executes so that 2394 // DevTools can report bad minification during injection. 2395 checkDCE(); 2396 module.exports = __webpack_require__(19); 2397 } else { 2398 module.exports = __webpack_require__(22); 2399 } 2400 2401 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 2402 2403 /***/ }), 2404 /* 19 */ 2405 /***/ (function(module, exports, __webpack_require__) { 2406 2407 "use strict"; 2408 /** @license React v16.2.0 2409 * react-dom.production.min.js 2410 * 2411 * Copyright (c) 2013-present, Facebook, Inc. 2412 * 2413 * This source code is licensed under the MIT license found in the 2414 * LICENSE file in the root directory of this source tree. 2415 */ 2416 2417 /* 2418 Modernizr 3.0.0pre (Custom Build) | MIT 2419 */ 2420 var aa=__webpack_require__(4),l=__webpack_require__(8),B=__webpack_require__(2),C=__webpack_require__(1),ba=__webpack_require__(9),da=__webpack_require__(10),ea=__webpack_require__(11),fa=__webpack_require__(12),ia=__webpack_require__(13),D=__webpack_require__(3); 2421 function E(a){for(var b=arguments.length-1,c="Minified React error #"+a+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant\x3d"+a,d=0;d<b;d++)c+="\x26args[]\x3d"+encodeURIComponent(arguments[d+1]);b=Error(c+" for the full message or use the non-minified dev environment for full errors and additional helpful warnings.");b.name="Invariant Violation";b.framesToPop=1;throw b;}aa?void 0:E("227"); 2422 var oa={children:!0,dangerouslySetInnerHTML:!0,defaultValue:!0,defaultChecked:!0,innerHTML:!0,suppressContentEditableWarning:!0,suppressHydrationWarning:!0,style:!0};function pa(a,b){return(a&b)===b} 2423 var ta={MUST_USE_PROPERTY:1,HAS_BOOLEAN_VALUE:4,HAS_NUMERIC_VALUE:8,HAS_POSITIVE_NUMERIC_VALUE:24,HAS_OVERLOADED_BOOLEAN_VALUE:32,HAS_STRING_BOOLEAN_VALUE:64,injectDOMPropertyConfig:function(a){var b=ta,c=a.Properties||{},d=a.DOMAttributeNamespaces||{},e=a.DOMAttributeNames||{};a=a.DOMMutationMethods||{};for(var f in c){ua.hasOwnProperty(f)?E("48",f):void 0;var g=f.toLowerCase(),h=c[f];g={attributeName:g,attributeNamespace:null,propertyName:f,mutationMethod:null,mustUseProperty:pa(h,b.MUST_USE_PROPERTY), 2424 hasBooleanValue:pa(h,b.HAS_BOOLEAN_VALUE),hasNumericValue:pa(h,b.HAS_NUMERIC_VALUE),hasPositiveNumericValue:pa(h,b.HAS_POSITIVE_NUMERIC_VALUE),hasOverloadedBooleanValue:pa(h,b.HAS_OVERLOADED_BOOLEAN_VALUE),hasStringBooleanValue:pa(h,b.HAS_STRING_BOOLEAN_VALUE)};1>=g.hasBooleanValue+g.hasNumericValue+g.hasOverloadedBooleanValue?void 0:E("50",f);e.hasOwnProperty(f)&&(g.attributeName=e[f]);d.hasOwnProperty(f)&&(g.attributeNamespace=d[f]);a.hasOwnProperty(f)&&(g.mutationMethod=a[f]);ua[f]=g}}},ua={}; 2425 function va(a,b){if(oa.hasOwnProperty(a)||2<a.length&&("o"===a[0]||"O"===a[0])&&("n"===a[1]||"N"===a[1]))return!1;if(null===b)return!0;switch(typeof b){case "boolean":return oa.hasOwnProperty(a)?a=!0:(b=wa(a))?a=b.hasBooleanValue||b.hasStringBooleanValue||b.hasOverloadedBooleanValue:(a=a.toLowerCase().slice(0,5),a="data-"===a||"aria-"===a),a;case "undefined":case "number":case "string":case "object":return!0;default:return!1}}function wa(a){return ua.hasOwnProperty(a)?ua[a]:null} 2426 var xa=ta,ya=xa.MUST_USE_PROPERTY,K=xa.HAS_BOOLEAN_VALUE,za=xa.HAS_NUMERIC_VALUE,Aa=xa.HAS_POSITIVE_NUMERIC_VALUE,Ba=xa.HAS_OVERLOADED_BOOLEAN_VALUE,Ca=xa.HAS_STRING_BOOLEAN_VALUE,Da={Properties:{allowFullScreen:K,async:K,autoFocus:K,autoPlay:K,capture:Ba,checked:ya|K,cols:Aa,contentEditable:Ca,controls:K,"default":K,defer:K,disabled:K,download:Ba,draggable:Ca,formNoValidate:K,hidden:K,loop:K,multiple:ya|K,muted:ya|K,noValidate:K,open:K,playsInline:K,readOnly:K,required:K,reversed:K,rows:Aa,rowSpan:za, 2427 scoped:K,seamless:K,selected:ya|K,size:Aa,start:za,span:Aa,spellCheck:Ca,style:0,tabIndex:0,itemScope:K,acceptCharset:0,className:0,htmlFor:0,httpEquiv:0,value:Ca},DOMAttributeNames:{acceptCharset:"accept-charset",className:"class",htmlFor:"for",httpEquiv:"http-equiv"},DOMMutationMethods:{value:function(a,b){if(null==b)return a.removeAttribute("value");"number"!==a.type||!1===a.hasAttribute("value")?a.setAttribute("value",""+b):a.validity&&!a.validity.badInput&&a.ownerDocument.activeElement!==a&& 2428 a.setAttribute("value",""+b)}}},Ea=xa.HAS_STRING_BOOLEAN_VALUE,M={xlink:"http://www.w3.org/1999/xlink",xml:"http://www.w3.org/XML/1998/namespace"},Ga={Properties:{autoReverse:Ea,externalResourcesRequired:Ea,preserveAlpha:Ea},DOMAttributeNames:{autoReverse:"autoReverse",externalResourcesRequired:"externalResourcesRequired",preserveAlpha:"preserveAlpha"},DOMAttributeNamespaces:{xlinkActuate:M.xlink,xlinkArcrole:M.xlink,xlinkHref:M.xlink,xlinkRole:M.xlink,xlinkShow:M.xlink,xlinkTitle:M.xlink,xlinkType:M.xlink, 2429 xmlBase:M.xml,xmlLang:M.xml,xmlSpace:M.xml}},Ha=/[\-\:]([a-z])/g;function Ia(a){return a[1].toUpperCase()} 2430 "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 x-height xlink:actuate xlink:arcrole xlink:href xlink:role xlink:show xlink:title xlink:type xml:base xmlns:xlink xml:lang xml:space".split(" ").forEach(function(a){var b=a.replace(Ha, 2431 Ia);Ga.Properties[b]=0;Ga.DOMAttributeNames[b]=a});xa.injectDOMPropertyConfig(Da);xa.injectDOMPropertyConfig(Ga); 2432 var P={_caughtError:null,_hasCaughtError:!1,_rethrowError:null,_hasRethrowError:!1,injection:{injectErrorUtils:function(a){"function"!==typeof a.invokeGuardedCallback?E("197"):void 0;Ja=a.invokeGuardedCallback}},invokeGuardedCallback:function(a,b,c,d,e,f,g,h,k){Ja.apply(P,arguments)},invokeGuardedCallbackAndCatchFirstError:function(a,b,c,d,e,f,g,h,k){P.invokeGuardedCallback.apply(this,arguments);if(P.hasCaughtError()){var q=P.clearCaughtError();P._hasRethrowError||(P._hasRethrowError=!0,P._rethrowError= 2433 q)}},rethrowCaughtError:function(){return Ka.apply(P,arguments)},hasCaughtError:function(){return P._hasCaughtError},clearCaughtError:function(){if(P._hasCaughtError){var a=P._caughtError;P._caughtError=null;P._hasCaughtError=!1;return a}E("198")}};function Ja(a,b,c,d,e,f,g,h,k){P._hasCaughtError=!1;P._caughtError=null;var q=Array.prototype.slice.call(arguments,3);try{b.apply(c,q)}catch(v){P._caughtError=v,P._hasCaughtError=!0}} 2434 function Ka(){if(P._hasRethrowError){var a=P._rethrowError;P._rethrowError=null;P._hasRethrowError=!1;throw a;}}var La=null,Ma={}; 2435 function Na(){if(La)for(var a in Ma){var b=Ma[a],c=La.indexOf(a);-1<c?void 0:E("96",a);if(!Oa[c]){b.extractEvents?void 0:E("97",a);Oa[c]=b;c=b.eventTypes;for(var d in c){var e=void 0;var f=c[d],g=b,h=d;Pa.hasOwnProperty(h)?E("99",h):void 0;Pa[h]=f;var k=f.phasedRegistrationNames;if(k){for(e in k)k.hasOwnProperty(e)&&Qa(k[e],g,h);e=!0}else f.registrationName?(Qa(f.registrationName,g,h),e=!0):e=!1;e?void 0:E("98",d,a)}}}} 2436 function Qa(a,b,c){Ra[a]?E("100",a):void 0;Ra[a]=b;Sa[a]=b.eventTypes[c].dependencies}var Oa=[],Pa={},Ra={},Sa={};function Ta(a){La?E("101"):void 0;La=Array.prototype.slice.call(a);Na()}function Ua(a){var b=!1,c;for(c in a)if(a.hasOwnProperty(c)){var d=a[c];Ma.hasOwnProperty(c)&&Ma[c]===d||(Ma[c]?E("102",c):void 0,Ma[c]=d,b=!0)}b&&Na()} 2437 var Va=Object.freeze({plugins:Oa,eventNameDispatchConfigs:Pa,registrationNameModules:Ra,registrationNameDependencies:Sa,possibleRegistrationNames:null,injectEventPluginOrder:Ta,injectEventPluginsByName:Ua}),Wa=null,Xa=null,Ya=null;function Za(a,b,c,d){b=a.type||"unknown-event";a.currentTarget=Ya(d);P.invokeGuardedCallbackAndCatchFirstError(b,c,void 0,a);a.currentTarget=null} 2438 function $a(a,b){null==b?E("30"):void 0;if(null==a)return b;if(Array.isArray(a)){if(Array.isArray(b))return a.push.apply(a,b),a;a.push(b);return a}return Array.isArray(b)?[a].concat(b):[a,b]}function ab(a,b,c){Array.isArray(a)?a.forEach(b,c):a&&b.call(c,a)}var bb=null; 2439 function cb(a,b){if(a){var c=a._dispatchListeners,d=a._dispatchInstances;if(Array.isArray(c))for(var e=0;e<c.length&&!a.isPropagationStopped();e++)Za(a,b,c[e],d[e]);else c&&Za(a,b,c,d);a._dispatchListeners=null;a._dispatchInstances=null;a.isPersistent()||a.constructor.release(a)}}function db(a){return cb(a,!0)}function gb(a){return cb(a,!1)}var hb={injectEventPluginOrder:Ta,injectEventPluginsByName:Ua}; 2440 function ib(a,b){var c=a.stateNode;if(!c)return null;var d=Wa(c);if(!d)return null;c=d[b];a:switch(b){case "onClick":case "onClickCapture":case "onDoubleClick":case "onDoubleClickCapture":case "onMouseDown":case "onMouseDownCapture":case "onMouseMove":case "onMouseMoveCapture":case "onMouseUp":case "onMouseUpCapture":(d=!d.disabled)||(a=a.type,d=!("button"===a||"input"===a||"select"===a||"textarea"===a));a=!d;break a;default:a=!1}if(a)return null;c&&"function"!==typeof c?E("231",b,typeof c):void 0; 2441 return c}function jb(a,b,c,d){for(var e,f=0;f<Oa.length;f++){var g=Oa[f];g&&(g=g.extractEvents(a,b,c,d))&&(e=$a(e,g))}return e}function kb(a){a&&(bb=$a(bb,a))}function lb(a){var b=bb;bb=null;b&&(a?ab(b,db):ab(b,gb),bb?E("95"):void 0,P.rethrowCaughtError())}var mb=Object.freeze({injection:hb,getListener:ib,extractEvents:jb,enqueueEvents:kb,processEventQueue:lb}),nb=Math.random().toString(36).slice(2),Q="__reactInternalInstance$"+nb,ob="__reactEventHandlers$"+nb; 2442 function pb(a){if(a[Q])return a[Q];for(var b=[];!a[Q];)if(b.push(a),a.parentNode)a=a.parentNode;else return null;var c=void 0,d=a[Q];if(5===d.tag||6===d.tag)return d;for(;a&&(d=a[Q]);a=b.pop())c=d;return c}function qb(a){if(5===a.tag||6===a.tag)return a.stateNode;E("33")}function rb(a){return a[ob]||null} 2443 var sb=Object.freeze({precacheFiberNode:function(a,b){b[Q]=a},getClosestInstanceFromNode:pb,getInstanceFromNode:function(a){a=a[Q];return!a||5!==a.tag&&6!==a.tag?null:a},getNodeFromInstance:qb,getFiberCurrentPropsFromNode:rb,updateFiberProps:function(a,b){a[ob]=b}});function tb(a){do a=a["return"];while(a&&5!==a.tag);return a?a:null}function ub(a,b,c){for(var d=[];a;)d.push(a),a=tb(a);for(a=d.length;0<a--;)b(d[a],"captured",c);for(a=0;a<d.length;a++)b(d[a],"bubbled",c)} 2444 function vb(a,b,c){if(b=ib(a,c.dispatchConfig.phasedRegistrationNames[b]))c._dispatchListeners=$a(c._dispatchListeners,b),c._dispatchInstances=$a(c._dispatchInstances,a)}function wb(a){a&&a.dispatchConfig.phasedRegistrationNames&&ub(a._targetInst,vb,a)}function xb(a){if(a&&a.dispatchConfig.phasedRegistrationNames){var b=a._targetInst;b=b?tb(b):null;ub(b,vb,a)}} 2445 function yb(a,b,c){a&&c&&c.dispatchConfig.registrationName&&(b=ib(a,c.dispatchConfig.registrationName))&&(c._dispatchListeners=$a(c._dispatchListeners,b),c._dispatchInstances=$a(c._dispatchInstances,a))}function zb(a){a&&a.dispatchConfig.registrationName&&yb(a._targetInst,null,a)}function Ab(a){ab(a,wb)} 2446 function Bb(a,b,c,d){if(c&&d)a:{var e=c;for(var f=d,g=0,h=e;h;h=tb(h))g++;h=0;for(var k=f;k;k=tb(k))h++;for(;0<g-h;)e=tb(e),g--;for(;0<h-g;)f=tb(f),h--;for(;g--;){if(e===f||e===f.alternate)break a;e=tb(e);f=tb(f)}e=null}else e=null;f=e;for(e=[];c&&c!==f;){g=c.alternate;if(null!==g&&g===f)break;e.push(c);c=tb(c)}for(c=[];d&&d!==f;){g=d.alternate;if(null!==g&&g===f)break;c.push(d);d=tb(d)}for(d=0;d<e.length;d++)yb(e[d],"bubbled",a);for(a=c.length;0<a--;)yb(c[a],"captured",b)} 2447 var Cb=Object.freeze({accumulateTwoPhaseDispatches:Ab,accumulateTwoPhaseDispatchesSkipTarget:function(a){ab(a,xb)},accumulateEnterLeaveDispatches:Bb,accumulateDirectDispatches:function(a){ab(a,zb)}}),Db=null;function Eb(){!Db&&l.canUseDOM&&(Db="textContent"in document.documentElement?"textContent":"innerText");return Db}var S={_root:null,_startText:null,_fallbackText:null}; 2448 function Fb(){if(S._fallbackText)return S._fallbackText;var a,b=S._startText,c=b.length,d,e=Gb(),f=e.length;for(a=0;a<c&&b[a]===e[a];a++);var g=c-a;for(d=1;d<=g&&b[c-d]===e[f-d];d++);S._fallbackText=e.slice(a,1<d?1-d:void 0);return S._fallbackText}function Gb(){return"value"in S._root?S._root.value:S._root[Eb()]} 2449 var Hb="dispatchConfig _targetInst nativeEvent isDefaultPrevented isPropagationStopped _dispatchListeners _dispatchInstances".split(" "),Ib={type:null,target:null,currentTarget:C.thatReturnsNull,eventPhase:null,bubbles:null,cancelable:null,timeStamp:function(a){return a.timeStamp||Date.now()},defaultPrevented:null,isTrusted:null}; 2450 function T(a,b,c,d){this.dispatchConfig=a;this._targetInst=b;this.nativeEvent=c;a=this.constructor.Interface;for(var e in a)a.hasOwnProperty(e)&&((b=a[e])?this[e]=b(c):"target"===e?this.target=d:this[e]=c[e]);this.isDefaultPrevented=(null!=c.defaultPrevented?c.defaultPrevented:!1===c.returnValue)?C.thatReturnsTrue:C.thatReturnsFalse;this.isPropagationStopped=C.thatReturnsFalse;return this} 2451 B(T.prototype,{preventDefault:function(){this.defaultPrevented=!0;var a=this.nativeEvent;a&&(a.preventDefault?a.preventDefault():"unknown"!==typeof a.returnValue&&(a.returnValue=!1),this.isDefaultPrevented=C.thatReturnsTrue)},stopPropagation:function(){var a=this.nativeEvent;a&&(a.stopPropagation?a.stopPropagation():"unknown"!==typeof a.cancelBubble&&(a.cancelBubble=!0),this.isPropagationStopped=C.thatReturnsTrue)},persist:function(){this.isPersistent=C.thatReturnsTrue},isPersistent:C.thatReturnsFalse, 2452 destructor:function(){var a=this.constructor.Interface,b;for(b in a)this[b]=null;for(a=0;a<Hb.length;a++)this[Hb[a]]=null}});T.Interface=Ib;T.augmentClass=function(a,b){function c(){}c.prototype=this.prototype;var d=new c;B(d,a.prototype);a.prototype=d;a.prototype.constructor=a;a.Interface=B({},this.Interface,b);a.augmentClass=this.augmentClass;Jb(a)};Jb(T);function Kb(a,b,c,d){if(this.eventPool.length){var e=this.eventPool.pop();this.call(e,a,b,c,d);return e}return new this(a,b,c,d)} 2453 function Lb(a){a instanceof this?void 0:E("223");a.destructor();10>this.eventPool.length&&this.eventPool.push(a)}function Jb(a){a.eventPool=[];a.getPooled=Kb;a.release=Lb}function Mb(a,b,c,d){return T.call(this,a,b,c,d)}T.augmentClass(Mb,{data:null});function Nb(a,b,c,d){return T.call(this,a,b,c,d)}T.augmentClass(Nb,{data:null});var Pb=[9,13,27,32],Vb=l.canUseDOM&&"CompositionEvent"in window,Wb=null;l.canUseDOM&&"documentMode"in document&&(Wb=document.documentMode);var Xb; 2454 if(Xb=l.canUseDOM&&"TextEvent"in window&&!Wb){var Yb=window.opera;Xb=!("object"===typeof Yb&&"function"===typeof Yb.version&&12>=parseInt(Yb.version(),10))} 2455 var Zb=Xb,$b=l.canUseDOM&&(!Vb||Wb&&8<Wb&&11>=Wb),ac=String.fromCharCode(32),bc={beforeInput:{phasedRegistrationNames:{bubbled:"onBeforeInput",captured:"onBeforeInputCapture"},dependencies:["topCompositionEnd","topKeyPress","topTextInput","topPaste"]},compositionEnd:{phasedRegistrationNames:{bubbled:"onCompositionEnd",captured:"onCompositionEndCapture"},dependencies:"topBlur topCompositionEnd topKeyDown topKeyPress topKeyUp topMouseDown".split(" ")},compositionStart:{phasedRegistrationNames:{bubbled:"onCompositionStart", 2456 captured:"onCompositionStartCapture"},dependencies:"topBlur topCompositionStart topKeyDown topKeyPress topKeyUp topMouseDown".split(" ")},compositionUpdate:{phasedRegistrationNames:{bubbled:"onCompositionUpdate",captured:"onCompositionUpdateCapture"},dependencies:"topBlur topCompositionUpdate topKeyDown topKeyPress topKeyUp topMouseDown".split(" ")}},cc=!1; 2457 function dc(a,b){switch(a){case "topKeyUp":return-1!==Pb.indexOf(b.keyCode);case "topKeyDown":return 229!==b.keyCode;case "topKeyPress":case "topMouseDown":case "topBlur":return!0;default:return!1}}function ec(a){a=a.detail;return"object"===typeof a&&"data"in a?a.data:null}var fc=!1;function gc(a,b){switch(a){case "topCompositionEnd":return ec(b);case "topKeyPress":if(32!==b.which)return null;cc=!0;return ac;case "topTextInput":return a=b.data,a===ac&&cc?null:a;default:return null}} 2458 function hc(a,b){if(fc)return"topCompositionEnd"===a||!Vb&&dc(a,b)?(a=Fb(),S._root=null,S._startText=null,S._fallbackText=null,fc=!1,a):null;switch(a){case "topPaste":return null;case "topKeyPress":if(!(b.ctrlKey||b.altKey||b.metaKey)||b.ctrlKey&&b.altKey){if(b.char&&1<b.char.length)return b.char;if(b.which)return String.fromCharCode(b.which)}return null;case "topCompositionEnd":return $b?null:b.data;default:return null}} 2459 var ic={eventTypes:bc,extractEvents:function(a,b,c,d){var e;if(Vb)b:{switch(a){case "topCompositionStart":var f=bc.compositionStart;break b;case "topCompositionEnd":f=bc.compositionEnd;break b;case "topCompositionUpdate":f=bc.compositionUpdate;break b}f=void 0}else fc?dc(a,c)&&(f=bc.compositionEnd):"topKeyDown"===a&&229===c.keyCode&&(f=bc.compositionStart);f?($b&&(fc||f!==bc.compositionStart?f===bc.compositionEnd&&fc&&(e=Fb()):(S._root=d,S._startText=Gb(),fc=!0)),f=Mb.getPooled(f,b,c,d),e?f.data= 2460 e:(e=ec(c),null!==e&&(f.data=e)),Ab(f),e=f):e=null;(a=Zb?gc(a,c):hc(a,c))?(b=Nb.getPooled(bc.beforeInput,b,c,d),b.data=a,Ab(b)):b=null;return[e,b]}},jc=null,kc=null,lc=null;function mc(a){if(a=Xa(a)){jc&&"function"===typeof jc.restoreControlledState?void 0:E("194");var b=Wa(a.stateNode);jc.restoreControlledState(a.stateNode,a.type,b)}}var nc={injectFiberControlledHostComponent:function(a){jc=a}};function oc(a){kc?lc?lc.push(a):lc=[a]:kc=a} 2461 function pc(){if(kc){var a=kc,b=lc;lc=kc=null;mc(a);if(b)for(a=0;a<b.length;a++)mc(b[a])}}var qc=Object.freeze({injection:nc,enqueueStateRestore:oc,restoreStateIfNeeded:pc});function rc(a,b){return a(b)}var sc=!1;function tc(a,b){if(sc)return rc(a,b);sc=!0;try{return rc(a,b)}finally{sc=!1,pc()}}var uc={color:!0,date:!0,datetime:!0,"datetime-local":!0,email:!0,month:!0,number:!0,password:!0,range:!0,search:!0,tel:!0,text:!0,time:!0,url:!0,week:!0}; 2462 function vc(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return"input"===b?!!uc[a.type]:"textarea"===b?!0:!1}function wc(a){a=a.target||a.srcElement||window;a.correspondingUseElement&&(a=a.correspondingUseElement);return 3===a.nodeType?a.parentNode:a}var xc;l.canUseDOM&&(xc=document.implementation&&document.implementation.hasFeature&&!0!==document.implementation.hasFeature("","")); 2463 function yc(a,b){if(!l.canUseDOM||b&&!("addEventListener"in document))return!1;b="on"+a;var c=b in document;c||(c=document.createElement("div"),c.setAttribute(b,"return;"),c="function"===typeof c[b]);!c&&xc&&"wheel"===a&&(c=document.implementation.hasFeature("Events.wheel","3.0"));return c}function zc(a){var b=a.type;return(a=a.nodeName)&&"input"===a.toLowerCase()&&("checkbox"===b||"radio"===b)} 2464 function Ac(a){var b=zc(a)?"checked":"value",c=Object.getOwnPropertyDescriptor(a.constructor.prototype,b),d=""+a[b];if(!a.hasOwnProperty(b)&&"function"===typeof c.get&&"function"===typeof c.set)return Object.defineProperty(a,b,{enumerable:c.enumerable,configurable:!0,get:function(){return c.get.call(this)},set:function(a){d=""+a;c.set.call(this,a)}}),{getValue:function(){return d},setValue:function(a){d=""+a},stopTracking:function(){a._valueTracker=null;delete a[b]}}} 2465 function Bc(a){a._valueTracker||(a._valueTracker=Ac(a))}function Cc(a){if(!a)return!1;var b=a._valueTracker;if(!b)return!0;var c=b.getValue();var d="";a&&(d=zc(a)?a.checked?"true":"false":a.value);a=d;return a!==c?(b.setValue(a),!0):!1}var Dc={change:{phasedRegistrationNames:{bubbled:"onChange",captured:"onChangeCapture"},dependencies:"topBlur topChange topClick topFocus topInput topKeyDown topKeyUp topSelectionChange".split(" ")}}; 2466 function Ec(a,b,c){a=T.getPooled(Dc.change,a,b,c);a.type="change";oc(c);Ab(a);return a}var Fc=null,Gc=null;function Hc(a){kb(a);lb(!1)}function Ic(a){var b=qb(a);if(Cc(b))return a}function Jc(a,b){if("topChange"===a)return b}var Kc=!1;l.canUseDOM&&(Kc=yc("input")&&(!document.documentMode||9<document.documentMode));function Lc(){Fc&&(Fc.detachEvent("onpropertychange",Mc),Gc=Fc=null)}function Mc(a){"value"===a.propertyName&&Ic(Gc)&&(a=Ec(Gc,a,wc(a)),tc(Hc,a))} 2467 function Nc(a,b,c){"topFocus"===a?(Lc(),Fc=b,Gc=c,Fc.attachEvent("onpropertychange",Mc)):"topBlur"===a&&Lc()}function Oc(a){if("topSelectionChange"===a||"topKeyUp"===a||"topKeyDown"===a)return Ic(Gc)}function Pc(a,b){if("topClick"===a)return Ic(b)}function $c(a,b){if("topInput"===a||"topChange"===a)return Ic(b)} 2468 var ad={eventTypes:Dc,_isInputEventSupported:Kc,extractEvents:function(a,b,c,d){var e=b?qb(b):window,f=e.nodeName&&e.nodeName.toLowerCase();if("select"===f||"input"===f&&"file"===e.type)var g=Jc;else if(vc(e))if(Kc)g=$c;else{g=Oc;var h=Nc}else f=e.nodeName,!f||"input"!==f.toLowerCase()||"checkbox"!==e.type&&"radio"!==e.type||(g=Pc);if(g&&(g=g(a,b)))return Ec(g,c,d);h&&h(a,e,b);"topBlur"===a&&null!=b&&(a=b._wrapperState||e._wrapperState)&&a.controlled&&"number"===e.type&&(a=""+e.value,e.getAttribute("value")!== 2469 a&&e.setAttribute("value",a))}};function bd(a,b,c,d){return T.call(this,a,b,c,d)}T.augmentClass(bd,{view:null,detail:null});var cd={Alt:"altKey",Control:"ctrlKey",Meta:"metaKey",Shift:"shiftKey"};function dd(a){var b=this.nativeEvent;return b.getModifierState?b.getModifierState(a):(a=cd[a])?!!b[a]:!1}function ed(){return dd}function fd(a,b,c,d){return T.call(this,a,b,c,d)} 2470 bd.augmentClass(fd,{screenX:null,screenY:null,clientX:null,clientY:null,pageX:null,pageY:null,ctrlKey:null,shiftKey:null,altKey:null,metaKey:null,getModifierState:ed,button:null,buttons:null,relatedTarget:function(a){return a.relatedTarget||(a.fromElement===a.srcElement?a.toElement:a.fromElement)}}); 2471 var gd={mouseEnter:{registrationName:"onMouseEnter",dependencies:["topMouseOut","topMouseOver"]},mouseLeave:{registrationName:"onMouseLeave",dependencies:["topMouseOut","topMouseOver"]}},hd={eventTypes:gd,extractEvents:function(a,b,c,d){if("topMouseOver"===a&&(c.relatedTarget||c.fromElement)||"topMouseOut"!==a&&"topMouseOver"!==a)return null;var e=d.window===d?d:(e=d.ownerDocument)?e.defaultView||e.parentWindow:window;"topMouseOut"===a?(a=b,b=(b=c.relatedTarget||c.toElement)?pb(b):null):a=null;if(a=== 2472 b)return null;var f=null==a?e:qb(a);e=null==b?e:qb(b);var g=fd.getPooled(gd.mouseLeave,a,c,d);g.type="mouseleave";g.target=f;g.relatedTarget=e;c=fd.getPooled(gd.mouseEnter,b,c,d);c.type="mouseenter";c.target=e;c.relatedTarget=f;Bb(g,c,a,b);return[g,c]}},id=aa.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner;function jd(a){a=a.type;return"string"===typeof a?a:"function"===typeof a?a.displayName||a.name:null} 2473 function kd(a){var b=a;if(a.alternate)for(;b["return"];)b=b["return"];else{if(0!==(b.effectTag&2))return 1;for(;b["return"];)if(b=b["return"],0!==(b.effectTag&2))return 1}return 3===b.tag?2:3}function ld(a){return(a=a._reactInternalFiber)?2===kd(a):!1}function md(a){2!==kd(a)?E("188"):void 0} 2474 function nd(a){var b=a.alternate;if(!b)return b=kd(a),3===b?E("188"):void 0,1===b?null:a;for(var c=a,d=b;;){var e=c["return"],f=e?e.alternate:null;if(!e||!f)break;if(e.child===f.child){for(var g=e.child;g;){if(g===c)return md(e),a;if(g===d)return md(e),b;g=g.sibling}E("188")}if(c["return"]!==d["return"])c=e,d=f;else{g=!1;for(var h=e.child;h;){if(h===c){g=!0;c=e;d=f;break}if(h===d){g=!0;d=e;c=f;break}h=h.sibling}if(!g){for(h=f.child;h;){if(h===c){g=!0;c=f;d=e;break}if(h===d){g=!0;d=f;c=e;break}h=h.sibling}g? 2475 void 0:E("189")}}c.alternate!==d?E("190"):void 0}3!==c.tag?E("188"):void 0;return c.stateNode.current===c?a:b}function od(a){a=nd(a);if(!a)return null;for(var b=a;;){if(5===b.tag||6===b.tag)return b;if(b.child)b.child["return"]=b,b=b.child;else{if(b===a)break;for(;!b.sibling;){if(!b["return"]||b["return"]===a)return null;b=b["return"]}b.sibling["return"]=b["return"];b=b.sibling}}return null} 2476 function pd(a){a=nd(a);if(!a)return null;for(var b=a;;){if(5===b.tag||6===b.tag)return b;if(b.child&&4!==b.tag)b.child["return"]=b,b=b.child;else{if(b===a)break;for(;!b.sibling;){if(!b["return"]||b["return"]===a)return null;b=b["return"]}b.sibling["return"]=b["return"];b=b.sibling}}return null}var qd=[]; 2477 function rd(a){var b=a.targetInst;do{if(!b){a.ancestors.push(b);break}var c;for(c=b;c["return"];)c=c["return"];c=3!==c.tag?null:c.stateNode.containerInfo;if(!c)break;a.ancestors.push(b);b=pb(c)}while(b);for(c=0;c<a.ancestors.length;c++)b=a.ancestors[c],sd(a.topLevelType,b,a.nativeEvent,wc(a.nativeEvent))}var td=!0,sd=void 0;function ud(a){td=!!a}function U(a,b,c){return c?ba.listen(c,b,vd.bind(null,a)):null}function wd(a,b,c){return c?ba.capture(c,b,vd.bind(null,a)):null} 2478 function vd(a,b){if(td){var c=wc(b);c=pb(c);null===c||"number"!==typeof c.tag||2===kd(c)||(c=null);if(qd.length){var d=qd.pop();d.topLevelType=a;d.nativeEvent=b;d.targetInst=c;a=d}else a={topLevelType:a,nativeEvent:b,targetInst:c,ancestors:[]};try{tc(rd,a)}finally{a.topLevelType=null,a.nativeEvent=null,a.targetInst=null,a.ancestors.length=0,10>qd.length&&qd.push(a)}}} 2479 var xd=Object.freeze({get _enabled(){return td},get _handleTopLevel(){return sd},setHandleTopLevel:function(a){sd=a},setEnabled:ud,isEnabled:function(){return td},trapBubbledEvent:U,trapCapturedEvent:wd,dispatchEvent:vd});function yd(a,b){var c={};c[a.toLowerCase()]=b.toLowerCase();c["Webkit"+a]="webkit"+b;c["Moz"+a]="moz"+b;c["ms"+a]="MS"+b;c["O"+a]="o"+b.toLowerCase();return c} 2480 var zd={animationend:yd("Animation","AnimationEnd"),animationiteration:yd("Animation","AnimationIteration"),animationstart:yd("Animation","AnimationStart"),transitionend:yd("Transition","TransitionEnd")},Ad={},Bd={};l.canUseDOM&&(Bd=document.createElement("div").style,"AnimationEvent"in window||(delete zd.animationend.animation,delete zd.animationiteration.animation,delete zd.animationstart.animation),"TransitionEvent"in window||delete zd.transitionend.transition); 2481 function Cd(a){if(Ad[a])return Ad[a];if(!zd[a])return a;var b=zd[a],c;for(c in b)if(b.hasOwnProperty(c)&&c in Bd)return Ad[a]=b[c];return""} 2482 var Dd={topAbort:"abort",topAnimationEnd:Cd("animationend")||"animationend",topAnimationIteration:Cd("animationiteration")||"animationiteration",topAnimationStart:Cd("animationstart")||"animationstart",topBlur:"blur",topCancel:"cancel",topCanPlay:"canplay",topCanPlayThrough:"canplaythrough",topChange:"change",topClick:"click",topClose:"close",topCompositionEnd:"compositionend",topCompositionStart:"compositionstart",topCompositionUpdate:"compositionupdate",topContextMenu:"contextmenu",topCopy:"copy", 2483 topCut:"cut",topDoubleClick:"dblclick",topDrag:"drag",topDragEnd:"dragend",topDragEnter:"dragenter",topDragExit:"dragexit",topDragLeave:"dragleave",topDragOver:"dragover",topDragStart:"dragstart",topDrop:"drop",topDurationChange:"durationchange",topEmptied:"emptied",topEncrypted:"encrypted",topEnded:"ended",topError:"error",topFocus:"focus",topInput:"input",topKeyDown:"keydown",topKeyPress:"keypress",topKeyUp:"keyup",topLoadedData:"loadeddata",topLoad:"load",topLoadedMetadata:"loadedmetadata",topLoadStart:"loadstart", 2484 topMouseDown:"mousedown",topMouseMove:"mousemove",topMouseOut:"mouseout",topMouseOver:"mouseover",topMouseUp:"mouseup",topPaste:"paste",topPause:"pause",topPlay:"play",topPlaying:"playing",topProgress:"progress",topRateChange:"ratechange",topScroll:"scroll",topSeeked:"seeked",topSeeking:"seeking",topSelectionChange:"selectionchange",topStalled:"stalled",topSuspend:"suspend",topTextInput:"textInput",topTimeUpdate:"timeupdate",topToggle:"toggle",topTouchCancel:"touchcancel",topTouchEnd:"touchend",topTouchMove:"touchmove", 2485 topTouchStart:"touchstart",topTransitionEnd:Cd("transitionend")||"transitionend",topVolumeChange:"volumechange",topWaiting:"waiting",topWheel:"wheel"},Ed={},Fd=0,Gd="_reactListenersID"+(""+Math.random()).slice(2);function Hd(a){Object.prototype.hasOwnProperty.call(a,Gd)||(a[Gd]=Fd++,Ed[a[Gd]]={});return Ed[a[Gd]]}function Id(a){for(;a&&a.firstChild;)a=a.firstChild;return a} 2486 function Jd(a,b){var c=Id(a);a=0;for(var d;c;){if(3===c.nodeType){d=a+c.textContent.length;if(a<=b&&d>=b)return{node:c,offset:b-a};a=d}a:{for(;c;){if(c.nextSibling){c=c.nextSibling;break a}c=c.parentNode}c=void 0}c=Id(c)}}function Kd(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return b&&("input"===b&&"text"===a.type||"textarea"===b||"true"===a.contentEditable)} 2487 var Ld=l.canUseDOM&&"documentMode"in document&&11>=document.documentMode,Md={select:{phasedRegistrationNames:{bubbled:"onSelect",captured:"onSelectCapture"},dependencies:"topBlur topContextMenu topFocus topKeyDown topKeyUp topMouseDown topMouseUp topSelectionChange".split(" ")}},Nd=null,Od=null,Pd=null,Qd=!1; 2488 function Rd(a,b){if(Qd||null==Nd||Nd!==da())return null;var c=Nd;"selectionStart"in c&&Kd(c)?c={start:c.selectionStart,end:c.selectionEnd}:window.getSelection?(c=window.getSelection(),c={anchorNode:c.anchorNode,anchorOffset:c.anchorOffset,focusNode:c.focusNode,focusOffset:c.focusOffset}):c=void 0;return Pd&&ea(Pd,c)?null:(Pd=c,a=T.getPooled(Md.select,Od,a,b),a.type="select",a.target=Nd,Ab(a),a)} 2489 var Sd={eventTypes:Md,extractEvents:function(a,b,c,d){var e=d.window===d?d.document:9===d.nodeType?d:d.ownerDocument,f;if(!(f=!e)){a:{e=Hd(e);f=Sa.onSelect;for(var g=0;g<f.length;g++){var h=f[g];if(!e.hasOwnProperty(h)||!e[h]){e=!1;break a}}e=!0}f=!e}if(f)return null;e=b?qb(b):window;switch(a){case "topFocus":if(vc(e)||"true"===e.contentEditable)Nd=e,Od=b,Pd=null;break;case "topBlur":Pd=Od=Nd=null;break;case "topMouseDown":Qd=!0;break;case "topContextMenu":case "topMouseUp":return Qd=!1,Rd(c,d);case "topSelectionChange":if(Ld)break; 2490 case "topKeyDown":case "topKeyUp":return Rd(c,d)}return null}};function Td(a,b,c,d){return T.call(this,a,b,c,d)}T.augmentClass(Td,{animationName:null,elapsedTime:null,pseudoElement:null});function Ud(a,b,c,d){return T.call(this,a,b,c,d)}T.augmentClass(Ud,{clipboardData:function(a){return"clipboardData"in a?a.clipboardData:window.clipboardData}});function Vd(a,b,c,d){return T.call(this,a,b,c,d)}bd.augmentClass(Vd,{relatedTarget:null}); 2491 function Wd(a){var b=a.keyCode;"charCode"in a?(a=a.charCode,0===a&&13===b&&(a=13)):a=b;return 32<=a||13===a?a:0} 2492 var Xd={Esc:"Escape",Spacebar:" ",Left:"ArrowLeft",Up:"ArrowUp",Right:"ArrowRight",Down:"ArrowDown",Del:"Delete",Win:"OS",Menu:"ContextMenu",Apps:"ContextMenu",Scroll:"ScrollLock",MozPrintableKey:"Unidentified"},Yd={8:"Backspace",9:"Tab",12:"Clear",13:"Enter",16:"Shift",17:"Control",18:"Alt",19:"Pause",20:"CapsLock",27:"Escape",32:" ",33:"PageUp",34:"PageDown",35:"End",36:"Home",37:"ArrowLeft",38:"ArrowUp",39:"ArrowRight",40:"ArrowDown",45:"Insert",46:"Delete",112:"F1",113:"F2",114:"F3",115:"F4", 2493 116:"F5",117:"F6",118:"F7",119:"F8",120:"F9",121:"F10",122:"F11",123:"F12",144:"NumLock",145:"ScrollLock",224:"Meta"};function Zd(a,b,c,d){return T.call(this,a,b,c,d)} 2494 bd.augmentClass(Zd,{key:function(a){if(a.key){var b=Xd[a.key]||a.key;if("Unidentified"!==b)return b}return"keypress"===a.type?(a=Wd(a),13===a?"Enter":String.fromCharCode(a)):"keydown"===a.type||"keyup"===a.type?Yd[a.keyCode]||"Unidentified":""},location:null,ctrlKey:null,shiftKey:null,altKey:null,metaKey:null,repeat:null,locale:null,getModifierState:ed,charCode:function(a){return"keypress"===a.type?Wd(a):0},keyCode:function(a){return"keydown"===a.type||"keyup"===a.type?a.keyCode:0},which:function(a){return"keypress"=== 2495 a.type?Wd(a):"keydown"===a.type||"keyup"===a.type?a.keyCode:0}});function $d(a,b,c,d){return T.call(this,a,b,c,d)}fd.augmentClass($d,{dataTransfer:null});function ae(a,b,c,d){return T.call(this,a,b,c,d)}bd.augmentClass(ae,{touches:null,targetTouches:null,changedTouches:null,altKey:null,metaKey:null,ctrlKey:null,shiftKey:null,getModifierState:ed});function be(a,b,c,d){return T.call(this,a,b,c,d)}T.augmentClass(be,{propertyName:null,elapsedTime:null,pseudoElement:null}); 2496 function ce(a,b,c,d){return T.call(this,a,b,c,d)}fd.augmentClass(ce,{deltaX:function(a){return"deltaX"in a?a.deltaX:"wheelDeltaX"in a?-a.wheelDeltaX:0},deltaY:function(a){return"deltaY"in a?a.deltaY:"wheelDeltaY"in a?-a.wheelDeltaY:"wheelDelta"in a?-a.wheelDelta:0},deltaZ:null,deltaMode:null});var de={},ee={}; 2497 "abort animationEnd animationIteration animationStart blur cancel canPlay canPlayThrough click close contextMenu copy cut doubleClick drag dragEnd dragEnter dragExit dragLeave dragOver dragStart drop durationChange emptied encrypted ended error focus input invalid keyDown keyPress keyUp load loadedData loadedMetadata loadStart mouseDown mouseMove mouseOut mouseOver mouseUp paste pause play playing progress rateChange reset scroll seeked seeking stalled submit suspend timeUpdate toggle touchCancel touchEnd touchMove touchStart transitionEnd volumeChange waiting wheel".split(" ").forEach(function(a){var b=a[0].toUpperCase()+ 2498 a.slice(1),c="on"+b;b="top"+b;c={phasedRegistrationNames:{bubbled:c,captured:c+"Capture"},dependencies:[b]};de[a]=c;ee[b]=c}); 2499 var fe={eventTypes:de,extractEvents:function(a,b,c,d){var e=ee[a];if(!e)return null;switch(a){case "topKeyPress":if(0===Wd(c))return null;case "topKeyDown":case "topKeyUp":a=Zd;break;case "topBlur":case "topFocus":a=Vd;break;case "topClick":if(2===c.button)return null;case "topDoubleClick":case "topMouseDown":case "topMouseMove":case "topMouseUp":case "topMouseOut":case "topMouseOver":case "topContextMenu":a=fd;break;case "topDrag":case "topDragEnd":case "topDragEnter":case "topDragExit":case "topDragLeave":case "topDragOver":case "topDragStart":case "topDrop":a= 2500 $d;break;case "topTouchCancel":case "topTouchEnd":case "topTouchMove":case "topTouchStart":a=ae;break;case "topAnimationEnd":case "topAnimationIteration":case "topAnimationStart":a=Td;break;case "topTransitionEnd":a=be;break;case "topScroll":a=bd;break;case "topWheel":a=ce;break;case "topCopy":case "topCut":case "topPaste":a=Ud;break;default:a=T}b=a.getPooled(e,b,c,d);Ab(b);return b}};sd=function(a,b,c,d){a=jb(a,b,c,d);kb(a);lb(!1)};hb.injectEventPluginOrder("ResponderEventPlugin SimpleEventPlugin TapEventPlugin EnterLeaveEventPlugin ChangeEventPlugin SelectEventPlugin BeforeInputEventPlugin".split(" ")); 2501 Wa=sb.getFiberCurrentPropsFromNode;Xa=sb.getInstanceFromNode;Ya=sb.getNodeFromInstance;hb.injectEventPluginsByName({SimpleEventPlugin:fe,EnterLeaveEventPlugin:hd,ChangeEventPlugin:ad,SelectEventPlugin:Sd,BeforeInputEventPlugin:ic});var ge=[],he=-1;function V(a){0>he||(a.current=ge[he],ge[he]=null,he--)}function W(a,b){he++;ge[he]=a.current;a.current=b}new Set;var ie={current:D},X={current:!1},je=D;function ke(a){return le(a)?je:ie.current} 2502 function me(a,b){var c=a.type.contextTypes;if(!c)return D;var d=a.stateNode;if(d&&d.__reactInternalMemoizedUnmaskedChildContext===b)return d.__reactInternalMemoizedMaskedChildContext;var e={},f;for(f in c)e[f]=b[f];d&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=b,a.__reactInternalMemoizedMaskedChildContext=e);return e}function le(a){return 2===a.tag&&null!=a.type.childContextTypes}function ne(a){le(a)&&(V(X,a),V(ie,a))} 2503 function oe(a,b,c){null!=ie.cursor?E("168"):void 0;W(ie,b,a);W(X,c,a)}function pe(a,b){var c=a.stateNode,d=a.type.childContextTypes;if("function"!==typeof c.getChildContext)return b;c=c.getChildContext();for(var e in c)e in d?void 0:E("108",jd(a)||"Unknown",e);return B({},b,c)}function qe(a){if(!le(a))return!1;var b=a.stateNode;b=b&&b.__reactInternalMemoizedMergedChildContext||D;je=ie.current;W(ie,b,a);W(X,X.current,a);return!0} 2504 function re(a,b){var c=a.stateNode;c?void 0:E("169");if(b){var d=pe(a,je);c.__reactInternalMemoizedMergedChildContext=d;V(X,a);V(ie,a);W(ie,d,a)}else V(X,a);W(X,b,a)} 2505 function Y(a,b,c){this.tag=a;this.key=b;this.stateNode=this.type=null;this.sibling=this.child=this["return"]=null;this.index=0;this.memoizedState=this.updateQueue=this.memoizedProps=this.pendingProps=this.ref=null;this.internalContextTag=c;this.effectTag=0;this.lastEffect=this.firstEffect=this.nextEffect=null;this.expirationTime=0;this.alternate=null} 2506 function se(a,b,c){var d=a.alternate;null===d?(d=new Y(a.tag,a.key,a.internalContextTag),d.type=a.type,d.stateNode=a.stateNode,d.alternate=a,a.alternate=d):(d.effectTag=0,d.nextEffect=null,d.firstEffect=null,d.lastEffect=null);d.expirationTime=c;d.pendingProps=b;d.child=a.child;d.memoizedProps=a.memoizedProps;d.memoizedState=a.memoizedState;d.updateQueue=a.updateQueue;d.sibling=a.sibling;d.index=a.index;d.ref=a.ref;return d} 2507 function te(a,b,c){var d=void 0,e=a.type,f=a.key;"function"===typeof e?(d=e.prototype&&e.prototype.isReactComponent?new Y(2,f,b):new Y(0,f,b),d.type=e,d.pendingProps=a.props):"string"===typeof e?(d=new Y(5,f,b),d.type=e,d.pendingProps=a.props):"object"===typeof e&&null!==e&&"number"===typeof e.tag?(d=e,d.pendingProps=a.props):E("130",null==e?e:typeof e,"");d.expirationTime=c;return d}function ue(a,b,c,d){b=new Y(10,d,b);b.pendingProps=a;b.expirationTime=c;return b} 2508 function ve(a,b,c){b=new Y(6,null,b);b.pendingProps=a;b.expirationTime=c;return b}function we(a,b,c){b=new Y(7,a.key,b);b.type=a.handler;b.pendingProps=a;b.expirationTime=c;return b}function xe(a,b,c){a=new Y(9,null,b);a.expirationTime=c;return a}function ye(a,b,c){b=new Y(4,a.key,b);b.pendingProps=a.children||[];b.expirationTime=c;b.stateNode={containerInfo:a.containerInfo,pendingChildren:null,implementation:a.implementation};return b}var ze=null,Ae=null; 2509 function Be(a){return function(b){try{return a(b)}catch(c){}}}function Ce(a){if("undefined"===typeof __REACT_DEVTOOLS_GLOBAL_HOOK__)return!1;var b=__REACT_DEVTOOLS_GLOBAL_HOOK__;if(b.isDisabled||!b.supportsFiber)return!0;try{var c=b.inject(a);ze=Be(function(a){return b.onCommitFiberRoot(c,a)});Ae=Be(function(a){return b.onCommitFiberUnmount(c,a)})}catch(d){}return!0}function De(a){"function"===typeof ze&&ze(a)}function Ee(a){"function"===typeof Ae&&Ae(a)} 2510 function Fe(a){return{baseState:a,expirationTime:0,first:null,last:null,callbackList:null,hasForceUpdate:!1,isInitialized:!1}}function Ge(a,b){null===a.last?a.first=a.last=b:(a.last.next=b,a.last=b);if(0===a.expirationTime||a.expirationTime>b.expirationTime)a.expirationTime=b.expirationTime} 2511 function He(a,b){var c=a.alternate,d=a.updateQueue;null===d&&(d=a.updateQueue=Fe(null));null!==c?(a=c.updateQueue,null===a&&(a=c.updateQueue=Fe(null))):a=null;a=a!==d?a:null;null===a?Ge(d,b):null===d.last||null===a.last?(Ge(d,b),Ge(a,b)):(Ge(d,b),a.last=b)}function Ie(a,b,c,d){a=a.partialState;return"function"===typeof a?a.call(b,c,d):a} 2512 function Je(a,b,c,d,e,f){null!==a&&a.updateQueue===c&&(c=b.updateQueue={baseState:c.baseState,expirationTime:c.expirationTime,first:c.first,last:c.last,isInitialized:c.isInitialized,callbackList:null,hasForceUpdate:!1});c.expirationTime=0;c.isInitialized?a=c.baseState:(a=c.baseState=b.memoizedState,c.isInitialized=!0);for(var g=!0,h=c.first,k=!1;null!==h;){var q=h.expirationTime;if(q>f){var v=c.expirationTime;if(0===v||v>q)c.expirationTime=q;k||(k=!0,c.baseState=a)}else{k||(c.first=h.next,null=== 2513 c.first&&(c.last=null));if(h.isReplace)a=Ie(h,d,a,e),g=!0;else if(q=Ie(h,d,a,e))a=g?B({},a,q):B(a,q),g=!1;h.isForced&&(c.hasForceUpdate=!0);null!==h.callback&&(q=c.callbackList,null===q&&(q=c.callbackList=[]),q.push(h))}h=h.next}null!==c.callbackList?b.effectTag|=32:null!==c.first||c.hasForceUpdate||(b.updateQueue=null);k||(c.baseState=a);return a} 2514 function Ke(a,b){var c=a.callbackList;if(null!==c)for(a.callbackList=null,a=0;a<c.length;a++){var d=c[a],e=d.callback;d.callback=null;"function"!==typeof e?E("191",e):void 0;e.call(b)}} 2515 function Le(a,b,c,d){function e(a,b){b.updater=f;a.stateNode=b;b._reactInternalFiber=a}var f={isMounted:ld,enqueueSetState:function(c,d,e){c=c._reactInternalFiber;e=void 0===e?null:e;var g=b(c);He(c,{expirationTime:g,partialState:d,callback:e,isReplace:!1,isForced:!1,nextCallback:null,next:null});a(c,g)},enqueueReplaceState:function(c,d,e){c=c._reactInternalFiber;e=void 0===e?null:e;var g=b(c);He(c,{expirationTime:g,partialState:d,callback:e,isReplace:!0,isForced:!1,nextCallback:null,next:null}); 2516 a(c,g)},enqueueForceUpdate:function(c,d){c=c._reactInternalFiber;d=void 0===d?null:d;var e=b(c);He(c,{expirationTime:e,partialState:null,callback:d,isReplace:!1,isForced:!0,nextCallback:null,next:null});a(c,e)}};return{adoptClassInstance:e,constructClassInstance:function(a,b){var c=a.type,d=ke(a),f=2===a.tag&&null!=a.type.contextTypes,g=f?me(a,d):D;b=new c(b,g);e(a,b);f&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=d,a.__reactInternalMemoizedMaskedChildContext=g);return b},mountClassInstance:function(a, 2517 b){var c=a.alternate,d=a.stateNode,e=d.state||null,g=a.pendingProps;g?void 0:E("158");var h=ke(a);d.props=g;d.state=a.memoizedState=e;d.refs=D;d.context=me(a,h);null!=a.type&&null!=a.type.prototype&&!0===a.type.prototype.unstable_isAsyncReactComponent&&(a.internalContextTag|=1);"function"===typeof d.componentWillMount&&(e=d.state,d.componentWillMount(),e!==d.state&&f.enqueueReplaceState(d,d.state,null),e=a.updateQueue,null!==e&&(d.state=Je(c,a,e,d,g,b)));"function"===typeof d.componentDidMount&&(a.effectTag|= 2518 4)},updateClassInstance:function(a,b,e){var g=b.stateNode;g.props=b.memoizedProps;g.state=b.memoizedState;var h=b.memoizedProps,k=b.pendingProps;k||(k=h,null==k?E("159"):void 0);var u=g.context,z=ke(b);z=me(b,z);"function"!==typeof g.componentWillReceiveProps||h===k&&u===z||(u=g.state,g.componentWillReceiveProps(k,z),g.state!==u&&f.enqueueReplaceState(g,g.state,null));u=b.memoizedState;e=null!==b.updateQueue?Je(a,b,b.updateQueue,g,k,e):u;if(!(h!==k||u!==e||X.current||null!==b.updateQueue&&b.updateQueue.hasForceUpdate))return"function"!== 2519 typeof g.componentDidUpdate||h===a.memoizedProps&&u===a.memoizedState||(b.effectTag|=4),!1;var G=k;if(null===h||null!==b.updateQueue&&b.updateQueue.hasForceUpdate)G=!0;else{var I=b.stateNode,L=b.type;G="function"===typeof I.shouldComponentUpdate?I.shouldComponentUpdate(G,e,z):L.prototype&&L.prototype.isPureReactComponent?!ea(h,G)||!ea(u,e):!0}G?("function"===typeof g.componentWillUpdate&&g.componentWillUpdate(k,e,z),"function"===typeof g.componentDidUpdate&&(b.effectTag|=4)):("function"!==typeof g.componentDidUpdate|| 2520 h===a.memoizedProps&&u===a.memoizedState||(b.effectTag|=4),c(b,k),d(b,e));g.props=k;g.state=e;g.context=z;return G}}}var Qe="function"===typeof Symbol&&Symbol["for"],Re=Qe?Symbol["for"]("react.element"):60103,Se=Qe?Symbol["for"]("react.call"):60104,Te=Qe?Symbol["for"]("react.return"):60105,Ue=Qe?Symbol["for"]("react.portal"):60106,Ve=Qe?Symbol["for"]("react.fragment"):60107,We="function"===typeof Symbol&&Symbol.iterator; 2521 function Xe(a){if(null===a||"undefined"===typeof a)return null;a=We&&a[We]||a["@@iterator"];return"function"===typeof a?a:null}var Ye=Array.isArray; 2522 function Ze(a,b){var c=b.ref;if(null!==c&&"function"!==typeof c){if(b._owner){b=b._owner;var d=void 0;b&&(2!==b.tag?E("110"):void 0,d=b.stateNode);d?void 0:E("147",c);var e=""+c;if(null!==a&&null!==a.ref&&a.ref._stringRef===e)return a.ref;a=function(a){var b=d.refs===D?d.refs={}:d.refs;null===a?delete b[e]:b[e]=a};a._stringRef=e;return a}"string"!==typeof c?E("148"):void 0;b._owner?void 0:E("149",c)}return c} 2523 function $e(a,b){"textarea"!==a.type&&E("31","[object Object]"===Object.prototype.toString.call(b)?"object with keys {"+Object.keys(b).join(", ")+"}":b,"")} 2524 function af(a){function b(b,c){if(a){var d=b.lastEffect;null!==d?(d.nextEffect=c,b.lastEffect=c):b.firstEffect=b.lastEffect=c;c.nextEffect=null;c.effectTag=8}}function c(c,d){if(!a)return null;for(;null!==d;)b(c,d),d=d.sibling;return null}function d(a,b){for(a=new Map;null!==b;)null!==b.key?a.set(b.key,b):a.set(b.index,b),b=b.sibling;return a}function e(a,b,c){a=se(a,b,c);a.index=0;a.sibling=null;return a}function f(b,c,d){b.index=d;if(!a)return c;d=b.alternate;if(null!==d)return d=d.index,d<c?(b.effectTag= 2525 2,c):d;b.effectTag=2;return c}function g(b){a&&null===b.alternate&&(b.effectTag=2);return b}function h(a,b,c,d){if(null===b||6!==b.tag)return b=ve(c,a.internalContextTag,d),b["return"]=a,b;b=e(b,c,d);b["return"]=a;return b}function k(a,b,c,d){if(null!==b&&b.type===c.type)return d=e(b,c.props,d),d.ref=Ze(b,c),d["return"]=a,d;d=te(c,a.internalContextTag,d);d.ref=Ze(b,c);d["return"]=a;return d}function q(a,b,c,d){if(null===b||7!==b.tag)return b=we(c,a.internalContextTag,d),b["return"]=a,b;b=e(b,c,d); 2526 b["return"]=a;return b}function v(a,b,c,d){if(null===b||9!==b.tag)return b=xe(c,a.internalContextTag,d),b.type=c.value,b["return"]=a,b;b=e(b,null,d);b.type=c.value;b["return"]=a;return b}function y(a,b,c,d){if(null===b||4!==b.tag||b.stateNode.containerInfo!==c.containerInfo||b.stateNode.implementation!==c.implementation)return b=ye(c,a.internalContextTag,d),b["return"]=a,b;b=e(b,c.children||[],d);b["return"]=a;return b}function u(a,b,c,d,f){if(null===b||10!==b.tag)return b=ue(c,a.internalContextTag, 2527 d,f),b["return"]=a,b;b=e(b,c,d);b["return"]=a;return b}function z(a,b,c){if("string"===typeof b||"number"===typeof b)return b=ve(""+b,a.internalContextTag,c),b["return"]=a,b;if("object"===typeof b&&null!==b){switch(b.$$typeof){case Re:if(b.type===Ve)return b=ue(b.props.children,a.internalContextTag,c,b.key),b["return"]=a,b;c=te(b,a.internalContextTag,c);c.ref=Ze(null,b);c["return"]=a;return c;case Se:return b=we(b,a.internalContextTag,c),b["return"]=a,b;case Te:return c=xe(b,a.internalContextTag, 2528 c),c.type=b.value,c["return"]=a,c;case Ue:return b=ye(b,a.internalContextTag,c),b["return"]=a,b}if(Ye(b)||Xe(b))return b=ue(b,a.internalContextTag,c,null),b["return"]=a,b;$e(a,b)}return null}function G(a,b,c,d){var e=null!==b?b.key:null;if("string"===typeof c||"number"===typeof c)return null!==e?null:h(a,b,""+c,d);if("object"===typeof c&&null!==c){switch(c.$$typeof){case Re:return c.key===e?c.type===Ve?u(a,b,c.props.children,d,e):k(a,b,c,d):null;case Se:return c.key===e?q(a,b,c,d):null;case Te:return null=== 2529 e?v(a,b,c,d):null;case Ue:return c.key===e?y(a,b,c,d):null}if(Ye(c)||Xe(c))return null!==e?null:u(a,b,c,d,null);$e(a,c)}return null}function I(a,b,c,d,e){if("string"===typeof d||"number"===typeof d)return a=a.get(c)||null,h(b,a,""+d,e);if("object"===typeof d&&null!==d){switch(d.$$typeof){case Re:return a=a.get(null===d.key?c:d.key)||null,d.type===Ve?u(b,a,d.props.children,e,d.key):k(b,a,d,e);case Se:return a=a.get(null===d.key?c:d.key)||null,q(b,a,d,e);case Te:return a=a.get(c)||null,v(b,a,d,e);case Ue:return a= 2530 a.get(null===d.key?c:d.key)||null,y(b,a,d,e)}if(Ye(d)||Xe(d))return a=a.get(c)||null,u(b,a,d,e,null);$e(b,d)}return null}function L(e,g,m,A){for(var h=null,r=null,n=g,w=g=0,k=null;null!==n&&w<m.length;w++){n.index>w?(k=n,n=null):k=n.sibling;var x=G(e,n,m[w],A);if(null===x){null===n&&(n=k);break}a&&n&&null===x.alternate&&b(e,n);g=f(x,g,w);null===r?h=x:r.sibling=x;r=x;n=k}if(w===m.length)return c(e,n),h;if(null===n){for(;w<m.length;w++)if(n=z(e,m[w],A))g=f(n,g,w),null===r?h=n:r.sibling=n,r=n;return h}for(n= 2531 d(e,n);w<m.length;w++)if(k=I(n,e,w,m[w],A)){if(a&&null!==k.alternate)n["delete"](null===k.key?w:k.key);g=f(k,g,w);null===r?h=k:r.sibling=k;r=k}a&&n.forEach(function(a){return b(e,a)});return h}function N(e,g,m,A){var h=Xe(m);"function"!==typeof h?E("150"):void 0;m=h.call(m);null==m?E("151"):void 0;for(var r=h=null,n=g,w=g=0,k=null,x=m.next();null!==n&&!x.done;w++,x=m.next()){n.index>w?(k=n,n=null):k=n.sibling;var J=G(e,n,x.value,A);if(null===J){n||(n=k);break}a&&n&&null===J.alternate&&b(e,n);g=f(J, 2532 g,w);null===r?h=J:r.sibling=J;r=J;n=k}if(x.done)return c(e,n),h;if(null===n){for(;!x.done;w++,x=m.next())x=z(e,x.value,A),null!==x&&(g=f(x,g,w),null===r?h=x:r.sibling=x,r=x);return h}for(n=d(e,n);!x.done;w++,x=m.next())if(x=I(n,e,w,x.value,A),null!==x){if(a&&null!==x.alternate)n["delete"](null===x.key?w:x.key);g=f(x,g,w);null===r?h=x:r.sibling=x;r=x}a&&n.forEach(function(a){return b(e,a)});return h}return function(a,d,f,h){"object"===typeof f&&null!==f&&f.type===Ve&&null===f.key&&(f=f.props.children); 2533 var m="object"===typeof f&&null!==f;if(m)switch(f.$$typeof){case Re:a:{var r=f.key;for(m=d;null!==m;){if(m.key===r)if(10===m.tag?f.type===Ve:m.type===f.type){c(a,m.sibling);d=e(m,f.type===Ve?f.props.children:f.props,h);d.ref=Ze(m,f);d["return"]=a;a=d;break a}else{c(a,m);break}else b(a,m);m=m.sibling}f.type===Ve?(d=ue(f.props.children,a.internalContextTag,h,f.key),d["return"]=a,a=d):(h=te(f,a.internalContextTag,h),h.ref=Ze(d,f),h["return"]=a,a=h)}return g(a);case Se:a:{for(m=f.key;null!==d;){if(d.key=== 2534 m)if(7===d.tag){c(a,d.sibling);d=e(d,f,h);d["return"]=a;a=d;break a}else{c(a,d);break}else b(a,d);d=d.sibling}d=we(f,a.internalContextTag,h);d["return"]=a;a=d}return g(a);case Te:a:{if(null!==d)if(9===d.tag){c(a,d.sibling);d=e(d,null,h);d.type=f.value;d["return"]=a;a=d;break a}else c(a,d);d=xe(f,a.internalContextTag,h);d.type=f.value;d["return"]=a;a=d}return g(a);case Ue:a:{for(m=f.key;null!==d;){if(d.key===m)if(4===d.tag&&d.stateNode.containerInfo===f.containerInfo&&d.stateNode.implementation=== 2535 f.implementation){c(a,d.sibling);d=e(d,f.children||[],h);d["return"]=a;a=d;break a}else{c(a,d);break}else b(a,d);d=d.sibling}d=ye(f,a.internalContextTag,h);d["return"]=a;a=d}return g(a)}if("string"===typeof f||"number"===typeof f)return f=""+f,null!==d&&6===d.tag?(c(a,d.sibling),d=e(d,f,h)):(c(a,d),d=ve(f,a.internalContextTag,h)),d["return"]=a,a=d,g(a);if(Ye(f))return L(a,d,f,h);if(Xe(f))return N(a,d,f,h);m&&$e(a,f);if("undefined"===typeof f)switch(a.tag){case 2:case 1:h=a.type,E("152",h.displayName|| 2536 h.name||"Component")}return c(a,d)}}var bf=af(!0),cf=af(!1); 2537 function df(a,b,c,d,e){function f(a,b,c){var d=b.expirationTime;b.child=null===a?cf(b,null,c,d):bf(b,a.child,c,d)}function g(a,b){var c=b.ref;null===c||a&&a.ref===c||(b.effectTag|=128)}function h(a,b,c,d){g(a,b);if(!c)return d&&re(b,!1),q(a,b);c=b.stateNode;id.current=b;var e=c.render();b.effectTag|=1;f(a,b,e);b.memoizedState=c.state;b.memoizedProps=c.props;d&&re(b,!0);return b.child}function k(a){var b=a.stateNode;b.pendingContext?oe(a,b.pendingContext,b.pendingContext!==b.context):b.context&&oe(a, 2538 b.context,!1);I(a,b.containerInfo)}function q(a,b){null!==a&&b.child!==a.child?E("153"):void 0;if(null!==b.child){a=b.child;var c=se(a,a.pendingProps,a.expirationTime);b.child=c;for(c["return"]=b;null!==a.sibling;)a=a.sibling,c=c.sibling=se(a,a.pendingProps,a.expirationTime),c["return"]=b;c.sibling=null}return b.child}function v(a,b){switch(b.tag){case 3:k(b);break;case 2:qe(b);break;case 4:I(b,b.stateNode.containerInfo)}return null}var y=a.shouldSetTextContent,u=a.useSyncScheduling,z=a.shouldDeprioritizeSubtree, 2539 G=b.pushHostContext,I=b.pushHostContainer,L=c.enterHydrationState,N=c.resetHydrationState,J=c.tryToClaimNextHydratableInstance;a=Le(d,e,function(a,b){a.memoizedProps=b},function(a,b){a.memoizedState=b});var w=a.adoptClassInstance,m=a.constructClassInstance,A=a.mountClassInstance,Ob=a.updateClassInstance;return{beginWork:function(a,b,c){if(0===b.expirationTime||b.expirationTime>c)return v(a,b);switch(b.tag){case 0:null!==a?E("155"):void 0;var d=b.type,e=b.pendingProps,r=ke(b);r=me(b,r);d=d(e,r);b.effectTag|= 2540 1;"object"===typeof d&&null!==d&&"function"===typeof d.render?(b.tag=2,e=qe(b),w(b,d),A(b,c),b=h(a,b,!0,e)):(b.tag=1,f(a,b,d),b.memoizedProps=e,b=b.child);return b;case 1:a:{e=b.type;c=b.pendingProps;d=b.memoizedProps;if(X.current)null===c&&(c=d);else if(null===c||d===c){b=q(a,b);break a}d=ke(b);d=me(b,d);e=e(c,d);b.effectTag|=1;f(a,b,e);b.memoizedProps=c;b=b.child}return b;case 2:return e=qe(b),d=void 0,null===a?b.stateNode?E("153"):(m(b,b.pendingProps),A(b,c),d=!0):d=Ob(a,b,c),h(a,b,d,e);case 3:return k(b), 2541 e=b.updateQueue,null!==e?(d=b.memoizedState,e=Je(a,b,e,null,null,c),d===e?(N(),b=q(a,b)):(d=e.element,r=b.stateNode,(null===a||null===a.child)&&r.hydrate&&L(b)?(b.effectTag|=2,b.child=cf(b,null,d,c)):(N(),f(a,b,d)),b.memoizedState=e,b=b.child)):(N(),b=q(a,b)),b;case 5:G(b);null===a&&J(b);e=b.type;var n=b.memoizedProps;d=b.pendingProps;null===d&&(d=n,null===d?E("154"):void 0);r=null!==a?a.memoizedProps:null;X.current||null!==d&&n!==d?(n=d.children,y(e,d)?n=null:r&&y(e,r)&&(b.effectTag|=16),g(a,b), 2542 2147483647!==c&&!u&&z(e,d)?(b.expirationTime=2147483647,b=null):(f(a,b,n),b.memoizedProps=d,b=b.child)):b=q(a,b);return b;case 6:return null===a&&J(b),a=b.pendingProps,null===a&&(a=b.memoizedProps),b.memoizedProps=a,null;case 8:b.tag=7;case 7:e=b.pendingProps;if(X.current)null===e&&(e=a&&a.memoizedProps,null===e?E("154"):void 0);else if(null===e||b.memoizedProps===e)e=b.memoizedProps;d=e.children;b.stateNode=null===a?cf(b,b.stateNode,d,c):bf(b,b.stateNode,d,c);b.memoizedProps=e;return b.stateNode; 2543 case 9:return null;case 4:a:{I(b,b.stateNode.containerInfo);e=b.pendingProps;if(X.current)null===e&&(e=a&&a.memoizedProps,null==e?E("154"):void 0);else if(null===e||b.memoizedProps===e){b=q(a,b);break a}null===a?b.child=bf(b,null,e,c):f(a,b,e);b.memoizedProps=e;b=b.child}return b;case 10:a:{c=b.pendingProps;if(X.current)null===c&&(c=b.memoizedProps);else if(null===c||b.memoizedProps===c){b=q(a,b);break a}f(a,b,c);b.memoizedProps=c;b=b.child}return b;default:E("156")}},beginFailedWork:function(a,b, 2544 c){switch(b.tag){case 2:qe(b);break;case 3:k(b);break;default:E("157")}b.effectTag|=64;null===a?b.child=null:b.child!==a.child&&(b.child=a.child);if(0===b.expirationTime||b.expirationTime>c)return v(a,b);b.firstEffect=null;b.lastEffect=null;b.child=null===a?cf(b,null,null,c):bf(b,a.child,null,c);2===b.tag&&(a=b.stateNode,b.memoizedProps=a.props,b.memoizedState=a.state);return b.child}}} 2545 function ef(a,b,c){function d(a){a.effectTag|=4}var e=a.createInstance,f=a.createTextInstance,g=a.appendInitialChild,h=a.finalizeInitialChildren,k=a.prepareUpdate,q=a.persistence,v=b.getRootHostContainer,y=b.popHostContext,u=b.getHostContext,z=b.popHostContainer,G=c.prepareToHydrateHostInstance,I=c.prepareToHydrateHostTextInstance,L=c.popHydrationState,N=void 0,J=void 0,w=void 0;a.mutation?(N=function(){},J=function(a,b,c){(b.updateQueue=c)&&d(b)},w=function(a,b,c,e){c!==e&&d(b)}):q?E("235"):E("236"); 2546 return{completeWork:function(a,b,c){var m=b.pendingProps;if(null===m)m=b.memoizedProps;else if(2147483647!==b.expirationTime||2147483647===c)b.pendingProps=null;switch(b.tag){case 1:return null;case 2:return ne(b),null;case 3:z(b);V(X,b);V(ie,b);m=b.stateNode;m.pendingContext&&(m.context=m.pendingContext,m.pendingContext=null);if(null===a||null===a.child)L(b),b.effectTag&=-3;N(b);return null;case 5:y(b);c=v();var A=b.type;if(null!==a&&null!=b.stateNode){var p=a.memoizedProps,q=b.stateNode,x=u();q= 2547 k(q,A,p,m,c,x);J(a,b,q,A,p,m,c);a.ref!==b.ref&&(b.effectTag|=128)}else{if(!m)return null===b.stateNode?E("166"):void 0,null;a=u();if(L(b))G(b,c,a)&&d(b);else{a=e(A,m,c,a,b);a:for(p=b.child;null!==p;){if(5===p.tag||6===p.tag)g(a,p.stateNode);else if(4!==p.tag&&null!==p.child){p.child["return"]=p;p=p.child;continue}if(p===b)break;for(;null===p.sibling;){if(null===p["return"]||p["return"]===b)break a;p=p["return"]}p.sibling["return"]=p["return"];p=p.sibling}h(a,A,m,c)&&d(b);b.stateNode=a}null!==b.ref&& 2548 (b.effectTag|=128)}return null;case 6:if(a&&null!=b.stateNode)w(a,b,a.memoizedProps,m);else{if("string"!==typeof m)return null===b.stateNode?E("166"):void 0,null;a=v();c=u();L(b)?I(b)&&d(b):b.stateNode=f(m,a,c,b)}return null;case 7:(m=b.memoizedProps)?void 0:E("165");b.tag=8;A=[];a:for((p=b.stateNode)&&(p["return"]=b);null!==p;){if(5===p.tag||6===p.tag||4===p.tag)E("247");else if(9===p.tag)A.push(p.type);else if(null!==p.child){p.child["return"]=p;p=p.child;continue}for(;null===p.sibling;){if(null=== 2549 p["return"]||p["return"]===b)break a;p=p["return"]}p.sibling["return"]=p["return"];p=p.sibling}p=m.handler;m=p(m.props,A);b.child=bf(b,null!==a?a.child:null,m,c);return b.child;case 8:return b.tag=7,null;case 9:return null;case 10:return null;case 4:return z(b),N(b),null;case 0:E("167");default:E("156")}}}} 2550 function ff(a,b){function c(a){var c=a.ref;if(null!==c)try{c(null)}catch(A){b(a,A)}}function d(a){"function"===typeof Ee&&Ee(a);switch(a.tag){case 2:c(a);var d=a.stateNode;if("function"===typeof d.componentWillUnmount)try{d.props=a.memoizedProps,d.state=a.memoizedState,d.componentWillUnmount()}catch(A){b(a,A)}break;case 5:c(a);break;case 7:e(a.stateNode);break;case 4:k&&g(a)}}function e(a){for(var b=a;;)if(d(b),null===b.child||k&&4===b.tag){if(b===a)break;for(;null===b.sibling;){if(null===b["return"]|| 2551 b["return"]===a)return;b=b["return"]}b.sibling["return"]=b["return"];b=b.sibling}else b.child["return"]=b,b=b.child}function f(a){return 5===a.tag||3===a.tag||4===a.tag}function g(a){for(var b=a,c=!1,f=void 0,g=void 0;;){if(!c){c=b["return"];a:for(;;){null===c?E("160"):void 0;switch(c.tag){case 5:f=c.stateNode;g=!1;break a;case 3:f=c.stateNode.containerInfo;g=!0;break a;case 4:f=c.stateNode.containerInfo;g=!0;break a}c=c["return"]}c=!0}if(5===b.tag||6===b.tag)e(b),g?J(f,b.stateNode):N(f,b.stateNode); 2552 else if(4===b.tag?f=b.stateNode.containerInfo:d(b),null!==b.child){b.child["return"]=b;b=b.child;continue}if(b===a)break;for(;null===b.sibling;){if(null===b["return"]||b["return"]===a)return;b=b["return"];4===b.tag&&(c=!1)}b.sibling["return"]=b["return"];b=b.sibling}}var h=a.getPublicInstance,k=a.mutation;a=a.persistence;k||(a?E("235"):E("236"));var q=k.commitMount,v=k.commitUpdate,y=k.resetTextContent,u=k.commitTextUpdate,z=k.appendChild,G=k.appendChildToContainer,I=k.insertBefore,L=k.insertInContainerBefore, 2553 N=k.removeChild,J=k.removeChildFromContainer;return{commitResetTextContent:function(a){y(a.stateNode)},commitPlacement:function(a){a:{for(var b=a["return"];null!==b;){if(f(b)){var c=b;break a}b=b["return"]}E("160");c=void 0}var d=b=void 0;switch(c.tag){case 5:b=c.stateNode;d=!1;break;case 3:b=c.stateNode.containerInfo;d=!0;break;case 4:b=c.stateNode.containerInfo;d=!0;break;default:E("161")}c.effectTag&16&&(y(b),c.effectTag&=-17);a:b:for(c=a;;){for(;null===c.sibling;){if(null===c["return"]||f(c["return"])){c= 2554 null;break a}c=c["return"]}c.sibling["return"]=c["return"];for(c=c.sibling;5!==c.tag&&6!==c.tag;){if(c.effectTag&2)continue b;if(null===c.child||4===c.tag)continue b;else c.child["return"]=c,c=c.child}if(!(c.effectTag&2)){c=c.stateNode;break a}}for(var e=a;;){if(5===e.tag||6===e.tag)c?d?L(b,e.stateNode,c):I(b,e.stateNode,c):d?G(b,e.stateNode):z(b,e.stateNode);else if(4!==e.tag&&null!==e.child){e.child["return"]=e;e=e.child;continue}if(e===a)break;for(;null===e.sibling;){if(null===e["return"]||e["return"]=== 2555 a)return;e=e["return"]}e.sibling["return"]=e["return"];e=e.sibling}},commitDeletion:function(a){g(a);a["return"]=null;a.child=null;a.alternate&&(a.alternate.child=null,a.alternate["return"]=null)},commitWork:function(a,b){switch(b.tag){case 2:break;case 5:var c=b.stateNode;if(null!=c){var d=b.memoizedProps;a=null!==a?a.memoizedProps:d;var e=b.type,f=b.updateQueue;b.updateQueue=null;null!==f&&v(c,f,e,a,d,b)}break;case 6:null===b.stateNode?E("162"):void 0;c=b.memoizedProps;u(b.stateNode,null!==a?a.memoizedProps: 2556 c,c);break;case 3:break;default:E("163")}},commitLifeCycles:function(a,b){switch(b.tag){case 2:var c=b.stateNode;if(b.effectTag&4)if(null===a)c.props=b.memoizedProps,c.state=b.memoizedState,c.componentDidMount();else{var d=a.memoizedProps;a=a.memoizedState;c.props=b.memoizedProps;c.state=b.memoizedState;c.componentDidUpdate(d,a)}b=b.updateQueue;null!==b&&Ke(b,c);break;case 3:c=b.updateQueue;null!==c&&Ke(c,null!==b.child?b.child.stateNode:null);break;case 5:c=b.stateNode;null===a&&b.effectTag&4&&q(c, 2557 b.type,b.memoizedProps,b);break;case 6:break;case 4:break;default:E("163")}},commitAttachRef:function(a){var b=a.ref;if(null!==b){var c=a.stateNode;switch(a.tag){case 5:b(h(c));break;default:b(c)}}},commitDetachRef:function(a){a=a.ref;null!==a&&a(null)}}}var gf={}; 2558 function hf(a){function b(a){a===gf?E("174"):void 0;return a}var c=a.getChildHostContext,d=a.getRootHostContext,e={current:gf},f={current:gf},g={current:gf};return{getHostContext:function(){return b(e.current)},getRootHostContainer:function(){return b(g.current)},popHostContainer:function(a){V(e,a);V(f,a);V(g,a)},popHostContext:function(a){f.current===a&&(V(e,a),V(f,a))},pushHostContainer:function(a,b){W(g,b,a);b=d(b);W(f,a,a);W(e,b,a)},pushHostContext:function(a){var d=b(g.current),h=b(e.current); 2559 d=c(h,a.type,d);h!==d&&(W(f,a,a),W(e,d,a))},resetHostContainer:function(){e.current=gf;g.current=gf}}} 2560 function jf(a){function b(a,b){var c=new Y(5,null,0);c.type="DELETED";c.stateNode=b;c["return"]=a;c.effectTag=8;null!==a.lastEffect?(a.lastEffect.nextEffect=c,a.lastEffect=c):a.firstEffect=a.lastEffect=c}function c(a,b){switch(a.tag){case 5:return b=f(b,a.type,a.pendingProps),null!==b?(a.stateNode=b,!0):!1;case 6:return b=g(b,a.pendingProps),null!==b?(a.stateNode=b,!0):!1;default:return!1}}function d(a){for(a=a["return"];null!==a&&5!==a.tag&&3!==a.tag;)a=a["return"];y=a}var e=a.shouldSetTextContent; 2561 a=a.hydration;if(!a)return{enterHydrationState:function(){return!1},resetHydrationState:function(){},tryToClaimNextHydratableInstance:function(){},prepareToHydrateHostInstance:function(){E("175")},prepareToHydrateHostTextInstance:function(){E("176")},popHydrationState:function(){return!1}};var f=a.canHydrateInstance,g=a.canHydrateTextInstance,h=a.getNextHydratableSibling,k=a.getFirstHydratableChild,q=a.hydrateInstance,v=a.hydrateTextInstance,y=null,u=null,z=!1;return{enterHydrationState:function(a){u= 2562 k(a.stateNode.containerInfo);y=a;return z=!0},resetHydrationState:function(){u=y=null;z=!1},tryToClaimNextHydratableInstance:function(a){if(z){var d=u;if(d){if(!c(a,d)){d=h(d);if(!d||!c(a,d)){a.effectTag|=2;z=!1;y=a;return}b(y,u)}y=a;u=k(d)}else a.effectTag|=2,z=!1,y=a}},prepareToHydrateHostInstance:function(a,b,c){b=q(a.stateNode,a.type,a.memoizedProps,b,c,a);a.updateQueue=b;return null!==b?!0:!1},prepareToHydrateHostTextInstance:function(a){return v(a.stateNode,a.memoizedProps,a)},popHydrationState:function(a){if(a!== 2563 y)return!1;if(!z)return d(a),z=!0,!1;var c=a.type;if(5!==a.tag||"head"!==c&&"body"!==c&&!e(c,a.memoizedProps))for(c=u;c;)b(a,c),c=h(c);d(a);u=y?h(a.stateNode):null;return!0}}} 2564 function kf(a){function b(a){Qb=ja=!0;var b=a.stateNode;b.current===a?E("177"):void 0;b.isReadyForCommit=!1;id.current=null;if(1<a.effectTag)if(null!==a.lastEffect){a.lastEffect.nextEffect=a;var c=a.firstEffect}else c=a;else c=a.firstEffect;yg();for(t=c;null!==t;){var d=!1,e=void 0;try{for(;null!==t;){var f=t.effectTag;f&16&&zg(t);if(f&128){var g=t.alternate;null!==g&&Ag(g)}switch(f&-242){case 2:Ne(t);t.effectTag&=-3;break;case 6:Ne(t);t.effectTag&=-3;Oe(t.alternate,t);break;case 4:Oe(t.alternate, 2565 t);break;case 8:Sc=!0,Bg(t),Sc=!1}t=t.nextEffect}}catch(Tc){d=!0,e=Tc}d&&(null===t?E("178"):void 0,h(t,e),null!==t&&(t=t.nextEffect))}Cg();b.current=a;for(t=c;null!==t;){c=!1;d=void 0;try{for(;null!==t;){var k=t.effectTag;k&36&&Dg(t.alternate,t);k&128&&Eg(t);if(k&64)switch(e=t,f=void 0,null!==R&&(f=R.get(e),R["delete"](e),null==f&&null!==e.alternate&&(e=e.alternate,f=R.get(e),R["delete"](e))),null==f?E("184"):void 0,e.tag){case 2:e.stateNode.componentDidCatch(f.error,{componentStack:f.componentStack}); 2566 break;case 3:null===ca&&(ca=f.error);break;default:E("157")}var Qc=t.nextEffect;t.nextEffect=null;t=Qc}}catch(Tc){c=!0,d=Tc}c&&(null===t?E("178"):void 0,h(t,d),null!==t&&(t=t.nextEffect))}ja=Qb=!1;"function"===typeof De&&De(a.stateNode);ha&&(ha.forEach(G),ha=null);null!==ca&&(a=ca,ca=null,Ob(a));b=b.current.expirationTime;0===b&&(qa=R=null);return b}function c(a){for(;;){var b=Fg(a.alternate,a,H),c=a["return"],d=a.sibling;var e=a;if(2147483647===H||2147483647!==e.expirationTime){if(2!==e.tag&&3!== 2567 e.tag)var f=0;else f=e.updateQueue,f=null===f?0:f.expirationTime;for(var g=e.child;null!==g;)0!==g.expirationTime&&(0===f||f>g.expirationTime)&&(f=g.expirationTime),g=g.sibling;e.expirationTime=f}if(null!==b)return b;null!==c&&(null===c.firstEffect&&(c.firstEffect=a.firstEffect),null!==a.lastEffect&&(null!==c.lastEffect&&(c.lastEffect.nextEffect=a.firstEffect),c.lastEffect=a.lastEffect),1<a.effectTag&&(null!==c.lastEffect?c.lastEffect.nextEffect=a:c.firstEffect=a,c.lastEffect=a));if(null!==d)return d; 2568 if(null!==c)a=c;else{a.stateNode.isReadyForCommit=!0;break}}return null}function d(a){var b=rg(a.alternate,a,H);null===b&&(b=c(a));id.current=null;return b}function e(a){var b=Gg(a.alternate,a,H);null===b&&(b=c(a));id.current=null;return b}function f(a){if(null!==R){if(!(0===H||H>a))if(H<=Uc)for(;null!==F;)F=k(F)?e(F):d(F);else for(;null!==F&&!A();)F=k(F)?e(F):d(F)}else if(!(0===H||H>a))if(H<=Uc)for(;null!==F;)F=d(F);else for(;null!==F&&!A();)F=d(F)}function g(a,b){ja?E("243"):void 0;ja=!0;a.isReadyForCommit= 2569 !1;if(a!==ra||b!==H||null===F){for(;-1<he;)ge[he]=null,he--;je=D;ie.current=D;X.current=!1;x();ra=a;H=b;F=se(ra.current,null,b)}var c=!1,d=null;try{f(b)}catch(Rc){c=!0,d=Rc}for(;c;){if(eb){ca=d;break}var g=F;if(null===g)eb=!0;else{var k=h(g,d);null===k?E("183"):void 0;if(!eb){try{c=k;d=b;for(k=c;null!==g;){switch(g.tag){case 2:ne(g);break;case 5:qg(g);break;case 3:p(g);break;case 4:p(g)}if(g===k||g.alternate===k)break;g=g["return"]}F=e(c);f(d)}catch(Rc){c=!0;d=Rc;continue}break}}}b=ca;eb=ja=!1;ca= 2570 null;null!==b&&Ob(b);return a.isReadyForCommit?a.current.alternate:null}function h(a,b){var c=id.current=null,d=!1,e=!1,f=null;if(3===a.tag)c=a,q(a)&&(eb=!0);else for(var g=a["return"];null!==g&&null===c;){2===g.tag?"function"===typeof g.stateNode.componentDidCatch&&(d=!0,f=jd(g),c=g,e=!0):3===g.tag&&(c=g);if(q(g)){if(Sc||null!==ha&&(ha.has(g)||null!==g.alternate&&ha.has(g.alternate)))return null;c=null;e=!1}g=g["return"]}if(null!==c){null===qa&&(qa=new Set);qa.add(c);var h="";g=a;do{a:switch(g.tag){case 0:case 1:case 2:case 5:var k= 2571 g._debugOwner,Qc=g._debugSource;var m=jd(g);var n=null;k&&(n=jd(k));k=Qc;m="\n in "+(m||"Unknown")+(k?" (at "+k.fileName.replace(/^.*[\\\/]/,"")+":"+k.lineNumber+")":n?" (created by "+n+")":"");break a;default:m=""}h+=m;g=g["return"]}while(g);g=h;a=jd(a);null===R&&(R=new Map);b={componentName:a,componentStack:g,error:b,errorBoundary:d?c.stateNode:null,errorBoundaryFound:d,errorBoundaryName:f,willRetry:e};R.set(c,b);try{var p=b.error;p&&p.suppressReactErrorLogging||console.error(p)}catch(Vc){Vc&& 2572 Vc.suppressReactErrorLogging||console.error(Vc)}Qb?(null===ha&&(ha=new Set),ha.add(c)):G(c);return c}null===ca&&(ca=b);return null}function k(a){return null!==R&&(R.has(a)||null!==a.alternate&&R.has(a.alternate))}function q(a){return null!==qa&&(qa.has(a)||null!==a.alternate&&qa.has(a.alternate))}function v(){return 20*(((I()+100)/20|0)+1)}function y(a){return 0!==ka?ka:ja?Qb?1:H:!Hg||a.internalContextTag&1?v():1}function u(a,b){return z(a,b,!1)}function z(a,b){for(;null!==a;){if(0===a.expirationTime|| 2573 a.expirationTime>b)a.expirationTime=b;null!==a.alternate&&(0===a.alternate.expirationTime||a.alternate.expirationTime>b)&&(a.alternate.expirationTime=b);if(null===a["return"])if(3===a.tag){var c=a.stateNode;!ja&&c===ra&&b<H&&(F=ra=null,H=0);var d=c,e=b;Rb>Ig&&E("185");if(null===d.nextScheduledRoot)d.remainingExpirationTime=e,null===O?(sa=O=d,d.nextScheduledRoot=d):(O=O.nextScheduledRoot=d,O.nextScheduledRoot=sa);else{var f=d.remainingExpirationTime;if(0===f||e<f)d.remainingExpirationTime=e}Fa||(la? 2574 Sb&&(ma=d,na=1,m(ma,na)):1===e?w(1,null):L(e));!ja&&c===ra&&b<H&&(F=ra=null,H=0)}else break;a=a["return"]}}function G(a){z(a,1,!0)}function I(){return Uc=((Wc()-Pe)/10|0)+2}function L(a){if(0!==Tb){if(a>Tb)return;Jg(Xc)}var b=Wc()-Pe;Tb=a;Xc=Kg(J,{timeout:10*(a-2)-b})}function N(){var a=0,b=null;if(null!==O)for(var c=O,d=sa;null!==d;){var e=d.remainingExpirationTime;if(0===e){null===c||null===O?E("244"):void 0;if(d===d.nextScheduledRoot){sa=O=d.nextScheduledRoot=null;break}else if(d===sa)sa=e=d.nextScheduledRoot, 2575 O.nextScheduledRoot=e,d.nextScheduledRoot=null;else if(d===O){O=c;O.nextScheduledRoot=sa;d.nextScheduledRoot=null;break}else c.nextScheduledRoot=d.nextScheduledRoot,d.nextScheduledRoot=null;d=c.nextScheduledRoot}else{if(0===a||e<a)a=e,b=d;if(d===O)break;c=d;d=d.nextScheduledRoot}}c=ma;null!==c&&c===b?Rb++:Rb=0;ma=b;na=a}function J(a){w(0,a)}function w(a,b){fb=b;for(N();null!==ma&&0!==na&&(0===a||na<=a)&&!Yc;)m(ma,na),N();null!==fb&&(Tb=0,Xc=-1);0!==na&&L(na);fb=null;Yc=!1;Rb=0;if(Ub)throw a=Zc,Zc= 2576 null,Ub=!1,a;}function m(a,c){Fa?E("245"):void 0;Fa=!0;if(c<=I()){var d=a.finishedWork;null!==d?(a.finishedWork=null,a.remainingExpirationTime=b(d)):(a.finishedWork=null,d=g(a,c),null!==d&&(a.remainingExpirationTime=b(d)))}else d=a.finishedWork,null!==d?(a.finishedWork=null,a.remainingExpirationTime=b(d)):(a.finishedWork=null,d=g(a,c),null!==d&&(A()?a.finishedWork=d:a.remainingExpirationTime=b(d)));Fa=!1}function A(){return null===fb||fb.timeRemaining()>Lg?!1:Yc=!0}function Ob(a){null===ma?E("246"): 2577 void 0;ma.remainingExpirationTime=0;Ub||(Ub=!0,Zc=a)}var r=hf(a),n=jf(a),p=r.popHostContainer,qg=r.popHostContext,x=r.resetHostContainer,Me=df(a,r,n,u,y),rg=Me.beginWork,Gg=Me.beginFailedWork,Fg=ef(a,r,n).completeWork;r=ff(a,h);var zg=r.commitResetTextContent,Ne=r.commitPlacement,Bg=r.commitDeletion,Oe=r.commitWork,Dg=r.commitLifeCycles,Eg=r.commitAttachRef,Ag=r.commitDetachRef,Wc=a.now,Kg=a.scheduleDeferredCallback,Jg=a.cancelDeferredCallback,Hg=a.useSyncScheduling,yg=a.prepareForCommit,Cg=a.resetAfterCommit, 2578 Pe=Wc(),Uc=2,ka=0,ja=!1,F=null,ra=null,H=0,t=null,R=null,qa=null,ha=null,ca=null,eb=!1,Qb=!1,Sc=!1,sa=null,O=null,Tb=0,Xc=-1,Fa=!1,ma=null,na=0,Yc=!1,Ub=!1,Zc=null,fb=null,la=!1,Sb=!1,Ig=1E3,Rb=0,Lg=1;return{computeAsyncExpiration:v,computeExpirationForFiber:y,scheduleWork:u,batchedUpdates:function(a,b){var c=la;la=!0;try{return a(b)}finally{(la=c)||Fa||w(1,null)}},unbatchedUpdates:function(a){if(la&&!Sb){Sb=!0;try{return a()}finally{Sb=!1}}return a()},flushSync:function(a){var b=la;la=!0;try{a:{var c= 2579 ka;ka=1;try{var d=a();break a}finally{ka=c}d=void 0}return d}finally{la=b,Fa?E("187"):void 0,w(1,null)}},deferredUpdates:function(a){var b=ka;ka=v();try{return a()}finally{ka=b}}}} 2580 function lf(a){function b(a){a=od(a);return null===a?null:a.stateNode}var c=a.getPublicInstance;a=kf(a);var d=a.computeAsyncExpiration,e=a.computeExpirationForFiber,f=a.scheduleWork;return{createContainer:function(a,b){var c=new Y(3,null,0);a={current:c,containerInfo:a,pendingChildren:null,remainingExpirationTime:0,isReadyForCommit:!1,finishedWork:null,context:null,pendingContext:null,hydrate:b,nextScheduledRoot:null};return c.stateNode=a},updateContainer:function(a,b,c,q){var g=b.current;if(c){c= 2581 c._reactInternalFiber;var h;b:{2===kd(c)&&2===c.tag?void 0:E("170");for(h=c;3!==h.tag;){if(le(h)){h=h.stateNode.__reactInternalMemoizedMergedChildContext;break b}(h=h["return"])?void 0:E("171")}h=h.stateNode.context}c=le(c)?pe(c,h):h}else c=D;null===b.context?b.context=c:b.pendingContext=c;b=q;b=void 0===b?null:b;q=null!=a&&null!=a.type&&null!=a.type.prototype&&!0===a.type.prototype.unstable_isAsyncReactComponent?d():e(g);He(g,{expirationTime:q,partialState:{element:a},callback:b,isReplace:!1,isForced:!1, 2582 nextCallback:null,next:null});f(g,q)},batchedUpdates:a.batchedUpdates,unbatchedUpdates:a.unbatchedUpdates,deferredUpdates:a.deferredUpdates,flushSync:a.flushSync,getPublicRootInstance:function(a){a=a.current;if(!a.child)return null;switch(a.child.tag){case 5:return c(a.child.stateNode);default:return a.child.stateNode}},findHostInstance:b,findHostInstanceWithNoPortals:function(a){a=pd(a);return null===a?null:a.stateNode},injectIntoDevTools:function(a){var c=a.findFiberByHostInstance;return Ce(B({}, 2583 a,{findHostInstanceByFiber:function(a){return b(a)},findFiberByHostInstance:function(a){return c?c(a):null}}))}}}var mf=Object.freeze({default:lf}),nf=mf&&lf||mf,of=nf["default"]?nf["default"]:nf;function pf(a,b,c){var d=3<arguments.length&&void 0!==arguments[3]?arguments[3]:null;return{$$typeof:Ue,key:null==d?null:""+d,children:a,containerInfo:b,implementation:c}}var qf="object"===typeof performance&&"function"===typeof performance.now,rf=void 0;rf=qf?function(){return performance.now()}:function(){return Date.now()}; 2584 var sf=void 0,tf=void 0; 2585 if(l.canUseDOM)if("function"!==typeof requestIdleCallback||"function"!==typeof cancelIdleCallback){var uf=null,vf=!1,wf=-1,xf=!1,yf=0,zf=33,Af=33,Bf;Bf=qf?{didTimeout:!1,timeRemaining:function(){var a=yf-performance.now();return 0<a?a:0}}:{didTimeout:!1,timeRemaining:function(){var a=yf-Date.now();return 0<a?a:0}};var Cf="__reactIdleCallback$"+Math.random().toString(36).slice(2);window.addEventListener("message",function(a){if(a.source===window&&a.data===Cf){vf=!1;a=rf();if(0>=yf-a)if(-1!==wf&&wf<= 2586 a)Bf.didTimeout=!0;else{xf||(xf=!0,requestAnimationFrame(Df));return}else Bf.didTimeout=!1;wf=-1;a=uf;uf=null;null!==a&&a(Bf)}},!1);var Df=function(a){xf=!1;var b=a-yf+Af;b<Af&&zf<Af?(8>b&&(b=8),Af=b<zf?zf:b):zf=b;yf=a+Af;vf||(vf=!0,window.postMessage(Cf,"*"))};sf=function(a,b){uf=a;null!=b&&"number"===typeof b.timeout&&(wf=rf()+b.timeout);xf||(xf=!0,requestAnimationFrame(Df));return 0};tf=function(){uf=null;vf=!1;wf=-1}}else sf=window.requestIdleCallback,tf=window.cancelIdleCallback;else sf=function(a){return setTimeout(function(){a({timeRemaining:function(){return Infinity}})})}, 2587 tf=function(a){clearTimeout(a)};var Ef=/^[: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][: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\-.0-9\u00B7\u0300-\u036F\u203F-\u2040]*$/,Ff={},Gf={}; 2588 function Hf(a){if(Gf.hasOwnProperty(a))return!0;if(Ff.hasOwnProperty(a))return!1;if(Ef.test(a))return Gf[a]=!0;Ff[a]=!0;return!1} 2589 function If(a,b,c){var d=wa(b);if(d&&va(b,c)){var e=d.mutationMethod;e?e(a,c):null==c||d.hasBooleanValue&&!c||d.hasNumericValue&&isNaN(c)||d.hasPositiveNumericValue&&1>c||d.hasOverloadedBooleanValue&&!1===c?Jf(a,b):d.mustUseProperty?a[d.propertyName]=c:(b=d.attributeName,(e=d.attributeNamespace)?a.setAttributeNS(e,b,""+c):d.hasBooleanValue||d.hasOverloadedBooleanValue&&!0===c?a.setAttribute(b,""):a.setAttribute(b,""+c))}else Kf(a,b,va(b,c)?c:null)} 2590 function Kf(a,b,c){Hf(b)&&(null==c?a.removeAttribute(b):a.setAttribute(b,""+c))}function Jf(a,b){var c=wa(b);c?(b=c.mutationMethod)?b(a,void 0):c.mustUseProperty?a[c.propertyName]=c.hasBooleanValue?!1:"":a.removeAttribute(c.attributeName):a.removeAttribute(b)} 2591 function Lf(a,b){var c=b.value,d=b.checked;return B({type:void 0,step:void 0,min:void 0,max:void 0},b,{defaultChecked:void 0,defaultValue:void 0,value:null!=c?c:a._wrapperState.initialValue,checked:null!=d?d:a._wrapperState.initialChecked})}function Mf(a,b){var c=b.defaultValue;a._wrapperState={initialChecked:null!=b.checked?b.checked:b.defaultChecked,initialValue:null!=b.value?b.value:c,controlled:"checkbox"===b.type||"radio"===b.type?null!=b.checked:null!=b.value}} 2592 function Nf(a,b){b=b.checked;null!=b&&If(a,"checked",b)}function Of(a,b){Nf(a,b);var c=b.value;if(null!=c)if(0===c&&""===a.value)a.value="0";else if("number"===b.type){if(b=parseFloat(a.value)||0,c!=b||c==b&&a.value!=c)a.value=""+c}else a.value!==""+c&&(a.value=""+c);else null==b.value&&null!=b.defaultValue&&a.defaultValue!==""+b.defaultValue&&(a.defaultValue=""+b.defaultValue),null==b.checked&&null!=b.defaultChecked&&(a.defaultChecked=!!b.defaultChecked)} 2593 function Pf(a,b){switch(b.type){case "submit":case "reset":break;case "color":case "date":case "datetime":case "datetime-local":case "month":case "time":case "week":a.value="";a.value=a.defaultValue;break;default:a.value=a.value}b=a.name;""!==b&&(a.name="");a.defaultChecked=!a.defaultChecked;a.defaultChecked=!a.defaultChecked;""!==b&&(a.name=b)}function Qf(a){var b="";aa.Children.forEach(a,function(a){null==a||"string"!==typeof a&&"number"!==typeof a||(b+=a)});return b} 2594 function Rf(a,b){a=B({children:void 0},b);if(b=Qf(b.children))a.children=b;return a}function Sf(a,b,c,d){a=a.options;if(b){b={};for(var e=0;e<c.length;e++)b["$"+c[e]]=!0;for(c=0;c<a.length;c++)e=b.hasOwnProperty("$"+a[c].value),a[c].selected!==e&&(a[c].selected=e),e&&d&&(a[c].defaultSelected=!0)}else{c=""+c;b=null;for(e=0;e<a.length;e++){if(a[e].value===c){a[e].selected=!0;d&&(a[e].defaultSelected=!0);return}null!==b||a[e].disabled||(b=a[e])}null!==b&&(b.selected=!0)}} 2595 function Tf(a,b){var c=b.value;a._wrapperState={initialValue:null!=c?c:b.defaultValue,wasMultiple:!!b.multiple}}function Uf(a,b){null!=b.dangerouslySetInnerHTML?E("91"):void 0;return B({},b,{value:void 0,defaultValue:void 0,children:""+a._wrapperState.initialValue})}function Vf(a,b){var c=b.value;null==c&&(c=b.defaultValue,b=b.children,null!=b&&(null!=c?E("92"):void 0,Array.isArray(b)&&(1>=b.length?void 0:E("93"),b=b[0]),c=""+b),null==c&&(c=""));a._wrapperState={initialValue:""+c}} 2596 function Wf(a,b){var c=b.value;null!=c&&(c=""+c,c!==a.value&&(a.value=c),null==b.defaultValue&&(a.defaultValue=c));null!=b.defaultValue&&(a.defaultValue=b.defaultValue)}function Xf(a){var b=a.textContent;b===a._wrapperState.initialValue&&(a.value=b)}var Yf={html:"http://www.w3.org/1999/xhtml",mathml:"http://www.w3.org/1998/Math/MathML",svg:"http://www.w3.org/2000/svg"}; 2597 function Zf(a){switch(a){case "svg":return"http://www.w3.org/2000/svg";case "math":return"http://www.w3.org/1998/Math/MathML";default:return"http://www.w3.org/1999/xhtml"}}function $f(a,b){return null==a||"http://www.w3.org/1999/xhtml"===a?Zf(b):"http://www.w3.org/2000/svg"===a&&"foreignObject"===b?"http://www.w3.org/1999/xhtml":a} 2598 var ag=void 0,bg=function(a){return"undefined"!==typeof MSApp&&MSApp.execUnsafeLocalFunction?function(b,c,d,e){MSApp.execUnsafeLocalFunction(function(){return a(b,c,d,e)})}:a}(function(a,b){if(a.namespaceURI!==Yf.svg||"innerHTML"in a)a.innerHTML=b;else{ag=ag||document.createElement("div");ag.innerHTML="\x3csvg\x3e"+b+"\x3c/svg\x3e";for(b=ag.firstChild;a.firstChild;)a.removeChild(a.firstChild);for(;b.firstChild;)a.appendChild(b.firstChild)}}); 2599 function cg(a,b){if(b){var c=a.firstChild;if(c&&c===a.lastChild&&3===c.nodeType){c.nodeValue=b;return}}a.textContent=b} 2600 var dg={animationIterationCount:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,floodOpacity:!0, 2601 stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},eg=["Webkit","ms","Moz","O"];Object.keys(dg).forEach(function(a){eg.forEach(function(b){b=b+a.charAt(0).toUpperCase()+a.substring(1);dg[b]=dg[a]})}); 2602 function fg(a,b){a=a.style;for(var c in b)if(b.hasOwnProperty(c)){var d=0===c.indexOf("--");var e=c;var f=b[c];e=null==f||"boolean"===typeof f||""===f?"":d||"number"!==typeof f||0===f||dg.hasOwnProperty(e)&&dg[e]?(""+f).trim():f+"px";"float"===c&&(c="cssFloat");d?a.setProperty(c,e):a[c]=e}}var gg=B({menuitem:!0},{area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0}); 2603 function hg(a,b,c){b&&(gg[a]&&(null!=b.children||null!=b.dangerouslySetInnerHTML?E("137",a,c()):void 0),null!=b.dangerouslySetInnerHTML&&(null!=b.children?E("60"):void 0,"object"===typeof b.dangerouslySetInnerHTML&&"__html"in b.dangerouslySetInnerHTML?void 0:E("61")),null!=b.style&&"object"!==typeof b.style?E("62",c()):void 0)} 2604 function ig(a,b){if(-1===a.indexOf("-"))return"string"===typeof b.is;switch(a){case "annotation-xml":case "color-profile":case "font-face":case "font-face-src":case "font-face-uri":case "font-face-format":case "font-face-name":case "missing-glyph":return!1;default:return!0}}var jg=Yf.html,kg=C.thatReturns(""); 2605 function lg(a,b){a=9===a.nodeType||11===a.nodeType?a:a.ownerDocument;var c=Hd(a);b=Sa[b];for(var d=0;d<b.length;d++){var e=b[d];c.hasOwnProperty(e)&&c[e]||("topScroll"===e?wd("topScroll","scroll",a):"topFocus"===e||"topBlur"===e?(wd("topFocus","focus",a),wd("topBlur","blur",a),c.topBlur=!0,c.topFocus=!0):"topCancel"===e?(yc("cancel",!0)&&wd("topCancel","cancel",a),c.topCancel=!0):"topClose"===e?(yc("close",!0)&&wd("topClose","close",a),c.topClose=!0):Dd.hasOwnProperty(e)&&U(e,Dd[e],a),c[e]=!0)}} 2606 var mg={topAbort:"abort",topCanPlay:"canplay",topCanPlayThrough:"canplaythrough",topDurationChange:"durationchange",topEmptied:"emptied",topEncrypted:"encrypted",topEnded:"ended",topError:"error",topLoadedData:"loadeddata",topLoadedMetadata:"loadedmetadata",topLoadStart:"loadstart",topPause:"pause",topPlay:"play",topPlaying:"playing",topProgress:"progress",topRateChange:"ratechange",topSeeked:"seeked",topSeeking:"seeking",topStalled:"stalled",topSuspend:"suspend",topTimeUpdate:"timeupdate",topVolumeChange:"volumechange", 2607 topWaiting:"waiting"};function ng(a,b,c,d){c=9===c.nodeType?c:c.ownerDocument;d===jg&&(d=Zf(a));d===jg?"script"===a?(a=c.createElement("div"),a.innerHTML="\x3cscript\x3e\x3c/script\x3e",a=a.removeChild(a.firstChild)):a="string"===typeof b.is?c.createElement(a,{is:b.is}):c.createElement(a):a=c.createElementNS(d,a);return a}function og(a,b){return(9===b.nodeType?b:b.ownerDocument).createTextNode(a)} 2608 function pg(a,b,c,d){var e=ig(b,c);switch(b){case "iframe":case "object":U("topLoad","load",a);var f=c;break;case "video":case "audio":for(f in mg)mg.hasOwnProperty(f)&&U(f,mg[f],a);f=c;break;case "source":U("topError","error",a);f=c;break;case "img":case "image":U("topError","error",a);U("topLoad","load",a);f=c;break;case "form":U("topReset","reset",a);U("topSubmit","submit",a);f=c;break;case "details":U("topToggle","toggle",a);f=c;break;case "input":Mf(a,c);f=Lf(a,c);U("topInvalid","invalid",a); 2609 lg(d,"onChange");break;case "option":f=Rf(a,c);break;case "select":Tf(a,c);f=B({},c,{value:void 0});U("topInvalid","invalid",a);lg(d,"onChange");break;case "textarea":Vf(a,c);f=Uf(a,c);U("topInvalid","invalid",a);lg(d,"onChange");break;default:f=c}hg(b,f,kg);var g=f,h;for(h in g)if(g.hasOwnProperty(h)){var k=g[h];"style"===h?fg(a,k,kg):"dangerouslySetInnerHTML"===h?(k=k?k.__html:void 0,null!=k&&bg(a,k)):"children"===h?"string"===typeof k?("textarea"!==b||""!==k)&&cg(a,k):"number"===typeof k&&cg(a, 2610 ""+k):"suppressContentEditableWarning"!==h&&"suppressHydrationWarning"!==h&&"autoFocus"!==h&&(Ra.hasOwnProperty(h)?null!=k&&lg(d,h):e?Kf(a,h,k):null!=k&&If(a,h,k))}switch(b){case "input":Bc(a);Pf(a,c);break;case "textarea":Bc(a);Xf(a,c);break;case "option":null!=c.value&&a.setAttribute("value",c.value);break;case "select":a.multiple=!!c.multiple;b=c.value;null!=b?Sf(a,!!c.multiple,b,!1):null!=c.defaultValue&&Sf(a,!!c.multiple,c.defaultValue,!0);break;default:"function"===typeof f.onClick&&(a.onclick= 2611 C)}} 2612 function sg(a,b,c,d,e){var f=null;switch(b){case "input":c=Lf(a,c);d=Lf(a,d);f=[];break;case "option":c=Rf(a,c);d=Rf(a,d);f=[];break;case "select":c=B({},c,{value:void 0});d=B({},d,{value:void 0});f=[];break;case "textarea":c=Uf(a,c);d=Uf(a,d);f=[];break;default:"function"!==typeof c.onClick&&"function"===typeof d.onClick&&(a.onclick=C)}hg(b,d,kg);var g,h;a=null;for(g in c)if(!d.hasOwnProperty(g)&&c.hasOwnProperty(g)&&null!=c[g])if("style"===g)for(h in b=c[g],b)b.hasOwnProperty(h)&&(a||(a={}),a[h]= 2613 "");else"dangerouslySetInnerHTML"!==g&&"children"!==g&&"suppressContentEditableWarning"!==g&&"suppressHydrationWarning"!==g&&"autoFocus"!==g&&(Ra.hasOwnProperty(g)?f||(f=[]):(f=f||[]).push(g,null));for(g in d){var k=d[g];b=null!=c?c[g]:void 0;if(d.hasOwnProperty(g)&&k!==b&&(null!=k||null!=b))if("style"===g)if(b){for(h in b)!b.hasOwnProperty(h)||k&&k.hasOwnProperty(h)||(a||(a={}),a[h]="");for(h in k)k.hasOwnProperty(h)&&b[h]!==k[h]&&(a||(a={}),a[h]=k[h])}else a||(f||(f=[]),f.push(g,a)),a=k;else"dangerouslySetInnerHTML"=== 2614 g?(k=k?k.__html:void 0,b=b?b.__html:void 0,null!=k&&b!==k&&(f=f||[]).push(g,""+k)):"children"===g?b===k||"string"!==typeof k&&"number"!==typeof k||(f=f||[]).push(g,""+k):"suppressContentEditableWarning"!==g&&"suppressHydrationWarning"!==g&&(Ra.hasOwnProperty(g)?(null!=k&&lg(e,g),f||b===k||(f=[])):(f=f||[]).push(g,k))}a&&(f=f||[]).push("style",a);return f} 2615 function tg(a,b,c,d,e){"input"===c&&"radio"===e.type&&null!=e.name&&Nf(a,e);ig(c,d);d=ig(c,e);for(var f=0;f<b.length;f+=2){var g=b[f],h=b[f+1];"style"===g?fg(a,h,kg):"dangerouslySetInnerHTML"===g?bg(a,h):"children"===g?cg(a,h):d?null!=h?Kf(a,g,h):a.removeAttribute(g):null!=h?If(a,g,h):Jf(a,g)}switch(c){case "input":Of(a,e);break;case "textarea":Wf(a,e);break;case "select":a._wrapperState.initialValue=void 0,b=a._wrapperState.wasMultiple,a._wrapperState.wasMultiple=!!e.multiple,c=e.value,null!=c?Sf(a, 2616 !!e.multiple,c,!1):b!==!!e.multiple&&(null!=e.defaultValue?Sf(a,!!e.multiple,e.defaultValue,!0):Sf(a,!!e.multiple,e.multiple?[]:"",!1))}} 2617 function ug(a,b,c,d,e){switch(b){case "iframe":case "object":U("topLoad","load",a);break;case "video":case "audio":for(var f in mg)mg.hasOwnProperty(f)&&U(f,mg[f],a);break;case "source":U("topError","error",a);break;case "img":case "image":U("topError","error",a);U("topLoad","load",a);break;case "form":U("topReset","reset",a);U("topSubmit","submit",a);break;case "details":U("topToggle","toggle",a);break;case "input":Mf(a,c);U("topInvalid","invalid",a);lg(e,"onChange");break;case "select":Tf(a,c); 2618 U("topInvalid","invalid",a);lg(e,"onChange");break;case "textarea":Vf(a,c),U("topInvalid","invalid",a),lg(e,"onChange")}hg(b,c,kg);d=null;for(var g in c)c.hasOwnProperty(g)&&(f=c[g],"children"===g?"string"===typeof f?a.textContent!==f&&(d=["children",f]):"number"===typeof f&&a.textContent!==""+f&&(d=["children",""+f]):Ra.hasOwnProperty(g)&&null!=f&&lg(e,g));switch(b){case "input":Bc(a);Pf(a,c);break;case "textarea":Bc(a);Xf(a,c);break;case "select":case "option":break;default:"function"===typeof c.onClick&& 2619 (a.onclick=C)}return d}function vg(a,b){return a.nodeValue!==b} 2620 var wg=Object.freeze({createElement:ng,createTextNode:og,setInitialProperties:pg,diffProperties:sg,updateProperties:tg,diffHydratedProperties:ug,diffHydratedText:vg,warnForUnmatchedText:function(){},warnForDeletedHydratableElement:function(){},warnForDeletedHydratableText:function(){},warnForInsertedHydratedElement:function(){},warnForInsertedHydratedText:function(){},restoreControlledState:function(a,b,c){switch(b){case "input":Of(a,c);b=c.name;if("radio"===c.type&&null!=b){for(c=a;c.parentNode;)c= 2621 c.parentNode;c=c.querySelectorAll("input[name\x3d"+JSON.stringify(""+b)+'][type\x3d"radio"]');for(b=0;b<c.length;b++){var d=c[b];if(d!==a&&d.form===a.form){var e=rb(d);e?void 0:E("90");Cc(d);Of(d,e)}}}break;case "textarea":Wf(a,c);break;case "select":b=c.value,null!=b&&Sf(a,!!c.multiple,b,!1)}}});nc.injectFiberControlledHostComponent(wg);var xg=null,Mg=null;function Ng(a){return!(!a||1!==a.nodeType&&9!==a.nodeType&&11!==a.nodeType&&(8!==a.nodeType||" react-mount-point-unstable "!==a.nodeValue))} 2622 function Og(a){a=a?9===a.nodeType?a.documentElement:a.firstChild:null;return!(!a||1!==a.nodeType||!a.hasAttribute("data-reactroot"))} 2623 var Z=of({getRootHostContext:function(a){var b=a.nodeType;switch(b){case 9:case 11:a=(a=a.documentElement)?a.namespaceURI:$f(null,"");break;default:b=8===b?a.parentNode:a,a=b.namespaceURI||null,b=b.tagName,a=$f(a,b)}return a},getChildHostContext:function(a,b){return $f(a,b)},getPublicInstance:function(a){return a},prepareForCommit:function(){xg=td;var a=da();if(Kd(a)){if("selectionStart"in a)var b={start:a.selectionStart,end:a.selectionEnd};else a:{var c=window.getSelection&&window.getSelection(); 2624 if(c&&0!==c.rangeCount){b=c.anchorNode;var d=c.anchorOffset,e=c.focusNode;c=c.focusOffset;try{b.nodeType,e.nodeType}catch(z){b=null;break a}var f=0,g=-1,h=-1,k=0,q=0,v=a,y=null;b:for(;;){for(var u;;){v!==b||0!==d&&3!==v.nodeType||(g=f+d);v!==e||0!==c&&3!==v.nodeType||(h=f+c);3===v.nodeType&&(f+=v.nodeValue.length);if(null===(u=v.firstChild))break;y=v;v=u}for(;;){if(v===a)break b;y===b&&++k===d&&(g=f);y===e&&++q===c&&(h=f);if(null!==(u=v.nextSibling))break;v=y;y=v.parentNode}v=u}b=-1===g||-1===h?null: 2625 {start:g,end:h}}else b=null}b=b||{start:0,end:0}}else b=null;Mg={focusedElem:a,selectionRange:b};ud(!1)},resetAfterCommit:function(){var a=Mg,b=da(),c=a.focusedElem,d=a.selectionRange;if(b!==c&&fa(document.documentElement,c)){if(Kd(c))if(b=d.start,a=d.end,void 0===a&&(a=b),"selectionStart"in c)c.selectionStart=b,c.selectionEnd=Math.min(a,c.value.length);else if(window.getSelection){b=window.getSelection();var e=c[Eb()].length;a=Math.min(d.start,e);d=void 0===d.end?a:Math.min(d.end,e);!b.extend&&a> 2626 d&&(e=d,d=a,a=e);e=Jd(c,a);var f=Jd(c,d);if(e&&f&&(1!==b.rangeCount||b.anchorNode!==e.node||b.anchorOffset!==e.offset||b.focusNode!==f.node||b.focusOffset!==f.offset)){var g=document.createRange();g.setStart(e.node,e.offset);b.removeAllRanges();a>d?(b.addRange(g),b.extend(f.node,f.offset)):(g.setEnd(f.node,f.offset),b.addRange(g))}}b=[];for(a=c;a=a.parentNode;)1===a.nodeType&&b.push({element:a,left:a.scrollLeft,top:a.scrollTop});ia(c);for(c=0;c<b.length;c++)a=b[c],a.element.scrollLeft=a.left,a.element.scrollTop= 2627 a.top}Mg=null;ud(xg);xg=null},createInstance:function(a,b,c,d,e){a=ng(a,b,c,d);a[Q]=e;a[ob]=b;return a},appendInitialChild:function(a,b){a.appendChild(b)},finalizeInitialChildren:function(a,b,c,d){pg(a,b,c,d);a:{switch(b){case "button":case "input":case "select":case "textarea":a=!!c.autoFocus;break a}a=!1}return a},prepareUpdate:function(a,b,c,d,e){return sg(a,b,c,d,e)},shouldSetTextContent:function(a,b){return"textarea"===a||"string"===typeof b.children||"number"===typeof b.children||"object"=== 2628 typeof b.dangerouslySetInnerHTML&&null!==b.dangerouslySetInnerHTML&&"string"===typeof b.dangerouslySetInnerHTML.__html},shouldDeprioritizeSubtree:function(a,b){return!!b.hidden},createTextInstance:function(a,b,c,d){a=og(a,b);a[Q]=d;return a},now:rf,mutation:{commitMount:function(a){a.focus()},commitUpdate:function(a,b,c,d,e){a[ob]=e;tg(a,b,c,d,e)},resetTextContent:function(a){a.textContent=""},commitTextUpdate:function(a,b,c){a.nodeValue=c},appendChild:function(a,b){a.appendChild(b)},appendChildToContainer:function(a, 2629 b){8===a.nodeType?a.parentNode.insertBefore(b,a):a.appendChild(b)},insertBefore:function(a,b,c){a.insertBefore(b,c)},insertInContainerBefore:function(a,b,c){8===a.nodeType?a.parentNode.insertBefore(b,c):a.insertBefore(b,c)},removeChild:function(a,b){a.removeChild(b)},removeChildFromContainer:function(a,b){8===a.nodeType?a.parentNode.removeChild(b):a.removeChild(b)}},hydration:{canHydrateInstance:function(a,b){return 1!==a.nodeType||b.toLowerCase()!==a.nodeName.toLowerCase()?null:a},canHydrateTextInstance:function(a, 2630 b){return""===b||3!==a.nodeType?null:a},getNextHydratableSibling:function(a){for(a=a.nextSibling;a&&1!==a.nodeType&&3!==a.nodeType;)a=a.nextSibling;return a},getFirstHydratableChild:function(a){for(a=a.firstChild;a&&1!==a.nodeType&&3!==a.nodeType;)a=a.nextSibling;return a},hydrateInstance:function(a,b,c,d,e,f){a[Q]=f;a[ob]=c;return ug(a,b,c,e,d)},hydrateTextInstance:function(a,b,c){a[Q]=c;return vg(a,b)},didNotMatchHydratedContainerTextInstance:function(){},didNotMatchHydratedTextInstance:function(){}, 2631 didNotHydrateContainerInstance:function(){},didNotHydrateInstance:function(){},didNotFindHydratableContainerInstance:function(){},didNotFindHydratableContainerTextInstance:function(){},didNotFindHydratableInstance:function(){},didNotFindHydratableTextInstance:function(){}},scheduleDeferredCallback:sf,cancelDeferredCallback:tf,useSyncScheduling:!0});rc=Z.batchedUpdates; 2632 function Pg(a,b,c,d,e){Ng(c)?void 0:E("200");var f=c._reactRootContainer;if(f)Z.updateContainer(b,f,a,e);else{d=d||Og(c);if(!d)for(f=void 0;f=c.lastChild;)c.removeChild(f);var g=Z.createContainer(c,d);f=c._reactRootContainer=g;Z.unbatchedUpdates(function(){Z.updateContainer(b,g,a,e)})}return Z.getPublicRootInstance(f)}function Qg(a,b){var c=2<arguments.length&&void 0!==arguments[2]?arguments[2]:null;Ng(b)?void 0:E("200");return pf(a,b,null,c)} 2633 function Rg(a,b){this._reactRootContainer=Z.createContainer(a,b)}Rg.prototype.render=function(a,b){Z.updateContainer(a,this._reactRootContainer,null,b)};Rg.prototype.unmount=function(a){Z.updateContainer(null,this._reactRootContainer,null,a)}; 2634 var Sg={createPortal:Qg,findDOMNode:function(a){if(null==a)return null;if(1===a.nodeType)return a;var b=a._reactInternalFiber;if(b)return Z.findHostInstance(b);"function"===typeof a.render?E("188"):E("213",Object.keys(a))},hydrate:function(a,b,c){return Pg(null,a,b,!0,c)},render:function(a,b,c){return Pg(null,a,b,!1,c)},unstable_renderSubtreeIntoContainer:function(a,b,c,d){null==a||void 0===a._reactInternalFiber?E("38"):void 0;return Pg(a,b,c,!1,d)},unmountComponentAtNode:function(a){Ng(a)?void 0: 2635 E("40");return a._reactRootContainer?(Z.unbatchedUpdates(function(){Pg(null,null,a,!1,function(){a._reactRootContainer=null})}),!0):!1},unstable_createPortal:Qg,unstable_batchedUpdates:tc,unstable_deferredUpdates:Z.deferredUpdates,flushSync:Z.flushSync,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:{EventPluginHub:mb,EventPluginRegistry:Va,EventPropagators:Cb,ReactControlledComponent:qc,ReactDOMComponentTree:sb,ReactDOMEventListener:xd}}; 2636 Z.injectIntoDevTools({findFiberByHostInstance:pb,bundleType:0,version:"16.2.0",rendererPackageName:"react-dom"});var Tg=Object.freeze({default:Sg}),Ug=Tg&&Sg||Tg;module.exports=Ug["default"]?Ug["default"]:Ug; 2637 2638 2639 /***/ }), 2640 /* 20 */ 2641 /***/ (function(module, exports, __webpack_require__) { 2642 2643 "use strict"; 2644 2645 2646 /** 2647 * Copyright (c) 2013-present, Facebook, Inc. 2648 * 2649 * This source code is licensed under the MIT license found in the 2650 * LICENSE file in the root directory of this source tree. 2651 * 2652 * @typechecks 2653 */ 2654 2655 var isNode = __webpack_require__(21); 2656 2657 /** 2658 * @param {*} object The object to check. 2659 * @return {boolean} Whether or not the object is a DOM text node. 2660 */ 2661 function isTextNode(object) { 2662 return isNode(object) && object.nodeType == 3; 2663 } 2664 2665 module.exports = isTextNode; 2666 2667 /***/ }), 2668 /* 21 */ 2669 /***/ (function(module, exports, __webpack_require__) { 2670 2671 "use strict"; 2672 2673 2674 /** 2675 * Copyright (c) 2013-present, Facebook, Inc. 2676 * 2677 * This source code is licensed under the MIT license found in the 2678 * LICENSE file in the root directory of this source tree. 2679 * 2680 * @typechecks 2681 */ 2682 2683 /** 2684 * @param {*} object The object to check. 2685 * @return {boolean} Whether or not the object is a DOM node. 2686 */ 2687 function isNode(object) { 2688 var doc = object ? object.ownerDocument || object : document; 2689 var defaultView = doc.defaultView || window; 2690 return !!(object && (typeof defaultView.Node === 'function' ? object instanceof defaultView.Node : typeof object === 'object' && typeof object.nodeType === 'number' && typeof object.nodeName === 'string')); 2691 } 2692 2693 module.exports = isNode; 2694 2695 /***/ }), 2696 /* 22 */ 2697 /***/ (function(module, exports, __webpack_require__) { 2698 2699 "use strict"; 2700 /* WEBPACK VAR INJECTION */(function(process) {/** @license React v16.2.0 2701 * react-dom.development.js 2702 * 2703 * Copyright (c) 2013-present, Facebook, Inc. 2704 * 2705 * This source code is licensed under the MIT license found in the 2706 * LICENSE file in the root directory of this source tree. 2707 */ 2708 2709 2710 2711 2712 2713 if (process.env.NODE_ENV !== "production") { 2714 (function() { 2715 'use strict'; 2716 2717 var React = __webpack_require__(4); 2718 var invariant = __webpack_require__(5); 2719 var warning = __webpack_require__(6); 2720 var ExecutionEnvironment = __webpack_require__(8); 2721 var _assign = __webpack_require__(2); 2722 var emptyFunction = __webpack_require__(1); 2723 var EventListener = __webpack_require__(9); 2724 var getActiveElement = __webpack_require__(10); 2725 var shallowEqual = __webpack_require__(11); 2726 var containsNode = __webpack_require__(12); 2727 var focusNode = __webpack_require__(13); 2728 var emptyObject = __webpack_require__(3); 2729 var checkPropTypes = __webpack_require__(7); 2730 var hyphenateStyleName = __webpack_require__(23); 2731 var camelizeStyleName = __webpack_require__(25); 2732 2733 /** 2734 * WARNING: DO NOT manually require this module. 2735 * This is a replacement for `invariant(...)` used by the error code system 2736 * and will _only_ be required by the corresponding babel pass. 2737 * It always throws. 2738 */ 2739 2740 !React ? invariant(false, 'ReactDOM was loaded before React. Make sure you load the React package before loading ReactDOM.') : void 0; 2741 2742 // These attributes should be all lowercase to allow for 2743 // case insensitive checks 2744 var RESERVED_PROPS = { 2745 children: true, 2746 dangerouslySetInnerHTML: true, 2747 defaultValue: true, 2748 defaultChecked: true, 2749 innerHTML: true, 2750 suppressContentEditableWarning: true, 2751 suppressHydrationWarning: true, 2752 style: true 2753 }; 2754 2755 function checkMask(value, bitmask) { 2756 return (value & bitmask) === bitmask; 2757 } 2758 2759 var DOMPropertyInjection = { 2760 /** 2761 * Mapping from normalized, camelcased property names to a configuration that 2762 * specifies how the associated DOM property should be accessed or rendered. 2763 */ 2764 MUST_USE_PROPERTY: 0x1, 2765 HAS_BOOLEAN_VALUE: 0x4, 2766 HAS_NUMERIC_VALUE: 0x8, 2767 HAS_POSITIVE_NUMERIC_VALUE: 0x10 | 0x8, 2768 HAS_OVERLOADED_BOOLEAN_VALUE: 0x20, 2769 HAS_STRING_BOOLEAN_VALUE: 0x40, 2770 2771 /** 2772 * Inject some specialized knowledge about the DOM. This takes a config object 2773 * with the following properties: 2774 * 2775 * Properties: object mapping DOM property name to one of the 2776 * DOMPropertyInjection constants or null. If your attribute isn't in here, 2777 * it won't get written to the DOM. 2778 * 2779 * DOMAttributeNames: object mapping React attribute name to the DOM 2780 * attribute name. Attribute names not specified use the **lowercase** 2781 * normalized name. 2782 * 2783 * DOMAttributeNamespaces: object mapping React attribute name to the DOM 2784 * attribute namespace URL. (Attribute names not specified use no namespace.) 2785 * 2786 * DOMPropertyNames: similar to DOMAttributeNames but for DOM properties. 2787 * Property names not specified use the normalized name. 2788 * 2789 * DOMMutationMethods: Properties that require special mutation methods. If 2790 * `value` is undefined, the mutation method should unset the property. 2791 * 2792 * @param {object} domPropertyConfig the config as described above. 2793 */ 2794 injectDOMPropertyConfig: function (domPropertyConfig) { 2795 var Injection = DOMPropertyInjection; 2796 var Properties = domPropertyConfig.Properties || {}; 2797 var DOMAttributeNamespaces = domPropertyConfig.DOMAttributeNamespaces || {}; 2798 var DOMAttributeNames = domPropertyConfig.DOMAttributeNames || {}; 2799 var DOMMutationMethods = domPropertyConfig.DOMMutationMethods || {}; 2800 2801 for (var propName in Properties) { 2802 !!properties.hasOwnProperty(propName) ? invariant(false, "injectDOMPropertyConfig(...): You're trying to inject DOM property '%s' which has already been injected. You may be accidentally injecting the same DOM property config twice, or you may be injecting two configs that have conflicting property names.", propName) : void 0; 2803 2804 var lowerCased = propName.toLowerCase(); 2805 var propConfig = Properties[propName]; 2806 2807 var propertyInfo = { 2808 attributeName: lowerCased, 2809 attributeNamespace: null, 2810 propertyName: propName, 2811 mutationMethod: null, 2812 2813 mustUseProperty: checkMask(propConfig, Injection.MUST_USE_PROPERTY), 2814 hasBooleanValue: checkMask(propConfig, Injection.HAS_BOOLEAN_VALUE), 2815 hasNumericValue: checkMask(propConfig, Injection.HAS_NUMERIC_VALUE), 2816 hasPositiveNumericValue: checkMask(propConfig, Injection.HAS_POSITIVE_NUMERIC_VALUE), 2817 hasOverloadedBooleanValue: checkMask(propConfig, Injection.HAS_OVERLOADED_BOOLEAN_VALUE), 2818 hasStringBooleanValue: checkMask(propConfig, Injection.HAS_STRING_BOOLEAN_VALUE) 2819 }; 2820 !(propertyInfo.hasBooleanValue + propertyInfo.hasNumericValue + propertyInfo.hasOverloadedBooleanValue <= 1) ? invariant(false, "DOMProperty: Value can be one of boolean, overloaded boolean, or numeric value, but not a combination: %s", propName) : void 0; 2821 2822 if (DOMAttributeNames.hasOwnProperty(propName)) { 2823 var attributeName = DOMAttributeNames[propName]; 2824 2825 propertyInfo.attributeName = attributeName; 2826 } 2827 2828 if (DOMAttributeNamespaces.hasOwnProperty(propName)) { 2829 propertyInfo.attributeNamespace = DOMAttributeNamespaces[propName]; 2830 } 2831 2832 if (DOMMutationMethods.hasOwnProperty(propName)) { 2833 propertyInfo.mutationMethod = DOMMutationMethods[propName]; 2834 } 2835 2836 // Downcase references to whitelist properties to check for membership 2837 // without case-sensitivity. This allows the whitelist to pick up 2838 // `allowfullscreen`, which should be written using the property configuration 2839 // for `allowFullscreen` 2840 properties[propName] = propertyInfo; 2841 } 2842 } 2843 }; 2844 2845 /* eslint-disable max-len */ 2846 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"; 2847 /* eslint-enable max-len */ 2848 var ATTRIBUTE_NAME_CHAR = ATTRIBUTE_NAME_START_CHAR + "\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040"; 2849 2850 2851 var ROOT_ATTRIBUTE_NAME = 'data-reactroot'; 2852 2853 /** 2854 * Map from property "standard name" to an object with info about how to set 2855 * the property in the DOM. Each object contains: 2856 * 2857 * attributeName: 2858 * Used when rendering markup or with `*Attribute()`. 2859 * attributeNamespace 2860 * propertyName: 2861 * Used on DOM node instances. (This includes properties that mutate due to 2862 * external factors.) 2863 * mutationMethod: 2864 * If non-null, used instead of the property or `setAttribute()` after 2865 * initial render. 2866 * mustUseProperty: 2867 * Whether the property must be accessed and mutated as an object property. 2868 * hasBooleanValue: 2869 * Whether the property should be removed when set to a falsey value. 2870 * hasNumericValue: 2871 * Whether the property must be numeric or parse as a numeric and should be 2872 * removed when set to a falsey value. 2873 * hasPositiveNumericValue: 2874 * Whether the property must be positive numeric or parse as a positive 2875 * numeric and should be removed when set to a falsey value. 2876 * hasOverloadedBooleanValue: 2877 * Whether the property can be used as a flag as well as with a value. 2878 * Removed when strictly equal to false; present without a value when 2879 * strictly equal to true; present with a value otherwise. 2880 */ 2881 var properties = {}; 2882 2883 /** 2884 * Checks whether a property name is a writeable attribute. 2885 * @method 2886 */ 2887 function shouldSetAttribute(name, value) { 2888 if (isReservedProp(name)) { 2889 return false; 2890 } 2891 if (name.length > 2 && (name[0] === 'o' || name[0] === 'O') && (name[1] === 'n' || name[1] === 'N')) { 2892 return false; 2893 } 2894 if (value === null) { 2895 return true; 2896 } 2897 switch (typeof value) { 2898 case 'boolean': 2899 return shouldAttributeAcceptBooleanValue(name); 2900 case 'undefined': 2901 case 'number': 2902 case 'string': 2903 case 'object': 2904 return true; 2905 default: 2906 // function, symbol 2907 return false; 2908 } 2909 } 2910 2911 function getPropertyInfo(name) { 2912 return properties.hasOwnProperty(name) ? properties[name] : null; 2913 } 2914 2915 function shouldAttributeAcceptBooleanValue(name) { 2916 if (isReservedProp(name)) { 2917 return true; 2918 } 2919 var propertyInfo = getPropertyInfo(name); 2920 if (propertyInfo) { 2921 return propertyInfo.hasBooleanValue || propertyInfo.hasStringBooleanValue || propertyInfo.hasOverloadedBooleanValue; 2922 } 2923 var prefix = name.toLowerCase().slice(0, 5); 2924 return prefix === 'data-' || prefix === 'aria-'; 2925 } 2926 2927 /** 2928 * Checks to see if a property name is within the list of properties 2929 * reserved for internal React operations. These properties should 2930 * not be set on an HTML element. 2931 * 2932 * @private 2933 * @param {string} name 2934 * @return {boolean} If the name is within reserved props 2935 */ 2936 function isReservedProp(name) { 2937 return RESERVED_PROPS.hasOwnProperty(name); 2938 } 2939 2940 var injection = DOMPropertyInjection; 2941 2942 var MUST_USE_PROPERTY = injection.MUST_USE_PROPERTY; 2943 var HAS_BOOLEAN_VALUE = injection.HAS_BOOLEAN_VALUE; 2944 var HAS_NUMERIC_VALUE = injection.HAS_NUMERIC_VALUE; 2945 var HAS_POSITIVE_NUMERIC_VALUE = injection.HAS_POSITIVE_NUMERIC_VALUE; 2946 var HAS_OVERLOADED_BOOLEAN_VALUE = injection.HAS_OVERLOADED_BOOLEAN_VALUE; 2947 var HAS_STRING_BOOLEAN_VALUE = injection.HAS_STRING_BOOLEAN_VALUE; 2948 2949 var HTMLDOMPropertyConfig = { 2950 // When adding attributes to this list, be sure to also add them to 2951 // the `possibleStandardNames` module to ensure casing and incorrect 2952 // name warnings. 2953 Properties: { 2954 allowFullScreen: HAS_BOOLEAN_VALUE, 2955 // specifies target context for links with `preload` type 2956 async: HAS_BOOLEAN_VALUE, 2957 // Note: there is a special case that prevents it from being written to the DOM 2958 // on the client side because the browsers are inconsistent. Instead we call focus(). 2959 autoFocus: HAS_BOOLEAN_VALUE, 2960 autoPlay: HAS_BOOLEAN_VALUE, 2961 capture: HAS_OVERLOADED_BOOLEAN_VALUE, 2962 checked: MUST_USE_PROPERTY | HAS_BOOLEAN_VALUE, 2963 cols: HAS_POSITIVE_NUMERIC_VALUE, 2964 contentEditable: HAS_STRING_BOOLEAN_VALUE, 2965 controls: HAS_BOOLEAN_VALUE, 2966 'default': HAS_BOOLEAN_VALUE, 2967 defer: HAS_BOOLEAN_VALUE, 2968 disabled: HAS_BOOLEAN_VALUE, 2969 download: HAS_OVERLOADED_BOOLEAN_VALUE, 2970 draggable: HAS_STRING_BOOLEAN_VALUE, 2971 formNoValidate: HAS_BOOLEAN_VALUE, 2972 hidden: HAS_BOOLEAN_VALUE, 2973 loop: HAS_BOOLEAN_VALUE, 2974 // Caution; `option.selected` is not updated if `select.multiple` is 2975 // disabled with `removeAttribute`. 2976 multiple: MUST_USE_PROPERTY | HAS_BOOLEAN_VALUE, 2977 muted: MUST_USE_PROPERTY | HAS_BOOLEAN_VALUE, 2978 noValidate: HAS_BOOLEAN_VALUE, 2979 open: HAS_BOOLEAN_VALUE, 2980 playsInline: HAS_BOOLEAN_VALUE, 2981 readOnly: HAS_BOOLEAN_VALUE, 2982 required: HAS_BOOLEAN_VALUE, 2983 reversed: HAS_BOOLEAN_VALUE, 2984 rows: HAS_POSITIVE_NUMERIC_VALUE, 2985 rowSpan: HAS_NUMERIC_VALUE, 2986 scoped: HAS_BOOLEAN_VALUE, 2987 seamless: HAS_BOOLEAN_VALUE, 2988 selected: MUST_USE_PROPERTY | HAS_BOOLEAN_VALUE, 2989 size: HAS_POSITIVE_NUMERIC_VALUE, 2990 start: HAS_NUMERIC_VALUE, 2991 // support for projecting regular DOM Elements via V1 named slots ( shadow dom ) 2992 span: HAS_POSITIVE_NUMERIC_VALUE, 2993 spellCheck: HAS_STRING_BOOLEAN_VALUE, 2994 // Style must be explicitly set in the attribute list. React components 2995 // expect a style object 2996 style: 0, 2997 // Keep it in the whitelist because it is case-sensitive for SVG. 2998 tabIndex: 0, 2999 // itemScope is for for Microdata support. 3000 // See http://schema.org/docs/gs.html 3001 itemScope: HAS_BOOLEAN_VALUE, 3002 // These attributes must stay in the white-list because they have 3003 // different attribute names (see DOMAttributeNames below) 3004 acceptCharset: 0, 3005 className: 0, 3006 htmlFor: 0, 3007 httpEquiv: 0, 3008 // Attributes with mutation methods must be specified in the whitelist 3009 // Set the string boolean flag to allow the behavior 3010 value: HAS_STRING_BOOLEAN_VALUE 3011 }, 3012 DOMAttributeNames: { 3013 acceptCharset: 'accept-charset', 3014 className: 'class', 3015 htmlFor: 'for', 3016 httpEquiv: 'http-equiv' 3017 }, 3018 DOMMutationMethods: { 3019 value: function (node, value) { 3020 if (value == null) { 3021 return node.removeAttribute('value'); 3022 } 3023 3024 // Number inputs get special treatment due to some edge cases in 3025 // Chrome. Let everything else assign the value attribute as normal. 3026 // https://github.com/facebook/react/issues/7253#issuecomment-236074326 3027 if (node.type !== 'number' || node.hasAttribute('value') === false) { 3028 node.setAttribute('value', '' + value); 3029 } else if (node.validity && !node.validity.badInput && node.ownerDocument.activeElement !== node) { 3030 // Don't assign an attribute if validation reports bad 3031 // input. Chrome will clear the value. Additionally, don't 3032 // operate on inputs that have focus, otherwise Chrome might 3033 // strip off trailing decimal places and cause the user's 3034 // cursor position to jump to the beginning of the input. 3035 // 3036 // In ReactDOMInput, we have an onBlur event that will trigger 3037 // this function again when focus is lost. 3038 node.setAttribute('value', '' + value); 3039 } 3040 } 3041 } 3042 }; 3043 3044 var HAS_STRING_BOOLEAN_VALUE$1 = injection.HAS_STRING_BOOLEAN_VALUE; 3045 3046 3047 var NS = { 3048 xlink: 'http://www.w3.org/1999/xlink', 3049 xml: 'http://www.w3.org/XML/1998/namespace' 3050 }; 3051 3052 /** 3053 * This is a list of all SVG attributes that need special casing, 3054 * namespacing, or boolean value assignment. 3055 * 3056 * When adding attributes to this list, be sure to also add them to 3057 * the `possibleStandardNames` module to ensure casing and incorrect 3058 * name warnings. 3059 * 3060 * SVG Attributes List: 3061 * https://www.w3.org/TR/SVG/attindex.html 3062 * SMIL Spec: 3063 * https://www.w3.org/TR/smil 3064 */ 3065 var ATTRS = ['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', 'x-height', 'xlink:actuate', 'xlink:arcrole', 'xlink:href', 'xlink:role', 'xlink:show', 'xlink:title', 'xlink:type', 'xml:base', 'xmlns:xlink', 'xml:lang', 'xml:space']; 3066 3067 var SVGDOMPropertyConfig = { 3068 Properties: { 3069 autoReverse: HAS_STRING_BOOLEAN_VALUE$1, 3070 externalResourcesRequired: HAS_STRING_BOOLEAN_VALUE$1, 3071 preserveAlpha: HAS_STRING_BOOLEAN_VALUE$1 3072 }, 3073 DOMAttributeNames: { 3074 autoReverse: 'autoReverse', 3075 externalResourcesRequired: 'externalResourcesRequired', 3076 preserveAlpha: 'preserveAlpha' 3077 }, 3078 DOMAttributeNamespaces: { 3079 xlinkActuate: NS.xlink, 3080 xlinkArcrole: NS.xlink, 3081 xlinkHref: NS.xlink, 3082 xlinkRole: NS.xlink, 3083 xlinkShow: NS.xlink, 3084 xlinkTitle: NS.xlink, 3085 xlinkType: NS.xlink, 3086 xmlBase: NS.xml, 3087 xmlLang: NS.xml, 3088 xmlSpace: NS.xml 3089 } 3090 }; 3091 3092 var CAMELIZE = /[\-\:]([a-z])/g; 3093 var capitalize = function (token) { 3094 return token[1].toUpperCase(); 3095 }; 3096 3097 ATTRS.forEach(function (original) { 3098 var reactName = original.replace(CAMELIZE, capitalize); 3099 3100 SVGDOMPropertyConfig.Properties[reactName] = 0; 3101 SVGDOMPropertyConfig.DOMAttributeNames[reactName] = original; 3102 }); 3103 3104 injection.injectDOMPropertyConfig(HTMLDOMPropertyConfig); 3105 injection.injectDOMPropertyConfig(SVGDOMPropertyConfig); 3106 3107 var ReactErrorUtils = { 3108 // Used by Fiber to simulate a try-catch. 3109 _caughtError: null, 3110 _hasCaughtError: false, 3111 3112 // Used by event system to capture/rethrow the first error. 3113 _rethrowError: null, 3114 _hasRethrowError: false, 3115 3116 injection: { 3117 injectErrorUtils: function (injectedErrorUtils) { 3118 !(typeof injectedErrorUtils.invokeGuardedCallback === 'function') ? invariant(false, 'Injected invokeGuardedCallback() must be a function.') : void 0; 3119 invokeGuardedCallback = injectedErrorUtils.invokeGuardedCallback; 3120 } 3121 }, 3122 3123 /** 3124 * Call a function while guarding against errors that happens within it. 3125 * Returns an error if it throws, otherwise null. 3126 * 3127 * In production, this is implemented using a try-catch. The reason we don't 3128 * use a try-catch directly is so that we can swap out a different 3129 * implementation in DEV mode. 3130 * 3131 * @param {String} name of the guard to use for logging or debugging 3132 * @param {Function} func The function to invoke 3133 * @param {*} context The context to use when calling the function 3134 * @param {...*} args Arguments for function 3135 */ 3136 invokeGuardedCallback: function (name, func, context, a, b, c, d, e, f) { 3137 invokeGuardedCallback.apply(ReactErrorUtils, arguments); 3138 }, 3139 3140 /** 3141 * Same as invokeGuardedCallback, but instead of returning an error, it stores 3142 * it in a global so it can be rethrown by `rethrowCaughtError` later. 3143 * TODO: See if _caughtError and _rethrowError can be unified. 3144 * 3145 * @param {String} name of the guard to use for logging or debugging 3146 * @param {Function} func The function to invoke 3147 * @param {*} context The context to use when calling the function 3148 * @param {...*} args Arguments for function 3149 */ 3150 invokeGuardedCallbackAndCatchFirstError: function (name, func, context, a, b, c, d, e, f) { 3151 ReactErrorUtils.invokeGuardedCallback.apply(this, arguments); 3152 if (ReactErrorUtils.hasCaughtError()) { 3153 var error = ReactErrorUtils.clearCaughtError(); 3154 if (!ReactErrorUtils._hasRethrowError) { 3155 ReactErrorUtils._hasRethrowError = true; 3156 ReactErrorUtils._rethrowError = error; 3157 } 3158 } 3159 }, 3160 3161 /** 3162 * During execution of guarded functions we will capture the first error which 3163 * we will rethrow to be handled by the top level error handler. 3164 */ 3165 rethrowCaughtError: function () { 3166 return rethrowCaughtError.apply(ReactErrorUtils, arguments); 3167 }, 3168 3169 hasCaughtError: function () { 3170 return ReactErrorUtils._hasCaughtError; 3171 }, 3172 3173 clearCaughtError: function () { 3174 if (ReactErrorUtils._hasCaughtError) { 3175 var error = ReactErrorUtils._caughtError; 3176 ReactErrorUtils._caughtError = null; 3177 ReactErrorUtils._hasCaughtError = false; 3178 return error; 3179 } else { 3180 invariant(false, 'clearCaughtError was called but no error was captured. This error is likely caused by a bug in React. Please file an issue.'); 3181 } 3182 } 3183 }; 3184 3185 var invokeGuardedCallback = function (name, func, context, a, b, c, d, e, f) { 3186 ReactErrorUtils._hasCaughtError = false; 3187 ReactErrorUtils._caughtError = null; 3188 var funcArgs = Array.prototype.slice.call(arguments, 3); 3189 try { 3190 func.apply(context, funcArgs); 3191 } catch (error) { 3192 ReactErrorUtils._caughtError = error; 3193 ReactErrorUtils._hasCaughtError = true; 3194 } 3195 }; 3196 3197 { 3198 // In DEV mode, we swap out invokeGuardedCallback for a special version 3199 // that plays more nicely with the browser's DevTools. The idea is to preserve 3200 // "Pause on exceptions" behavior. Because React wraps all user-provided 3201 // functions in invokeGuardedCallback, and the production version of 3202 // invokeGuardedCallback uses a try-catch, all user exceptions are treated 3203 // like caught exceptions, and the DevTools won't pause unless the developer 3204 // takes the extra step of enabling pause on caught exceptions. This is 3205 // untintuitive, though, because even though React has caught the error, from 3206 // the developer's perspective, the error is uncaught. 3207 // 3208 // To preserve the expected "Pause on exceptions" behavior, we don't use a 3209 // try-catch in DEV. Instead, we synchronously dispatch a fake event to a fake 3210 // DOM node, and call the user-provided callback from inside an event handler 3211 // for that fake event. If the callback throws, the error is "captured" using 3212 // a global event handler. But because the error happens in a different 3213 // event loop context, it does not interrupt the normal program flow. 3214 // Effectively, this gives us try-catch behavior without actually using 3215 // try-catch. Neat! 3216 3217 // Check that the browser supports the APIs we need to implement our special 3218 // DEV version of invokeGuardedCallback 3219 if (typeof window !== 'undefined' && typeof window.dispatchEvent === 'function' && typeof document !== 'undefined' && typeof document.createEvent === 'function') { 3220 var fakeNode = document.createElement('react'); 3221 3222 var invokeGuardedCallbackDev = function (name, func, context, a, b, c, d, e, f) { 3223 // Keeps track of whether the user-provided callback threw an error. We 3224 // set this to true at the beginning, then set it to false right after 3225 // calling the function. If the function errors, `didError` will never be 3226 // set to false. This strategy works even if the browser is flaky and 3227 // fails to call our global error handler, because it doesn't rely on 3228 // the error event at all. 3229 var didError = true; 3230 3231 // Create an event handler for our fake event. We will synchronously 3232 // dispatch our fake event using `dispatchEvent`. Inside the handler, we 3233 // call the user-provided callback. 3234 var funcArgs = Array.prototype.slice.call(arguments, 3); 3235 function callCallback() { 3236 // We immediately remove the callback from event listeners so that 3237 // nested `invokeGuardedCallback` calls do not clash. Otherwise, a 3238 // nested call would trigger the fake event handlers of any call higher 3239 // in the stack. 3240 fakeNode.removeEventListener(evtType, callCallback, false); 3241 func.apply(context, funcArgs); 3242 didError = false; 3243 } 3244 3245 // Create a global error event handler. We use this to capture the value 3246 // that was thrown. It's possible that this error handler will fire more 3247 // than once; for example, if non-React code also calls `dispatchEvent` 3248 // and a handler for that event throws. We should be resilient to most of 3249 // those cases. Even if our error event handler fires more than once, the 3250 // last error event is always used. If the callback actually does error, 3251 // we know that the last error event is the correct one, because it's not 3252 // possible for anything else to have happened in between our callback 3253 // erroring and the code that follows the `dispatchEvent` call below. If 3254 // the callback doesn't error, but the error event was fired, we know to 3255 // ignore it because `didError` will be false, as described above. 3256 var error = void 0; 3257 // Use this to track whether the error event is ever called. 3258 var didSetError = false; 3259 var isCrossOriginError = false; 3260 3261 function onError(event) { 3262 error = event.error; 3263 didSetError = true; 3264 if (error === null && event.colno === 0 && event.lineno === 0) { 3265 isCrossOriginError = true; 3266 } 3267 } 3268 3269 // Create a fake event type. 3270 var evtType = 'react-' + (name ? name : 'invokeguardedcallback'); 3271 3272 // Attach our event handlers 3273 window.addEventListener('error', onError); 3274 fakeNode.addEventListener(evtType, callCallback, false); 3275 3276 // Synchronously dispatch our fake event. If the user-provided function 3277 // errors, it will trigger our global error handler. 3278 var evt = document.createEvent('Event'); 3279 evt.initEvent(evtType, false, false); 3280 fakeNode.dispatchEvent(evt); 3281 3282 if (didError) { 3283 if (!didSetError) { 3284 // The callback errored, but the error event never fired. 3285 error = new Error('An error was thrown inside one of your components, but React ' + "doesn't know what it was. This is likely due to browser " + 'flakiness. React does its best to preserve the "Pause on ' + 'exceptions" behavior of the DevTools, which requires some ' + "DEV-mode only tricks. It's possible that these don't work in " + 'your browser. Try triggering the error in production mode, ' + 'or switching to a modern browser. If you suspect that this is ' + 'actually an issue with React, please file an issue.'); 3286 } else if (isCrossOriginError) { 3287 error = new Error("A cross-origin error was thrown. React doesn't have access to " + 'the actual error object in development. ' + 'See https://fb.me/react-crossorigin-error for more information.'); 3288 } 3289 ReactErrorUtils._hasCaughtError = true; 3290 ReactErrorUtils._caughtError = error; 3291 } else { 3292 ReactErrorUtils._hasCaughtError = false; 3293 ReactErrorUtils._caughtError = null; 3294 } 3295 3296 // Remove our event listeners 3297 window.removeEventListener('error', onError); 3298 }; 3299 3300 invokeGuardedCallback = invokeGuardedCallbackDev; 3301 } 3302 } 3303 3304 var rethrowCaughtError = function () { 3305 if (ReactErrorUtils._hasRethrowError) { 3306 var error = ReactErrorUtils._rethrowError; 3307 ReactErrorUtils._rethrowError = null; 3308 ReactErrorUtils._hasRethrowError = false; 3309 throw error; 3310 } 3311 }; 3312 3313 /** 3314 * Injectable ordering of event plugins. 3315 */ 3316 var eventPluginOrder = null; 3317 3318 /** 3319 * Injectable mapping from names to event plugin modules. 3320 */ 3321 var namesToPlugins = {}; 3322 3323 /** 3324 * Recomputes the plugin list using the injected plugins and plugin ordering. 3325 * 3326 * @private 3327 */ 3328 function recomputePluginOrdering() { 3329 if (!eventPluginOrder) { 3330 // Wait until an `eventPluginOrder` is injected. 3331 return; 3332 } 3333 for (var pluginName in namesToPlugins) { 3334 var pluginModule = namesToPlugins[pluginName]; 3335 var pluginIndex = eventPluginOrder.indexOf(pluginName); 3336 !(pluginIndex > -1) ? invariant(false, 'EventPluginRegistry: Cannot inject event plugins that do not exist in the plugin ordering, `%s`.', pluginName) : void 0; 3337 if (plugins[pluginIndex]) { 3338 continue; 3339 } 3340 !pluginModule.extractEvents ? invariant(false, 'EventPluginRegistry: Event plugins must implement an `extractEvents` method, but `%s` does not.', pluginName) : void 0; 3341 plugins[pluginIndex] = pluginModule; 3342 var publishedEvents = pluginModule.eventTypes; 3343 for (var eventName in publishedEvents) { 3344 !publishEventForPlugin(publishedEvents[eventName], pluginModule, eventName) ? invariant(false, 'EventPluginRegistry: Failed to publish event `%s` for plugin `%s`.', eventName, pluginName) : void 0; 3345 } 3346 } 3347 } 3348 3349 /** 3350 * Publishes an event so that it can be dispatched by the supplied plugin. 3351 * 3352 * @param {object} dispatchConfig Dispatch configuration for the event. 3353 * @param {object} PluginModule Plugin publishing the event. 3354 * @return {boolean} True if the event was successfully published. 3355 * @private 3356 */ 3357 function publishEventForPlugin(dispatchConfig, pluginModule, eventName) { 3358 !!eventNameDispatchConfigs.hasOwnProperty(eventName) ? invariant(false, 'EventPluginHub: More than one plugin attempted to publish the same event name, `%s`.', eventName) : void 0; 3359 eventNameDispatchConfigs[eventName] = dispatchConfig; 3360 3361 var phasedRegistrationNames = dispatchConfig.phasedRegistrationNames; 3362 if (phasedRegistrationNames) { 3363 for (var phaseName in phasedRegistrationNames) { 3364 if (phasedRegistrationNames.hasOwnProperty(phaseName)) { 3365 var phasedRegistrationName = phasedRegistrationNames[phaseName]; 3366 publishRegistrationName(phasedRegistrationName, pluginModule, eventName); 3367 } 3368 } 3369 return true; 3370 } else if (dispatchConfig.registrationName) { 3371 publishRegistrationName(dispatchConfig.registrationName, pluginModule, eventName); 3372 return true; 3373 } 3374 return false; 3375 } 3376 3377 /** 3378 * Publishes a registration name that is used to identify dispatched events. 3379 * 3380 * @param {string} registrationName Registration name to add. 3381 * @param {object} PluginModule Plugin publishing the event. 3382 * @private 3383 */ 3384 function publishRegistrationName(registrationName, pluginModule, eventName) { 3385 !!registrationNameModules[registrationName] ? invariant(false, 'EventPluginHub: More than one plugin attempted to publish the same registration name, `%s`.', registrationName) : void 0; 3386 registrationNameModules[registrationName] = pluginModule; 3387 registrationNameDependencies[registrationName] = pluginModule.eventTypes[eventName].dependencies; 3388 3389 { 3390 var lowerCasedName = registrationName.toLowerCase(); 3391 possibleRegistrationNames[lowerCasedName] = registrationName; 3392 3393 if (registrationName === 'onDoubleClick') { 3394 possibleRegistrationNames.ondblclick = registrationName; 3395 } 3396 } 3397 } 3398 3399 /** 3400 * Registers plugins so that they can extract and dispatch events. 3401 * 3402 * @see {EventPluginHub} 3403 */ 3404 3405 /** 3406 * Ordered list of injected plugins. 3407 */ 3408 var plugins = []; 3409 3410 /** 3411 * Mapping from event name to dispatch config 3412 */ 3413 var eventNameDispatchConfigs = {}; 3414 3415 /** 3416 * Mapping from registration name to plugin module 3417 */ 3418 var registrationNameModules = {}; 3419 3420 /** 3421 * Mapping from registration name to event name 3422 */ 3423 var registrationNameDependencies = {}; 3424 3425 /** 3426 * Mapping from lowercase registration names to the properly cased version, 3427 * used to warn in the case of missing event handlers. Available 3428 * only in true. 3429 * @type {Object} 3430 */ 3431 var possibleRegistrationNames = {}; 3432 // Trust the developer to only use possibleRegistrationNames in true 3433 3434 /** 3435 * Injects an ordering of plugins (by plugin name). This allows the ordering 3436 * to be decoupled from injection of the actual plugins so that ordering is 3437 * always deterministic regardless of packaging, on-the-fly injection, etc. 3438 * 3439 * @param {array} InjectedEventPluginOrder 3440 * @internal 3441 * @see {EventPluginHub.injection.injectEventPluginOrder} 3442 */ 3443 function injectEventPluginOrder(injectedEventPluginOrder) { 3444 !!eventPluginOrder ? invariant(false, 'EventPluginRegistry: Cannot inject event plugin ordering more than once. You are likely trying to load more than one copy of React.') : void 0; 3445 // Clone the ordering so it cannot be dynamically mutated. 3446 eventPluginOrder = Array.prototype.slice.call(injectedEventPluginOrder); 3447 recomputePluginOrdering(); 3448 } 3449 3450 /** 3451 * Injects plugins to be used by `EventPluginHub`. The plugin names must be 3452 * in the ordering injected by `injectEventPluginOrder`. 3453 * 3454 * Plugins can be injected as part of page initialization or on-the-fly. 3455 * 3456 * @param {object} injectedNamesToPlugins Map from names to plugin modules. 3457 * @internal 3458 * @see {EventPluginHub.injection.injectEventPluginsByName} 3459 */ 3460 function injectEventPluginsByName(injectedNamesToPlugins) { 3461 var isOrderingDirty = false; 3462 for (var pluginName in injectedNamesToPlugins) { 3463 if (!injectedNamesToPlugins.hasOwnProperty(pluginName)) { 3464 continue; 3465 } 3466 var pluginModule = injectedNamesToPlugins[pluginName]; 3467 if (!namesToPlugins.hasOwnProperty(pluginName) || namesToPlugins[pluginName] !== pluginModule) { 3468 !!namesToPlugins[pluginName] ? invariant(false, 'EventPluginRegistry: Cannot inject two different event plugins using the same name, `%s`.', pluginName) : void 0; 3469 namesToPlugins[pluginName] = pluginModule; 3470 isOrderingDirty = true; 3471 } 3472 } 3473 if (isOrderingDirty) { 3474 recomputePluginOrdering(); 3475 } 3476 } 3477 3478 var EventPluginRegistry = Object.freeze({ 3479 plugins: plugins, 3480 eventNameDispatchConfigs: eventNameDispatchConfigs, 3481 registrationNameModules: registrationNameModules, 3482 registrationNameDependencies: registrationNameDependencies, 3483 possibleRegistrationNames: possibleRegistrationNames, 3484 injectEventPluginOrder: injectEventPluginOrder, 3485 injectEventPluginsByName: injectEventPluginsByName 3486 }); 3487 3488 var getFiberCurrentPropsFromNode = null; 3489 var getInstanceFromNode = null; 3490 var getNodeFromInstance = null; 3491 3492 var injection$2 = { 3493 injectComponentTree: function (Injected) { 3494 getFiberCurrentPropsFromNode = Injected.getFiberCurrentPropsFromNode; 3495 getInstanceFromNode = Injected.getInstanceFromNode; 3496 getNodeFromInstance = Injected.getNodeFromInstance; 3497 3498 { 3499 warning(getNodeFromInstance && getInstanceFromNode, 'EventPluginUtils.injection.injectComponentTree(...): Injected ' + 'module is missing getNodeFromInstance or getInstanceFromNode.'); 3500 } 3501 } 3502 }; 3503 3504 3505 3506 3507 3508 3509 var validateEventDispatches; 3510 { 3511 validateEventDispatches = function (event) { 3512 var dispatchListeners = event._dispatchListeners; 3513 var dispatchInstances = event._dispatchInstances; 3514 3515 var listenersIsArr = Array.isArray(dispatchListeners); 3516 var listenersLen = listenersIsArr ? dispatchListeners.length : dispatchListeners ? 1 : 0; 3517 3518 var instancesIsArr = Array.isArray(dispatchInstances); 3519 var instancesLen = instancesIsArr ? dispatchInstances.length : dispatchInstances ? 1 : 0; 3520 3521 warning(instancesIsArr === listenersIsArr && instancesLen === listenersLen, 'EventPluginUtils: Invalid `event`.'); 3522 }; 3523 } 3524 3525 /** 3526 * Dispatch the event to the listener. 3527 * @param {SyntheticEvent} event SyntheticEvent to handle 3528 * @param {boolean} simulated If the event is simulated (changes exn behavior) 3529 * @param {function} listener Application-level callback 3530 * @param {*} inst Internal component instance 3531 */ 3532 function executeDispatch(event, simulated, listener, inst) { 3533 var type = event.type || 'unknown-event'; 3534 event.currentTarget = getNodeFromInstance(inst); 3535 ReactErrorUtils.invokeGuardedCallbackAndCatchFirstError(type, listener, undefined, event); 3536 event.currentTarget = null; 3537 } 3538 3539 /** 3540 * Standard/simple iteration through an event's collected dispatches. 3541 */ 3542 function executeDispatchesInOrder(event, simulated) { 3543 var dispatchListeners = event._dispatchListeners; 3544 var dispatchInstances = event._dispatchInstances; 3545 { 3546 validateEventDispatches(event); 3547 } 3548 if (Array.isArray(dispatchListeners)) { 3549 for (var i = 0; i < dispatchListeners.length; i++) { 3550 if (event.isPropagationStopped()) { 3551 break; 3552 } 3553 // Listeners and Instances are two parallel arrays that are always in sync. 3554 executeDispatch(event, simulated, dispatchListeners[i], dispatchInstances[i]); 3555 } 3556 } else if (dispatchListeners) { 3557 executeDispatch(event, simulated, dispatchListeners, dispatchInstances); 3558 } 3559 event._dispatchListeners = null; 3560 event._dispatchInstances = null; 3561 } 3562 3563 /** 3564 * @see executeDispatchesInOrderStopAtTrueImpl 3565 */ 3566 3567 3568 /** 3569 * Execution of a "direct" dispatch - there must be at most one dispatch 3570 * accumulated on the event or it is considered an error. It doesn't really make 3571 * sense for an event with multiple dispatches (bubbled) to keep track of the 3572 * return values at each dispatch execution, but it does tend to make sense when 3573 * dealing with "direct" dispatches. 3574 * 3575 * @return {*} The return value of executing the single dispatch. 3576 */ 3577 3578 3579 /** 3580 * @param {SyntheticEvent} event 3581 * @return {boolean} True iff number of dispatches accumulated is greater than 0. 3582 */ 3583 3584 /** 3585 * Accumulates items that must not be null or undefined into the first one. This 3586 * is used to conserve memory by avoiding array allocations, and thus sacrifices 3587 * API cleanness. Since `current` can be null before being passed in and not 3588 * null after this function, make sure to assign it back to `current`: 3589 * 3590 * `a = accumulateInto(a, b);` 3591 * 3592 * This API should be sparingly used. Try `accumulate` for something cleaner. 3593 * 3594 * @return {*|array<*>} An accumulation of items. 3595 */ 3596 3597 function accumulateInto(current, next) { 3598 !(next != null) ? invariant(false, 'accumulateInto(...): Accumulated items must not be null or undefined.') : void 0; 3599 3600 if (current == null) { 3601 return next; 3602 } 3603 3604 // Both are not empty. Warning: Never call x.concat(y) when you are not 3605 // certain that x is an Array (x could be a string with concat method). 3606 if (Array.isArray(current)) { 3607 if (Array.isArray(next)) { 3608 current.push.apply(current, next); 3609 return current; 3610 } 3611 current.push(next); 3612 return current; 3613 } 3614 3615 if (Array.isArray(next)) { 3616 // A bit too dangerous to mutate `next`. 3617 return [current].concat(next); 3618 } 3619 3620 return [current, next]; 3621 } 3622 3623 /** 3624 * @param {array} arr an "accumulation" of items which is either an Array or 3625 * a single item. Useful when paired with the `accumulate` module. This is a 3626 * simple utility that allows us to reason about a collection of items, but 3627 * handling the case when there is exactly one item (and we do not need to 3628 * allocate an array). 3629 * @param {function} cb Callback invoked with each element or a collection. 3630 * @param {?} [scope] Scope used as `this` in a callback. 3631 */ 3632 function forEachAccumulated(arr, cb, scope) { 3633 if (Array.isArray(arr)) { 3634 arr.forEach(cb, scope); 3635 } else if (arr) { 3636 cb.call(scope, arr); 3637 } 3638 } 3639 3640 /** 3641 * Internal queue of events that have accumulated their dispatches and are 3642 * waiting to have their dispatches executed. 3643 */ 3644 var eventQueue = null; 3645 3646 /** 3647 * Dispatches an event and releases it back into the pool, unless persistent. 3648 * 3649 * @param {?object} event Synthetic event to be dispatched. 3650 * @param {boolean} simulated If the event is simulated (changes exn behavior) 3651 * @private 3652 */ 3653 var executeDispatchesAndRelease = function (event, simulated) { 3654 if (event) { 3655 executeDispatchesInOrder(event, simulated); 3656 3657 if (!event.isPersistent()) { 3658 event.constructor.release(event); 3659 } 3660 } 3661 }; 3662 var executeDispatchesAndReleaseSimulated = function (e) { 3663 return executeDispatchesAndRelease(e, true); 3664 }; 3665 var executeDispatchesAndReleaseTopLevel = function (e) { 3666 return executeDispatchesAndRelease(e, false); 3667 }; 3668 3669 function isInteractive(tag) { 3670 return tag === 'button' || tag === 'input' || tag === 'select' || tag === 'textarea'; 3671 } 3672 3673 function shouldPreventMouseEvent(name, type, props) { 3674 switch (name) { 3675 case 'onClick': 3676 case 'onClickCapture': 3677 case 'onDoubleClick': 3678 case 'onDoubleClickCapture': 3679 case 'onMouseDown': 3680 case 'onMouseDownCapture': 3681 case 'onMouseMove': 3682 case 'onMouseMoveCapture': 3683 case 'onMouseUp': 3684 case 'onMouseUpCapture': 3685 return !!(props.disabled && isInteractive(type)); 3686 default: 3687 return false; 3688 } 3689 } 3690 3691 /** 3692 * This is a unified interface for event plugins to be installed and configured. 3693 * 3694 * Event plugins can implement the following properties: 3695 * 3696 * `extractEvents` {function(string, DOMEventTarget, string, object): *} 3697 * Required. When a top-level event is fired, this method is expected to 3698 * extract synthetic events that will in turn be queued and dispatched. 3699 * 3700 * `eventTypes` {object} 3701 * Optional, plugins that fire events must publish a mapping of registration 3702 * names that are used to register listeners. Values of this mapping must 3703 * be objects that contain `registrationName` or `phasedRegistrationNames`. 3704 * 3705 * `executeDispatch` {function(object, function, string)} 3706 * Optional, allows plugins to override how an event gets dispatched. By 3707 * default, the listener is simply invoked. 3708 * 3709 * Each plugin that is injected into `EventsPluginHub` is immediately operable. 3710 * 3711 * @public 3712 */ 3713 3714 /** 3715 * Methods for injecting dependencies. 3716 */ 3717 var injection$1 = { 3718 /** 3719 * @param {array} InjectedEventPluginOrder 3720 * @public 3721 */ 3722 injectEventPluginOrder: injectEventPluginOrder, 3723 3724 /** 3725 * @param {object} injectedNamesToPlugins Map from names to plugin modules. 3726 */ 3727 injectEventPluginsByName: injectEventPluginsByName 3728 }; 3729 3730 /** 3731 * @param {object} inst The instance, which is the source of events. 3732 * @param {string} registrationName Name of listener (e.g. `onClick`). 3733 * @return {?function} The stored callback. 3734 */ 3735 function getListener(inst, registrationName) { 3736 var listener; 3737 3738 // TODO: shouldPreventMouseEvent is DOM-specific and definitely should not 3739 // live here; needs to be moved to a better place soon 3740 var stateNode = inst.stateNode; 3741 if (!stateNode) { 3742 // Work in progress (ex: onload events in incremental mode). 3743 return null; 3744 } 3745 var props = getFiberCurrentPropsFromNode(stateNode); 3746 if (!props) { 3747 // Work in progress. 3748 return null; 3749 } 3750 listener = props[registrationName]; 3751 if (shouldPreventMouseEvent(registrationName, inst.type, props)) { 3752 return null; 3753 } 3754 !(!listener || typeof listener === 'function') ? invariant(false, 'Expected `%s` listener to be a function, instead got a value of `%s` type.', registrationName, typeof listener) : void 0; 3755 return listener; 3756 } 3757 3758 /** 3759 * Allows registered plugins an opportunity to extract events from top-level 3760 * native browser events. 3761 * 3762 * @return {*} An accumulation of synthetic events. 3763 * @internal 3764 */ 3765 function extractEvents(topLevelType, targetInst, nativeEvent, nativeEventTarget) { 3766 var events; 3767 for (var i = 0; i < plugins.length; i++) { 3768 // Not every plugin in the ordering may be loaded at runtime. 3769 var possiblePlugin = plugins[i]; 3770 if (possiblePlugin) { 3771 var extractedEvents = possiblePlugin.extractEvents(topLevelType, targetInst, nativeEvent, nativeEventTarget); 3772 if (extractedEvents) { 3773 events = accumulateInto(events, extractedEvents); 3774 } 3775 } 3776 } 3777 return events; 3778 } 3779 3780 /** 3781 * Enqueues a synthetic event that should be dispatched when 3782 * `processEventQueue` is invoked. 3783 * 3784 * @param {*} events An accumulation of synthetic events. 3785 * @internal 3786 */ 3787 function enqueueEvents(events) { 3788 if (events) { 3789 eventQueue = accumulateInto(eventQueue, events); 3790 } 3791 } 3792 3793 /** 3794 * Dispatches all synthetic events on the event queue. 3795 * 3796 * @internal 3797 */ 3798 function processEventQueue(simulated) { 3799 // Set `eventQueue` to null before processing it so that we can tell if more 3800 // events get enqueued while processing. 3801 var processingEventQueue = eventQueue; 3802 eventQueue = null; 3803 3804 if (!processingEventQueue) { 3805 return; 3806 } 3807 3808 if (simulated) { 3809 forEachAccumulated(processingEventQueue, executeDispatchesAndReleaseSimulated); 3810 } else { 3811 forEachAccumulated(processingEventQueue, executeDispatchesAndReleaseTopLevel); 3812 } 3813 !!eventQueue ? invariant(false, 'processEventQueue(): Additional events were enqueued while processing an event queue. Support for this has not yet been implemented.') : void 0; 3814 // This would be a good time to rethrow if any of the event handlers threw. 3815 ReactErrorUtils.rethrowCaughtError(); 3816 } 3817 3818 var EventPluginHub = Object.freeze({ 3819 injection: injection$1, 3820 getListener: getListener, 3821 extractEvents: extractEvents, 3822 enqueueEvents: enqueueEvents, 3823 processEventQueue: processEventQueue 3824 }); 3825 3826 var IndeterminateComponent = 0; // Before we know whether it is functional or class 3827 var FunctionalComponent = 1; 3828 var ClassComponent = 2; 3829 var HostRoot = 3; // Root of a host tree. Could be nested inside another node. 3830 var HostPortal = 4; // A subtree. Could be an entry point to a different renderer. 3831 var HostComponent = 5; 3832 var HostText = 6; 3833 var CallComponent = 7; 3834 var CallHandlerPhase = 8; 3835 var ReturnComponent = 9; 3836 var Fragment = 10; 3837 3838 var randomKey = Math.random().toString(36).slice(2); 3839 var internalInstanceKey = '__reactInternalInstance$' + randomKey; 3840 var internalEventHandlersKey = '__reactEventHandlers$' + randomKey; 3841 3842 function precacheFiberNode$1(hostInst, node) { 3843 node[internalInstanceKey] = hostInst; 3844 } 3845 3846 /** 3847 * Given a DOM node, return the closest ReactDOMComponent or 3848 * ReactDOMTextComponent instance ancestor. 3849 */ 3850 function getClosestInstanceFromNode(node) { 3851 if (node[internalInstanceKey]) { 3852 return node[internalInstanceKey]; 3853 } 3854 3855 // Walk up the tree until we find an ancestor whose instance we have cached. 3856 var parents = []; 3857 while (!node[internalInstanceKey]) { 3858 parents.push(node); 3859 if (node.parentNode) { 3860 node = node.parentNode; 3861 } else { 3862 // Top of the tree. This node must not be part of a React tree (or is 3863 // unmounted, potentially). 3864 return null; 3865 } 3866 } 3867 3868 var closest = void 0; 3869 var inst = node[internalInstanceKey]; 3870 if (inst.tag === HostComponent || inst.tag === HostText) { 3871 // In Fiber, this will always be the deepest root. 3872 return inst; 3873 } 3874 for (; node && (inst = node[internalInstanceKey]); node = parents.pop()) { 3875 closest = inst; 3876 } 3877 3878 return closest; 3879 } 3880 3881 /** 3882 * Given a DOM node, return the ReactDOMComponent or ReactDOMTextComponent 3883 * instance, or null if the node was not rendered by this React. 3884 */ 3885 function getInstanceFromNode$1(node) { 3886 var inst = node[internalInstanceKey]; 3887 if (inst) { 3888 if (inst.tag === HostComponent || inst.tag === HostText) { 3889 return inst; 3890 } else { 3891 return null; 3892 } 3893 } 3894 return null; 3895 } 3896 3897 /** 3898 * Given a ReactDOMComponent or ReactDOMTextComponent, return the corresponding 3899 * DOM node. 3900 */ 3901 function getNodeFromInstance$1(inst) { 3902 if (inst.tag === HostComponent || inst.tag === HostText) { 3903 // In Fiber this, is just the state node right now. We assume it will be 3904 // a host component or host text. 3905 return inst.stateNode; 3906 } 3907 3908 // Without this first invariant, passing a non-DOM-component triggers the next 3909 // invariant for a missing parent, which is super confusing. 3910 invariant(false, 'getNodeFromInstance: Invalid argument.'); 3911 } 3912 3913 function getFiberCurrentPropsFromNode$1(node) { 3914 return node[internalEventHandlersKey] || null; 3915 } 3916 3917 function updateFiberProps$1(node, props) { 3918 node[internalEventHandlersKey] = props; 3919 } 3920 3921 var ReactDOMComponentTree = Object.freeze({ 3922 precacheFiberNode: precacheFiberNode$1, 3923 getClosestInstanceFromNode: getClosestInstanceFromNode, 3924 getInstanceFromNode: getInstanceFromNode$1, 3925 getNodeFromInstance: getNodeFromInstance$1, 3926 getFiberCurrentPropsFromNode: getFiberCurrentPropsFromNode$1, 3927 updateFiberProps: updateFiberProps$1 3928 }); 3929 3930 function getParent(inst) { 3931 do { 3932 inst = inst['return']; 3933 // TODO: If this is a HostRoot we might want to bail out. 3934 // That is depending on if we want nested subtrees (layers) to bubble 3935 // events to their parent. We could also go through parentNode on the 3936 // host node but that wouldn't work for React Native and doesn't let us 3937 // do the portal feature. 3938 } while (inst && inst.tag !== HostComponent); 3939 if (inst) { 3940 return inst; 3941 } 3942 return null; 3943 } 3944 3945 /** 3946 * Return the lowest common ancestor of A and B, or null if they are in 3947 * different trees. 3948 */ 3949 function getLowestCommonAncestor(instA, instB) { 3950 var depthA = 0; 3951 for (var tempA = instA; tempA; tempA = getParent(tempA)) { 3952 depthA++; 3953 } 3954 var depthB = 0; 3955 for (var tempB = instB; tempB; tempB = getParent(tempB)) { 3956 depthB++; 3957 } 3958 3959 // If A is deeper, crawl up. 3960 while (depthA - depthB > 0) { 3961 instA = getParent(instA); 3962 depthA--; 3963 } 3964 3965 // If B is deeper, crawl up. 3966 while (depthB - depthA > 0) { 3967 instB = getParent(instB); 3968 depthB--; 3969 } 3970 3971 // Walk in lockstep until we find a match. 3972 var depth = depthA; 3973 while (depth--) { 3974 if (instA === instB || instA === instB.alternate) { 3975 return instA; 3976 } 3977 instA = getParent(instA); 3978 instB = getParent(instB); 3979 } 3980 return null; 3981 } 3982 3983 /** 3984 * Return if A is an ancestor of B. 3985 */ 3986 3987 3988 /** 3989 * Return the parent instance of the passed-in instance. 3990 */ 3991 function getParentInstance(inst) { 3992 return getParent(inst); 3993 } 3994 3995 /** 3996 * Simulates the traversal of a two-phase, capture/bubble event dispatch. 3997 */ 3998 function traverseTwoPhase(inst, fn, arg) { 3999 var path = []; 4000 while (inst) { 4001 path.push(inst); 4002 inst = getParent(inst); 4003 } 4004 var i; 4005 for (i = path.length; i-- > 0;) { 4006 fn(path[i], 'captured', arg); 4007 } 4008 for (i = 0; i < path.length; i++) { 4009 fn(path[i], 'bubbled', arg); 4010 } 4011 } 4012 4013 /** 4014 * Traverses the ID hierarchy and invokes the supplied `cb` on any IDs that 4015 * should would receive a `mouseEnter` or `mouseLeave` event. 4016 * 4017 * Does not invoke the callback on the nearest common ancestor because nothing 4018 * "entered" or "left" that element. 4019 */ 4020 function traverseEnterLeave(from, to, fn, argFrom, argTo) { 4021 var common = from && to ? getLowestCommonAncestor(from, to) : null; 4022 var pathFrom = []; 4023 while (true) { 4024 if (!from) { 4025 break; 4026 } 4027 if (from === common) { 4028 break; 4029 } 4030 var alternate = from.alternate; 4031 if (alternate !== null && alternate === common) { 4032 break; 4033 } 4034 pathFrom.push(from); 4035 from = getParent(from); 4036 } 4037 var pathTo = []; 4038 while (true) { 4039 if (!to) { 4040 break; 4041 } 4042 if (to === common) { 4043 break; 4044 } 4045 var _alternate = to.alternate; 4046 if (_alternate !== null && _alternate === common) { 4047 break; 4048 } 4049 pathTo.push(to); 4050 to = getParent(to); 4051 } 4052 for (var i = 0; i < pathFrom.length; i++) { 4053 fn(pathFrom[i], 'bubbled', argFrom); 4054 } 4055 for (var _i = pathTo.length; _i-- > 0;) { 4056 fn(pathTo[_i], 'captured', argTo); 4057 } 4058 } 4059 4060 /** 4061 * Some event types have a notion of different registration names for different 4062 * "phases" of propagation. This finds listeners by a given phase. 4063 */ 4064 function listenerAtPhase(inst, event, propagationPhase) { 4065 var registrationName = event.dispatchConfig.phasedRegistrationNames[propagationPhase]; 4066 return getListener(inst, registrationName); 4067 } 4068 4069 /** 4070 * A small set of propagation patterns, each of which will accept a small amount 4071 * of information, and generate a set of "dispatch ready event objects" - which 4072 * are sets of events that have already been annotated with a set of dispatched 4073 * listener functions/ids. The API is designed this way to discourage these 4074 * propagation strategies from actually executing the dispatches, since we 4075 * always want to collect the entire set of dispatches before executing even a 4076 * single one. 4077 */ 4078 4079 /** 4080 * Tags a `SyntheticEvent` with dispatched listeners. Creating this function 4081 * here, allows us to not have to bind or create functions for each event. 4082 * Mutating the event's members allows us to not have to create a wrapping 4083 * "dispatch" object that pairs the event with the listener. 4084 */ 4085 function accumulateDirectionalDispatches(inst, phase, event) { 4086 { 4087 warning(inst, 'Dispatching inst must not be null'); 4088 } 4089 var listener = listenerAtPhase(inst, event, phase); 4090 if (listener) { 4091 event._dispatchListeners = accumulateInto(event._dispatchListeners, listener); 4092 event._dispatchInstances = accumulateInto(event._dispatchInstances, inst); 4093 } 4094 } 4095 4096 /** 4097 * Collect dispatches (must be entirely collected before dispatching - see unit 4098 * tests). Lazily allocate the array to conserve memory. We must loop through 4099 * each event and perform the traversal for each one. We cannot perform a 4100 * single traversal for the entire collection of events because each event may 4101 * have a different target. 4102 */ 4103 function accumulateTwoPhaseDispatchesSingle(event) { 4104 if (event && event.dispatchConfig.phasedRegistrationNames) { 4105 traverseTwoPhase(event._targetInst, accumulateDirectionalDispatches, event); 4106 } 4107 } 4108 4109 /** 4110 * Same as `accumulateTwoPhaseDispatchesSingle`, but skips over the targetID. 4111 */ 4112 function accumulateTwoPhaseDispatchesSingleSkipTarget(event) { 4113 if (event && event.dispatchConfig.phasedRegistrationNames) { 4114 var targetInst = event._targetInst; 4115 var parentInst = targetInst ? getParentInstance(targetInst) : null; 4116 traverseTwoPhase(parentInst, accumulateDirectionalDispatches, event); 4117 } 4118 } 4119 4120 /** 4121 * Accumulates without regard to direction, does not look for phased 4122 * registration names. Same as `accumulateDirectDispatchesSingle` but without 4123 * requiring that the `dispatchMarker` be the same as the dispatched ID. 4124 */ 4125 function accumulateDispatches(inst, ignoredDirection, event) { 4126 if (inst && event && event.dispatchConfig.registrationName) { 4127 var registrationName = event.dispatchConfig.registrationName; 4128 var listener = getListener(inst, registrationName); 4129 if (listener) { 4130 event._dispatchListeners = accumulateInto(event._dispatchListeners, listener); 4131 event._dispatchInstances = accumulateInto(event._dispatchInstances, inst); 4132 } 4133 } 4134 } 4135 4136 /** 4137 * Accumulates dispatches on an `SyntheticEvent`, but only for the 4138 * `dispatchMarker`. 4139 * @param {SyntheticEvent} event 4140 */ 4141 function accumulateDirectDispatchesSingle(event) { 4142 if (event && event.dispatchConfig.registrationName) { 4143 accumulateDispatches(event._targetInst, null, event); 4144 } 4145 } 4146 4147 function accumulateTwoPhaseDispatches(events) { 4148 forEachAccumulated(events, accumulateTwoPhaseDispatchesSingle); 4149 } 4150 4151 function accumulateTwoPhaseDispatchesSkipTarget(events) { 4152 forEachAccumulated(events, accumulateTwoPhaseDispatchesSingleSkipTarget); 4153 } 4154 4155 function accumulateEnterLeaveDispatches(leave, enter, from, to) { 4156 traverseEnterLeave(from, to, accumulateDispatches, leave, enter); 4157 } 4158 4159 function accumulateDirectDispatches(events) { 4160 forEachAccumulated(events, accumulateDirectDispatchesSingle); 4161 } 4162 4163 var EventPropagators = Object.freeze({ 4164 accumulateTwoPhaseDispatches: accumulateTwoPhaseDispatches, 4165 accumulateTwoPhaseDispatchesSkipTarget: accumulateTwoPhaseDispatchesSkipTarget, 4166 accumulateEnterLeaveDispatches: accumulateEnterLeaveDispatches, 4167 accumulateDirectDispatches: accumulateDirectDispatches 4168 }); 4169 4170 var contentKey = null; 4171 4172 /** 4173 * Gets the key used to access text content on a DOM node. 4174 * 4175 * @return {?string} Key used to access text content. 4176 * @internal 4177 */ 4178 function getTextContentAccessor() { 4179 if (!contentKey && ExecutionEnvironment.canUseDOM) { 4180 // Prefer textContent to innerText because many browsers support both but 4181 // SVG <text> elements don't support innerText even when <div> does. 4182 contentKey = 'textContent' in document.documentElement ? 'textContent' : 'innerText'; 4183 } 4184 return contentKey; 4185 } 4186 4187 /** 4188 * This helper object stores information about text content of a target node, 4189 * allowing comparison of content before and after a given event. 4190 * 4191 * Identify the node where selection currently begins, then observe 4192 * both its text content and its current position in the DOM. Since the 4193 * browser may natively replace the target node during composition, we can 4194 * use its position to find its replacement. 4195 * 4196 * 4197 */ 4198 var compositionState = { 4199 _root: null, 4200 _startText: null, 4201 _fallbackText: null 4202 }; 4203 4204 function initialize(nativeEventTarget) { 4205 compositionState._root = nativeEventTarget; 4206 compositionState._startText = getText(); 4207 return true; 4208 } 4209 4210 function reset() { 4211 compositionState._root = null; 4212 compositionState._startText = null; 4213 compositionState._fallbackText = null; 4214 } 4215 4216 function getData() { 4217 if (compositionState._fallbackText) { 4218 return compositionState._fallbackText; 4219 } 4220 4221 var start; 4222 var startValue = compositionState._startText; 4223 var startLength = startValue.length; 4224 var end; 4225 var endValue = getText(); 4226 var endLength = endValue.length; 4227 4228 for (start = 0; start < startLength; start++) { 4229 if (startValue[start] !== endValue[start]) { 4230 break; 4231 } 4232 } 4233 4234 var minEnd = startLength - start; 4235 for (end = 1; end <= minEnd; end++) { 4236 if (startValue[startLength - end] !== endValue[endLength - end]) { 4237 break; 4238 } 4239 } 4240 4241 var sliceTail = end > 1 ? 1 - end : undefined; 4242 compositionState._fallbackText = endValue.slice(start, sliceTail); 4243 return compositionState._fallbackText; 4244 } 4245 4246 function getText() { 4247 if ('value' in compositionState._root) { 4248 return compositionState._root.value; 4249 } 4250 return compositionState._root[getTextContentAccessor()]; 4251 } 4252 4253 /* eslint valid-typeof: 0 */ 4254 4255 var didWarnForAddedNewProperty = false; 4256 var isProxySupported = typeof Proxy === 'function'; 4257 var EVENT_POOL_SIZE = 10; 4258 4259 var shouldBeReleasedProperties = ['dispatchConfig', '_targetInst', 'nativeEvent', 'isDefaultPrevented', 'isPropagationStopped', '_dispatchListeners', '_dispatchInstances']; 4260 4261 /** 4262 * @interface Event 4263 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 4264 */ 4265 var EventInterface = { 4266 type: null, 4267 target: null, 4268 // currentTarget is set when dispatching; no use in copying it here 4269 currentTarget: emptyFunction.thatReturnsNull, 4270 eventPhase: null, 4271 bubbles: null, 4272 cancelable: null, 4273 timeStamp: function (event) { 4274 return event.timeStamp || Date.now(); 4275 }, 4276 defaultPrevented: null, 4277 isTrusted: null 4278 }; 4279 4280 /** 4281 * Synthetic events are dispatched by event plugins, typically in response to a 4282 * top-level event delegation handler. 4283 * 4284 * These systems should generally use pooling to reduce the frequency of garbage 4285 * collection. The system should check `isPersistent` to determine whether the 4286 * event should be released into the pool after being dispatched. Users that 4287 * need a persisted event should invoke `persist`. 4288 * 4289 * Synthetic events (and subclasses) implement the DOM Level 3 Events API by 4290 * normalizing browser quirks. Subclasses do not necessarily have to implement a 4291 * DOM interface; custom application-specific events can also subclass this. 4292 * 4293 * @param {object} dispatchConfig Configuration used to dispatch this event. 4294 * @param {*} targetInst Marker identifying the event target. 4295 * @param {object} nativeEvent Native browser event. 4296 * @param {DOMEventTarget} nativeEventTarget Target node. 4297 */ 4298 function SyntheticEvent(dispatchConfig, targetInst, nativeEvent, nativeEventTarget) { 4299 { 4300 // these have a getter/setter for warnings 4301 delete this.nativeEvent; 4302 delete this.preventDefault; 4303 delete this.stopPropagation; 4304 } 4305 4306 this.dispatchConfig = dispatchConfig; 4307 this._targetInst = targetInst; 4308 this.nativeEvent = nativeEvent; 4309 4310 var Interface = this.constructor.Interface; 4311 for (var propName in Interface) { 4312 if (!Interface.hasOwnProperty(propName)) { 4313 continue; 4314 } 4315 { 4316 delete this[propName]; // this has a getter/setter for warnings 4317 } 4318 var normalize = Interface[propName]; 4319 if (normalize) { 4320 this[propName] = normalize(nativeEvent); 4321 } else { 4322 if (propName === 'target') { 4323 this.target = nativeEventTarget; 4324 } else { 4325 this[propName] = nativeEvent[propName]; 4326 } 4327 } 4328 } 4329 4330 var defaultPrevented = nativeEvent.defaultPrevented != null ? nativeEvent.defaultPrevented : nativeEvent.returnValue === false; 4331 if (defaultPrevented) { 4332 this.isDefaultPrevented = emptyFunction.thatReturnsTrue; 4333 } else { 4334 this.isDefaultPrevented = emptyFunction.thatReturnsFalse; 4335 } 4336 this.isPropagationStopped = emptyFunction.thatReturnsFalse; 4337 return this; 4338 } 4339 4340 _assign(SyntheticEvent.prototype, { 4341 preventDefault: function () { 4342 this.defaultPrevented = true; 4343 var event = this.nativeEvent; 4344 if (!event) { 4345 return; 4346 } 4347 4348 if (event.preventDefault) { 4349 event.preventDefault(); 4350 } else if (typeof event.returnValue !== 'unknown') { 4351 event.returnValue = false; 4352 } 4353 this.isDefaultPrevented = emptyFunction.thatReturnsTrue; 4354 }, 4355 4356 stopPropagation: function () { 4357 var event = this.nativeEvent; 4358 if (!event) { 4359 return; 4360 } 4361 4362 if (event.stopPropagation) { 4363 event.stopPropagation(); 4364 } else if (typeof event.cancelBubble !== 'unknown') { 4365 // The ChangeEventPlugin registers a "propertychange" event for 4366 // IE. This event does not support bubbling or cancelling, and 4367 // any references to cancelBubble throw "Member not found". A 4368 // typeof check of "unknown" circumvents this issue (and is also 4369 // IE specific). 4370 event.cancelBubble = true; 4371 } 4372 4373 this.isPropagationStopped = emptyFunction.thatReturnsTrue; 4374 }, 4375 4376 /** 4377 * We release all dispatched `SyntheticEvent`s after each event loop, adding 4378 * them back into the pool. This allows a way to hold onto a reference that 4379 * won't be added back into the pool. 4380 */ 4381 persist: function () { 4382 this.isPersistent = emptyFunction.thatReturnsTrue; 4383 }, 4384 4385 /** 4386 * Checks if this event should be released back into the pool. 4387 * 4388 * @return {boolean} True if this should not be released, false otherwise. 4389 */ 4390 isPersistent: emptyFunction.thatReturnsFalse, 4391 4392 /** 4393 * `PooledClass` looks for `destructor` on each instance it releases. 4394 */ 4395 destructor: function () { 4396 var Interface = this.constructor.Interface; 4397 for (var propName in Interface) { 4398 { 4399 Object.defineProperty(this, propName, getPooledWarningPropertyDefinition(propName, Interface[propName])); 4400 } 4401 } 4402 for (var i = 0; i < shouldBeReleasedProperties.length; i++) { 4403 this[shouldBeReleasedProperties[i]] = null; 4404 } 4405 { 4406 Object.defineProperty(this, 'nativeEvent', getPooledWarningPropertyDefinition('nativeEvent', null)); 4407 Object.defineProperty(this, 'preventDefault', getPooledWarningPropertyDefinition('preventDefault', emptyFunction)); 4408 Object.defineProperty(this, 'stopPropagation', getPooledWarningPropertyDefinition('stopPropagation', emptyFunction)); 4409 } 4410 } 4411 }); 4412 4413 SyntheticEvent.Interface = EventInterface; 4414 4415 /** 4416 * Helper to reduce boilerplate when creating subclasses. 4417 * 4418 * @param {function} Class 4419 * @param {?object} Interface 4420 */ 4421 SyntheticEvent.augmentClass = function (Class, Interface) { 4422 var Super = this; 4423 4424 var E = function () {}; 4425 E.prototype = Super.prototype; 4426 var prototype = new E(); 4427 4428 _assign(prototype, Class.prototype); 4429 Class.prototype = prototype; 4430 Class.prototype.constructor = Class; 4431 4432 Class.Interface = _assign({}, Super.Interface, Interface); 4433 Class.augmentClass = Super.augmentClass; 4434 addEventPoolingTo(Class); 4435 }; 4436 4437 /** Proxying after everything set on SyntheticEvent 4438 * to resolve Proxy issue on some WebKit browsers 4439 * in which some Event properties are set to undefined (GH#10010) 4440 */ 4441 { 4442 if (isProxySupported) { 4443 /*eslint-disable no-func-assign */ 4444 SyntheticEvent = new Proxy(SyntheticEvent, { 4445 construct: function (target, args) { 4446 return this.apply(target, Object.create(target.prototype), args); 4447 }, 4448 apply: function (constructor, that, args) { 4449 return new Proxy(constructor.apply(that, args), { 4450 set: function (target, prop, value) { 4451 if (prop !== 'isPersistent' && !target.constructor.Interface.hasOwnProperty(prop) && shouldBeReleasedProperties.indexOf(prop) === -1) { 4452 warning(didWarnForAddedNewProperty || target.isPersistent(), "This synthetic event is reused for performance reasons. If you're " + "seeing this, you're adding a new property in the synthetic event object. " + 'The property is never released. See ' + 'https://fb.me/react-event-pooling for more information.'); 4453 didWarnForAddedNewProperty = true; 4454 } 4455 target[prop] = value; 4456 return true; 4457 } 4458 }); 4459 } 4460 }); 4461 /*eslint-enable no-func-assign */ 4462 } 4463 } 4464 4465 addEventPoolingTo(SyntheticEvent); 4466 4467 /** 4468 * Helper to nullify syntheticEvent instance properties when destructing 4469 * 4470 * @param {String} propName 4471 * @param {?object} getVal 4472 * @return {object} defineProperty object 4473 */ 4474 function getPooledWarningPropertyDefinition(propName, getVal) { 4475 var isFunction = typeof getVal === 'function'; 4476 return { 4477 configurable: true, 4478 set: set, 4479 get: get 4480 }; 4481 4482 function set(val) { 4483 var action = isFunction ? 'setting the method' : 'setting the property'; 4484 warn(action, 'This is effectively a no-op'); 4485 return val; 4486 } 4487 4488 function get() { 4489 var action = isFunction ? 'accessing the method' : 'accessing the property'; 4490 var result = isFunction ? 'This is a no-op function' : 'This is set to null'; 4491 warn(action, result); 4492 return getVal; 4493 } 4494 4495 function warn(action, result) { 4496 var warningCondition = false; 4497 warning(warningCondition, "This synthetic event is reused for performance reasons. If you're seeing this, " + "you're %s `%s` on a released/nullified synthetic event. %s. " + 'If you must keep the original synthetic event around, use event.persist(). ' + 'See https://fb.me/react-event-pooling for more information.', action, propName, result); 4498 } 4499 } 4500 4501 function getPooledEvent(dispatchConfig, targetInst, nativeEvent, nativeInst) { 4502 var EventConstructor = this; 4503 if (EventConstructor.eventPool.length) { 4504 var instance = EventConstructor.eventPool.pop(); 4505 EventConstructor.call(instance, dispatchConfig, targetInst, nativeEvent, nativeInst); 4506 return instance; 4507 } 4508 return new EventConstructor(dispatchConfig, targetInst, nativeEvent, nativeInst); 4509 } 4510 4511 function releasePooledEvent(event) { 4512 var EventConstructor = this; 4513 !(event instanceof EventConstructor) ? invariant(false, 'Trying to release an event instance into a pool of a different type.') : void 0; 4514 event.destructor(); 4515 if (EventConstructor.eventPool.length < EVENT_POOL_SIZE) { 4516 EventConstructor.eventPool.push(event); 4517 } 4518 } 4519 4520 function addEventPoolingTo(EventConstructor) { 4521 EventConstructor.eventPool = []; 4522 EventConstructor.getPooled = getPooledEvent; 4523 EventConstructor.release = releasePooledEvent; 4524 } 4525 4526 var SyntheticEvent$1 = SyntheticEvent; 4527 4528 /** 4529 * @interface Event 4530 * @see http://www.w3.org/TR/DOM-Level-3-Events/#events-compositionevents 4531 */ 4532 var CompositionEventInterface = { 4533 data: null 4534 }; 4535 4536 /** 4537 * @param {object} dispatchConfig Configuration used to dispatch this event. 4538 * @param {string} dispatchMarker Marker identifying the event target. 4539 * @param {object} nativeEvent Native browser event. 4540 * @extends {SyntheticEvent} 4541 */ 4542 function SyntheticCompositionEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 4543 return SyntheticEvent$1.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 4544 } 4545 4546 SyntheticEvent$1.augmentClass(SyntheticCompositionEvent, CompositionEventInterface); 4547 4548 /** 4549 * @interface Event 4550 * @see http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105 4551 * /#events-inputevents 4552 */ 4553 var InputEventInterface = { 4554 data: null 4555 }; 4556 4557 /** 4558 * @param {object} dispatchConfig Configuration used to dispatch this event. 4559 * @param {string} dispatchMarker Marker identifying the event target. 4560 * @param {object} nativeEvent Native browser event. 4561 * @extends {SyntheticEvent} 4562 */ 4563 function SyntheticInputEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 4564 return SyntheticEvent$1.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 4565 } 4566 4567 SyntheticEvent$1.augmentClass(SyntheticInputEvent, InputEventInterface); 4568 4569 var END_KEYCODES = [9, 13, 27, 32]; // Tab, Return, Esc, Space 4570 var START_KEYCODE = 229; 4571 4572 var canUseCompositionEvent = ExecutionEnvironment.canUseDOM && 'CompositionEvent' in window; 4573 4574 var documentMode = null; 4575 if (ExecutionEnvironment.canUseDOM && 'documentMode' in document) { 4576 documentMode = document.documentMode; 4577 } 4578 4579 // Webkit offers a very useful `textInput` event that can be used to 4580 // directly represent `beforeInput`. The IE `textinput` event is not as 4581 // useful, so we don't use it. 4582 var canUseTextInputEvent = ExecutionEnvironment.canUseDOM && 'TextEvent' in window && !documentMode && !isPresto(); 4583 4584 // In IE9+, we have access to composition events, but the data supplied 4585 // by the native compositionend event may be incorrect. Japanese ideographic 4586 // spaces, for instance (\u3000) are not recorded correctly. 4587 var useFallbackCompositionData = ExecutionEnvironment.canUseDOM && (!canUseCompositionEvent || documentMode && documentMode > 8 && documentMode <= 11); 4588 4589 /** 4590 * Opera <= 12 includes TextEvent in window, but does not fire 4591 * text input events. Rely on keypress instead. 4592 */ 4593 function isPresto() { 4594 var opera = window.opera; 4595 return typeof opera === 'object' && typeof opera.version === 'function' && parseInt(opera.version(), 10) <= 12; 4596 } 4597 4598 var SPACEBAR_CODE = 32; 4599 var SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE); 4600 4601 // Events and their corresponding property names. 4602 var eventTypes = { 4603 beforeInput: { 4604 phasedRegistrationNames: { 4605 bubbled: 'onBeforeInput', 4606 captured: 'onBeforeInputCapture' 4607 }, 4608 dependencies: ['topCompositionEnd', 'topKeyPress', 'topTextInput', 'topPaste'] 4609 }, 4610 compositionEnd: { 4611 phasedRegistrationNames: { 4612 bubbled: 'onCompositionEnd', 4613 captured: 'onCompositionEndCapture' 4614 }, 4615 dependencies: ['topBlur', 'topCompositionEnd', 'topKeyDown', 'topKeyPress', 'topKeyUp', 'topMouseDown'] 4616 }, 4617 compositionStart: { 4618 phasedRegistrationNames: { 4619 bubbled: 'onCompositionStart', 4620 captured: 'onCompositionStartCapture' 4621 }, 4622 dependencies: ['topBlur', 'topCompositionStart', 'topKeyDown', 'topKeyPress', 'topKeyUp', 'topMouseDown'] 4623 }, 4624 compositionUpdate: { 4625 phasedRegistrationNames: { 4626 bubbled: 'onCompositionUpdate', 4627 captured: 'onCompositionUpdateCapture' 4628 }, 4629 dependencies: ['topBlur', 'topCompositionUpdate', 'topKeyDown', 'topKeyPress', 'topKeyUp', 'topMouseDown'] 4630 } 4631 }; 4632 4633 // Track whether we've ever handled a keypress on the space key. 4634 var hasSpaceKeypress = false; 4635 4636 /** 4637 * Return whether a native keypress event is assumed to be a command. 4638 * This is required because Firefox fires `keypress` events for key commands 4639 * (cut, copy, select-all, etc.) even though no character is inserted. 4640 */ 4641 function isKeypressCommand(nativeEvent) { 4642 return (nativeEvent.ctrlKey || nativeEvent.altKey || nativeEvent.metaKey) && 4643 // ctrlKey && altKey is equivalent to AltGr, and is not a command. 4644 !(nativeEvent.ctrlKey && nativeEvent.altKey); 4645 } 4646 4647 /** 4648 * Translate native top level events into event types. 4649 * 4650 * @param {string} topLevelType 4651 * @return {object} 4652 */ 4653 function getCompositionEventType(topLevelType) { 4654 switch (topLevelType) { 4655 case 'topCompositionStart': 4656 return eventTypes.compositionStart; 4657 case 'topCompositionEnd': 4658 return eventTypes.compositionEnd; 4659 case 'topCompositionUpdate': 4660 return eventTypes.compositionUpdate; 4661 } 4662 } 4663 4664 /** 4665 * Does our fallback best-guess model think this event signifies that 4666 * composition has begun? 4667 * 4668 * @param {string} topLevelType 4669 * @param {object} nativeEvent 4670 * @return {boolean} 4671 */ 4672 function isFallbackCompositionStart(topLevelType, nativeEvent) { 4673 return topLevelType === 'topKeyDown' && nativeEvent.keyCode === START_KEYCODE; 4674 } 4675 4676 /** 4677 * Does our fallback mode think that this event is the end of composition? 4678 * 4679 * @param {string} topLevelType 4680 * @param {object} nativeEvent 4681 * @return {boolean} 4682 */ 4683 function isFallbackCompositionEnd(topLevelType, nativeEvent) { 4684 switch (topLevelType) { 4685 case 'topKeyUp': 4686 // Command keys insert or clear IME input. 4687 return END_KEYCODES.indexOf(nativeEvent.keyCode) !== -1; 4688 case 'topKeyDown': 4689 // Expect IME keyCode on each keydown. If we get any other 4690 // code we must have exited earlier. 4691 return nativeEvent.keyCode !== START_KEYCODE; 4692 case 'topKeyPress': 4693 case 'topMouseDown': 4694 case 'topBlur': 4695 // Events are not possible without cancelling IME. 4696 return true; 4697 default: 4698 return false; 4699 } 4700 } 4701 4702 /** 4703 * Google Input Tools provides composition data via a CustomEvent, 4704 * with the `data` property populated in the `detail` object. If this 4705 * is available on the event object, use it. If not, this is a plain 4706 * composition event and we have nothing special to extract. 4707 * 4708 * @param {object} nativeEvent 4709 * @return {?string} 4710 */ 4711 function getDataFromCustomEvent(nativeEvent) { 4712 var detail = nativeEvent.detail; 4713 if (typeof detail === 'object' && 'data' in detail) { 4714 return detail.data; 4715 } 4716 return null; 4717 } 4718 4719 // Track the current IME composition status, if any. 4720 var isComposing = false; 4721 4722 /** 4723 * @return {?object} A SyntheticCompositionEvent. 4724 */ 4725 function extractCompositionEvent(topLevelType, targetInst, nativeEvent, nativeEventTarget) { 4726 var eventType; 4727 var fallbackData; 4728 4729 if (canUseCompositionEvent) { 4730 eventType = getCompositionEventType(topLevelType); 4731 } else if (!isComposing) { 4732 if (isFallbackCompositionStart(topLevelType, nativeEvent)) { 4733 eventType = eventTypes.compositionStart; 4734 } 4735 } else if (isFallbackCompositionEnd(topLevelType, nativeEvent)) { 4736 eventType = eventTypes.compositionEnd; 4737 } 4738 4739 if (!eventType) { 4740 return null; 4741 } 4742 4743 if (useFallbackCompositionData) { 4744 // The current composition is stored statically and must not be 4745 // overwritten while composition continues. 4746 if (!isComposing && eventType === eventTypes.compositionStart) { 4747 isComposing = initialize(nativeEventTarget); 4748 } else if (eventType === eventTypes.compositionEnd) { 4749 if (isComposing) { 4750 fallbackData = getData(); 4751 } 4752 } 4753 } 4754 4755 var event = SyntheticCompositionEvent.getPooled(eventType, targetInst, nativeEvent, nativeEventTarget); 4756 4757 if (fallbackData) { 4758 // Inject data generated from fallback path into the synthetic event. 4759 // This matches the property of native CompositionEventInterface. 4760 event.data = fallbackData; 4761 } else { 4762 var customData = getDataFromCustomEvent(nativeEvent); 4763 if (customData !== null) { 4764 event.data = customData; 4765 } 4766 } 4767 4768 accumulateTwoPhaseDispatches(event); 4769 return event; 4770 } 4771 4772 /** 4773 * @param {TopLevelTypes} topLevelType Record from `BrowserEventConstants`. 4774 * @param {object} nativeEvent Native browser event. 4775 * @return {?string} The string corresponding to this `beforeInput` event. 4776 */ 4777 function getNativeBeforeInputChars(topLevelType, nativeEvent) { 4778 switch (topLevelType) { 4779 case 'topCompositionEnd': 4780 return getDataFromCustomEvent(nativeEvent); 4781 case 'topKeyPress': 4782 /** 4783 * If native `textInput` events are available, our goal is to make 4784 * use of them. However, there is a special case: the spacebar key. 4785 * In Webkit, preventing default on a spacebar `textInput` event 4786 * cancels character insertion, but it *also* causes the browser 4787 * to fall back to its default spacebar behavior of scrolling the 4788 * page. 4789 * 4790 * Tracking at: 4791 * https://code.google.com/p/chromium/issues/detail?id=355103 4792 * 4793 * To avoid this issue, use the keypress event as if no `textInput` 4794 * event is available. 4795 */ 4796 var which = nativeEvent.which; 4797 if (which !== SPACEBAR_CODE) { 4798 return null; 4799 } 4800 4801 hasSpaceKeypress = true; 4802 return SPACEBAR_CHAR; 4803 4804 case 'topTextInput': 4805 // Record the characters to be added to the DOM. 4806 var chars = nativeEvent.data; 4807 4808 // If it's a spacebar character, assume that we have already handled 4809 // it at the keypress level and bail immediately. Android Chrome 4810 // doesn't give us keycodes, so we need to blacklist it. 4811 if (chars === SPACEBAR_CHAR && hasSpaceKeypress) { 4812 return null; 4813 } 4814 4815 return chars; 4816 4817 default: 4818 // For other native event types, do nothing. 4819 return null; 4820 } 4821 } 4822 4823 /** 4824 * For browsers that do not provide the `textInput` event, extract the 4825 * appropriate string to use for SyntheticInputEvent. 4826 * 4827 * @param {string} topLevelType Record from `BrowserEventConstants`. 4828 * @param {object} nativeEvent Native browser event. 4829 * @return {?string} The fallback string for this `beforeInput` event. 4830 */ 4831 function getFallbackBeforeInputChars(topLevelType, nativeEvent) { 4832 // If we are currently composing (IME) and using a fallback to do so, 4833 // try to extract the composed characters from the fallback object. 4834 // If composition event is available, we extract a string only at 4835 // compositionevent, otherwise extract it at fallback events. 4836 if (isComposing) { 4837 if (topLevelType === 'topCompositionEnd' || !canUseCompositionEvent && isFallbackCompositionEnd(topLevelType, nativeEvent)) { 4838 var chars = getData(); 4839 reset(); 4840 isComposing = false; 4841 return chars; 4842 } 4843 return null; 4844 } 4845 4846 switch (topLevelType) { 4847 case 'topPaste': 4848 // If a paste event occurs after a keypress, throw out the input 4849 // chars. Paste events should not lead to BeforeInput events. 4850 return null; 4851 case 'topKeyPress': 4852 /** 4853 * As of v27, Firefox may fire keypress events even when no character 4854 * will be inserted. A few possibilities: 4855 * 4856 * - `which` is `0`. Arrow keys, Esc key, etc. 4857 * 4858 * - `which` is the pressed key code, but no char is available. 4859 * Ex: 'AltGr + d` in Polish. There is no modified character for 4860 * this key combination and no character is inserted into the 4861 * document, but FF fires the keypress for char code `100` anyway. 4862 * No `input` event will occur. 4863 * 4864 * - `which` is the pressed key code, but a command combination is 4865 * being used. Ex: `Cmd+C`. No character is inserted, and no 4866 * `input` event will occur. 4867 */ 4868 if (!isKeypressCommand(nativeEvent)) { 4869 // IE fires the `keypress` event when a user types an emoji via 4870 // Touch keyboard of Windows. In such a case, the `char` property 4871 // holds an emoji character like `\uD83D\uDE0A`. Because its length 4872 // is 2, the property `which` does not represent an emoji correctly. 4873 // In such a case, we directly return the `char` property instead of 4874 // using `which`. 4875 if (nativeEvent.char && nativeEvent.char.length > 1) { 4876 return nativeEvent.char; 4877 } else if (nativeEvent.which) { 4878 return String.fromCharCode(nativeEvent.which); 4879 } 4880 } 4881 return null; 4882 case 'topCompositionEnd': 4883 return useFallbackCompositionData ? null : nativeEvent.data; 4884 default: 4885 return null; 4886 } 4887 } 4888 4889 /** 4890 * Extract a SyntheticInputEvent for `beforeInput`, based on either native 4891 * `textInput` or fallback behavior. 4892 * 4893 * @return {?object} A SyntheticInputEvent. 4894 */ 4895 function extractBeforeInputEvent(topLevelType, targetInst, nativeEvent, nativeEventTarget) { 4896 var chars; 4897 4898 if (canUseTextInputEvent) { 4899 chars = getNativeBeforeInputChars(topLevelType, nativeEvent); 4900 } else { 4901 chars = getFallbackBeforeInputChars(topLevelType, nativeEvent); 4902 } 4903 4904 // If no characters are being inserted, no BeforeInput event should 4905 // be fired. 4906 if (!chars) { 4907 return null; 4908 } 4909 4910 var event = SyntheticInputEvent.getPooled(eventTypes.beforeInput, targetInst, nativeEvent, nativeEventTarget); 4911 4912 event.data = chars; 4913 accumulateTwoPhaseDispatches(event); 4914 return event; 4915 } 4916 4917 /** 4918 * Create an `onBeforeInput` event to match 4919 * http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105/#events-inputevents. 4920 * 4921 * This event plugin is based on the native `textInput` event 4922 * available in Chrome, Safari, Opera, and IE. This event fires after 4923 * `onKeyPress` and `onCompositionEnd`, but before `onInput`. 4924 * 4925 * `beforeInput` is spec'd but not implemented in any browsers, and 4926 * the `input` event does not provide any useful information about what has 4927 * actually been added, contrary to the spec. Thus, `textInput` is the best 4928 * available event to identify the characters that have actually been inserted 4929 * into the target node. 4930 * 4931 * This plugin is also responsible for emitting `composition` events, thus 4932 * allowing us to share composition fallback code for both `beforeInput` and 4933 * `composition` event types. 4934 */ 4935 var BeforeInputEventPlugin = { 4936 eventTypes: eventTypes, 4937 4938 extractEvents: function (topLevelType, targetInst, nativeEvent, nativeEventTarget) { 4939 return [extractCompositionEvent(topLevelType, targetInst, nativeEvent, nativeEventTarget), extractBeforeInputEvent(topLevelType, targetInst, nativeEvent, nativeEventTarget)]; 4940 } 4941 }; 4942 4943 // Use to restore controlled state after a change event has fired. 4944 4945 var fiberHostComponent = null; 4946 4947 var ReactControlledComponentInjection = { 4948 injectFiberControlledHostComponent: function (hostComponentImpl) { 4949 // The fiber implementation doesn't use dynamic dispatch so we need to 4950 // inject the implementation. 4951 fiberHostComponent = hostComponentImpl; 4952 } 4953 }; 4954 4955 var restoreTarget = null; 4956 var restoreQueue = null; 4957 4958 function restoreStateOfTarget(target) { 4959 // We perform this translation at the end of the event loop so that we 4960 // always receive the correct fiber here 4961 var internalInstance = getInstanceFromNode(target); 4962 if (!internalInstance) { 4963 // Unmounted 4964 return; 4965 } 4966 !(fiberHostComponent && typeof fiberHostComponent.restoreControlledState === 'function') ? invariant(false, 'Fiber needs to be injected to handle a fiber target for controlled events. This error is likely caused by a bug in React. Please file an issue.') : void 0; 4967 var props = getFiberCurrentPropsFromNode(internalInstance.stateNode); 4968 fiberHostComponent.restoreControlledState(internalInstance.stateNode, internalInstance.type, props); 4969 } 4970 4971 var injection$3 = ReactControlledComponentInjection; 4972 4973 function enqueueStateRestore(target) { 4974 if (restoreTarget) { 4975 if (restoreQueue) { 4976 restoreQueue.push(target); 4977 } else { 4978 restoreQueue = [target]; 4979 } 4980 } else { 4981 restoreTarget = target; 4982 } 4983 } 4984 4985 function restoreStateIfNeeded() { 4986 if (!restoreTarget) { 4987 return; 4988 } 4989 var target = restoreTarget; 4990 var queuedTargets = restoreQueue; 4991 restoreTarget = null; 4992 restoreQueue = null; 4993 4994 restoreStateOfTarget(target); 4995 if (queuedTargets) { 4996 for (var i = 0; i < queuedTargets.length; i++) { 4997 restoreStateOfTarget(queuedTargets[i]); 4998 } 4999 } 5000 } 5001 5002 var ReactControlledComponent = Object.freeze({ 5003 injection: injection$3, 5004 enqueueStateRestore: enqueueStateRestore, 5005 restoreStateIfNeeded: restoreStateIfNeeded 5006 }); 5007 5008 // Used as a way to call batchedUpdates when we don't have a reference to 5009 // the renderer. Such as when we're dispatching events or if third party 5010 // libraries need to call batchedUpdates. Eventually, this API will go away when 5011 // everything is batched by default. We'll then have a similar API to opt-out of 5012 // scheduled work and instead do synchronous work. 5013 5014 // Defaults 5015 var fiberBatchedUpdates = function (fn, bookkeeping) { 5016 return fn(bookkeeping); 5017 }; 5018 5019 var isNestingBatched = false; 5020 function batchedUpdates(fn, bookkeeping) { 5021 if (isNestingBatched) { 5022 // If we are currently inside another batch, we need to wait until it 5023 // fully completes before restoring state. Therefore, we add the target to 5024 // a queue of work. 5025 return fiberBatchedUpdates(fn, bookkeeping); 5026 } 5027 isNestingBatched = true; 5028 try { 5029 return fiberBatchedUpdates(fn, bookkeeping); 5030 } finally { 5031 // Here we wait until all updates have propagated, which is important 5032 // when using controlled components within layers: 5033 // https://github.com/facebook/react/issues/1698 5034 // Then we restore state of any controlled component. 5035 isNestingBatched = false; 5036 restoreStateIfNeeded(); 5037 } 5038 } 5039 5040 var ReactGenericBatchingInjection = { 5041 injectFiberBatchedUpdates: function (_batchedUpdates) { 5042 fiberBatchedUpdates = _batchedUpdates; 5043 } 5044 }; 5045 5046 var injection$4 = ReactGenericBatchingInjection; 5047 5048 /** 5049 * @see http://www.whatwg.org/specs/web-apps/current-work/multipage/the-input-element.html#input-type-attr-summary 5050 */ 5051 var supportedInputTypes = { 5052 color: true, 5053 date: true, 5054 datetime: true, 5055 'datetime-local': true, 5056 email: true, 5057 month: true, 5058 number: true, 5059 password: true, 5060 range: true, 5061 search: true, 5062 tel: true, 5063 text: true, 5064 time: true, 5065 url: true, 5066 week: true 5067 }; 5068 5069 function isTextInputElement(elem) { 5070 var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase(); 5071 5072 if (nodeName === 'input') { 5073 return !!supportedInputTypes[elem.type]; 5074 } 5075 5076 if (nodeName === 'textarea') { 5077 return true; 5078 } 5079 5080 return false; 5081 } 5082 5083 /** 5084 * HTML nodeType values that represent the type of the node 5085 */ 5086 5087 var ELEMENT_NODE = 1; 5088 var TEXT_NODE = 3; 5089 var COMMENT_NODE = 8; 5090 var DOCUMENT_NODE = 9; 5091 var DOCUMENT_FRAGMENT_NODE = 11; 5092 5093 /** 5094 * Gets the target node from a native browser event by accounting for 5095 * inconsistencies in browser DOM APIs. 5096 * 5097 * @param {object} nativeEvent Native browser event. 5098 * @return {DOMEventTarget} Target node. 5099 */ 5100 function getEventTarget(nativeEvent) { 5101 var target = nativeEvent.target || nativeEvent.srcElement || window; 5102 5103 // Normalize SVG <use> element events #4963 5104 if (target.correspondingUseElement) { 5105 target = target.correspondingUseElement; 5106 } 5107 5108 // Safari may fire events on text nodes (Node.TEXT_NODE is 3). 5109 // @see http://www.quirksmode.org/js/events_properties.html 5110 return target.nodeType === TEXT_NODE ? target.parentNode : target; 5111 } 5112 5113 var useHasFeature; 5114 if (ExecutionEnvironment.canUseDOM) { 5115 useHasFeature = document.implementation && document.implementation.hasFeature && 5116 // always returns true in newer browsers as per the standard. 5117 // @see http://dom.spec.whatwg.org/#dom-domimplementation-hasfeature 5118 document.implementation.hasFeature('', '') !== true; 5119 } 5120 5121 /** 5122 * Checks if an event is supported in the current execution environment. 5123 * 5124 * NOTE: This will not work correctly for non-generic events such as `change`, 5125 * `reset`, `load`, `error`, and `select`. 5126 * 5127 * Borrows from Modernizr. 5128 * 5129 * @param {string} eventNameSuffix Event name, e.g. "click". 5130 * @param {?boolean} capture Check if the capture phase is supported. 5131 * @return {boolean} True if the event is supported. 5132 * @internal 5133 * @license Modernizr 3.0.0pre (Custom Build) | MIT 5134 */ 5135 function isEventSupported(eventNameSuffix, capture) { 5136 if (!ExecutionEnvironment.canUseDOM || capture && !('addEventListener' in document)) { 5137 return false; 5138 } 5139 5140 var eventName = 'on' + eventNameSuffix; 5141 var isSupported = eventName in document; 5142 5143 if (!isSupported) { 5144 var element = document.createElement('div'); 5145 element.setAttribute(eventName, 'return;'); 5146 isSupported = typeof element[eventName] === 'function'; 5147 } 5148 5149 if (!isSupported && useHasFeature && eventNameSuffix === 'wheel') { 5150 // This is the only way to test support for the `wheel` event in IE9+. 5151 isSupported = document.implementation.hasFeature('Events.wheel', '3.0'); 5152 } 5153 5154 return isSupported; 5155 } 5156 5157 function isCheckable(elem) { 5158 var type = elem.type; 5159 var nodeName = elem.nodeName; 5160 return nodeName && nodeName.toLowerCase() === 'input' && (type === 'checkbox' || type === 'radio'); 5161 } 5162 5163 function getTracker(node) { 5164 return node._valueTracker; 5165 } 5166 5167 function detachTracker(node) { 5168 node._valueTracker = null; 5169 } 5170 5171 function getValueFromNode(node) { 5172 var value = ''; 5173 if (!node) { 5174 return value; 5175 } 5176 5177 if (isCheckable(node)) { 5178 value = node.checked ? 'true' : 'false'; 5179 } else { 5180 value = node.value; 5181 } 5182 5183 return value; 5184 } 5185 5186 function trackValueOnNode(node) { 5187 var valueField = isCheckable(node) ? 'checked' : 'value'; 5188 var descriptor = Object.getOwnPropertyDescriptor(node.constructor.prototype, valueField); 5189 5190 var currentValue = '' + node[valueField]; 5191 5192 // if someone has already defined a value or Safari, then bail 5193 // and don't track value will cause over reporting of changes, 5194 // but it's better then a hard failure 5195 // (needed for certain tests that spyOn input values and Safari) 5196 if (node.hasOwnProperty(valueField) || typeof descriptor.get !== 'function' || typeof descriptor.set !== 'function') { 5197 return; 5198 } 5199 5200 Object.defineProperty(node, valueField, { 5201 enumerable: descriptor.enumerable, 5202 configurable: true, 5203 get: function () { 5204 return descriptor.get.call(this); 5205 }, 5206 set: function (value) { 5207 currentValue = '' + value; 5208 descriptor.set.call(this, value); 5209 } 5210 }); 5211 5212 var tracker = { 5213 getValue: function () { 5214 return currentValue; 5215 }, 5216 setValue: function (value) { 5217 currentValue = '' + value; 5218 }, 5219 stopTracking: function () { 5220 detachTracker(node); 5221 delete node[valueField]; 5222 } 5223 }; 5224 return tracker; 5225 } 5226 5227 function track(node) { 5228 if (getTracker(node)) { 5229 return; 5230 } 5231 5232 // TODO: Once it's just Fiber we can move this to node._wrapperState 5233 node._valueTracker = trackValueOnNode(node); 5234 } 5235 5236 function updateValueIfChanged(node) { 5237 if (!node) { 5238 return false; 5239 } 5240 5241 var tracker = getTracker(node); 5242 // if there is no tracker at this point it's unlikely 5243 // that trying again will succeed 5244 if (!tracker) { 5245 return true; 5246 } 5247 5248 var lastValue = tracker.getValue(); 5249 var nextValue = getValueFromNode(node); 5250 if (nextValue !== lastValue) { 5251 tracker.setValue(nextValue); 5252 return true; 5253 } 5254 return false; 5255 } 5256 5257 var eventTypes$1 = { 5258 change: { 5259 phasedRegistrationNames: { 5260 bubbled: 'onChange', 5261 captured: 'onChangeCapture' 5262 }, 5263 dependencies: ['topBlur', 'topChange', 'topClick', 'topFocus', 'topInput', 'topKeyDown', 'topKeyUp', 'topSelectionChange'] 5264 } 5265 }; 5266 5267 function createAndAccumulateChangeEvent(inst, nativeEvent, target) { 5268 var event = SyntheticEvent$1.getPooled(eventTypes$1.change, inst, nativeEvent, target); 5269 event.type = 'change'; 5270 // Flag this event loop as needing state restore. 5271 enqueueStateRestore(target); 5272 accumulateTwoPhaseDispatches(event); 5273 return event; 5274 } 5275 /** 5276 * For IE shims 5277 */ 5278 var activeElement = null; 5279 var activeElementInst = null; 5280 5281 /** 5282 * SECTION: handle `change` event 5283 */ 5284 function shouldUseChangeEvent(elem) { 5285 var nodeName = elem.nodeName && elem.nodeName.toLowerCase(); 5286 return nodeName === 'select' || nodeName === 'input' && elem.type === 'file'; 5287 } 5288 5289 function manualDispatchChangeEvent(nativeEvent) { 5290 var event = createAndAccumulateChangeEvent(activeElementInst, nativeEvent, getEventTarget(nativeEvent)); 5291 5292 // If change and propertychange bubbled, we'd just bind to it like all the 5293 // other events and have it go through ReactBrowserEventEmitter. Since it 5294 // doesn't, we manually listen for the events and so we have to enqueue and 5295 // process the abstract event manually. 5296 // 5297 // Batching is necessary here in order to ensure that all event handlers run 5298 // before the next rerender (including event handlers attached to ancestor 5299 // elements instead of directly on the input). Without this, controlled 5300 // components don't work properly in conjunction with event bubbling because 5301 // the component is rerendered and the value reverted before all the event 5302 // handlers can run. See https://github.com/facebook/react/issues/708. 5303 batchedUpdates(runEventInBatch, event); 5304 } 5305 5306 function runEventInBatch(event) { 5307 enqueueEvents(event); 5308 processEventQueue(false); 5309 } 5310 5311 function getInstIfValueChanged(targetInst) { 5312 var targetNode = getNodeFromInstance$1(targetInst); 5313 if (updateValueIfChanged(targetNode)) { 5314 return targetInst; 5315 } 5316 } 5317 5318 function getTargetInstForChangeEvent(topLevelType, targetInst) { 5319 if (topLevelType === 'topChange') { 5320 return targetInst; 5321 } 5322 } 5323 5324 /** 5325 * SECTION: handle `input` event 5326 */ 5327 var isInputEventSupported = false; 5328 if (ExecutionEnvironment.canUseDOM) { 5329 // IE9 claims to support the input event but fails to trigger it when 5330 // deleting text, so we ignore its input events. 5331 isInputEventSupported = isEventSupported('input') && (!document.documentMode || document.documentMode > 9); 5332 } 5333 5334 /** 5335 * (For IE <=9) Starts tracking propertychange events on the passed-in element 5336 * and override the value property so that we can distinguish user events from 5337 * value changes in JS. 5338 */ 5339 function startWatchingForValueChange(target, targetInst) { 5340 activeElement = target; 5341 activeElementInst = targetInst; 5342 activeElement.attachEvent('onpropertychange', handlePropertyChange); 5343 } 5344 5345 /** 5346 * (For IE <=9) Removes the event listeners from the currently-tracked element, 5347 * if any exists. 5348 */ 5349 function stopWatchingForValueChange() { 5350 if (!activeElement) { 5351 return; 5352 } 5353 activeElement.detachEvent('onpropertychange', handlePropertyChange); 5354 activeElement = null; 5355 activeElementInst = null; 5356 } 5357 5358 /** 5359 * (For IE <=9) Handles a propertychange event, sending a `change` event if 5360 * the value of the active element has changed. 5361 */ 5362 function handlePropertyChange(nativeEvent) { 5363 if (nativeEvent.propertyName !== 'value') { 5364 return; 5365 } 5366 if (getInstIfValueChanged(activeElementInst)) { 5367 manualDispatchChangeEvent(nativeEvent); 5368 } 5369 } 5370 5371 function handleEventsForInputEventPolyfill(topLevelType, target, targetInst) { 5372 if (topLevelType === 'topFocus') { 5373 // In IE9, propertychange fires for most input events but is buggy and 5374 // doesn't fire when text is deleted, but conveniently, selectionchange 5375 // appears to fire in all of the remaining cases so we catch those and 5376 // forward the event if the value has changed 5377 // In either case, we don't want to call the event handler if the value 5378 // is changed from JS so we redefine a setter for `.value` that updates 5379 // our activeElementValue variable, allowing us to ignore those changes 5380 // 5381 // stopWatching() should be a noop here but we call it just in case we 5382 // missed a blur event somehow. 5383 stopWatchingForValueChange(); 5384 startWatchingForValueChange(target, targetInst); 5385 } else if (topLevelType === 'topBlur') { 5386 stopWatchingForValueChange(); 5387 } 5388 } 5389 5390 // For IE8 and IE9. 5391 function getTargetInstForInputEventPolyfill(topLevelType, targetInst) { 5392 if (topLevelType === 'topSelectionChange' || topLevelType === 'topKeyUp' || topLevelType === 'topKeyDown') { 5393 // On the selectionchange event, the target is just document which isn't 5394 // helpful for us so just check activeElement instead. 5395 // 5396 // 99% of the time, keydown and keyup aren't necessary. IE8 fails to fire 5397 // propertychange on the first input event after setting `value` from a 5398 // script and fires only keydown, keypress, keyup. Catching keyup usually 5399 // gets it and catching keydown lets us fire an event for the first 5400 // keystroke if user does a key repeat (it'll be a little delayed: right 5401 // before the second keystroke). Other input methods (e.g., paste) seem to 5402 // fire selectionchange normally. 5403 return getInstIfValueChanged(activeElementInst); 5404 } 5405 } 5406 5407 /** 5408 * SECTION: handle `click` event 5409 */ 5410 function shouldUseClickEvent(elem) { 5411 // Use the `click` event to detect changes to checkbox and radio inputs. 5412 // This approach works across all browsers, whereas `change` does not fire 5413 // until `blur` in IE8. 5414 var nodeName = elem.nodeName; 5415 return nodeName && nodeName.toLowerCase() === 'input' && (elem.type === 'checkbox' || elem.type === 'radio'); 5416 } 5417 5418 function getTargetInstForClickEvent(topLevelType, targetInst) { 5419 if (topLevelType === 'topClick') { 5420 return getInstIfValueChanged(targetInst); 5421 } 5422 } 5423 5424 function getTargetInstForInputOrChangeEvent(topLevelType, targetInst) { 5425 if (topLevelType === 'topInput' || topLevelType === 'topChange') { 5426 return getInstIfValueChanged(targetInst); 5427 } 5428 } 5429 5430 function handleControlledInputBlur(inst, node) { 5431 // TODO: In IE, inst is occasionally null. Why? 5432 if (inst == null) { 5433 return; 5434 } 5435 5436 // Fiber and ReactDOM keep wrapper state in separate places 5437 var state = inst._wrapperState || node._wrapperState; 5438 5439 if (!state || !state.controlled || node.type !== 'number') { 5440 return; 5441 } 5442 5443 // If controlled, assign the value attribute to the current value on blur 5444 var value = '' + node.value; 5445 if (node.getAttribute('value') !== value) { 5446 node.setAttribute('value', value); 5447 } 5448 } 5449 5450 /** 5451 * This plugin creates an `onChange` event that normalizes change events 5452 * across form elements. This event fires at a time when it's possible to 5453 * change the element's value without seeing a flicker. 5454 * 5455 * Supported elements are: 5456 * - input (see `isTextInputElement`) 5457 * - textarea 5458 * - select 5459 */ 5460 var ChangeEventPlugin = { 5461 eventTypes: eventTypes$1, 5462 5463 _isInputEventSupported: isInputEventSupported, 5464 5465 extractEvents: function (topLevelType, targetInst, nativeEvent, nativeEventTarget) { 5466 var targetNode = targetInst ? getNodeFromInstance$1(targetInst) : window; 5467 5468 var getTargetInstFunc, handleEventFunc; 5469 if (shouldUseChangeEvent(targetNode)) { 5470 getTargetInstFunc = getTargetInstForChangeEvent; 5471 } else if (isTextInputElement(targetNode)) { 5472 if (isInputEventSupported) { 5473 getTargetInstFunc = getTargetInstForInputOrChangeEvent; 5474 } else { 5475 getTargetInstFunc = getTargetInstForInputEventPolyfill; 5476 handleEventFunc = handleEventsForInputEventPolyfill; 5477 } 5478 } else if (shouldUseClickEvent(targetNode)) { 5479 getTargetInstFunc = getTargetInstForClickEvent; 5480 } 5481 5482 if (getTargetInstFunc) { 5483 var inst = getTargetInstFunc(topLevelType, targetInst); 5484 if (inst) { 5485 var event = createAndAccumulateChangeEvent(inst, nativeEvent, nativeEventTarget); 5486 return event; 5487 } 5488 } 5489 5490 if (handleEventFunc) { 5491 handleEventFunc(topLevelType, targetNode, targetInst); 5492 } 5493 5494 // When blurring, set the value attribute for number inputs 5495 if (topLevelType === 'topBlur') { 5496 handleControlledInputBlur(targetInst, targetNode); 5497 } 5498 } 5499 }; 5500 5501 /** 5502 * Module that is injectable into `EventPluginHub`, that specifies a 5503 * deterministic ordering of `EventPlugin`s. A convenient way to reason about 5504 * plugins, without having to package every one of them. This is better than 5505 * having plugins be ordered in the same order that they are injected because 5506 * that ordering would be influenced by the packaging order. 5507 * `ResponderEventPlugin` must occur before `SimpleEventPlugin` so that 5508 * preventing default on events is convenient in `SimpleEventPlugin` handlers. 5509 */ 5510 var DOMEventPluginOrder = ['ResponderEventPlugin', 'SimpleEventPlugin', 'TapEventPlugin', 'EnterLeaveEventPlugin', 'ChangeEventPlugin', 'SelectEventPlugin', 'BeforeInputEventPlugin']; 5511 5512 /** 5513 * @interface UIEvent 5514 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 5515 */ 5516 var UIEventInterface = { 5517 view: null, 5518 detail: null 5519 }; 5520 5521 /** 5522 * @param {object} dispatchConfig Configuration used to dispatch this event. 5523 * @param {string} dispatchMarker Marker identifying the event target. 5524 * @param {object} nativeEvent Native browser event. 5525 * @extends {SyntheticEvent} 5526 */ 5527 function SyntheticUIEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 5528 return SyntheticEvent$1.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 5529 } 5530 5531 SyntheticEvent$1.augmentClass(SyntheticUIEvent, UIEventInterface); 5532 5533 /** 5534 * Translation from modifier key to the associated property in the event. 5535 * @see http://www.w3.org/TR/DOM-Level-3-Events/#keys-Modifiers 5536 */ 5537 5538 var modifierKeyToProp = { 5539 Alt: 'altKey', 5540 Control: 'ctrlKey', 5541 Meta: 'metaKey', 5542 Shift: 'shiftKey' 5543 }; 5544 5545 // IE8 does not implement getModifierState so we simply map it to the only 5546 // modifier keys exposed by the event itself, does not support Lock-keys. 5547 // Currently, all major browsers except Chrome seems to support Lock-keys. 5548 function modifierStateGetter(keyArg) { 5549 var syntheticEvent = this; 5550 var nativeEvent = syntheticEvent.nativeEvent; 5551 if (nativeEvent.getModifierState) { 5552 return nativeEvent.getModifierState(keyArg); 5553 } 5554 var keyProp = modifierKeyToProp[keyArg]; 5555 return keyProp ? !!nativeEvent[keyProp] : false; 5556 } 5557 5558 function getEventModifierState(nativeEvent) { 5559 return modifierStateGetter; 5560 } 5561 5562 /** 5563 * @interface MouseEvent 5564 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 5565 */ 5566 var MouseEventInterface = { 5567 screenX: null, 5568 screenY: null, 5569 clientX: null, 5570 clientY: null, 5571 pageX: null, 5572 pageY: null, 5573 ctrlKey: null, 5574 shiftKey: null, 5575 altKey: null, 5576 metaKey: null, 5577 getModifierState: getEventModifierState, 5578 button: null, 5579 buttons: null, 5580 relatedTarget: function (event) { 5581 return event.relatedTarget || (event.fromElement === event.srcElement ? event.toElement : event.fromElement); 5582 } 5583 }; 5584 5585 /** 5586 * @param {object} dispatchConfig Configuration used to dispatch this event. 5587 * @param {string} dispatchMarker Marker identifying the event target. 5588 * @param {object} nativeEvent Native browser event. 5589 * @extends {SyntheticUIEvent} 5590 */ 5591 function SyntheticMouseEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 5592 return SyntheticUIEvent.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 5593 } 5594 5595 SyntheticUIEvent.augmentClass(SyntheticMouseEvent, MouseEventInterface); 5596 5597 var eventTypes$2 = { 5598 mouseEnter: { 5599 registrationName: 'onMouseEnter', 5600 dependencies: ['topMouseOut', 'topMouseOver'] 5601 }, 5602 mouseLeave: { 5603 registrationName: 'onMouseLeave', 5604 dependencies: ['topMouseOut', 'topMouseOver'] 5605 } 5606 }; 5607 5608 var EnterLeaveEventPlugin = { 5609 eventTypes: eventTypes$2, 5610 5611 /** 5612 * For almost every interaction we care about, there will be both a top-level 5613 * `mouseover` and `mouseout` event that occurs. Only use `mouseout` so that 5614 * we do not extract duplicate events. However, moving the mouse into the 5615 * browser from outside will not fire a `mouseout` event. In this case, we use 5616 * the `mouseover` top-level event. 5617 */ 5618 extractEvents: function (topLevelType, targetInst, nativeEvent, nativeEventTarget) { 5619 if (topLevelType === 'topMouseOver' && (nativeEvent.relatedTarget || nativeEvent.fromElement)) { 5620 return null; 5621 } 5622 if (topLevelType !== 'topMouseOut' && topLevelType !== 'topMouseOver') { 5623 // Must not be a mouse in or mouse out - ignoring. 5624 return null; 5625 } 5626 5627 var win; 5628 if (nativeEventTarget.window === nativeEventTarget) { 5629 // `nativeEventTarget` is probably a window object. 5630 win = nativeEventTarget; 5631 } else { 5632 // TODO: Figure out why `ownerDocument` is sometimes undefined in IE8. 5633 var doc = nativeEventTarget.ownerDocument; 5634 if (doc) { 5635 win = doc.defaultView || doc.parentWindow; 5636 } else { 5637 win = window; 5638 } 5639 } 5640 5641 var from; 5642 var to; 5643 if (topLevelType === 'topMouseOut') { 5644 from = targetInst; 5645 var related = nativeEvent.relatedTarget || nativeEvent.toElement; 5646 to = related ? getClosestInstanceFromNode(related) : null; 5647 } else { 5648 // Moving to a node from outside the window. 5649 from = null; 5650 to = targetInst; 5651 } 5652 5653 if (from === to) { 5654 // Nothing pertains to our managed components. 5655 return null; 5656 } 5657 5658 var fromNode = from == null ? win : getNodeFromInstance$1(from); 5659 var toNode = to == null ? win : getNodeFromInstance$1(to); 5660 5661 var leave = SyntheticMouseEvent.getPooled(eventTypes$2.mouseLeave, from, nativeEvent, nativeEventTarget); 5662 leave.type = 'mouseleave'; 5663 leave.target = fromNode; 5664 leave.relatedTarget = toNode; 5665 5666 var enter = SyntheticMouseEvent.getPooled(eventTypes$2.mouseEnter, to, nativeEvent, nativeEventTarget); 5667 enter.type = 'mouseenter'; 5668 enter.target = toNode; 5669 enter.relatedTarget = fromNode; 5670 5671 accumulateEnterLeaveDispatches(leave, enter, from, to); 5672 5673 return [leave, enter]; 5674 } 5675 }; 5676 5677 /** 5678 * `ReactInstanceMap` maintains a mapping from a public facing stateful 5679 * instance (key) and the internal representation (value). This allows public 5680 * methods to accept the user facing instance as an argument and map them back 5681 * to internal methods. 5682 * 5683 * Note that this module is currently shared and assumed to be stateless. 5684 * If this becomes an actual Map, that will break. 5685 */ 5686 5687 /** 5688 * This API should be called `delete` but we'd have to make sure to always 5689 * transform these to strings for IE support. When this transform is fully 5690 * supported we can rename it. 5691 */ 5692 5693 5694 function get(key) { 5695 return key._reactInternalFiber; 5696 } 5697 5698 function has(key) { 5699 return key._reactInternalFiber !== undefined; 5700 } 5701 5702 function set(key, value) { 5703 key._reactInternalFiber = value; 5704 } 5705 5706 var ReactInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; 5707 5708 var ReactCurrentOwner = ReactInternals.ReactCurrentOwner; 5709 var ReactDebugCurrentFrame = ReactInternals.ReactDebugCurrentFrame; 5710 5711 function getComponentName(fiber) { 5712 var type = fiber.type; 5713 5714 if (typeof type === 'string') { 5715 return type; 5716 } 5717 if (typeof type === 'function') { 5718 return type.displayName || type.name; 5719 } 5720 return null; 5721 } 5722 5723 // Don't change these two values: 5724 var NoEffect = 0; // 0b00000000 5725 var PerformedWork = 1; // 0b00000001 5726 5727 // You can change the rest (and add more). 5728 var Placement = 2; // 0b00000010 5729 var Update = 4; // 0b00000100 5730 var PlacementAndUpdate = 6; // 0b00000110 5731 var Deletion = 8; // 0b00001000 5732 var ContentReset = 16; // 0b00010000 5733 var Callback = 32; // 0b00100000 5734 var Err = 64; // 0b01000000 5735 var Ref = 128; // 0b10000000 5736 5737 var MOUNTING = 1; 5738 var MOUNTED = 2; 5739 var UNMOUNTED = 3; 5740 5741 function isFiberMountedImpl(fiber) { 5742 var node = fiber; 5743 if (!fiber.alternate) { 5744 // If there is no alternate, this might be a new tree that isn't inserted 5745 // yet. If it is, then it will have a pending insertion effect on it. 5746 if ((node.effectTag & Placement) !== NoEffect) { 5747 return MOUNTING; 5748 } 5749 while (node['return']) { 5750 node = node['return']; 5751 if ((node.effectTag & Placement) !== NoEffect) { 5752 return MOUNTING; 5753 } 5754 } 5755 } else { 5756 while (node['return']) { 5757 node = node['return']; 5758 } 5759 } 5760 if (node.tag === HostRoot) { 5761 // TODO: Check if this was a nested HostRoot when used with 5762 // renderContainerIntoSubtree. 5763 return MOUNTED; 5764 } 5765 // If we didn't hit the root, that means that we're in an disconnected tree 5766 // that has been unmounted. 5767 return UNMOUNTED; 5768 } 5769 5770 function isFiberMounted(fiber) { 5771 return isFiberMountedImpl(fiber) === MOUNTED; 5772 } 5773 5774 function isMounted(component) { 5775 { 5776 var owner = ReactCurrentOwner.current; 5777 if (owner !== null && owner.tag === ClassComponent) { 5778 var ownerFiber = owner; 5779 var instance = ownerFiber.stateNode; 5780 warning(instance._warnedAboutRefsInRender, '%s is accessing isMounted inside its render() function. ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', getComponentName(ownerFiber) || 'A component'); 5781 instance._warnedAboutRefsInRender = true; 5782 } 5783 } 5784 5785 var fiber = get(component); 5786 if (!fiber) { 5787 return false; 5788 } 5789 return isFiberMountedImpl(fiber) === MOUNTED; 5790 } 5791 5792 function assertIsMounted(fiber) { 5793 !(isFiberMountedImpl(fiber) === MOUNTED) ? invariant(false, 'Unable to find node on an unmounted component.') : void 0; 5794 } 5795 5796 function findCurrentFiberUsingSlowPath(fiber) { 5797 var alternate = fiber.alternate; 5798 if (!alternate) { 5799 // If there is no alternate, then we only need to check if it is mounted. 5800 var state = isFiberMountedImpl(fiber); 5801 !(state !== UNMOUNTED) ? invariant(false, 'Unable to find node on an unmounted component.') : void 0; 5802 if (state === MOUNTING) { 5803 return null; 5804 } 5805 return fiber; 5806 } 5807 // If we have two possible branches, we'll walk backwards up to the root 5808 // to see what path the root points to. On the way we may hit one of the 5809 // special cases and we'll deal with them. 5810 var a = fiber; 5811 var b = alternate; 5812 while (true) { 5813 var parentA = a['return']; 5814 var parentB = parentA ? parentA.alternate : null; 5815 if (!parentA || !parentB) { 5816 // We're at the root. 5817 break; 5818 } 5819 5820 // If both copies of the parent fiber point to the same child, we can 5821 // assume that the child is current. This happens when we bailout on low 5822 // priority: the bailed out fiber's child reuses the current child. 5823 if (parentA.child === parentB.child) { 5824 var child = parentA.child; 5825 while (child) { 5826 if (child === a) { 5827 // We've determined that A is the current branch. 5828 assertIsMounted(parentA); 5829 return fiber; 5830 } 5831 if (child === b) { 5832 // We've determined that B is the current branch. 5833 assertIsMounted(parentA); 5834 return alternate; 5835 } 5836 child = child.sibling; 5837 } 5838 // We should never have an alternate for any mounting node. So the only 5839 // way this could possibly happen is if this was unmounted, if at all. 5840 invariant(false, 'Unable to find node on an unmounted component.'); 5841 } 5842 5843 if (a['return'] !== b['return']) { 5844 // The return pointer of A and the return pointer of B point to different 5845 // fibers. We assume that return pointers never criss-cross, so A must 5846 // belong to the child set of A.return, and B must belong to the child 5847 // set of B.return. 5848 a = parentA; 5849 b = parentB; 5850 } else { 5851 // The return pointers point to the same fiber. We'll have to use the 5852 // default, slow path: scan the child sets of each parent alternate to see 5853 // which child belongs to which set. 5854 // 5855 // Search parent A's child set 5856 var didFindChild = false; 5857 var _child = parentA.child; 5858 while (_child) { 5859 if (_child === a) { 5860 didFindChild = true; 5861 a = parentA; 5862 b = parentB; 5863 break; 5864 } 5865 if (_child === b) { 5866 didFindChild = true; 5867 b = parentA; 5868 a = parentB; 5869 break; 5870 } 5871 _child = _child.sibling; 5872 } 5873 if (!didFindChild) { 5874 // Search parent B's child set 5875 _child = parentB.child; 5876 while (_child) { 5877 if (_child === a) { 5878 didFindChild = true; 5879 a = parentB; 5880 b = parentA; 5881 break; 5882 } 5883 if (_child === b) { 5884 didFindChild = true; 5885 b = parentB; 5886 a = parentA; 5887 break; 5888 } 5889 _child = _child.sibling; 5890 } 5891 !didFindChild ? invariant(false, 'Child was not found in either parent set. This indicates a bug in React related to the return pointer. Please file an issue.') : void 0; 5892 } 5893 } 5894 5895 !(a.alternate === b) ? invariant(false, 'Return fibers should always be each others\' alternates. This error is likely caused by a bug in React. Please file an issue.') : void 0; 5896 } 5897 // If the root is not a host container, we're in a disconnected tree. I.e. 5898 // unmounted. 5899 !(a.tag === HostRoot) ? invariant(false, 'Unable to find node on an unmounted component.') : void 0; 5900 if (a.stateNode.current === a) { 5901 // We've determined that A is the current branch. 5902 return fiber; 5903 } 5904 // Otherwise B has to be current branch. 5905 return alternate; 5906 } 5907 5908 function findCurrentHostFiber(parent) { 5909 var currentParent = findCurrentFiberUsingSlowPath(parent); 5910 if (!currentParent) { 5911 return null; 5912 } 5913 5914 // Next we'll drill down this component to find the first HostComponent/Text. 5915 var node = currentParent; 5916 while (true) { 5917 if (node.tag === HostComponent || node.tag === HostText) { 5918 return node; 5919 } else if (node.child) { 5920 node.child['return'] = node; 5921 node = node.child; 5922 continue; 5923 } 5924 if (node === currentParent) { 5925 return null; 5926 } 5927 while (!node.sibling) { 5928 if (!node['return'] || node['return'] === currentParent) { 5929 return null; 5930 } 5931 node = node['return']; 5932 } 5933 node.sibling['return'] = node['return']; 5934 node = node.sibling; 5935 } 5936 // Flow needs the return null here, but ESLint complains about it. 5937 // eslint-disable-next-line no-unreachable 5938 return null; 5939 } 5940 5941 function findCurrentHostFiberWithNoPortals(parent) { 5942 var currentParent = findCurrentFiberUsingSlowPath(parent); 5943 if (!currentParent) { 5944 return null; 5945 } 5946 5947 // Next we'll drill down this component to find the first HostComponent/Text. 5948 var node = currentParent; 5949 while (true) { 5950 if (node.tag === HostComponent || node.tag === HostText) { 5951 return node; 5952 } else if (node.child && node.tag !== HostPortal) { 5953 node.child['return'] = node; 5954 node = node.child; 5955 continue; 5956 } 5957 if (node === currentParent) { 5958 return null; 5959 } 5960 while (!node.sibling) { 5961 if (!node['return'] || node['return'] === currentParent) { 5962 return null; 5963 } 5964 node = node['return']; 5965 } 5966 node.sibling['return'] = node['return']; 5967 node = node.sibling; 5968 } 5969 // Flow needs the return null here, but ESLint complains about it. 5970 // eslint-disable-next-line no-unreachable 5971 return null; 5972 } 5973 5974 var CALLBACK_BOOKKEEPING_POOL_SIZE = 10; 5975 var callbackBookkeepingPool = []; 5976 5977 /** 5978 * Find the deepest React component completely containing the root of the 5979 * passed-in instance (for use when entire React trees are nested within each 5980 * other). If React trees are not nested, returns null. 5981 */ 5982 function findRootContainerNode(inst) { 5983 // TODO: It may be a good idea to cache this to prevent unnecessary DOM 5984 // traversal, but caching is difficult to do correctly without using a 5985 // mutation observer to listen for all DOM changes. 5986 while (inst['return']) { 5987 inst = inst['return']; 5988 } 5989 if (inst.tag !== HostRoot) { 5990 // This can happen if we're in a detached tree. 5991 return null; 5992 } 5993 return inst.stateNode.containerInfo; 5994 } 5995 5996 // Used to store ancestor hierarchy in top level callback 5997 function getTopLevelCallbackBookKeeping(topLevelType, nativeEvent, targetInst) { 5998 if (callbackBookkeepingPool.length) { 5999 var instance = callbackBookkeepingPool.pop(); 6000 instance.topLevelType = topLevelType; 6001 instance.nativeEvent = nativeEvent; 6002 instance.targetInst = targetInst; 6003 return instance; 6004 } 6005 return { 6006 topLevelType: topLevelType, 6007 nativeEvent: nativeEvent, 6008 targetInst: targetInst, 6009 ancestors: [] 6010 }; 6011 } 6012 6013 function releaseTopLevelCallbackBookKeeping(instance) { 6014 instance.topLevelType = null; 6015 instance.nativeEvent = null; 6016 instance.targetInst = null; 6017 instance.ancestors.length = 0; 6018 if (callbackBookkeepingPool.length < CALLBACK_BOOKKEEPING_POOL_SIZE) { 6019 callbackBookkeepingPool.push(instance); 6020 } 6021 } 6022 6023 function handleTopLevelImpl(bookKeeping) { 6024 var targetInst = bookKeeping.targetInst; 6025 6026 // Loop through the hierarchy, in case there's any nested components. 6027 // It's important that we build the array of ancestors before calling any 6028 // event handlers, because event handlers can modify the DOM, leading to 6029 // inconsistencies with ReactMount's node cache. See #1105. 6030 var ancestor = targetInst; 6031 do { 6032 if (!ancestor) { 6033 bookKeeping.ancestors.push(ancestor); 6034 break; 6035 } 6036 var root = findRootContainerNode(ancestor); 6037 if (!root) { 6038 break; 6039 } 6040 bookKeeping.ancestors.push(ancestor); 6041 ancestor = getClosestInstanceFromNode(root); 6042 } while (ancestor); 6043 6044 for (var i = 0; i < bookKeeping.ancestors.length; i++) { 6045 targetInst = bookKeeping.ancestors[i]; 6046 _handleTopLevel(bookKeeping.topLevelType, targetInst, bookKeeping.nativeEvent, getEventTarget(bookKeeping.nativeEvent)); 6047 } 6048 } 6049 6050 // TODO: can we stop exporting these? 6051 var _enabled = true; 6052 var _handleTopLevel = void 0; 6053 6054 function setHandleTopLevel(handleTopLevel) { 6055 _handleTopLevel = handleTopLevel; 6056 } 6057 6058 function setEnabled(enabled) { 6059 _enabled = !!enabled; 6060 } 6061 6062 function isEnabled() { 6063 return _enabled; 6064 } 6065 6066 /** 6067 * Traps top-level events by using event bubbling. 6068 * 6069 * @param {string} topLevelType Record from `BrowserEventConstants`. 6070 * @param {string} handlerBaseName Event name (e.g. "click"). 6071 * @param {object} element Element on which to attach listener. 6072 * @return {?object} An object with a remove function which will forcefully 6073 * remove the listener. 6074 * @internal 6075 */ 6076 function trapBubbledEvent(topLevelType, handlerBaseName, element) { 6077 if (!element) { 6078 return null; 6079 } 6080 return EventListener.listen(element, handlerBaseName, dispatchEvent.bind(null, topLevelType)); 6081 } 6082 6083 /** 6084 * Traps a top-level event by using event capturing. 6085 * 6086 * @param {string} topLevelType Record from `BrowserEventConstants`. 6087 * @param {string} handlerBaseName Event name (e.g. "click"). 6088 * @param {object} element Element on which to attach listener. 6089 * @return {?object} An object with a remove function which will forcefully 6090 * remove the listener. 6091 * @internal 6092 */ 6093 function trapCapturedEvent(topLevelType, handlerBaseName, element) { 6094 if (!element) { 6095 return null; 6096 } 6097 return EventListener.capture(element, handlerBaseName, dispatchEvent.bind(null, topLevelType)); 6098 } 6099 6100 function dispatchEvent(topLevelType, nativeEvent) { 6101 if (!_enabled) { 6102 return; 6103 } 6104 6105 var nativeEventTarget = getEventTarget(nativeEvent); 6106 var targetInst = getClosestInstanceFromNode(nativeEventTarget); 6107 if (targetInst !== null && typeof targetInst.tag === 'number' && !isFiberMounted(targetInst)) { 6108 // If we get an event (ex: img onload) before committing that 6109 // component's mount, ignore it for now (that is, treat it as if it was an 6110 // event on a non-React tree). We might also consider queueing events and 6111 // dispatching them after the mount. 6112 targetInst = null; 6113 } 6114 6115 var bookKeeping = getTopLevelCallbackBookKeeping(topLevelType, nativeEvent, targetInst); 6116 6117 try { 6118 // Event queue being processed in the same cycle allows 6119 // `preventDefault`. 6120 batchedUpdates(handleTopLevelImpl, bookKeeping); 6121 } finally { 6122 releaseTopLevelCallbackBookKeeping(bookKeeping); 6123 } 6124 } 6125 6126 var ReactDOMEventListener = Object.freeze({ 6127 get _enabled () { return _enabled; }, 6128 get _handleTopLevel () { return _handleTopLevel; }, 6129 setHandleTopLevel: setHandleTopLevel, 6130 setEnabled: setEnabled, 6131 isEnabled: isEnabled, 6132 trapBubbledEvent: trapBubbledEvent, 6133 trapCapturedEvent: trapCapturedEvent, 6134 dispatchEvent: dispatchEvent 6135 }); 6136 6137 /** 6138 * Generate a mapping of standard vendor prefixes using the defined style property and event name. 6139 * 6140 * @param {string} styleProp 6141 * @param {string} eventName 6142 * @returns {object} 6143 */ 6144 function makePrefixMap(styleProp, eventName) { 6145 var prefixes = {}; 6146 6147 prefixes[styleProp.toLowerCase()] = eventName.toLowerCase(); 6148 prefixes['Webkit' + styleProp] = 'webkit' + eventName; 6149 prefixes['Moz' + styleProp] = 'moz' + eventName; 6150 prefixes['ms' + styleProp] = 'MS' + eventName; 6151 prefixes['O' + styleProp] = 'o' + eventName.toLowerCase(); 6152 6153 return prefixes; 6154 } 6155 6156 /** 6157 * A list of event names to a configurable list of vendor prefixes. 6158 */ 6159 var vendorPrefixes = { 6160 animationend: makePrefixMap('Animation', 'AnimationEnd'), 6161 animationiteration: makePrefixMap('Animation', 'AnimationIteration'), 6162 animationstart: makePrefixMap('Animation', 'AnimationStart'), 6163 transitionend: makePrefixMap('Transition', 'TransitionEnd') 6164 }; 6165 6166 /** 6167 * Event names that have already been detected and prefixed (if applicable). 6168 */ 6169 var prefixedEventNames = {}; 6170 6171 /** 6172 * Element to check for prefixes on. 6173 */ 6174 var style = {}; 6175 6176 /** 6177 * Bootstrap if a DOM exists. 6178 */ 6179 if (ExecutionEnvironment.canUseDOM) { 6180 style = document.createElement('div').style; 6181 6182 // On some platforms, in particular some releases of Android 4.x, 6183 // the un-prefixed "animation" and "transition" properties are defined on the 6184 // style object but the events that fire will still be prefixed, so we need 6185 // to check if the un-prefixed events are usable, and if not remove them from the map. 6186 if (!('AnimationEvent' in window)) { 6187 delete vendorPrefixes.animationend.animation; 6188 delete vendorPrefixes.animationiteration.animation; 6189 delete vendorPrefixes.animationstart.animation; 6190 } 6191 6192 // Same as above 6193 if (!('TransitionEvent' in window)) { 6194 delete vendorPrefixes.transitionend.transition; 6195 } 6196 } 6197 6198 /** 6199 * Attempts to determine the correct vendor prefixed event name. 6200 * 6201 * @param {string} eventName 6202 * @returns {string} 6203 */ 6204 function getVendorPrefixedEventName(eventName) { 6205 if (prefixedEventNames[eventName]) { 6206 return prefixedEventNames[eventName]; 6207 } else if (!vendorPrefixes[eventName]) { 6208 return eventName; 6209 } 6210 6211 var prefixMap = vendorPrefixes[eventName]; 6212 6213 for (var styleProp in prefixMap) { 6214 if (prefixMap.hasOwnProperty(styleProp) && styleProp in style) { 6215 return prefixedEventNames[eventName] = prefixMap[styleProp]; 6216 } 6217 } 6218 6219 return ''; 6220 } 6221 6222 /** 6223 * Types of raw signals from the browser caught at the top level. 6224 * 6225 * For events like 'submit' which don't consistently bubble (which we 6226 * trap at a lower node than `document`), binding at `document` would 6227 * cause duplicate events so we don't include them here. 6228 */ 6229 var topLevelTypes$1 = { 6230 topAbort: 'abort', 6231 topAnimationEnd: getVendorPrefixedEventName('animationend') || 'animationend', 6232 topAnimationIteration: getVendorPrefixedEventName('animationiteration') || 'animationiteration', 6233 topAnimationStart: getVendorPrefixedEventName('animationstart') || 'animationstart', 6234 topBlur: 'blur', 6235 topCancel: 'cancel', 6236 topCanPlay: 'canplay', 6237 topCanPlayThrough: 'canplaythrough', 6238 topChange: 'change', 6239 topClick: 'click', 6240 topClose: 'close', 6241 topCompositionEnd: 'compositionend', 6242 topCompositionStart: 'compositionstart', 6243 topCompositionUpdate: 'compositionupdate', 6244 topContextMenu: 'contextmenu', 6245 topCopy: 'copy', 6246 topCut: 'cut', 6247 topDoubleClick: 'dblclick', 6248 topDrag: 'drag', 6249 topDragEnd: 'dragend', 6250 topDragEnter: 'dragenter', 6251 topDragExit: 'dragexit', 6252 topDragLeave: 'dragleave', 6253 topDragOver: 'dragover', 6254 topDragStart: 'dragstart', 6255 topDrop: 'drop', 6256 topDurationChange: 'durationchange', 6257 topEmptied: 'emptied', 6258 topEncrypted: 'encrypted', 6259 topEnded: 'ended', 6260 topError: 'error', 6261 topFocus: 'focus', 6262 topInput: 'input', 6263 topKeyDown: 'keydown', 6264 topKeyPress: 'keypress', 6265 topKeyUp: 'keyup', 6266 topLoadedData: 'loadeddata', 6267 topLoad: 'load', 6268 topLoadedMetadata: 'loadedmetadata', 6269 topLoadStart: 'loadstart', 6270 topMouseDown: 'mousedown', 6271 topMouseMove: 'mousemove', 6272 topMouseOut: 'mouseout', 6273 topMouseOver: 'mouseover', 6274 topMouseUp: 'mouseup', 6275 topPaste: 'paste', 6276 topPause: 'pause', 6277 topPlay: 'play', 6278 topPlaying: 'playing', 6279 topProgress: 'progress', 6280 topRateChange: 'ratechange', 6281 topScroll: 'scroll', 6282 topSeeked: 'seeked', 6283 topSeeking: 'seeking', 6284 topSelectionChange: 'selectionchange', 6285 topStalled: 'stalled', 6286 topSuspend: 'suspend', 6287 topTextInput: 'textInput', 6288 topTimeUpdate: 'timeupdate', 6289 topToggle: 'toggle', 6290 topTouchCancel: 'touchcancel', 6291 topTouchEnd: 'touchend', 6292 topTouchMove: 'touchmove', 6293 topTouchStart: 'touchstart', 6294 topTransitionEnd: getVendorPrefixedEventName('transitionend') || 'transitionend', 6295 topVolumeChange: 'volumechange', 6296 topWaiting: 'waiting', 6297 topWheel: 'wheel' 6298 }; 6299 6300 var BrowserEventConstants = { 6301 topLevelTypes: topLevelTypes$1 6302 }; 6303 6304 function runEventQueueInBatch(events) { 6305 enqueueEvents(events); 6306 processEventQueue(false); 6307 } 6308 6309 /** 6310 * Streams a fired top-level event to `EventPluginHub` where plugins have the 6311 * opportunity to create `ReactEvent`s to be dispatched. 6312 */ 6313 function handleTopLevel(topLevelType, targetInst, nativeEvent, nativeEventTarget) { 6314 var events = extractEvents(topLevelType, targetInst, nativeEvent, nativeEventTarget); 6315 runEventQueueInBatch(events); 6316 } 6317 6318 var topLevelTypes = BrowserEventConstants.topLevelTypes; 6319 6320 /** 6321 * Summary of `ReactBrowserEventEmitter` event handling: 6322 * 6323 * - Top-level delegation is used to trap most native browser events. This 6324 * may only occur in the main thread and is the responsibility of 6325 * ReactDOMEventListener, which is injected and can therefore support 6326 * pluggable event sources. This is the only work that occurs in the main 6327 * thread. 6328 * 6329 * - We normalize and de-duplicate events to account for browser quirks. This 6330 * may be done in the worker thread. 6331 * 6332 * - Forward these native events (with the associated top-level type used to 6333 * trap it) to `EventPluginHub`, which in turn will ask plugins if they want 6334 * to extract any synthetic events. 6335 * 6336 * - The `EventPluginHub` will then process each event by annotating them with 6337 * "dispatches", a sequence of listeners and IDs that care about that event. 6338 * 6339 * - The `EventPluginHub` then dispatches the events. 6340 * 6341 * Overview of React and the event system: 6342 * 6343 * +------------+ . 6344 * | DOM | . 6345 * +------------+ . 6346 * | . 6347 * v . 6348 * +------------+ . 6349 * | ReactEvent | . 6350 * | Listener | . 6351 * +------------+ . +-----------+ 6352 * | . +--------+|SimpleEvent| 6353 * | . | |Plugin | 6354 * +-----|------+ . v +-----------+ 6355 * | | | . +--------------+ +------------+ 6356 * | +-----------.--->|EventPluginHub| | Event | 6357 * | | . | | +-----------+ | Propagators| 6358 * | ReactEvent | . | | |TapEvent | |------------| 6359 * | Emitter | . | |<---+|Plugin | |other plugin| 6360 * | | . | | +-----------+ | utilities | 6361 * | +-----------.--->| | +------------+ 6362 * | | | . +--------------+ 6363 * +-----|------+ . ^ +-----------+ 6364 * | . | |Enter/Leave| 6365 * + . +-------+|Plugin | 6366 * +-------------+ . +-----------+ 6367 * | application | . 6368 * |-------------| . 6369 * | | . 6370 * | | . 6371 * +-------------+ . 6372 * . 6373 * React Core . General Purpose Event Plugin System 6374 */ 6375 6376 var alreadyListeningTo = {}; 6377 var reactTopListenersCounter = 0; 6378 6379 /** 6380 * To ensure no conflicts with other potential React instances on the page 6381 */ 6382 var topListenersIDKey = '_reactListenersID' + ('' + Math.random()).slice(2); 6383 6384 function getListeningForDocument(mountAt) { 6385 // In IE8, `mountAt` is a host object and doesn't have `hasOwnProperty` 6386 // directly. 6387 if (!Object.prototype.hasOwnProperty.call(mountAt, topListenersIDKey)) { 6388 mountAt[topListenersIDKey] = reactTopListenersCounter++; 6389 alreadyListeningTo[mountAt[topListenersIDKey]] = {}; 6390 } 6391 return alreadyListeningTo[mountAt[topListenersIDKey]]; 6392 } 6393 6394 /** 6395 * We listen for bubbled touch events on the document object. 6396 * 6397 * Firefox v8.01 (and possibly others) exhibited strange behavior when 6398 * mounting `onmousemove` events at some node that was not the document 6399 * element. The symptoms were that if your mouse is not moving over something 6400 * contained within that mount point (for example on the background) the 6401 * top-level listeners for `onmousemove` won't be called. However, if you 6402 * register the `mousemove` on the document object, then it will of course 6403 * catch all `mousemove`s. This along with iOS quirks, justifies restricting 6404 * top-level listeners to the document object only, at least for these 6405 * movement types of events and possibly all events. 6406 * 6407 * @see http://www.quirksmode.org/blog/archives/2010/09/click_event_del.html 6408 * 6409 * Also, `keyup`/`keypress`/`keydown` do not bubble to the window on IE, but 6410 * they bubble to document. 6411 * 6412 * @param {string} registrationName Name of listener (e.g. `onClick`). 6413 * @param {object} contentDocumentHandle Document which owns the container 6414 */ 6415 function listenTo(registrationName, contentDocumentHandle) { 6416 var mountAt = contentDocumentHandle; 6417 var isListening = getListeningForDocument(mountAt); 6418 var dependencies = registrationNameDependencies[registrationName]; 6419 6420 for (var i = 0; i < dependencies.length; i++) { 6421 var dependency = dependencies[i]; 6422 if (!(isListening.hasOwnProperty(dependency) && isListening[dependency])) { 6423 if (dependency === 'topScroll') { 6424 trapCapturedEvent('topScroll', 'scroll', mountAt); 6425 } else if (dependency === 'topFocus' || dependency === 'topBlur') { 6426 trapCapturedEvent('topFocus', 'focus', mountAt); 6427 trapCapturedEvent('topBlur', 'blur', mountAt); 6428 6429 // to make sure blur and focus event listeners are only attached once 6430 isListening.topBlur = true; 6431 isListening.topFocus = true; 6432 } else if (dependency === 'topCancel') { 6433 if (isEventSupported('cancel', true)) { 6434 trapCapturedEvent('topCancel', 'cancel', mountAt); 6435 } 6436 isListening.topCancel = true; 6437 } else if (dependency === 'topClose') { 6438 if (isEventSupported('close', true)) { 6439 trapCapturedEvent('topClose', 'close', mountAt); 6440 } 6441 isListening.topClose = true; 6442 } else if (topLevelTypes.hasOwnProperty(dependency)) { 6443 trapBubbledEvent(dependency, topLevelTypes[dependency], mountAt); 6444 } 6445 6446 isListening[dependency] = true; 6447 } 6448 } 6449 } 6450 6451 function isListeningToAllDependencies(registrationName, mountAt) { 6452 var isListening = getListeningForDocument(mountAt); 6453 var dependencies = registrationNameDependencies[registrationName]; 6454 for (var i = 0; i < dependencies.length; i++) { 6455 var dependency = dependencies[i]; 6456 if (!(isListening.hasOwnProperty(dependency) && isListening[dependency])) { 6457 return false; 6458 } 6459 } 6460 return true; 6461 } 6462 6463 /** 6464 * Given any node return the first leaf node without children. 6465 * 6466 * @param {DOMElement|DOMTextNode} node 6467 * @return {DOMElement|DOMTextNode} 6468 */ 6469 function getLeafNode(node) { 6470 while (node && node.firstChild) { 6471 node = node.firstChild; 6472 } 6473 return node; 6474 } 6475 6476 /** 6477 * Get the next sibling within a container. This will walk up the 6478 * DOM if a node's siblings have been exhausted. 6479 * 6480 * @param {DOMElement|DOMTextNode} node 6481 * @return {?DOMElement|DOMTextNode} 6482 */ 6483 function getSiblingNode(node) { 6484 while (node) { 6485 if (node.nextSibling) { 6486 return node.nextSibling; 6487 } 6488 node = node.parentNode; 6489 } 6490 } 6491 6492 /** 6493 * Get object describing the nodes which contain characters at offset. 6494 * 6495 * @param {DOMElement|DOMTextNode} root 6496 * @param {number} offset 6497 * @return {?object} 6498 */ 6499 function getNodeForCharacterOffset(root, offset) { 6500 var node = getLeafNode(root); 6501 var nodeStart = 0; 6502 var nodeEnd = 0; 6503 6504 while (node) { 6505 if (node.nodeType === TEXT_NODE) { 6506 nodeEnd = nodeStart + node.textContent.length; 6507 6508 if (nodeStart <= offset && nodeEnd >= offset) { 6509 return { 6510 node: node, 6511 offset: offset - nodeStart 6512 }; 6513 } 6514 6515 nodeStart = nodeEnd; 6516 } 6517 6518 node = getLeafNode(getSiblingNode(node)); 6519 } 6520 } 6521 6522 /** 6523 * @param {DOMElement} outerNode 6524 * @return {?object} 6525 */ 6526 function getOffsets(outerNode) { 6527 var selection = window.getSelection && window.getSelection(); 6528 6529 if (!selection || selection.rangeCount === 0) { 6530 return null; 6531 } 6532 6533 var anchorNode = selection.anchorNode, 6534 anchorOffset = selection.anchorOffset, 6535 focusNode$$1 = selection.focusNode, 6536 focusOffset = selection.focusOffset; 6537 6538 // In Firefox, anchorNode and focusNode can be "anonymous divs", e.g. the 6539 // up/down buttons on an <input type="number">. Anonymous divs do not seem to 6540 // expose properties, triggering a "Permission denied error" if any of its 6541 // properties are accessed. The only seemingly possible way to avoid erroring 6542 // is to access a property that typically works for non-anonymous divs and 6543 // catch any error that may otherwise arise. See 6544 // https://bugzilla.mozilla.org/show_bug.cgi?id=208427 6545 6546 try { 6547 /* eslint-disable no-unused-expressions */ 6548 anchorNode.nodeType; 6549 focusNode$$1.nodeType; 6550 /* eslint-enable no-unused-expressions */ 6551 } catch (e) { 6552 return null; 6553 } 6554 6555 return getModernOffsetsFromPoints(outerNode, anchorNode, anchorOffset, focusNode$$1, focusOffset); 6556 } 6557 6558 /** 6559 * Returns {start, end} where `start` is the character/codepoint index of 6560 * (anchorNode, anchorOffset) within the textContent of `outerNode`, and 6561 * `end` is the index of (focusNode, focusOffset). 6562 * 6563 * Returns null if you pass in garbage input but we should probably just crash. 6564 * 6565 * Exported only for testing. 6566 */ 6567 function getModernOffsetsFromPoints(outerNode, anchorNode, anchorOffset, focusNode$$1, focusOffset) { 6568 var length = 0; 6569 var start = -1; 6570 var end = -1; 6571 var indexWithinAnchor = 0; 6572 var indexWithinFocus = 0; 6573 var node = outerNode; 6574 var parentNode = null; 6575 6576 outer: while (true) { 6577 var next = null; 6578 6579 while (true) { 6580 if (node === anchorNode && (anchorOffset === 0 || node.nodeType === TEXT_NODE)) { 6581 start = length + anchorOffset; 6582 } 6583 if (node === focusNode$$1 && (focusOffset === 0 || node.nodeType === TEXT_NODE)) { 6584 end = length + focusOffset; 6585 } 6586 6587 if (node.nodeType === TEXT_NODE) { 6588 length += node.nodeValue.length; 6589 } 6590 6591 if ((next = node.firstChild) === null) { 6592 break; 6593 } 6594 // Moving from `node` to its first child `next`. 6595 parentNode = node; 6596 node = next; 6597 } 6598 6599 while (true) { 6600 if (node === outerNode) { 6601 // If `outerNode` has children, this is always the second time visiting 6602 // it. If it has no children, this is still the first loop, and the only 6603 // valid selection is anchorNode and focusNode both equal to this node 6604 // and both offsets 0, in which case we will have handled above. 6605 break outer; 6606 } 6607 if (parentNode === anchorNode && ++indexWithinAnchor === anchorOffset) { 6608 start = length; 6609 } 6610 if (parentNode === focusNode$$1 && ++indexWithinFocus === focusOffset) { 6611 end = length; 6612 } 6613 if ((next = node.nextSibling) !== null) { 6614 break; 6615 } 6616 node = parentNode; 6617 parentNode = node.parentNode; 6618 } 6619 6620 // Moving from `node` to its next sibling `next`. 6621 node = next; 6622 } 6623 6624 if (start === -1 || end === -1) { 6625 // This should never happen. (Would happen if the anchor/focus nodes aren't 6626 // actually inside the passed-in node.) 6627 return null; 6628 } 6629 6630 return { 6631 start: start, 6632 end: end 6633 }; 6634 } 6635 6636 /** 6637 * In modern non-IE browsers, we can support both forward and backward 6638 * selections. 6639 * 6640 * Note: IE10+ supports the Selection object, but it does not support 6641 * the `extend` method, which means that even in modern IE, it's not possible 6642 * to programmatically create a backward selection. Thus, for all IE 6643 * versions, we use the old IE API to create our selections. 6644 * 6645 * @param {DOMElement|DOMTextNode} node 6646 * @param {object} offsets 6647 */ 6648 function setOffsets(node, offsets) { 6649 if (!window.getSelection) { 6650 return; 6651 } 6652 6653 var selection = window.getSelection(); 6654 var length = node[getTextContentAccessor()].length; 6655 var start = Math.min(offsets.start, length); 6656 var end = offsets.end === undefined ? start : Math.min(offsets.end, length); 6657 6658 // IE 11 uses modern selection, but doesn't support the extend method. 6659 // Flip backward selections, so we can set with a single range. 6660 if (!selection.extend && start > end) { 6661 var temp = end; 6662 end = start; 6663 start = temp; 6664 } 6665 6666 var startMarker = getNodeForCharacterOffset(node, start); 6667 var endMarker = getNodeForCharacterOffset(node, end); 6668 6669 if (startMarker && endMarker) { 6670 if (selection.rangeCount === 1 && selection.anchorNode === startMarker.node && selection.anchorOffset === startMarker.offset && selection.focusNode === endMarker.node && selection.focusOffset === endMarker.offset) { 6671 return; 6672 } 6673 var range = document.createRange(); 6674 range.setStart(startMarker.node, startMarker.offset); 6675 selection.removeAllRanges(); 6676 6677 if (start > end) { 6678 selection.addRange(range); 6679 selection.extend(endMarker.node, endMarker.offset); 6680 } else { 6681 range.setEnd(endMarker.node, endMarker.offset); 6682 selection.addRange(range); 6683 } 6684 } 6685 } 6686 6687 function isInDocument(node) { 6688 return containsNode(document.documentElement, node); 6689 } 6690 6691 /** 6692 * @ReactInputSelection: React input selection module. Based on Selection.js, 6693 * but modified to be suitable for react and has a couple of bug fixes (doesn't 6694 * assume buttons have range selections allowed). 6695 * Input selection module for React. 6696 */ 6697 6698 function hasSelectionCapabilities(elem) { 6699 var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase(); 6700 return nodeName && (nodeName === 'input' && elem.type === 'text' || nodeName === 'textarea' || elem.contentEditable === 'true'); 6701 } 6702 6703 function getSelectionInformation() { 6704 var focusedElem = getActiveElement(); 6705 return { 6706 focusedElem: focusedElem, 6707 selectionRange: hasSelectionCapabilities(focusedElem) ? getSelection$1(focusedElem) : null 6708 }; 6709 } 6710 6711 /** 6712 * @restoreSelection: If any selection information was potentially lost, 6713 * restore it. This is useful when performing operations that could remove dom 6714 * nodes and place them back in, resulting in focus being lost. 6715 */ 6716 function restoreSelection(priorSelectionInformation) { 6717 var curFocusedElem = getActiveElement(); 6718 var priorFocusedElem = priorSelectionInformation.focusedElem; 6719 var priorSelectionRange = priorSelectionInformation.selectionRange; 6720 if (curFocusedElem !== priorFocusedElem && isInDocument(priorFocusedElem)) { 6721 if (hasSelectionCapabilities(priorFocusedElem)) { 6722 setSelection(priorFocusedElem, priorSelectionRange); 6723 } 6724 6725 // Focusing a node can change the scroll position, which is undesirable 6726 var ancestors = []; 6727 var ancestor = priorFocusedElem; 6728 while (ancestor = ancestor.parentNode) { 6729 if (ancestor.nodeType === ELEMENT_NODE) { 6730 ancestors.push({ 6731 element: ancestor, 6732 left: ancestor.scrollLeft, 6733 top: ancestor.scrollTop 6734 }); 6735 } 6736 } 6737 6738 focusNode(priorFocusedElem); 6739 6740 for (var i = 0; i < ancestors.length; i++) { 6741 var info = ancestors[i]; 6742 info.element.scrollLeft = info.left; 6743 info.element.scrollTop = info.top; 6744 } 6745 } 6746 } 6747 6748 /** 6749 * @getSelection: Gets the selection bounds of a focused textarea, input or 6750 * contentEditable node. 6751 * -@input: Look up selection bounds of this input 6752 * -@return {start: selectionStart, end: selectionEnd} 6753 */ 6754 function getSelection$1(input) { 6755 var selection = void 0; 6756 6757 if ('selectionStart' in input) { 6758 // Modern browser with input or textarea. 6759 selection = { 6760 start: input.selectionStart, 6761 end: input.selectionEnd 6762 }; 6763 } else { 6764 // Content editable or old IE textarea. 6765 selection = getOffsets(input); 6766 } 6767 6768 return selection || { start: 0, end: 0 }; 6769 } 6770 6771 /** 6772 * @setSelection: Sets the selection bounds of a textarea or input and focuses 6773 * the input. 6774 * -@input Set selection bounds of this input or textarea 6775 * -@offsets Object of same form that is returned from get* 6776 */ 6777 function setSelection(input, offsets) { 6778 var start = offsets.start, 6779 end = offsets.end; 6780 6781 if (end === undefined) { 6782 end = start; 6783 } 6784 6785 if ('selectionStart' in input) { 6786 input.selectionStart = start; 6787 input.selectionEnd = Math.min(end, input.value.length); 6788 } else { 6789 setOffsets(input, offsets); 6790 } 6791 } 6792 6793 var skipSelectionChangeEvent = ExecutionEnvironment.canUseDOM && 'documentMode' in document && document.documentMode <= 11; 6794 6795 var eventTypes$3 = { 6796 select: { 6797 phasedRegistrationNames: { 6798 bubbled: 'onSelect', 6799 captured: 'onSelectCapture' 6800 }, 6801 dependencies: ['topBlur', 'topContextMenu', 'topFocus', 'topKeyDown', 'topKeyUp', 'topMouseDown', 'topMouseUp', 'topSelectionChange'] 6802 } 6803 }; 6804 6805 var activeElement$1 = null; 6806 var activeElementInst$1 = null; 6807 var lastSelection = null; 6808 var mouseDown = false; 6809 6810 /** 6811 * Get an object which is a unique representation of the current selection. 6812 * 6813 * The return value will not be consistent across nodes or browsers, but 6814 * two identical selections on the same node will return identical objects. 6815 * 6816 * @param {DOMElement} node 6817 * @return {object} 6818 */ 6819 function getSelection(node) { 6820 if ('selectionStart' in node && hasSelectionCapabilities(node)) { 6821 return { 6822 start: node.selectionStart, 6823 end: node.selectionEnd 6824 }; 6825 } else if (window.getSelection) { 6826 var selection = window.getSelection(); 6827 return { 6828 anchorNode: selection.anchorNode, 6829 anchorOffset: selection.anchorOffset, 6830 focusNode: selection.focusNode, 6831 focusOffset: selection.focusOffset 6832 }; 6833 } 6834 } 6835 6836 /** 6837 * Poll selection to see whether it's changed. 6838 * 6839 * @param {object} nativeEvent 6840 * @return {?SyntheticEvent} 6841 */ 6842 function constructSelectEvent(nativeEvent, nativeEventTarget) { 6843 // Ensure we have the right element, and that the user is not dragging a 6844 // selection (this matches native `select` event behavior). In HTML5, select 6845 // fires only on input and textarea thus if there's no focused element we 6846 // won't dispatch. 6847 if (mouseDown || activeElement$1 == null || activeElement$1 !== getActiveElement()) { 6848 return null; 6849 } 6850 6851 // Only fire when selection has actually changed. 6852 var currentSelection = getSelection(activeElement$1); 6853 if (!lastSelection || !shallowEqual(lastSelection, currentSelection)) { 6854 lastSelection = currentSelection; 6855 6856 var syntheticEvent = SyntheticEvent$1.getPooled(eventTypes$3.select, activeElementInst$1, nativeEvent, nativeEventTarget); 6857 6858 syntheticEvent.type = 'select'; 6859 syntheticEvent.target = activeElement$1; 6860 6861 accumulateTwoPhaseDispatches(syntheticEvent); 6862 6863 return syntheticEvent; 6864 } 6865 6866 return null; 6867 } 6868 6869 /** 6870 * This plugin creates an `onSelect` event that normalizes select events 6871 * across form elements. 6872 * 6873 * Supported elements are: 6874 * - input (see `isTextInputElement`) 6875 * - textarea 6876 * - contentEditable 6877 * 6878 * This differs from native browser implementations in the following ways: 6879 * - Fires on contentEditable fields as well as inputs. 6880 * - Fires for collapsed selection. 6881 * - Fires after user input. 6882 */ 6883 var SelectEventPlugin = { 6884 eventTypes: eventTypes$3, 6885 6886 extractEvents: function (topLevelType, targetInst, nativeEvent, nativeEventTarget) { 6887 var doc = nativeEventTarget.window === nativeEventTarget ? nativeEventTarget.document : nativeEventTarget.nodeType === DOCUMENT_NODE ? nativeEventTarget : nativeEventTarget.ownerDocument; 6888 // Track whether all listeners exists for this plugin. If none exist, we do 6889 // not extract events. See #3639. 6890 if (!doc || !isListeningToAllDependencies('onSelect', doc)) { 6891 return null; 6892 } 6893 6894 var targetNode = targetInst ? getNodeFromInstance$1(targetInst) : window; 6895 6896 switch (topLevelType) { 6897 // Track the input node that has focus. 6898 case 'topFocus': 6899 if (isTextInputElement(targetNode) || targetNode.contentEditable === 'true') { 6900 activeElement$1 = targetNode; 6901 activeElementInst$1 = targetInst; 6902 lastSelection = null; 6903 } 6904 break; 6905 case 'topBlur': 6906 activeElement$1 = null; 6907 activeElementInst$1 = null; 6908 lastSelection = null; 6909 break; 6910 // Don't fire the event while the user is dragging. This matches the 6911 // semantics of the native select event. 6912 case 'topMouseDown': 6913 mouseDown = true; 6914 break; 6915 case 'topContextMenu': 6916 case 'topMouseUp': 6917 mouseDown = false; 6918 return constructSelectEvent(nativeEvent, nativeEventTarget); 6919 // Chrome and IE fire non-standard event when selection is changed (and 6920 // sometimes when it hasn't). IE's event fires out of order with respect 6921 // to key and input events on deletion, so we discard it. 6922 // 6923 // Firefox doesn't support selectionchange, so check selection status 6924 // after each key entry. The selection changes after keydown and before 6925 // keyup, but we check on keydown as well in the case of holding down a 6926 // key, when multiple keydown events are fired but only one keyup is. 6927 // This is also our approach for IE handling, for the reason above. 6928 case 'topSelectionChange': 6929 if (skipSelectionChangeEvent) { 6930 break; 6931 } 6932 // falls through 6933 case 'topKeyDown': 6934 case 'topKeyUp': 6935 return constructSelectEvent(nativeEvent, nativeEventTarget); 6936 } 6937 6938 return null; 6939 } 6940 }; 6941 6942 /** 6943 * @interface Event 6944 * @see http://www.w3.org/TR/css3-animations/#AnimationEvent-interface 6945 * @see https://developer.mozilla.org/en-US/docs/Web/API/AnimationEvent 6946 */ 6947 var AnimationEventInterface = { 6948 animationName: null, 6949 elapsedTime: null, 6950 pseudoElement: null 6951 }; 6952 6953 /** 6954 * @param {object} dispatchConfig Configuration used to dispatch this event. 6955 * @param {string} dispatchMarker Marker identifying the event target. 6956 * @param {object} nativeEvent Native browser event. 6957 * @extends {SyntheticEvent} 6958 */ 6959 function SyntheticAnimationEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 6960 return SyntheticEvent$1.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 6961 } 6962 6963 SyntheticEvent$1.augmentClass(SyntheticAnimationEvent, AnimationEventInterface); 6964 6965 /** 6966 * @interface Event 6967 * @see http://www.w3.org/TR/clipboard-apis/ 6968 */ 6969 var ClipboardEventInterface = { 6970 clipboardData: function (event) { 6971 return 'clipboardData' in event ? event.clipboardData : window.clipboardData; 6972 } 6973 }; 6974 6975 /** 6976 * @param {object} dispatchConfig Configuration used to dispatch this event. 6977 * @param {string} dispatchMarker Marker identifying the event target. 6978 * @param {object} nativeEvent Native browser event. 6979 * @extends {SyntheticEvent} 6980 */ 6981 function SyntheticClipboardEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 6982 return SyntheticEvent$1.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 6983 } 6984 6985 SyntheticEvent$1.augmentClass(SyntheticClipboardEvent, ClipboardEventInterface); 6986 6987 /** 6988 * @interface FocusEvent 6989 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 6990 */ 6991 var FocusEventInterface = { 6992 relatedTarget: null 6993 }; 6994 6995 /** 6996 * @param {object} dispatchConfig Configuration used to dispatch this event. 6997 * @param {string} dispatchMarker Marker identifying the event target. 6998 * @param {object} nativeEvent Native browser event. 6999 * @extends {SyntheticUIEvent} 7000 */ 7001 function SyntheticFocusEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 7002 return SyntheticUIEvent.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 7003 } 7004 7005 SyntheticUIEvent.augmentClass(SyntheticFocusEvent, FocusEventInterface); 7006 7007 /** 7008 * `charCode` represents the actual "character code" and is safe to use with 7009 * `String.fromCharCode`. As such, only keys that correspond to printable 7010 * characters produce a valid `charCode`, the only exception to this is Enter. 7011 * The Tab-key is considered non-printable and does not have a `charCode`, 7012 * presumably because it does not produce a tab-character in browsers. 7013 * 7014 * @param {object} nativeEvent Native browser event. 7015 * @return {number} Normalized `charCode` property. 7016 */ 7017 function getEventCharCode(nativeEvent) { 7018 var charCode; 7019 var keyCode = nativeEvent.keyCode; 7020 7021 if ('charCode' in nativeEvent) { 7022 charCode = nativeEvent.charCode; 7023 7024 // FF does not set `charCode` for the Enter-key, check against `keyCode`. 7025 if (charCode === 0 && keyCode === 13) { 7026 charCode = 13; 7027 } 7028 } else { 7029 // IE8 does not implement `charCode`, but `keyCode` has the correct value. 7030 charCode = keyCode; 7031 } 7032 7033 // Some non-printable keys are reported in `charCode`/`keyCode`, discard them. 7034 // Must not discard the (non-)printable Enter-key. 7035 if (charCode >= 32 || charCode === 13) { 7036 return charCode; 7037 } 7038 7039 return 0; 7040 } 7041 7042 /** 7043 * Normalization of deprecated HTML5 `key` values 7044 * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names 7045 */ 7046 var normalizeKey = { 7047 Esc: 'Escape', 7048 Spacebar: ' ', 7049 Left: 'ArrowLeft', 7050 Up: 'ArrowUp', 7051 Right: 'ArrowRight', 7052 Down: 'ArrowDown', 7053 Del: 'Delete', 7054 Win: 'OS', 7055 Menu: 'ContextMenu', 7056 Apps: 'ContextMenu', 7057 Scroll: 'ScrollLock', 7058 MozPrintableKey: 'Unidentified' 7059 }; 7060 7061 /** 7062 * Translation from legacy `keyCode` to HTML5 `key` 7063 * Only special keys supported, all others depend on keyboard layout or browser 7064 * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names 7065 */ 7066 var translateToKey = { 7067 '8': 'Backspace', 7068 '9': 'Tab', 7069 '12': 'Clear', 7070 '13': 'Enter', 7071 '16': 'Shift', 7072 '17': 'Control', 7073 '18': 'Alt', 7074 '19': 'Pause', 7075 '20': 'CapsLock', 7076 '27': 'Escape', 7077 '32': ' ', 7078 '33': 'PageUp', 7079 '34': 'PageDown', 7080 '35': 'End', 7081 '36': 'Home', 7082 '37': 'ArrowLeft', 7083 '38': 'ArrowUp', 7084 '39': 'ArrowRight', 7085 '40': 'ArrowDown', 7086 '45': 'Insert', 7087 '46': 'Delete', 7088 '112': 'F1', 7089 '113': 'F2', 7090 '114': 'F3', 7091 '115': 'F4', 7092 '116': 'F5', 7093 '117': 'F6', 7094 '118': 'F7', 7095 '119': 'F8', 7096 '120': 'F9', 7097 '121': 'F10', 7098 '122': 'F11', 7099 '123': 'F12', 7100 '144': 'NumLock', 7101 '145': 'ScrollLock', 7102 '224': 'Meta' 7103 }; 7104 7105 /** 7106 * @param {object} nativeEvent Native browser event. 7107 * @return {string} Normalized `key` property. 7108 */ 7109 function getEventKey(nativeEvent) { 7110 if (nativeEvent.key) { 7111 // Normalize inconsistent values reported by browsers due to 7112 // implementations of a working draft specification. 7113 7114 // FireFox implements `key` but returns `MozPrintableKey` for all 7115 // printable characters (normalized to `Unidentified`), ignore it. 7116 var key = normalizeKey[nativeEvent.key] || nativeEvent.key; 7117 if (key !== 'Unidentified') { 7118 return key; 7119 } 7120 } 7121 7122 // Browser does not implement `key`, polyfill as much of it as we can. 7123 if (nativeEvent.type === 'keypress') { 7124 var charCode = getEventCharCode(nativeEvent); 7125 7126 // The enter-key is technically both printable and non-printable and can 7127 // thus be captured by `keypress`, no other non-printable key should. 7128 return charCode === 13 ? 'Enter' : String.fromCharCode(charCode); 7129 } 7130 if (nativeEvent.type === 'keydown' || nativeEvent.type === 'keyup') { 7131 // While user keyboard layout determines the actual meaning of each 7132 // `keyCode` value, almost all function keys have a universal value. 7133 return translateToKey[nativeEvent.keyCode] || 'Unidentified'; 7134 } 7135 return ''; 7136 } 7137 7138 /** 7139 * @interface KeyboardEvent 7140 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 7141 */ 7142 var KeyboardEventInterface = { 7143 key: getEventKey, 7144 location: null, 7145 ctrlKey: null, 7146 shiftKey: null, 7147 altKey: null, 7148 metaKey: null, 7149 repeat: null, 7150 locale: null, 7151 getModifierState: getEventModifierState, 7152 // Legacy Interface 7153 charCode: function (event) { 7154 // `charCode` is the result of a KeyPress event and represents the value of 7155 // the actual printable character. 7156 7157 // KeyPress is deprecated, but its replacement is not yet final and not 7158 // implemented in any major browser. Only KeyPress has charCode. 7159 if (event.type === 'keypress') { 7160 return getEventCharCode(event); 7161 } 7162 return 0; 7163 }, 7164 keyCode: function (event) { 7165 // `keyCode` is the result of a KeyDown/Up event and represents the value of 7166 // physical keyboard key. 7167 7168 // The actual meaning of the value depends on the users' keyboard layout 7169 // which cannot be detected. Assuming that it is a US keyboard layout 7170 // provides a surprisingly accurate mapping for US and European users. 7171 // Due to this, it is left to the user to implement at this time. 7172 if (event.type === 'keydown' || event.type === 'keyup') { 7173 return event.keyCode; 7174 } 7175 return 0; 7176 }, 7177 which: function (event) { 7178 // `which` is an alias for either `keyCode` or `charCode` depending on the 7179 // type of the event. 7180 if (event.type === 'keypress') { 7181 return getEventCharCode(event); 7182 } 7183 if (event.type === 'keydown' || event.type === 'keyup') { 7184 return event.keyCode; 7185 } 7186 return 0; 7187 } 7188 }; 7189 7190 /** 7191 * @param {object} dispatchConfig Configuration used to dispatch this event. 7192 * @param {string} dispatchMarker Marker identifying the event target. 7193 * @param {object} nativeEvent Native browser event. 7194 * @extends {SyntheticUIEvent} 7195 */ 7196 function SyntheticKeyboardEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 7197 return SyntheticUIEvent.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 7198 } 7199 7200 SyntheticUIEvent.augmentClass(SyntheticKeyboardEvent, KeyboardEventInterface); 7201 7202 /** 7203 * @interface DragEvent 7204 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 7205 */ 7206 var DragEventInterface = { 7207 dataTransfer: null 7208 }; 7209 7210 /** 7211 * @param {object} dispatchConfig Configuration used to dispatch this event. 7212 * @param {string} dispatchMarker Marker identifying the event target. 7213 * @param {object} nativeEvent Native browser event. 7214 * @extends {SyntheticMouseEvent} 7215 */ 7216 function SyntheticDragEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 7217 return SyntheticMouseEvent.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 7218 } 7219 7220 SyntheticMouseEvent.augmentClass(SyntheticDragEvent, DragEventInterface); 7221 7222 /** 7223 * @interface TouchEvent 7224 * @see http://www.w3.org/TR/touch-events/ 7225 */ 7226 var TouchEventInterface = { 7227 touches: null, 7228 targetTouches: null, 7229 changedTouches: null, 7230 altKey: null, 7231 metaKey: null, 7232 ctrlKey: null, 7233 shiftKey: null, 7234 getModifierState: getEventModifierState 7235 }; 7236 7237 /** 7238 * @param {object} dispatchConfig Configuration used to dispatch this event. 7239 * @param {string} dispatchMarker Marker identifying the event target. 7240 * @param {object} nativeEvent Native browser event. 7241 * @extends {SyntheticUIEvent} 7242 */ 7243 function SyntheticTouchEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 7244 return SyntheticUIEvent.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 7245 } 7246 7247 SyntheticUIEvent.augmentClass(SyntheticTouchEvent, TouchEventInterface); 7248 7249 /** 7250 * @interface Event 7251 * @see http://www.w3.org/TR/2009/WD-css3-transitions-20090320/#transition-events- 7252 * @see https://developer.mozilla.org/en-US/docs/Web/API/TransitionEvent 7253 */ 7254 var TransitionEventInterface = { 7255 propertyName: null, 7256 elapsedTime: null, 7257 pseudoElement: null 7258 }; 7259 7260 /** 7261 * @param {object} dispatchConfig Configuration used to dispatch this event. 7262 * @param {string} dispatchMarker Marker identifying the event target. 7263 * @param {object} nativeEvent Native browser event. 7264 * @extends {SyntheticEvent} 7265 */ 7266 function SyntheticTransitionEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 7267 return SyntheticEvent$1.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 7268 } 7269 7270 SyntheticEvent$1.augmentClass(SyntheticTransitionEvent, TransitionEventInterface); 7271 7272 /** 7273 * @interface WheelEvent 7274 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 7275 */ 7276 var WheelEventInterface = { 7277 deltaX: function (event) { 7278 return 'deltaX' in event ? event.deltaX : // Fallback to `wheelDeltaX` for Webkit and normalize (right is positive). 7279 'wheelDeltaX' in event ? -event.wheelDeltaX : 0; 7280 }, 7281 deltaY: function (event) { 7282 return 'deltaY' in event ? event.deltaY : // Fallback to `wheelDeltaY` for Webkit and normalize (down is positive). 7283 'wheelDeltaY' in event ? -event.wheelDeltaY : // Fallback to `wheelDelta` for IE<9 and normalize (down is positive). 7284 'wheelDelta' in event ? -event.wheelDelta : 0; 7285 }, 7286 deltaZ: null, 7287 7288 // Browsers without "deltaMode" is reporting in raw wheel delta where one 7289 // notch on the scroll is always +/- 120, roughly equivalent to pixels. 7290 // A good approximation of DOM_DELTA_LINE (1) is 5% of viewport size or 7291 // ~40 pixels, for DOM_DELTA_SCREEN (2) it is 87.5% of viewport size. 7292 deltaMode: null 7293 }; 7294 7295 /** 7296 * @param {object} dispatchConfig Configuration used to dispatch this event. 7297 * @param {string} dispatchMarker Marker identifying the event target. 7298 * @param {object} nativeEvent Native browser event. 7299 * @extends {SyntheticMouseEvent} 7300 */ 7301 function SyntheticWheelEvent(dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget) { 7302 return SyntheticMouseEvent.call(this, dispatchConfig, dispatchMarker, nativeEvent, nativeEventTarget); 7303 } 7304 7305 SyntheticMouseEvent.augmentClass(SyntheticWheelEvent, WheelEventInterface); 7306 7307 /** 7308 * Turns 7309 * ['abort', ...] 7310 * into 7311 * eventTypes = { 7312 * 'abort': { 7313 * phasedRegistrationNames: { 7314 * bubbled: 'onAbort', 7315 * captured: 'onAbortCapture', 7316 * }, 7317 * dependencies: ['topAbort'], 7318 * }, 7319 * ... 7320 * }; 7321 * topLevelEventsToDispatchConfig = { 7322 * 'topAbort': { sameConfig } 7323 * }; 7324 */ 7325 var eventTypes$4 = {}; 7326 var topLevelEventsToDispatchConfig = {}; 7327 ['abort', 'animationEnd', 'animationIteration', 'animationStart', 'blur', 'cancel', 'canPlay', 'canPlayThrough', 'click', 'close', 'contextMenu', 'copy', 'cut', 'doubleClick', 'drag', 'dragEnd', 'dragEnter', 'dragExit', 'dragLeave', 'dragOver', 'dragStart', 'drop', 'durationChange', 'emptied', 'encrypted', 'ended', 'error', 'focus', 'input', 'invalid', 'keyDown', 'keyPress', 'keyUp', 'load', 'loadedData', 'loadedMetadata', 'loadStart', 'mouseDown', 'mouseMove', 'mouseOut', 'mouseOver', 'mouseUp', 'paste', 'pause', 'play', 'playing', 'progress', 'rateChange', 'reset', 'scroll', 'seeked', 'seeking', 'stalled', 'submit', 'suspend', 'timeUpdate', 'toggle', 'touchCancel', 'touchEnd', 'touchMove', 'touchStart', 'transitionEnd', 'volumeChange', 'waiting', 'wheel'].forEach(function (event) { 7328 var capitalizedEvent = event[0].toUpperCase() + event.slice(1); 7329 var onEvent = 'on' + capitalizedEvent; 7330 var topEvent = 'top' + capitalizedEvent; 7331 7332 var type = { 7333 phasedRegistrationNames: { 7334 bubbled: onEvent, 7335 captured: onEvent + 'Capture' 7336 }, 7337 dependencies: [topEvent] 7338 }; 7339 eventTypes$4[event] = type; 7340 topLevelEventsToDispatchConfig[topEvent] = type; 7341 }); 7342 7343 // Only used in DEV for exhaustiveness validation. 7344 var knownHTMLTopLevelTypes = ['topAbort', 'topCancel', 'topCanPlay', 'topCanPlayThrough', 'topClose', 'topDurationChange', 'topEmptied', 'topEncrypted', 'topEnded', 'topError', 'topInput', 'topInvalid', 'topLoad', 'topLoadedData', 'topLoadedMetadata', 'topLoadStart', 'topPause', 'topPlay', 'topPlaying', 'topProgress', 'topRateChange', 'topReset', 'topSeeked', 'topSeeking', 'topStalled', 'topSubmit', 'topSuspend', 'topTimeUpdate', 'topToggle', 'topVolumeChange', 'topWaiting']; 7345 7346 var SimpleEventPlugin = { 7347 eventTypes: eventTypes$4, 7348 7349 extractEvents: function (topLevelType, targetInst, nativeEvent, nativeEventTarget) { 7350 var dispatchConfig = topLevelEventsToDispatchConfig[topLevelType]; 7351 if (!dispatchConfig) { 7352 return null; 7353 } 7354 var EventConstructor; 7355 switch (topLevelType) { 7356 case 'topKeyPress': 7357 // Firefox creates a keypress event for function keys too. This removes 7358 // the unwanted keypress events. Enter is however both printable and 7359 // non-printable. One would expect Tab to be as well (but it isn't). 7360 if (getEventCharCode(nativeEvent) === 0) { 7361 return null; 7362 } 7363 /* falls through */ 7364 case 'topKeyDown': 7365 case 'topKeyUp': 7366 EventConstructor = SyntheticKeyboardEvent; 7367 break; 7368 case 'topBlur': 7369 case 'topFocus': 7370 EventConstructor = SyntheticFocusEvent; 7371 break; 7372 case 'topClick': 7373 // Firefox creates a click event on right mouse clicks. This removes the 7374 // unwanted click events. 7375 if (nativeEvent.button === 2) { 7376 return null; 7377 } 7378 /* falls through */ 7379 case 'topDoubleClick': 7380 case 'topMouseDown': 7381 case 'topMouseMove': 7382 case 'topMouseUp': 7383 // TODO: Disabled elements should not respond to mouse events 7384 /* falls through */ 7385 case 'topMouseOut': 7386 case 'topMouseOver': 7387 case 'topContextMenu': 7388 EventConstructor = SyntheticMouseEvent; 7389 break; 7390 case 'topDrag': 7391 case 'topDragEnd': 7392 case 'topDragEnter': 7393 case 'topDragExit': 7394 case 'topDragLeave': 7395 case 'topDragOver': 7396 case 'topDragStart': 7397 case 'topDrop': 7398 EventConstructor = SyntheticDragEvent; 7399 break; 7400 case 'topTouchCancel': 7401 case 'topTouchEnd': 7402 case 'topTouchMove': 7403 case 'topTouchStart': 7404 EventConstructor = SyntheticTouchEvent; 7405 break; 7406 case 'topAnimationEnd': 7407 case 'topAnimationIteration': 7408 case 'topAnimationStart': 7409 EventConstructor = SyntheticAnimationEvent; 7410 break; 7411 case 'topTransitionEnd': 7412 EventConstructor = SyntheticTransitionEvent; 7413 break; 7414 case 'topScroll': 7415 EventConstructor = SyntheticUIEvent; 7416 break; 7417 case 'topWheel': 7418 EventConstructor = SyntheticWheelEvent; 7419 break; 7420 case 'topCopy': 7421 case 'topCut': 7422 case 'topPaste': 7423 EventConstructor = SyntheticClipboardEvent; 7424 break; 7425 default: 7426 { 7427 if (knownHTMLTopLevelTypes.indexOf(topLevelType) === -1) { 7428 warning(false, 'SimpleEventPlugin: Unhandled event type, `%s`. This warning ' + 'is likely caused by a bug in React. Please file an issue.', topLevelType); 7429 } 7430 } 7431 // HTML Events 7432 // @see http://www.w3.org/TR/html5/index.html#events-0 7433 EventConstructor = SyntheticEvent$1; 7434 break; 7435 } 7436 var event = EventConstructor.getPooled(dispatchConfig, targetInst, nativeEvent, nativeEventTarget); 7437 accumulateTwoPhaseDispatches(event); 7438 return event; 7439 } 7440 }; 7441 7442 setHandleTopLevel(handleTopLevel); 7443 7444 /** 7445 * Inject modules for resolving DOM hierarchy and plugin ordering. 7446 */ 7447 injection$1.injectEventPluginOrder(DOMEventPluginOrder); 7448 injection$2.injectComponentTree(ReactDOMComponentTree); 7449 7450 /** 7451 * Some important event plugins included by default (without having to require 7452 * them). 7453 */ 7454 injection$1.injectEventPluginsByName({ 7455 SimpleEventPlugin: SimpleEventPlugin, 7456 EnterLeaveEventPlugin: EnterLeaveEventPlugin, 7457 ChangeEventPlugin: ChangeEventPlugin, 7458 SelectEventPlugin: SelectEventPlugin, 7459 BeforeInputEventPlugin: BeforeInputEventPlugin 7460 }); 7461 7462 var enableAsyncSubtreeAPI = true; 7463 var enableAsyncSchedulingByDefaultInReactDOM = false; 7464 // Exports ReactDOM.createRoot 7465 var enableCreateRoot = false; 7466 var enableUserTimingAPI = true; 7467 7468 // Mutating mode (React DOM, React ART, React Native): 7469 var enableMutatingReconciler = true; 7470 // Experimental noop mode (currently unused): 7471 var enableNoopReconciler = false; 7472 // Experimental persistent mode (CS): 7473 var enablePersistentReconciler = false; 7474 7475 // Helps identify side effects in begin-phase lifecycle hooks and setState reducers: 7476 var debugRenderPhaseSideEffects = false; 7477 7478 // Only used in www builds. 7479 7480 var valueStack = []; 7481 7482 { 7483 var fiberStack = []; 7484 } 7485 7486 var index = -1; 7487 7488 function createCursor(defaultValue) { 7489 return { 7490 current: defaultValue 7491 }; 7492 } 7493 7494 7495 7496 function pop(cursor, fiber) { 7497 if (index < 0) { 7498 { 7499 warning(false, 'Unexpected pop.'); 7500 } 7501 return; 7502 } 7503 7504 { 7505 if (fiber !== fiberStack[index]) { 7506 warning(false, 'Unexpected Fiber popped.'); 7507 } 7508 } 7509 7510 cursor.current = valueStack[index]; 7511 7512 valueStack[index] = null; 7513 7514 { 7515 fiberStack[index] = null; 7516 } 7517 7518 index--; 7519 } 7520 7521 function push(cursor, value, fiber) { 7522 index++; 7523 7524 valueStack[index] = cursor.current; 7525 7526 { 7527 fiberStack[index] = fiber; 7528 } 7529 7530 cursor.current = value; 7531 } 7532 7533 function reset$1() { 7534 while (index > -1) { 7535 valueStack[index] = null; 7536 7537 { 7538 fiberStack[index] = null; 7539 } 7540 7541 index--; 7542 } 7543 } 7544 7545 var describeComponentFrame = function (name, source, ownerName) { 7546 return '\n in ' + (name || 'Unknown') + (source ? ' (at ' + source.fileName.replace(/^.*[\\\/]/, '') + ':' + source.lineNumber + ')' : ownerName ? ' (created by ' + ownerName + ')' : ''); 7547 }; 7548 7549 function describeFiber(fiber) { 7550 switch (fiber.tag) { 7551 case IndeterminateComponent: 7552 case FunctionalComponent: 7553 case ClassComponent: 7554 case HostComponent: 7555 var owner = fiber._debugOwner; 7556 var source = fiber._debugSource; 7557 var name = getComponentName(fiber); 7558 var ownerName = null; 7559 if (owner) { 7560 ownerName = getComponentName(owner); 7561 } 7562 return describeComponentFrame(name, source, ownerName); 7563 default: 7564 return ''; 7565 } 7566 } 7567 7568 // This function can only be called with a work-in-progress fiber and 7569 // only during begin or complete phase. Do not call it under any other 7570 // circumstances. 7571 function getStackAddendumByWorkInProgressFiber(workInProgress) { 7572 var info = ''; 7573 var node = workInProgress; 7574 do { 7575 info += describeFiber(node); 7576 // Otherwise this return pointer might point to the wrong tree: 7577 node = node['return']; 7578 } while (node); 7579 return info; 7580 } 7581 7582 function getCurrentFiberOwnerName() { 7583 { 7584 var fiber = ReactDebugCurrentFiber.current; 7585 if (fiber === null) { 7586 return null; 7587 } 7588 var owner = fiber._debugOwner; 7589 if (owner !== null && typeof owner !== 'undefined') { 7590 return getComponentName(owner); 7591 } 7592 } 7593 return null; 7594 } 7595 7596 function getCurrentFiberStackAddendum() { 7597 { 7598 var fiber = ReactDebugCurrentFiber.current; 7599 if (fiber === null) { 7600 return null; 7601 } 7602 // Safe because if current fiber exists, we are reconciling, 7603 // and it is guaranteed to be the work-in-progress version. 7604 return getStackAddendumByWorkInProgressFiber(fiber); 7605 } 7606 return null; 7607 } 7608 7609 function resetCurrentFiber() { 7610 ReactDebugCurrentFrame.getCurrentStack = null; 7611 ReactDebugCurrentFiber.current = null; 7612 ReactDebugCurrentFiber.phase = null; 7613 } 7614 7615 function setCurrentFiber(fiber) { 7616 ReactDebugCurrentFrame.getCurrentStack = getCurrentFiberStackAddendum; 7617 ReactDebugCurrentFiber.current = fiber; 7618 ReactDebugCurrentFiber.phase = null; 7619 } 7620 7621 function setCurrentPhase(phase) { 7622 ReactDebugCurrentFiber.phase = phase; 7623 } 7624 7625 var ReactDebugCurrentFiber = { 7626 current: null, 7627 phase: null, 7628 resetCurrentFiber: resetCurrentFiber, 7629 setCurrentFiber: setCurrentFiber, 7630 setCurrentPhase: setCurrentPhase, 7631 getCurrentFiberOwnerName: getCurrentFiberOwnerName, 7632 getCurrentFiberStackAddendum: getCurrentFiberStackAddendum 7633 }; 7634 7635 // Prefix measurements so that it's possible to filter them. 7636 // Longer prefixes are hard to read in DevTools. 7637 var reactEmoji = '\u269B'; 7638 var warningEmoji = '\u26D4'; 7639 var supportsUserTiming = typeof performance !== 'undefined' && typeof performance.mark === 'function' && typeof performance.clearMarks === 'function' && typeof performance.measure === 'function' && typeof performance.clearMeasures === 'function'; 7640 7641 // Keep track of current fiber so that we know the path to unwind on pause. 7642 // TODO: this looks the same as nextUnitOfWork in scheduler. Can we unify them? 7643 var currentFiber = null; 7644 // If we're in the middle of user code, which fiber and method is it? 7645 // Reusing `currentFiber` would be confusing for this because user code fiber 7646 // can change during commit phase too, but we don't need to unwind it (since 7647 // lifecycles in the commit phase don't resemble a tree). 7648 var currentPhase = null; 7649 var currentPhaseFiber = null; 7650 // Did lifecycle hook schedule an update? This is often a performance problem, 7651 // so we will keep track of it, and include it in the report. 7652 // Track commits caused by cascading updates. 7653 var isCommitting = false; 7654 var hasScheduledUpdateInCurrentCommit = false; 7655 var hasScheduledUpdateInCurrentPhase = false; 7656 var commitCountInCurrentWorkLoop = 0; 7657 var effectCountInCurrentCommit = 0; 7658 var isWaitingForCallback = false; 7659 // During commits, we only show a measurement once per method name 7660 // to avoid stretch the commit phase with measurement overhead. 7661 var labelsInCurrentCommit = new Set(); 7662 7663 var formatMarkName = function (markName) { 7664 return reactEmoji + ' ' + markName; 7665 }; 7666 7667 var formatLabel = function (label, warning$$1) { 7668 var prefix = warning$$1 ? warningEmoji + ' ' : reactEmoji + ' '; 7669 var suffix = warning$$1 ? ' Warning: ' + warning$$1 : ''; 7670 return '' + prefix + label + suffix; 7671 }; 7672 7673 var beginMark = function (markName) { 7674 performance.mark(formatMarkName(markName)); 7675 }; 7676 7677 var clearMark = function (markName) { 7678 performance.clearMarks(formatMarkName(markName)); 7679 }; 7680 7681 var endMark = function (label, markName, warning$$1) { 7682 var formattedMarkName = formatMarkName(markName); 7683 var formattedLabel = formatLabel(label, warning$$1); 7684 try { 7685 performance.measure(formattedLabel, formattedMarkName); 7686 } catch (err) {} 7687 // If previous mark was missing for some reason, this will throw. 7688 // This could only happen if React crashed in an unexpected place earlier. 7689 // Don't pile on with more errors. 7690 7691 // Clear marks immediately to avoid growing buffer. 7692 performance.clearMarks(formattedMarkName); 7693 performance.clearMeasures(formattedLabel); 7694 }; 7695 7696 var getFiberMarkName = function (label, debugID) { 7697 return label + ' (#' + debugID + ')'; 7698 }; 7699 7700 var getFiberLabel = function (componentName, isMounted, phase) { 7701 if (phase === null) { 7702 // These are composite component total time measurements. 7703 return componentName + ' [' + (isMounted ? 'update' : 'mount') + ']'; 7704 } else { 7705 // Composite component methods. 7706 return componentName + '.' + phase; 7707 } 7708 }; 7709 7710 var beginFiberMark = function (fiber, phase) { 7711 var componentName = getComponentName(fiber) || 'Unknown'; 7712 var debugID = fiber._debugID; 7713 var isMounted = fiber.alternate !== null; 7714 var label = getFiberLabel(componentName, isMounted, phase); 7715 7716 if (isCommitting && labelsInCurrentCommit.has(label)) { 7717 // During the commit phase, we don't show duplicate labels because 7718 // there is a fixed overhead for every measurement, and we don't 7719 // want to stretch the commit phase beyond necessary. 7720 return false; 7721 } 7722 labelsInCurrentCommit.add(label); 7723 7724 var markName = getFiberMarkName(label, debugID); 7725 beginMark(markName); 7726 return true; 7727 }; 7728 7729 var clearFiberMark = function (fiber, phase) { 7730 var componentName = getComponentName(fiber) || 'Unknown'; 7731 var debugID = fiber._debugID; 7732 var isMounted = fiber.alternate !== null; 7733 var label = getFiberLabel(componentName, isMounted, phase); 7734 var markName = getFiberMarkName(label, debugID); 7735 clearMark(markName); 7736 }; 7737 7738 var endFiberMark = function (fiber, phase, warning$$1) { 7739 var componentName = getComponentName(fiber) || 'Unknown'; 7740 var debugID = fiber._debugID; 7741 var isMounted = fiber.alternate !== null; 7742 var label = getFiberLabel(componentName, isMounted, phase); 7743 var markName = getFiberMarkName(label, debugID); 7744 endMark(label, markName, warning$$1); 7745 }; 7746 7747 var shouldIgnoreFiber = function (fiber) { 7748 // Host components should be skipped in the timeline. 7749 // We could check typeof fiber.type, but does this work with RN? 7750 switch (fiber.tag) { 7751 case HostRoot: 7752 case HostComponent: 7753 case HostText: 7754 case HostPortal: 7755 case ReturnComponent: 7756 case Fragment: 7757 return true; 7758 default: 7759 return false; 7760 } 7761 }; 7762 7763 var clearPendingPhaseMeasurement = function () { 7764 if (currentPhase !== null && currentPhaseFiber !== null) { 7765 clearFiberMark(currentPhaseFiber, currentPhase); 7766 } 7767 currentPhaseFiber = null; 7768 currentPhase = null; 7769 hasScheduledUpdateInCurrentPhase = false; 7770 }; 7771 7772 var pauseTimers = function () { 7773 // Stops all currently active measurements so that they can be resumed 7774 // if we continue in a later deferred loop from the same unit of work. 7775 var fiber = currentFiber; 7776 while (fiber) { 7777 if (fiber._debugIsCurrentlyTiming) { 7778 endFiberMark(fiber, null, null); 7779 } 7780 fiber = fiber['return']; 7781 } 7782 }; 7783 7784 var resumeTimersRecursively = function (fiber) { 7785 if (fiber['return'] !== null) { 7786 resumeTimersRecursively(fiber['return']); 7787 } 7788 if (fiber._debugIsCurrentlyTiming) { 7789 beginFiberMark(fiber, null); 7790 } 7791 }; 7792 7793 var resumeTimers = function () { 7794 // Resumes all measurements that were active during the last deferred loop. 7795 if (currentFiber !== null) { 7796 resumeTimersRecursively(currentFiber); 7797 } 7798 }; 7799 7800 function recordEffect() { 7801 if (enableUserTimingAPI) { 7802 effectCountInCurrentCommit++; 7803 } 7804 } 7805 7806 function recordScheduleUpdate() { 7807 if (enableUserTimingAPI) { 7808 if (isCommitting) { 7809 hasScheduledUpdateInCurrentCommit = true; 7810 } 7811 if (currentPhase !== null && currentPhase !== 'componentWillMount' && currentPhase !== 'componentWillReceiveProps') { 7812 hasScheduledUpdateInCurrentPhase = true; 7813 } 7814 } 7815 } 7816 7817 function startRequestCallbackTimer() { 7818 if (enableUserTimingAPI) { 7819 if (supportsUserTiming && !isWaitingForCallback) { 7820 isWaitingForCallback = true; 7821 beginMark('(Waiting for async callback...)'); 7822 } 7823 } 7824 } 7825 7826 function stopRequestCallbackTimer(didExpire) { 7827 if (enableUserTimingAPI) { 7828 if (supportsUserTiming) { 7829 isWaitingForCallback = false; 7830 var warning$$1 = didExpire ? 'React was blocked by main thread' : null; 7831 endMark('(Waiting for async callback...)', '(Waiting for async callback...)', warning$$1); 7832 } 7833 } 7834 } 7835 7836 function startWorkTimer(fiber) { 7837 if (enableUserTimingAPI) { 7838 if (!supportsUserTiming || shouldIgnoreFiber(fiber)) { 7839 return; 7840 } 7841 // If we pause, this is the fiber to unwind from. 7842 currentFiber = fiber; 7843 if (!beginFiberMark(fiber, null)) { 7844 return; 7845 } 7846 fiber._debugIsCurrentlyTiming = true; 7847 } 7848 } 7849 7850 function cancelWorkTimer(fiber) { 7851 if (enableUserTimingAPI) { 7852 if (!supportsUserTiming || shouldIgnoreFiber(fiber)) { 7853 return; 7854 } 7855 // Remember we shouldn't complete measurement for this fiber. 7856 // Otherwise flamechart will be deep even for small updates. 7857 fiber._debugIsCurrentlyTiming = false; 7858 clearFiberMark(fiber, null); 7859 } 7860 } 7861 7862 function stopWorkTimer(fiber) { 7863 if (enableUserTimingAPI) { 7864 if (!supportsUserTiming || shouldIgnoreFiber(fiber)) { 7865 return; 7866 } 7867 // If we pause, its parent is the fiber to unwind from. 7868 currentFiber = fiber['return']; 7869 if (!fiber._debugIsCurrentlyTiming) { 7870 return; 7871 } 7872 fiber._debugIsCurrentlyTiming = false; 7873 endFiberMark(fiber, null, null); 7874 } 7875 } 7876 7877 function stopFailedWorkTimer(fiber) { 7878 if (enableUserTimingAPI) { 7879 if (!supportsUserTiming || shouldIgnoreFiber(fiber)) { 7880 return; 7881 } 7882 // If we pause, its parent is the fiber to unwind from. 7883 currentFiber = fiber['return']; 7884 if (!fiber._debugIsCurrentlyTiming) { 7885 return; 7886 } 7887 fiber._debugIsCurrentlyTiming = false; 7888 var warning$$1 = 'An error was thrown inside this error boundary'; 7889 endFiberMark(fiber, null, warning$$1); 7890 } 7891 } 7892 7893 function startPhaseTimer(fiber, phase) { 7894 if (enableUserTimingAPI) { 7895 if (!supportsUserTiming) { 7896 return; 7897 } 7898 clearPendingPhaseMeasurement(); 7899 if (!beginFiberMark(fiber, phase)) { 7900 return; 7901 } 7902 currentPhaseFiber = fiber; 7903 currentPhase = phase; 7904 } 7905 } 7906 7907 function stopPhaseTimer() { 7908 if (enableUserTimingAPI) { 7909 if (!supportsUserTiming) { 7910 return; 7911 } 7912 if (currentPhase !== null && currentPhaseFiber !== null) { 7913 var warning$$1 = hasScheduledUpdateInCurrentPhase ? 'Scheduled a cascading update' : null; 7914 endFiberMark(currentPhaseFiber, currentPhase, warning$$1); 7915 } 7916 currentPhase = null; 7917 currentPhaseFiber = null; 7918 } 7919 } 7920 7921 function startWorkLoopTimer(nextUnitOfWork) { 7922 if (enableUserTimingAPI) { 7923 currentFiber = nextUnitOfWork; 7924 if (!supportsUserTiming) { 7925 return; 7926 } 7927 commitCountInCurrentWorkLoop = 0; 7928 // This is top level call. 7929 // Any other measurements are performed within. 7930 beginMark('(React Tree Reconciliation)'); 7931 // Resume any measurements that were in progress during the last loop. 7932 resumeTimers(); 7933 } 7934 } 7935 7936 function stopWorkLoopTimer(interruptedBy) { 7937 if (enableUserTimingAPI) { 7938 if (!supportsUserTiming) { 7939 return; 7940 } 7941 var warning$$1 = null; 7942 if (interruptedBy !== null) { 7943 if (interruptedBy.tag === HostRoot) { 7944 warning$$1 = 'A top-level update interrupted the previous render'; 7945 } else { 7946 var componentName = getComponentName(interruptedBy) || 'Unknown'; 7947 warning$$1 = 'An update to ' + componentName + ' interrupted the previous render'; 7948 } 7949 } else if (commitCountInCurrentWorkLoop > 1) { 7950 warning$$1 = 'There were cascading updates'; 7951 } 7952 commitCountInCurrentWorkLoop = 0; 7953 // Pause any measurements until the next loop. 7954 pauseTimers(); 7955 endMark('(React Tree Reconciliation)', '(React Tree Reconciliation)', warning$$1); 7956 } 7957 } 7958 7959 function startCommitTimer() { 7960 if (enableUserTimingAPI) { 7961 if (!supportsUserTiming) { 7962 return; 7963 } 7964 isCommitting = true; 7965 hasScheduledUpdateInCurrentCommit = false; 7966 labelsInCurrentCommit.clear(); 7967 beginMark('(Committing Changes)'); 7968 } 7969 } 7970 7971 function stopCommitTimer() { 7972 if (enableUserTimingAPI) { 7973 if (!supportsUserTiming) { 7974 return; 7975 } 7976 7977 var warning$$1 = null; 7978 if (hasScheduledUpdateInCurrentCommit) { 7979 warning$$1 = 'Lifecycle hook scheduled a cascading update'; 7980 } else if (commitCountInCurrentWorkLoop > 0) { 7981 warning$$1 = 'Caused by a cascading update in earlier commit'; 7982 } 7983 hasScheduledUpdateInCurrentCommit = false; 7984 commitCountInCurrentWorkLoop++; 7985 isCommitting = false; 7986 labelsInCurrentCommit.clear(); 7987 7988 endMark('(Committing Changes)', '(Committing Changes)', warning$$1); 7989 } 7990 } 7991 7992 function startCommitHostEffectsTimer() { 7993 if (enableUserTimingAPI) { 7994 if (!supportsUserTiming) { 7995 return; 7996 } 7997 effectCountInCurrentCommit = 0; 7998 beginMark('(Committing Host Effects)'); 7999 } 8000 } 8001 8002 function stopCommitHostEffectsTimer() { 8003 if (enableUserTimingAPI) { 8004 if (!supportsUserTiming) { 8005 return; 8006 } 8007 var count = effectCountInCurrentCommit; 8008 effectCountInCurrentCommit = 0; 8009 endMark('(Committing Host Effects: ' + count + ' Total)', '(Committing Host Effects)', null); 8010 } 8011 } 8012 8013 function startCommitLifeCyclesTimer() { 8014 if (enableUserTimingAPI) { 8015 if (!supportsUserTiming) { 8016 return; 8017 } 8018 effectCountInCurrentCommit = 0; 8019 beginMark('(Calling Lifecycle Methods)'); 8020 } 8021 } 8022 8023 function stopCommitLifeCyclesTimer() { 8024 if (enableUserTimingAPI) { 8025 if (!supportsUserTiming) { 8026 return; 8027 } 8028 var count = effectCountInCurrentCommit; 8029 effectCountInCurrentCommit = 0; 8030 endMark('(Calling Lifecycle Methods: ' + count + ' Total)', '(Calling Lifecycle Methods)', null); 8031 } 8032 } 8033 8034 { 8035 var warnedAboutMissingGetChildContext = {}; 8036 } 8037 8038 // A cursor to the current merged context object on the stack. 8039 var contextStackCursor = createCursor(emptyObject); 8040 // A cursor to a boolean indicating whether the context has changed. 8041 var didPerformWorkStackCursor = createCursor(false); 8042 // Keep track of the previous context object that was on the stack. 8043 // We use this to get access to the parent context after we have already 8044 // pushed the next context provider, and now need to merge their contexts. 8045 var previousContext = emptyObject; 8046 8047 function getUnmaskedContext(workInProgress) { 8048 var hasOwnContext = isContextProvider(workInProgress); 8049 if (hasOwnContext) { 8050 // If the fiber is a context provider itself, when we read its context 8051 // we have already pushed its own child context on the stack. A context 8052 // provider should not "see" its own child context. Therefore we read the 8053 // previous (parent) context instead for a context provider. 8054 return previousContext; 8055 } 8056 return contextStackCursor.current; 8057 } 8058 8059 function cacheContext(workInProgress, unmaskedContext, maskedContext) { 8060 var instance = workInProgress.stateNode; 8061 instance.__reactInternalMemoizedUnmaskedChildContext = unmaskedContext; 8062 instance.__reactInternalMemoizedMaskedChildContext = maskedContext; 8063 } 8064 8065 function getMaskedContext(workInProgress, unmaskedContext) { 8066 var type = workInProgress.type; 8067 var contextTypes = type.contextTypes; 8068 if (!contextTypes) { 8069 return emptyObject; 8070 } 8071 8072 // Avoid recreating masked context unless unmasked context has changed. 8073 // Failing to do this will result in unnecessary calls to componentWillReceiveProps. 8074 // This may trigger infinite loops if componentWillReceiveProps calls setState. 8075 var instance = workInProgress.stateNode; 8076 if (instance && instance.__reactInternalMemoizedUnmaskedChildContext === unmaskedContext) { 8077 return instance.__reactInternalMemoizedMaskedChildContext; 8078 } 8079 8080 var context = {}; 8081 for (var key in contextTypes) { 8082 context[key] = unmaskedContext[key]; 8083 } 8084 8085 { 8086 var name = getComponentName(workInProgress) || 'Unknown'; 8087 checkPropTypes(contextTypes, context, 'context', name, ReactDebugCurrentFiber.getCurrentFiberStackAddendum); 8088 } 8089 8090 // Cache unmasked context so we can avoid recreating masked context unless necessary. 8091 // Context is created before the class component is instantiated so check for instance. 8092 if (instance) { 8093 cacheContext(workInProgress, unmaskedContext, context); 8094 } 8095 8096 return context; 8097 } 8098 8099 function hasContextChanged() { 8100 return didPerformWorkStackCursor.current; 8101 } 8102 8103 function isContextConsumer(fiber) { 8104 return fiber.tag === ClassComponent && fiber.type.contextTypes != null; 8105 } 8106 8107 function isContextProvider(fiber) { 8108 return fiber.tag === ClassComponent && fiber.type.childContextTypes != null; 8109 } 8110 8111 function popContextProvider(fiber) { 8112 if (!isContextProvider(fiber)) { 8113 return; 8114 } 8115 8116 pop(didPerformWorkStackCursor, fiber); 8117 pop(contextStackCursor, fiber); 8118 } 8119 8120 function popTopLevelContextObject(fiber) { 8121 pop(didPerformWorkStackCursor, fiber); 8122 pop(contextStackCursor, fiber); 8123 } 8124 8125 function pushTopLevelContextObject(fiber, context, didChange) { 8126 !(contextStackCursor.cursor == null) ? invariant(false, 'Unexpected context found on stack. This error is likely caused by a bug in React. Please file an issue.') : void 0; 8127 8128 push(contextStackCursor, context, fiber); 8129 push(didPerformWorkStackCursor, didChange, fiber); 8130 } 8131 8132 function processChildContext(fiber, parentContext) { 8133 var instance = fiber.stateNode; 8134 var childContextTypes = fiber.type.childContextTypes; 8135 8136 // TODO (bvaughn) Replace this behavior with an invariant() in the future. 8137 // It has only been added in Fiber to match the (unintentional) behavior in Stack. 8138 if (typeof instance.getChildContext !== 'function') { 8139 { 8140 var componentName = getComponentName(fiber) || 'Unknown'; 8141 8142 if (!warnedAboutMissingGetChildContext[componentName]) { 8143 warnedAboutMissingGetChildContext[componentName] = true; 8144 warning(false, '%s.childContextTypes is specified but there is no getChildContext() method ' + 'on the instance. You can either define getChildContext() on %s or remove ' + 'childContextTypes from it.', componentName, componentName); 8145 } 8146 } 8147 return parentContext; 8148 } 8149 8150 var childContext = void 0; 8151 { 8152 ReactDebugCurrentFiber.setCurrentPhase('getChildContext'); 8153 } 8154 startPhaseTimer(fiber, 'getChildContext'); 8155 childContext = instance.getChildContext(); 8156 stopPhaseTimer(); 8157 { 8158 ReactDebugCurrentFiber.setCurrentPhase(null); 8159 } 8160 for (var contextKey in childContext) { 8161 !(contextKey in childContextTypes) ? invariant(false, '%s.getChildContext(): key "%s" is not defined in childContextTypes.', getComponentName(fiber) || 'Unknown', contextKey) : void 0; 8162 } 8163 { 8164 var name = getComponentName(fiber) || 'Unknown'; 8165 checkPropTypes(childContextTypes, childContext, 'child context', name, 8166 // In practice, there is one case in which we won't get a stack. It's when 8167 // somebody calls unstable_renderSubtreeIntoContainer() and we process 8168 // context from the parent component instance. The stack will be missing 8169 // because it's outside of the reconciliation, and so the pointer has not 8170 // been set. This is rare and doesn't matter. We'll also remove that API. 8171 ReactDebugCurrentFiber.getCurrentFiberStackAddendum); 8172 } 8173 8174 return _assign({}, parentContext, childContext); 8175 } 8176 8177 function pushContextProvider(workInProgress) { 8178 if (!isContextProvider(workInProgress)) { 8179 return false; 8180 } 8181 8182 var instance = workInProgress.stateNode; 8183 // We push the context as early as possible to ensure stack integrity. 8184 // If the instance does not exist yet, we will push null at first, 8185 // and replace it on the stack later when invalidating the context. 8186 var memoizedMergedChildContext = instance && instance.__reactInternalMemoizedMergedChildContext || emptyObject; 8187 8188 // Remember the parent context so we can merge with it later. 8189 // Inherit the parent's did-perform-work value to avoid inadvertently blocking updates. 8190 previousContext = contextStackCursor.current; 8191 push(contextStackCursor, memoizedMergedChildContext, workInProgress); 8192 push(didPerformWorkStackCursor, didPerformWorkStackCursor.current, workInProgress); 8193 8194 return true; 8195 } 8196 8197 function invalidateContextProvider(workInProgress, didChange) { 8198 var instance = workInProgress.stateNode; 8199 !instance ? invariant(false, 'Expected to have an instance by this point. This error is likely caused by a bug in React. Please file an issue.') : void 0; 8200 8201 if (didChange) { 8202 // Merge parent and own context. 8203 // Skip this if we're not updating due to sCU. 8204 // This avoids unnecessarily recomputing memoized values. 8205 var mergedContext = processChildContext(workInProgress, previousContext); 8206 instance.__reactInternalMemoizedMergedChildContext = mergedContext; 8207 8208 // Replace the old (or empty) context with the new one. 8209 // It is important to unwind the context in the reverse order. 8210 pop(didPerformWorkStackCursor, workInProgress); 8211 pop(contextStackCursor, workInProgress); 8212 // Now push the new context and mark that it has changed. 8213 push(contextStackCursor, mergedContext, workInProgress); 8214 push(didPerformWorkStackCursor, didChange, workInProgress); 8215 } else { 8216 pop(didPerformWorkStackCursor, workInProgress); 8217 push(didPerformWorkStackCursor, didChange, workInProgress); 8218 } 8219 } 8220 8221 function resetContext() { 8222 previousContext = emptyObject; 8223 contextStackCursor.current = emptyObject; 8224 didPerformWorkStackCursor.current = false; 8225 } 8226 8227 function findCurrentUnmaskedContext(fiber) { 8228 // Currently this is only used with renderSubtreeIntoContainer; not sure if it 8229 // makes sense elsewhere 8230 !(isFiberMounted(fiber) && fiber.tag === ClassComponent) ? invariant(false, 'Expected subtree parent to be a mounted class component. This error is likely caused by a bug in React. Please file an issue.') : void 0; 8231 8232 var node = fiber; 8233 while (node.tag !== HostRoot) { 8234 if (isContextProvider(node)) { 8235 return node.stateNode.__reactInternalMemoizedMergedChildContext; 8236 } 8237 var parent = node['return']; 8238 !parent ? invariant(false, 'Found unexpected detached subtree parent. This error is likely caused by a bug in React. Please file an issue.') : void 0; 8239 node = parent; 8240 } 8241 return node.stateNode.context; 8242 } 8243 8244 var NoWork = 0; // TODO: Use an opaque type once ESLint et al support the syntax 8245 8246 var Sync = 1; 8247 var Never = 2147483647; // Max int32: Math.pow(2, 31) - 1 8248 8249 var UNIT_SIZE = 10; 8250 var MAGIC_NUMBER_OFFSET = 2; 8251 8252 // 1 unit of expiration time represents 10ms. 8253 function msToExpirationTime(ms) { 8254 // Always add an offset so that we don't clash with the magic number for NoWork. 8255 return (ms / UNIT_SIZE | 0) + MAGIC_NUMBER_OFFSET; 8256 } 8257 8258 function expirationTimeToMs(expirationTime) { 8259 return (expirationTime - MAGIC_NUMBER_OFFSET) * UNIT_SIZE; 8260 } 8261 8262 function ceiling(num, precision) { 8263 return ((num / precision | 0) + 1) * precision; 8264 } 8265 8266 function computeExpirationBucket(currentTime, expirationInMs, bucketSizeMs) { 8267 return ceiling(currentTime + expirationInMs / UNIT_SIZE, bucketSizeMs / UNIT_SIZE); 8268 } 8269 8270 var NoContext = 0; 8271 var AsyncUpdates = 1; 8272 8273 { 8274 var hasBadMapPolyfill = false; 8275 try { 8276 var nonExtensibleObject = Object.preventExtensions({}); 8277 /* eslint-disable no-new */ 8278 8279 /* eslint-enable no-new */ 8280 } catch (e) { 8281 // TODO: Consider warning about bad polyfills 8282 hasBadMapPolyfill = true; 8283 } 8284 } 8285 8286 // A Fiber is work on a Component that needs to be done or was done. There can 8287 // be more than one per component. 8288 8289 8290 { 8291 var debugCounter = 1; 8292 } 8293 8294 function FiberNode(tag, key, internalContextTag) { 8295 // Instance 8296 this.tag = tag; 8297 this.key = key; 8298 this.type = null; 8299 this.stateNode = null; 8300 8301 // Fiber 8302 this['return'] = null; 8303 this.child = null; 8304 this.sibling = null; 8305 this.index = 0; 8306 8307 this.ref = null; 8308 8309 this.pendingProps = null; 8310 this.memoizedProps = null; 8311 this.updateQueue = null; 8312 this.memoizedState = null; 8313 8314 this.internalContextTag = internalContextTag; 8315 8316 // Effects 8317 this.effectTag = NoEffect; 8318 this.nextEffect = null; 8319 8320 this.firstEffect = null; 8321 this.lastEffect = null; 8322 8323 this.expirationTime = NoWork; 8324 8325 this.alternate = null; 8326 8327 { 8328 this._debugID = debugCounter++; 8329 this._debugSource = null; 8330 this._debugOwner = null; 8331 this._debugIsCurrentlyTiming = false; 8332 if (!hasBadMapPolyfill && typeof Object.preventExtensions === 'function') { 8333 Object.preventExtensions(this); 8334 } 8335 } 8336 } 8337 8338 // This is a constructor function, rather than a POJO constructor, still 8339 // please ensure we do the following: 8340 // 1) Nobody should add any instance methods on this. Instance methods can be 8341 // more difficult to predict when they get optimized and they are almost 8342 // never inlined properly in static compilers. 8343 // 2) Nobody should rely on `instanceof Fiber` for type testing. We should 8344 // always know when it is a fiber. 8345 // 3) We might want to experiment with using numeric keys since they are easier 8346 // to optimize in a non-JIT environment. 8347 // 4) We can easily go from a constructor to a createFiber object literal if that 8348 // is faster. 8349 // 5) It should be easy to port this to a C struct and keep a C implementation 8350 // compatible. 8351 var createFiber = function (tag, key, internalContextTag) { 8352 // $FlowFixMe: the shapes are exact here but Flow doesn't like constructors 8353 return new FiberNode(tag, key, internalContextTag); 8354 }; 8355 8356 function shouldConstruct(Component) { 8357 return !!(Component.prototype && Component.prototype.isReactComponent); 8358 } 8359 8360 // This is used to create an alternate fiber to do work on. 8361 function createWorkInProgress(current, pendingProps, expirationTime) { 8362 var workInProgress = current.alternate; 8363 if (workInProgress === null) { 8364 // We use a double buffering pooling technique because we know that we'll 8365 // only ever need at most two versions of a tree. We pool the "other" unused 8366 // node that we're free to reuse. This is lazily created to avoid allocating 8367 // extra objects for things that are never updated. It also allow us to 8368 // reclaim the extra memory if needed. 8369 workInProgress = createFiber(current.tag, current.key, current.internalContextTag); 8370 workInProgress.type = current.type; 8371 workInProgress.stateNode = current.stateNode; 8372 8373 { 8374 // DEV-only fields 8375 workInProgress._debugID = current._debugID; 8376 workInProgress._debugSource = current._debugSource; 8377 workInProgress._debugOwner = current._debugOwner; 8378 } 8379 8380 workInProgress.alternate = current; 8381 current.alternate = workInProgress; 8382 } else { 8383 // We already have an alternate. 8384 // Reset the effect tag. 8385 workInProgress.effectTag = NoEffect; 8386 8387 // The effect list is no longer valid. 8388 workInProgress.nextEffect = null; 8389 workInProgress.firstEffect = null; 8390 workInProgress.lastEffect = null; 8391 } 8392 8393 workInProgress.expirationTime = expirationTime; 8394 workInProgress.pendingProps = pendingProps; 8395 8396 workInProgress.child = current.child; 8397 workInProgress.memoizedProps = current.memoizedProps; 8398 workInProgress.memoizedState = current.memoizedState; 8399 workInProgress.updateQueue = current.updateQueue; 8400 8401 // These will be overridden during the parent's reconciliation 8402 workInProgress.sibling = current.sibling; 8403 workInProgress.index = current.index; 8404 workInProgress.ref = current.ref; 8405 8406 return workInProgress; 8407 } 8408 8409 function createHostRootFiber() { 8410 var fiber = createFiber(HostRoot, null, NoContext); 8411 return fiber; 8412 } 8413 8414 function createFiberFromElement(element, internalContextTag, expirationTime) { 8415 var owner = null; 8416 { 8417 owner = element._owner; 8418 } 8419 8420 var fiber = void 0; 8421 var type = element.type, 8422 key = element.key; 8423 8424 if (typeof type === 'function') { 8425 fiber = shouldConstruct(type) ? createFiber(ClassComponent, key, internalContextTag) : createFiber(IndeterminateComponent, key, internalContextTag); 8426 fiber.type = type; 8427 fiber.pendingProps = element.props; 8428 } else if (typeof type === 'string') { 8429 fiber = createFiber(HostComponent, key, internalContextTag); 8430 fiber.type = type; 8431 fiber.pendingProps = element.props; 8432 } else if (typeof type === 'object' && type !== null && typeof type.tag === 'number') { 8433 // Currently assumed to be a continuation and therefore is a fiber already. 8434 // TODO: The yield system is currently broken for updates in some cases. 8435 // The reified yield stores a fiber, but we don't know which fiber that is; 8436 // the current or a workInProgress? When the continuation gets rendered here 8437 // we don't know if we can reuse that fiber or if we need to clone it. 8438 // There is probably a clever way to restructure this. 8439 fiber = type; 8440 fiber.pendingProps = element.props; 8441 } else { 8442 var info = ''; 8443 { 8444 if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) { 8445 info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports."; 8446 } 8447 var ownerName = owner ? getComponentName(owner) : null; 8448 if (ownerName) { 8449 info += '\n\nCheck the render method of `' + ownerName + '`.'; 8450 } 8451 } 8452 invariant(false, 'Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s', type == null ? type : typeof type, info); 8453 } 8454 8455 { 8456 fiber._debugSource = element._source; 8457 fiber._debugOwner = element._owner; 8458 } 8459 8460 fiber.expirationTime = expirationTime; 8461 8462 return fiber; 8463 } 8464 8465 function createFiberFromFragment(elements, internalContextTag, expirationTime, key) { 8466 var fiber = createFiber(Fragment, key, internalContextTag); 8467 fiber.pendingProps = elements; 8468 fiber.expirationTime = expirationTime; 8469 return fiber; 8470 } 8471 8472 function createFiberFromText(content, internalContextTag, expirationTime) { 8473 var fiber = createFiber(HostText, null, internalContextTag); 8474 fiber.pendingProps = content; 8475 fiber.expirationTime = expirationTime; 8476 return fiber; 8477 } 8478 8479 function createFiberFromHostInstanceForDeletion() { 8480 var fiber = createFiber(HostComponent, null, NoContext); 8481 fiber.type = 'DELETED'; 8482 return fiber; 8483 } 8484 8485 function createFiberFromCall(call, internalContextTag, expirationTime) { 8486 var fiber = createFiber(CallComponent, call.key, internalContextTag); 8487 fiber.type = call.handler; 8488 fiber.pendingProps = call; 8489 fiber.expirationTime = expirationTime; 8490 return fiber; 8491 } 8492 8493 function createFiberFromReturn(returnNode, internalContextTag, expirationTime) { 8494 var fiber = createFiber(ReturnComponent, null, internalContextTag); 8495 fiber.expirationTime = expirationTime; 8496 return fiber; 8497 } 8498 8499 function createFiberFromPortal(portal, internalContextTag, expirationTime) { 8500 var fiber = createFiber(HostPortal, portal.key, internalContextTag); 8501 fiber.pendingProps = portal.children || []; 8502 fiber.expirationTime = expirationTime; 8503 fiber.stateNode = { 8504 containerInfo: portal.containerInfo, 8505 pendingChildren: null, // Used by persistent updates 8506 implementation: portal.implementation 8507 }; 8508 return fiber; 8509 } 8510 8511 function createFiberRoot(containerInfo, hydrate) { 8512 // Cyclic construction. This cheats the type system right now because 8513 // stateNode is any. 8514 var uninitializedFiber = createHostRootFiber(); 8515 var root = { 8516 current: uninitializedFiber, 8517 containerInfo: containerInfo, 8518 pendingChildren: null, 8519 remainingExpirationTime: NoWork, 8520 isReadyForCommit: false, 8521 finishedWork: null, 8522 context: null, 8523 pendingContext: null, 8524 hydrate: hydrate, 8525 nextScheduledRoot: null 8526 }; 8527 uninitializedFiber.stateNode = root; 8528 return root; 8529 } 8530 8531 var onCommitFiberRoot = null; 8532 var onCommitFiberUnmount = null; 8533 var hasLoggedError = false; 8534 8535 function catchErrors(fn) { 8536 return function (arg) { 8537 try { 8538 return fn(arg); 8539 } catch (err) { 8540 if (true && !hasLoggedError) { 8541 hasLoggedError = true; 8542 warning(false, 'React DevTools encountered an error: %s', err); 8543 } 8544 } 8545 }; 8546 } 8547 8548 function injectInternals(internals) { 8549 if (typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined') { 8550 // No DevTools 8551 return false; 8552 } 8553 var hook = __REACT_DEVTOOLS_GLOBAL_HOOK__; 8554 if (hook.isDisabled) { 8555 // This isn't a real property on the hook, but it can be set to opt out 8556 // of DevTools integration and associated warnings and logs. 8557 // https://github.com/facebook/react/issues/3877 8558 return true; 8559 } 8560 if (!hook.supportsFiber) { 8561 { 8562 warning(false, 'The installed version of React DevTools is too old and will not work ' + 'with the current version of React. Please update React DevTools. ' + 'https://fb.me/react-devtools'); 8563 } 8564 // DevTools exists, even though it doesn't support Fiber. 8565 return true; 8566 } 8567 try { 8568 var rendererID = hook.inject(internals); 8569 // We have successfully injected, so now it is safe to set up hooks. 8570 onCommitFiberRoot = catchErrors(function (root) { 8571 return hook.onCommitFiberRoot(rendererID, root); 8572 }); 8573 onCommitFiberUnmount = catchErrors(function (fiber) { 8574 return hook.onCommitFiberUnmount(rendererID, fiber); 8575 }); 8576 } catch (err) { 8577 // Catch all errors because it is unsafe to throw during initialization. 8578 { 8579 warning(false, 'React DevTools encountered an error: %s.', err); 8580 } 8581 } 8582 // DevTools exists 8583 return true; 8584 } 8585 8586 function onCommitRoot(root) { 8587 if (typeof onCommitFiberRoot === 'function') { 8588 onCommitFiberRoot(root); 8589 } 8590 } 8591 8592 function onCommitUnmount(fiber) { 8593 if (typeof onCommitFiberUnmount === 'function') { 8594 onCommitFiberUnmount(fiber); 8595 } 8596 } 8597 8598 { 8599 var didWarnUpdateInsideUpdate = false; 8600 } 8601 8602 // Callbacks are not validated until invocation 8603 8604 8605 // Singly linked-list of updates. When an update is scheduled, it is added to 8606 // the queue of the current fiber and the work-in-progress fiber. The two queues 8607 // are separate but they share a persistent structure. 8608 // 8609 // During reconciliation, updates are removed from the work-in-progress fiber, 8610 // but they remain on the current fiber. That ensures that if a work-in-progress 8611 // is aborted, the aborted updates are recovered by cloning from current. 8612 // 8613 // The work-in-progress queue is always a subset of the current queue. 8614 // 8615 // When the tree is committed, the work-in-progress becomes the current. 8616 8617 8618 function createUpdateQueue(baseState) { 8619 var queue = { 8620 baseState: baseState, 8621 expirationTime: NoWork, 8622 first: null, 8623 last: null, 8624 callbackList: null, 8625 hasForceUpdate: false, 8626 isInitialized: false 8627 }; 8628 { 8629 queue.isProcessing = false; 8630 } 8631 return queue; 8632 } 8633 8634 function insertUpdateIntoQueue(queue, update) { 8635 // Append the update to the end of the list. 8636 if (queue.last === null) { 8637 // Queue is empty 8638 queue.first = queue.last = update; 8639 } else { 8640 queue.last.next = update; 8641 queue.last = update; 8642 } 8643 if (queue.expirationTime === NoWork || queue.expirationTime > update.expirationTime) { 8644 queue.expirationTime = update.expirationTime; 8645 } 8646 } 8647 8648 function insertUpdateIntoFiber(fiber, update) { 8649 // We'll have at least one and at most two distinct update queues. 8650 var alternateFiber = fiber.alternate; 8651 var queue1 = fiber.updateQueue; 8652 if (queue1 === null) { 8653 // TODO: We don't know what the base state will be until we begin work. 8654 // It depends on which fiber is the next current. Initialize with an empty 8655 // base state, then set to the memoizedState when rendering. Not super 8656 // happy with this approach. 8657 queue1 = fiber.updateQueue = createUpdateQueue(null); 8658 } 8659 8660 var queue2 = void 0; 8661 if (alternateFiber !== null) { 8662 queue2 = alternateFiber.updateQueue; 8663 if (queue2 === null) { 8664 queue2 = alternateFiber.updateQueue = createUpdateQueue(null); 8665 } 8666 } else { 8667 queue2 = null; 8668 } 8669 queue2 = queue2 !== queue1 ? queue2 : null; 8670 8671 // Warn if an update is scheduled from inside an updater function. 8672 { 8673 if ((queue1.isProcessing || queue2 !== null && queue2.isProcessing) && !didWarnUpdateInsideUpdate) { 8674 warning(false, 'An update (setState, replaceState, or forceUpdate) was scheduled ' + 'from inside an update function. Update functions should be pure, ' + 'with zero side-effects. Consider using componentDidUpdate or a ' + 'callback.'); 8675 didWarnUpdateInsideUpdate = true; 8676 } 8677 } 8678 8679 // If there's only one queue, add the update to that queue and exit. 8680 if (queue2 === null) { 8681 insertUpdateIntoQueue(queue1, update); 8682 return; 8683 } 8684 8685 // If either queue is empty, we need to add to both queues. 8686 if (queue1.last === null || queue2.last === null) { 8687 insertUpdateIntoQueue(queue1, update); 8688 insertUpdateIntoQueue(queue2, update); 8689 return; 8690 } 8691 8692 // If both lists are not empty, the last update is the same for both lists 8693 // because of structural sharing. So, we should only append to one of 8694 // the lists. 8695 insertUpdateIntoQueue(queue1, update); 8696 // But we still need to update the `last` pointer of queue2. 8697 queue2.last = update; 8698 } 8699 8700 function getUpdateExpirationTime(fiber) { 8701 if (fiber.tag !== ClassComponent && fiber.tag !== HostRoot) { 8702 return NoWork; 8703 } 8704 var updateQueue = fiber.updateQueue; 8705 if (updateQueue === null) { 8706 return NoWork; 8707 } 8708 return updateQueue.expirationTime; 8709 } 8710 8711 function getStateFromUpdate(update, instance, prevState, props) { 8712 var partialState = update.partialState; 8713 if (typeof partialState === 'function') { 8714 var updateFn = partialState; 8715 8716 // Invoke setState callback an extra time to help detect side-effects. 8717 if (debugRenderPhaseSideEffects) { 8718 updateFn.call(instance, prevState, props); 8719 } 8720 8721 return updateFn.call(instance, prevState, props); 8722 } else { 8723 return partialState; 8724 } 8725 } 8726 8727 function processUpdateQueue(current, workInProgress, queue, instance, props, renderExpirationTime) { 8728 if (current !== null && current.updateQueue === queue) { 8729 // We need to create a work-in-progress queue, by cloning the current queue. 8730 var currentQueue = queue; 8731 queue = workInProgress.updateQueue = { 8732 baseState: currentQueue.baseState, 8733 expirationTime: currentQueue.expirationTime, 8734 first: currentQueue.first, 8735 last: currentQueue.last, 8736 isInitialized: currentQueue.isInitialized, 8737 // These fields are no longer valid because they were already committed. 8738 // Reset them. 8739 callbackList: null, 8740 hasForceUpdate: false 8741 }; 8742 } 8743 8744 { 8745 // Set this flag so we can warn if setState is called inside the update 8746 // function of another setState. 8747 queue.isProcessing = true; 8748 } 8749 8750 // Reset the remaining expiration time. If we skip over any updates, we'll 8751 // increase this accordingly. 8752 queue.expirationTime = NoWork; 8753 8754 // TODO: We don't know what the base state will be until we begin work. 8755 // It depends on which fiber is the next current. Initialize with an empty 8756 // base state, then set to the memoizedState when rendering. Not super 8757 // happy with this approach. 8758 var state = void 0; 8759 if (queue.isInitialized) { 8760 state = queue.baseState; 8761 } else { 8762 state = queue.baseState = workInProgress.memoizedState; 8763 queue.isInitialized = true; 8764 } 8765 var dontMutatePrevState = true; 8766 var update = queue.first; 8767 var didSkip = false; 8768 while (update !== null) { 8769 var updateExpirationTime = update.expirationTime; 8770 if (updateExpirationTime > renderExpirationTime) { 8771 // This update does not have sufficient priority. Skip it. 8772 var remainingExpirationTime = queue.expirationTime; 8773 if (remainingExpirationTime === NoWork || remainingExpirationTime > updateExpirationTime) { 8774 // Update the remaining expiration time. 8775 queue.expirationTime = updateExpirationTime; 8776 } 8777 if (!didSkip) { 8778 didSkip = true; 8779 queue.baseState = state; 8780 } 8781 // Continue to the next update. 8782 update = update.next; 8783 continue; 8784 } 8785 8786 // This update does have sufficient priority. 8787 8788 // If no previous updates were skipped, drop this update from the queue by 8789 // advancing the head of the list. 8790 if (!didSkip) { 8791 queue.first = update.next; 8792 if (queue.first === null) { 8793 queue.last = null; 8794 } 8795 } 8796 8797 // Process the update 8798 var _partialState = void 0; 8799 if (update.isReplace) { 8800 state = getStateFromUpdate(update, instance, state, props); 8801 dontMutatePrevState = true; 8802 } else { 8803 _partialState = getStateFromUpdate(update, instance, state, props); 8804 if (_partialState) { 8805 if (dontMutatePrevState) { 8806 // $FlowFixMe: Idk how to type this properly. 8807 state = _assign({}, state, _partialState); 8808 } else { 8809 state = _assign(state, _partialState); 8810 } 8811 dontMutatePrevState = false; 8812 } 8813 } 8814 if (update.isForced) { 8815 queue.hasForceUpdate = true; 8816 } 8817 if (update.callback !== null) { 8818 // Append to list of callbacks. 8819 var _callbackList = queue.callbackList; 8820 if (_callbackList === null) { 8821 _callbackList = queue.callbackList = []; 8822 } 8823 _callbackList.push(update); 8824 } 8825 update = update.next; 8826 } 8827 8828 if (queue.callbackList !== null) { 8829 workInProgress.effectTag |= Callback; 8830 } else if (queue.first === null && !queue.hasForceUpdate) { 8831 // The queue is empty. We can reset it. 8832 workInProgress.updateQueue = null; 8833 } 8834 8835 if (!didSkip) { 8836 didSkip = true; 8837 queue.baseState = state; 8838 } 8839 8840 { 8841 // No longer processing. 8842 queue.isProcessing = false; 8843 } 8844 8845 return state; 8846 } 8847 8848 function commitCallbacks(queue, context) { 8849 var callbackList = queue.callbackList; 8850 if (callbackList === null) { 8851 return; 8852 } 8853 // Set the list to null to make sure they don't get called more than once. 8854 queue.callbackList = null; 8855 for (var i = 0; i < callbackList.length; i++) { 8856 var update = callbackList[i]; 8857 var _callback = update.callback; 8858 // This update might be processed again. Clear the callback so it's only 8859 // called once. 8860 update.callback = null; 8861 !(typeof _callback === 'function') ? invariant(false, 'Invalid argument passed as callback. Expected a function. Instead received: %s', _callback) : void 0; 8862 _callback.call(context); 8863 } 8864 } 8865 8866 var fakeInternalInstance = {}; 8867 var isArray = Array.isArray; 8868 8869 { 8870 var didWarnAboutStateAssignmentForComponent = {}; 8871 8872 var warnOnInvalidCallback = function (callback, callerName) { 8873 warning(callback === null || typeof callback === 'function', '%s(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callerName, callback); 8874 }; 8875 8876 // This is so gross but it's at least non-critical and can be removed if 8877 // it causes problems. This is meant to give a nicer error message for 8878 // ReactDOM15.unstable_renderSubtreeIntoContainer(reactDOM16Component, 8879 // ...)) which otherwise throws a "_processChildContext is not a function" 8880 // exception. 8881 Object.defineProperty(fakeInternalInstance, '_processChildContext', { 8882 enumerable: false, 8883 value: function () { 8884 invariant(false, '_processChildContext is not available in React 16+. This likely means you have multiple copies of React and are attempting to nest a React 15 tree inside a React 16 tree using unstable_renderSubtreeIntoContainer, which isn\'t supported. Try to make sure you have only one copy of React (and ideally, switch to ReactDOM.createPortal).'); 8885 } 8886 }); 8887 Object.freeze(fakeInternalInstance); 8888 } 8889 8890 var ReactFiberClassComponent = function (scheduleWork, computeExpirationForFiber, memoizeProps, memoizeState) { 8891 // Class component state updater 8892 var updater = { 8893 isMounted: isMounted, 8894 enqueueSetState: function (instance, partialState, callback) { 8895 var fiber = get(instance); 8896 callback = callback === undefined ? null : callback; 8897 { 8898 warnOnInvalidCallback(callback, 'setState'); 8899 } 8900 var expirationTime = computeExpirationForFiber(fiber); 8901 var update = { 8902 expirationTime: expirationTime, 8903 partialState: partialState, 8904 callback: callback, 8905 isReplace: false, 8906 isForced: false, 8907 nextCallback: null, 8908 next: null 8909 }; 8910 insertUpdateIntoFiber(fiber, update); 8911 scheduleWork(fiber, expirationTime); 8912 }, 8913 enqueueReplaceState: function (instance, state, callback) { 8914 var fiber = get(instance); 8915 callback = callback === undefined ? null : callback; 8916 { 8917 warnOnInvalidCallback(callback, 'replaceState'); 8918 } 8919 var expirationTime = computeExpirationForFiber(fiber); 8920 var update = { 8921 expirationTime: expirationTime, 8922 partialState: state, 8923 callback: callback, 8924 isReplace: true, 8925 isForced: false, 8926 nextCallback: null, 8927 next: null 8928 }; 8929 insertUpdateIntoFiber(fiber, update); 8930 scheduleWork(fiber, expirationTime); 8931 }, 8932 enqueueForceUpdate: function (instance, callback) { 8933 var fiber = get(instance); 8934 callback = callback === undefined ? null : callback; 8935 { 8936 warnOnInvalidCallback(callback, 'forceUpdate'); 8937 } 8938 var expirationTime = computeExpirationForFiber(fiber); 8939 var update = { 8940 expirationTime: expirationTime, 8941 partialState: null, 8942 callback: callback, 8943 isReplace: false, 8944 isForced: true, 8945 nextCallback: null, 8946 next: null 8947 }; 8948 insertUpdateIntoFiber(fiber, update); 8949 scheduleWork(fiber, expirationTime); 8950 } 8951 }; 8952 8953 function checkShouldComponentUpdate(workInProgress, oldProps, newProps, oldState, newState, newContext) { 8954 if (oldProps === null || workInProgress.updateQueue !== null && workInProgress.updateQueue.hasForceUpdate) { 8955 // If the workInProgress already has an Update effect, return true 8956 return true; 8957 } 8958 8959 var instance = workInProgress.stateNode; 8960 var type = workInProgress.type; 8961 if (typeof instance.shouldComponentUpdate === 'function') { 8962 startPhaseTimer(workInProgress, 'shouldComponentUpdate'); 8963 var shouldUpdate = instance.shouldComponentUpdate(newProps, newState, newContext); 8964 stopPhaseTimer(); 8965 8966 // Simulate an async bailout/interruption by invoking lifecycle twice. 8967 if (debugRenderPhaseSideEffects) { 8968 instance.shouldComponentUpdate(newProps, newState, newContext); 8969 } 8970 8971 { 8972 warning(shouldUpdate !== undefined, '%s.shouldComponentUpdate(): Returned undefined instead of a ' + 'boolean value. Make sure to return true or false.', getComponentName(workInProgress) || 'Unknown'); 8973 } 8974 8975 return shouldUpdate; 8976 } 8977 8978 if (type.prototype && type.prototype.isPureReactComponent) { 8979 return !shallowEqual(oldProps, newProps) || !shallowEqual(oldState, newState); 8980 } 8981 8982 return true; 8983 } 8984 8985 function checkClassInstance(workInProgress) { 8986 var instance = workInProgress.stateNode; 8987 var type = workInProgress.type; 8988 { 8989 var name = getComponentName(workInProgress); 8990 var renderPresent = instance.render; 8991 8992 if (!renderPresent) { 8993 if (type.prototype && typeof type.prototype.render === 'function') { 8994 warning(false, '%s(...): No `render` method found on the returned component ' + 'instance: did you accidentally return an object from the constructor?', name); 8995 } else { 8996 warning(false, '%s(...): No `render` method found on the returned component ' + 'instance: you may have forgotten to define `render`.', name); 8997 } 8998 } 8999 9000 var noGetInitialStateOnES6 = !instance.getInitialState || instance.getInitialState.isReactClassApproved || instance.state; 9001 warning(noGetInitialStateOnES6, 'getInitialState was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Did you mean to define a state property instead?', name); 9002 var noGetDefaultPropsOnES6 = !instance.getDefaultProps || instance.getDefaultProps.isReactClassApproved; 9003 warning(noGetDefaultPropsOnES6, 'getDefaultProps was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Use a static property to define defaultProps instead.', name); 9004 var noInstancePropTypes = !instance.propTypes; 9005 warning(noInstancePropTypes, 'propTypes was defined as an instance property on %s. Use a static ' + 'property to define propTypes instead.', name); 9006 var noInstanceContextTypes = !instance.contextTypes; 9007 warning(noInstanceContextTypes, 'contextTypes was defined as an instance property on %s. Use a static ' + 'property to define contextTypes instead.', name); 9008 var noComponentShouldUpdate = typeof instance.componentShouldUpdate !== 'function'; 9009 warning(noComponentShouldUpdate, '%s has a method called ' + 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' + 'The name is phrased as a question because the function is ' + 'expected to return a value.', name); 9010 if (type.prototype && type.prototype.isPureReactComponent && typeof instance.shouldComponentUpdate !== 'undefined') { 9011 warning(false, '%s has a method called shouldComponentUpdate(). ' + 'shouldComponentUpdate should not be used when extending React.PureComponent. ' + 'Please extend React.Component if shouldComponentUpdate is used.', getComponentName(workInProgress) || 'A pure component'); 9012 } 9013 var noComponentDidUnmount = typeof instance.componentDidUnmount !== 'function'; 9014 warning(noComponentDidUnmount, '%s has a method called ' + 'componentDidUnmount(). But there is no such lifecycle method. ' + 'Did you mean componentWillUnmount()?', name); 9015 var noComponentDidReceiveProps = typeof instance.componentDidReceiveProps !== 'function'; 9016 warning(noComponentDidReceiveProps, '%s has a method called ' + 'componentDidReceiveProps(). But there is no such lifecycle method. ' + 'If you meant to update the state in response to changing props, ' + 'use componentWillReceiveProps(). If you meant to fetch data or ' + 'run side-effects or mutations after React has updated the UI, use componentDidUpdate().', name); 9017 var noComponentWillRecieveProps = typeof instance.componentWillRecieveProps !== 'function'; 9018 warning(noComponentWillRecieveProps, '%s has a method called ' + 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?', name); 9019 var hasMutatedProps = instance.props !== workInProgress.pendingProps; 9020 warning(instance.props === undefined || !hasMutatedProps, '%s(...): When calling super() in `%s`, make sure to pass ' + "up the same props that your component's constructor was passed.", name, name); 9021 var noInstanceDefaultProps = !instance.defaultProps; 9022 warning(noInstanceDefaultProps, 'Setting defaultProps as an instance property on %s is not supported and will be ignored.' + ' Instead, define defaultProps as a static property on %s.', name, name); 9023 } 9024 9025 var state = instance.state; 9026 if (state && (typeof state !== 'object' || isArray(state))) { 9027 warning(false, '%s.state: must be set to an object or null', getComponentName(workInProgress)); 9028 } 9029 if (typeof instance.getChildContext === 'function') { 9030 warning(typeof workInProgress.type.childContextTypes === 'object', '%s.getChildContext(): childContextTypes must be defined in order to ' + 'use getChildContext().', getComponentName(workInProgress)); 9031 } 9032 } 9033 9034 function resetInputPointers(workInProgress, instance) { 9035 instance.props = workInProgress.memoizedProps; 9036 instance.state = workInProgress.memoizedState; 9037 } 9038 9039 function adoptClassInstance(workInProgress, instance) { 9040 instance.updater = updater; 9041 workInProgress.stateNode = instance; 9042 // The instance needs access to the fiber so that it can schedule updates 9043 set(instance, workInProgress); 9044 { 9045 instance._reactInternalInstance = fakeInternalInstance; 9046 } 9047 } 9048 9049 function constructClassInstance(workInProgress, props) { 9050 var ctor = workInProgress.type; 9051 var unmaskedContext = getUnmaskedContext(workInProgress); 9052 var needsContext = isContextConsumer(workInProgress); 9053 var context = needsContext ? getMaskedContext(workInProgress, unmaskedContext) : emptyObject; 9054 var instance = new ctor(props, context); 9055 adoptClassInstance(workInProgress, instance); 9056 9057 // Cache unmasked context so we can avoid recreating masked context unless necessary. 9058 // ReactFiberContext usually updates this cache but can't for newly-created instances. 9059 if (needsContext) { 9060 cacheContext(workInProgress, unmaskedContext, context); 9061 } 9062 9063 return instance; 9064 } 9065 9066 function callComponentWillMount(workInProgress, instance) { 9067 startPhaseTimer(workInProgress, 'componentWillMount'); 9068 var oldState = instance.state; 9069 instance.componentWillMount(); 9070 stopPhaseTimer(); 9071 9072 // Simulate an async bailout/interruption by invoking lifecycle twice. 9073 if (debugRenderPhaseSideEffects) { 9074 instance.componentWillMount(); 9075 } 9076 9077 if (oldState !== instance.state) { 9078 { 9079 warning(false, '%s.componentWillMount(): Assigning directly to this.state is ' + "deprecated (except inside a component's " + 'constructor). Use setState instead.', getComponentName(workInProgress)); 9080 } 9081 updater.enqueueReplaceState(instance, instance.state, null); 9082 } 9083 } 9084 9085 function callComponentWillReceiveProps(workInProgress, instance, newProps, newContext) { 9086 startPhaseTimer(workInProgress, 'componentWillReceiveProps'); 9087 var oldState = instance.state; 9088 instance.componentWillReceiveProps(newProps, newContext); 9089 stopPhaseTimer(); 9090 9091 // Simulate an async bailout/interruption by invoking lifecycle twice. 9092 if (debugRenderPhaseSideEffects) { 9093 instance.componentWillReceiveProps(newProps, newContext); 9094 } 9095 9096 if (instance.state !== oldState) { 9097 { 9098 var componentName = getComponentName(workInProgress) || 'Component'; 9099 if (!didWarnAboutStateAssignmentForComponent[componentName]) { 9100 warning(false, '%s.componentWillReceiveProps(): Assigning directly to ' + "this.state is deprecated (except inside a component's " + 'constructor). Use setState instead.', componentName); 9101 didWarnAboutStateAssignmentForComponent[componentName] = true; 9102 } 9103 } 9104 updater.enqueueReplaceState(instance, instance.state, null); 9105 } 9106 } 9107 9108 // Invokes the mount life-cycles on a previously never rendered instance. 9109 function mountClassInstance(workInProgress, renderExpirationTime) { 9110 var current = workInProgress.alternate; 9111 9112 { 9113 checkClassInstance(workInProgress); 9114 } 9115 9116 var instance = workInProgress.stateNode; 9117 var state = instance.state || null; 9118 9119 var props = workInProgress.pendingProps; 9120 !props ? invariant(false, 'There must be pending props for an initial mount. This error is likely caused by a bug in React. Please file an issue.') : void 0; 9121 9122 var unmaskedContext = getUnmaskedContext(workInProgress); 9123 9124 instance.props = props; 9125 instance.state = workInProgress.memoizedState = state; 9126 instance.refs = emptyObject; 9127 instance.context = getMaskedContext(workInProgress, unmaskedContext); 9128 9129 if (enableAsyncSubtreeAPI && workInProgress.type != null && workInProgress.type.prototype != null && workInProgress.type.prototype.unstable_isAsyncReactComponent === true) { 9130 workInProgress.internalContextTag |= AsyncUpdates; 9131 } 9132 9133 if (typeof instance.componentWillMount === 'function') { 9134 callComponentWillMount(workInProgress, instance); 9135 // If we had additional state updates during this life-cycle, let's 9136 // process them now. 9137 var updateQueue = workInProgress.updateQueue; 9138 if (updateQueue !== null) { 9139 instance.state = processUpdateQueue(current, workInProgress, updateQueue, instance, props, renderExpirationTime); 9140 } 9141 } 9142 if (typeof instance.componentDidMount === 'function') { 9143 workInProgress.effectTag |= Update; 9144 } 9145 } 9146 9147 // Called on a preexisting class instance. Returns false if a resumed render 9148 // could be reused. 9149 // function resumeMountClassInstance( 9150 // workInProgress: Fiber, 9151 // priorityLevel: PriorityLevel, 9152 // ): boolean { 9153 // const instance = workInProgress.stateNode; 9154 // resetInputPointers(workInProgress, instance); 9155 9156 // let newState = workInProgress.memoizedState; 9157 // let newProps = workInProgress.pendingProps; 9158 // if (!newProps) { 9159 // // If there isn't any new props, then we'll reuse the memoized props. 9160 // // This could be from already completed work. 9161 // newProps = workInProgress.memoizedProps; 9162 // invariant( 9163 // newProps != null, 9164 // 'There should always be pending or memoized props. This error is ' + 9165 // 'likely caused by a bug in React. Please file an issue.', 9166 // ); 9167 // } 9168 // const newUnmaskedContext = getUnmaskedContext(workInProgress); 9169 // const newContext = getMaskedContext(workInProgress, newUnmaskedContext); 9170 9171 // const oldContext = instance.context; 9172 // const oldProps = workInProgress.memoizedProps; 9173 9174 // if ( 9175 // typeof instance.componentWillReceiveProps === 'function' && 9176 // (oldProps !== newProps || oldContext !== newContext) 9177 // ) { 9178 // callComponentWillReceiveProps( 9179 // workInProgress, 9180 // instance, 9181 // newProps, 9182 // newContext, 9183 // ); 9184 // } 9185 9186 // // Process the update queue before calling shouldComponentUpdate 9187 // const updateQueue = workInProgress.updateQueue; 9188 // if (updateQueue !== null) { 9189 // newState = processUpdateQueue( 9190 // workInProgress, 9191 // updateQueue, 9192 // instance, 9193 // newState, 9194 // newProps, 9195 // priorityLevel, 9196 // ); 9197 // } 9198 9199 // // TODO: Should we deal with a setState that happened after the last 9200 // // componentWillMount and before this componentWillMount? Probably 9201 // // unsupported anyway. 9202 9203 // if ( 9204 // !checkShouldComponentUpdate( 9205 // workInProgress, 9206 // workInProgress.memoizedProps, 9207 // newProps, 9208 // workInProgress.memoizedState, 9209 // newState, 9210 // newContext, 9211 // ) 9212 // ) { 9213 // // Update the existing instance's state, props, and context pointers even 9214 // // though we're bailing out. 9215 // instance.props = newProps; 9216 // instance.state = newState; 9217 // instance.context = newContext; 9218 // return false; 9219 // } 9220 9221 // // Update the input pointers now so that they are correct when we call 9222 // // componentWillMount 9223 // instance.props = newProps; 9224 // instance.state = newState; 9225 // instance.context = newContext; 9226 9227 // if (typeof instance.componentWillMount === 'function') { 9228 // callComponentWillMount(workInProgress, instance); 9229 // // componentWillMount may have called setState. Process the update queue. 9230 // const newUpdateQueue = workInProgress.updateQueue; 9231 // if (newUpdateQueue !== null) { 9232 // newState = processUpdateQueue( 9233 // workInProgress, 9234 // newUpdateQueue, 9235 // instance, 9236 // newState, 9237 // newProps, 9238 // priorityLevel, 9239 // ); 9240 // } 9241 // } 9242 9243 // if (typeof instance.componentDidMount === 'function') { 9244 // workInProgress.effectTag |= Update; 9245 // } 9246 9247 // instance.state = newState; 9248 9249 // return true; 9250 // } 9251 9252 // Invokes the update life-cycles and returns false if it shouldn't rerender. 9253 function updateClassInstance(current, workInProgress, renderExpirationTime) { 9254 var instance = workInProgress.stateNode; 9255 resetInputPointers(workInProgress, instance); 9256 9257 var oldProps = workInProgress.memoizedProps; 9258 var newProps = workInProgress.pendingProps; 9259 if (!newProps) { 9260 // If there aren't any new props, then we'll reuse the memoized props. 9261 // This could be from already completed work. 9262 newProps = oldProps; 9263 !(newProps != null) ? invariant(false, 'There should always be pending or memoized props. This error is likely caused by a bug in React. Please file an issue.') : void 0; 9264 } 9265 var oldContext = instance.context; 9266 var newUnmaskedContext = getUnmaskedContext(workInProgress); 9267 var newContext = getMaskedContext(workInProgress, newUnmaskedContext); 9268 9269 // Note: During these life-cycles, instance.props/instance.state are what 9270 // ever the previously attempted to render - not the "current". However, 9271 // during componentDidUpdate we pass the "current" props. 9272 9273 if (typeof instance.componentWillReceiveProps === 'function' && (oldProps !== newProps || oldContext !== newContext)) { 9274 callComponentWillReceiveProps(workInProgress, instance, newProps, newContext); 9275 } 9276 9277 // Compute the next state using the memoized state and the update queue. 9278 var oldState = workInProgress.memoizedState; 9279 // TODO: Previous state can be null. 9280 var newState = void 0; 9281 if (workInProgress.updateQueue !== null) { 9282 newState = processUpdateQueue(current, workInProgress, workInProgress.updateQueue, instance, newProps, renderExpirationTime); 9283 } else { 9284 newState = oldState; 9285 } 9286 9287 if (oldProps === newProps && oldState === newState && !hasContextChanged() && !(workInProgress.updateQueue !== null && workInProgress.updateQueue.hasForceUpdate)) { 9288 // If an update was already in progress, we should schedule an Update 9289 // effect even though we're bailing out, so that cWU/cDU are called. 9290 if (typeof instance.componentDidUpdate === 'function') { 9291 if (oldProps !== current.memoizedProps || oldState !== current.memoizedState) { 9292 workInProgress.effectTag |= Update; 9293 } 9294 } 9295 return false; 9296 } 9297 9298 var shouldUpdate = checkShouldComponentUpdate(workInProgress, oldProps, newProps, oldState, newState, newContext); 9299 9300 if (shouldUpdate) { 9301 if (typeof instance.componentWillUpdate === 'function') { 9302 startPhaseTimer(workInProgress, 'componentWillUpdate'); 9303 instance.componentWillUpdate(newProps, newState, newContext); 9304 stopPhaseTimer(); 9305 9306 // Simulate an async bailout/interruption by invoking lifecycle twice. 9307 if (debugRenderPhaseSideEffects) { 9308 instance.componentWillUpdate(newProps, newState, newContext); 9309 } 9310 } 9311 if (typeof instance.componentDidUpdate === 'function') { 9312 workInProgress.effectTag |= Update; 9313 } 9314 } else { 9315 // If an update was already in progress, we should schedule an Update 9316 // effect even though we're bailing out, so that cWU/cDU are called. 9317 if (typeof instance.componentDidUpdate === 'function') { 9318 if (oldProps !== current.memoizedProps || oldState !== current.memoizedState) { 9319 workInProgress.effectTag |= Update; 9320 } 9321 } 9322 9323 // If shouldComponentUpdate returned false, we should still update the 9324 // memoized props/state to indicate that this work can be reused. 9325 memoizeProps(workInProgress, newProps); 9326 memoizeState(workInProgress, newState); 9327 } 9328 9329 // Update the existing instance's state, props, and context pointers even 9330 // if shouldComponentUpdate returns false. 9331 instance.props = newProps; 9332 instance.state = newState; 9333 instance.context = newContext; 9334 9335 return shouldUpdate; 9336 } 9337 9338 return { 9339 adoptClassInstance: adoptClassInstance, 9340 constructClassInstance: constructClassInstance, 9341 mountClassInstance: mountClassInstance, 9342 // resumeMountClassInstance, 9343 updateClassInstance: updateClassInstance 9344 }; 9345 }; 9346 9347 // The Symbol used to tag the ReactElement-like types. If there is no native Symbol 9348 // nor polyfill, then a plain number is used for performance. 9349 var hasSymbol = typeof Symbol === 'function' && Symbol['for']; 9350 9351 var REACT_ELEMENT_TYPE = hasSymbol ? Symbol['for']('react.element') : 0xeac7; 9352 var REACT_CALL_TYPE = hasSymbol ? Symbol['for']('react.call') : 0xeac8; 9353 var REACT_RETURN_TYPE = hasSymbol ? Symbol['for']('react.return') : 0xeac9; 9354 var REACT_PORTAL_TYPE = hasSymbol ? Symbol['for']('react.portal') : 0xeaca; 9355 var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol['for']('react.fragment') : 0xeacb; 9356 9357 var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator; 9358 var FAUX_ITERATOR_SYMBOL = '@@iterator'; 9359 9360 function getIteratorFn(maybeIterable) { 9361 if (maybeIterable === null || typeof maybeIterable === 'undefined') { 9362 return null; 9363 } 9364 var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]; 9365 if (typeof maybeIterator === 'function') { 9366 return maybeIterator; 9367 } 9368 return null; 9369 } 9370 9371 var getCurrentFiberStackAddendum$1 = ReactDebugCurrentFiber.getCurrentFiberStackAddendum; 9372 9373 9374 { 9375 var didWarnAboutMaps = false; 9376 /** 9377 * Warn if there's no key explicitly set on dynamic arrays of children or 9378 * object keys are not valid. This allows us to keep track of children between 9379 * updates. 9380 */ 9381 var ownerHasKeyUseWarning = {}; 9382 var ownerHasFunctionTypeWarning = {}; 9383 9384 var warnForMissingKey = function (child) { 9385 if (child === null || typeof child !== 'object') { 9386 return; 9387 } 9388 if (!child._store || child._store.validated || child.key != null) { 9389 return; 9390 } 9391 !(typeof child._store === 'object') ? invariant(false, 'React Component in warnForMissingKey should have a _store. This error is likely caused by a bug in React. Please file an issue.') : void 0; 9392 child._store.validated = true; 9393 9394 var currentComponentErrorInfo = 'Each child in an array or iterator should have a unique ' + '"key" prop. See https://fb.me/react-warning-keys for ' + 'more information.' + (getCurrentFiberStackAddendum$1() || ''); 9395 if (ownerHasKeyUseWarning[currentComponentErrorInfo]) { 9396 return; 9397 } 9398 ownerHasKeyUseWarning[currentComponentErrorInfo] = true; 9399 9400 warning(false, 'Each child in an array or iterator should have a unique ' + '"key" prop. See https://fb.me/react-warning-keys for ' + 'more information.%s', getCurrentFiberStackAddendum$1()); 9401 }; 9402 } 9403 9404 var isArray$1 = Array.isArray; 9405 9406 function coerceRef(current, element) { 9407 var mixedRef = element.ref; 9408 if (mixedRef !== null && typeof mixedRef !== 'function') { 9409 if (element._owner) { 9410 var owner = element._owner; 9411 var inst = void 0; 9412 if (owner) { 9413 var ownerFiber = owner; 9414 !(ownerFiber.tag === ClassComponent) ? invariant(false, 'Stateless function components cannot have refs.') : void 0; 9415 inst = ownerFiber.stateNode; 9416 } 9417 !inst ? invariant(false, 'Missing owner for string ref %s. This error is likely caused by a bug in React. Please file an issue.', mixedRef) : void 0; 9418 var stringRef = '' + mixedRef; 9419 // Check if previous string ref matches new string ref 9420 if (current !== null && current.ref !== null && current.ref._stringRef === stringRef) { 9421 return current.ref; 9422 } 9423 var ref = function (value) { 9424 var refs = inst.refs === emptyObject ? inst.refs = {} : inst.refs; 9425 if (value === null) { 9426 delete refs[stringRef]; 9427 } else { 9428 refs[stringRef] = value; 9429 } 9430 }; 9431 ref._stringRef = stringRef; 9432 return ref; 9433 } else { 9434 !(typeof mixedRef === 'string') ? invariant(false, 'Expected ref to be a function or a string.') : void 0; 9435 !element._owner ? invariant(false, 'Element ref was specified as a string (%s) but no owner was set. You may have multiple copies of React loaded. (details: https://fb.me/react-refs-must-have-owner).', mixedRef) : void 0; 9436 } 9437 } 9438 return mixedRef; 9439 } 9440 9441 function throwOnInvalidObjectType(returnFiber, newChild) { 9442 if (returnFiber.type !== 'textarea') { 9443 var addendum = ''; 9444 { 9445 addendum = ' If you meant to render a collection of children, use an array ' + 'instead.' + (getCurrentFiberStackAddendum$1() || ''); 9446 } 9447 invariant(false, 'Objects are not valid as a React child (found: %s).%s', Object.prototype.toString.call(newChild) === '[object Object]' ? 'object with keys {' + Object.keys(newChild).join(', ') + '}' : newChild, addendum); 9448 } 9449 } 9450 9451 function warnOnFunctionType() { 9452 var currentComponentErrorInfo = 'Functions are not valid as a React child. This may happen if ' + 'you return a Component instead of <Component /> from render. ' + 'Or maybe you meant to call this function rather than return it.' + (getCurrentFiberStackAddendum$1() || ''); 9453 9454 if (ownerHasFunctionTypeWarning[currentComponentErrorInfo]) { 9455 return; 9456 } 9457 ownerHasFunctionTypeWarning[currentComponentErrorInfo] = true; 9458 9459 warning(false, 'Functions are not valid as a React child. This may happen if ' + 'you return a Component instead of <Component /> from render. ' + 'Or maybe you meant to call this function rather than return it.%s', getCurrentFiberStackAddendum$1() || ''); 9460 } 9461 9462 // This wrapper function exists because I expect to clone the code in each path 9463 // to be able to optimize each path individually by branching early. This needs 9464 // a compiler or we can do it manually. Helpers that don't need this branching 9465 // live outside of this function. 9466 function ChildReconciler(shouldTrackSideEffects) { 9467 function deleteChild(returnFiber, childToDelete) { 9468 if (!shouldTrackSideEffects) { 9469 // Noop. 9470 return; 9471 } 9472 // Deletions are added in reversed order so we add it to the front. 9473 // At this point, the return fiber's effect list is empty except for 9474 // deletions, so we can just append the deletion to the list. The remaining 9475 // effects aren't added until the complete phase. Once we implement 9476 // resuming, this may not be true. 9477 var last = returnFiber.lastEffect; 9478 if (last !== null) { 9479 last.nextEffect = childToDelete; 9480 returnFiber.lastEffect = childToDelete; 9481 } else { 9482 returnFiber.firstEffect = returnFiber.lastEffect = childToDelete; 9483 } 9484 childToDelete.nextEffect = null; 9485 childToDelete.effectTag = Deletion; 9486 } 9487 9488 function deleteRemainingChildren(returnFiber, currentFirstChild) { 9489 if (!shouldTrackSideEffects) { 9490 // Noop. 9491 return null; 9492 } 9493 9494 // TODO: For the shouldClone case, this could be micro-optimized a bit by 9495 // assuming that after the first child we've already added everything. 9496 var childToDelete = currentFirstChild; 9497 while (childToDelete !== null) { 9498 deleteChild(returnFiber, childToDelete); 9499 childToDelete = childToDelete.sibling; 9500 } 9501 return null; 9502 } 9503 9504 function mapRemainingChildren(returnFiber, currentFirstChild) { 9505 // Add the remaining children to a temporary map so that we can find them by 9506 // keys quickly. Implicit (null) keys get added to this set with their index 9507 var existingChildren = new Map(); 9508 9509 var existingChild = currentFirstChild; 9510 while (existingChild !== null) { 9511 if (existingChild.key !== null) { 9512 existingChildren.set(existingChild.key, existingChild); 9513 } else { 9514 existingChildren.set(existingChild.index, existingChild); 9515 } 9516 existingChild = existingChild.sibling; 9517 } 9518 return existingChildren; 9519 } 9520 9521 function useFiber(fiber, pendingProps, expirationTime) { 9522 // We currently set sibling to null and index to 0 here because it is easy 9523 // to forget to do before returning it. E.g. for the single child case. 9524 var clone = createWorkInProgress(fiber, pendingProps, expirationTime); 9525 clone.index = 0; 9526 clone.sibling = null; 9527 return clone; 9528 } 9529 9530 function placeChild(newFiber, lastPlacedIndex, newIndex) { 9531 newFiber.index = newIndex; 9532 if (!shouldTrackSideEffects) { 9533 // Noop. 9534 return lastPlacedIndex; 9535 } 9536 var current = newFiber.alternate; 9537 if (current !== null) { 9538 var oldIndex = current.index; 9539 if (oldIndex < lastPlacedIndex) { 9540 // This is a move. 9541 newFiber.effectTag = Placement; 9542 return lastPlacedIndex; 9543 } else { 9544 // This item can stay in place. 9545 return oldIndex; 9546 } 9547 } else { 9548 // This is an insertion. 9549 newFiber.effectTag = Placement; 9550 return lastPlacedIndex; 9551 } 9552 } 9553 9554 function placeSingleChild(newFiber) { 9555 // This is simpler for the single child case. We only need to do a 9556 // placement for inserting new children. 9557 if (shouldTrackSideEffects && newFiber.alternate === null) { 9558 newFiber.effectTag = Placement; 9559 } 9560 return newFiber; 9561 } 9562 9563 function updateTextNode(returnFiber, current, textContent, expirationTime) { 9564 if (current === null || current.tag !== HostText) { 9565 // Insert 9566 var created = createFiberFromText(textContent, returnFiber.internalContextTag, expirationTime); 9567 created['return'] = returnFiber; 9568 return created; 9569 } else { 9570 // Update 9571 var existing = useFiber(current, textContent, expirationTime); 9572 existing['return'] = returnFiber; 9573 return existing; 9574 } 9575 } 9576 9577 function updateElement(returnFiber, current, element, expirationTime) { 9578 if (current !== null && current.type === element.type) { 9579 // Move based on index 9580 var existing = useFiber(current, element.props, expirationTime); 9581 existing.ref = coerceRef(current, element); 9582 existing['return'] = returnFiber; 9583 { 9584 existing._debugSource = element._source; 9585 existing._debugOwner = element._owner; 9586 } 9587 return existing; 9588 } else { 9589 // Insert 9590 var created = createFiberFromElement(element, returnFiber.internalContextTag, expirationTime); 9591 created.ref = coerceRef(current, element); 9592 created['return'] = returnFiber; 9593 return created; 9594 } 9595 } 9596 9597 function updateCall(returnFiber, current, call, expirationTime) { 9598 // TODO: Should this also compare handler to determine whether to reuse? 9599 if (current === null || current.tag !== CallComponent) { 9600 // Insert 9601 var created = createFiberFromCall(call, returnFiber.internalContextTag, expirationTime); 9602 created['return'] = returnFiber; 9603 return created; 9604 } else { 9605 // Move based on index 9606 var existing = useFiber(current, call, expirationTime); 9607 existing['return'] = returnFiber; 9608 return existing; 9609 } 9610 } 9611 9612 function updateReturn(returnFiber, current, returnNode, expirationTime) { 9613 if (current === null || current.tag !== ReturnComponent) { 9614 // Insert 9615 var created = createFiberFromReturn(returnNode, returnFiber.internalContextTag, expirationTime); 9616 created.type = returnNode.value; 9617 created['return'] = returnFiber; 9618 return created; 9619 } else { 9620 // Move based on index 9621 var existing = useFiber(current, null, expirationTime); 9622 existing.type = returnNode.value; 9623 existing['return'] = returnFiber; 9624 return existing; 9625 } 9626 } 9627 9628 function updatePortal(returnFiber, current, portal, expirationTime) { 9629 if (current === null || current.tag !== HostPortal || current.stateNode.containerInfo !== portal.containerInfo || current.stateNode.implementation !== portal.implementation) { 9630 // Insert 9631 var created = createFiberFromPortal(portal, returnFiber.internalContextTag, expirationTime); 9632 created['return'] = returnFiber; 9633 return created; 9634 } else { 9635 // Update 9636 var existing = useFiber(current, portal.children || [], expirationTime); 9637 existing['return'] = returnFiber; 9638 return existing; 9639 } 9640 } 9641 9642 function updateFragment(returnFiber, current, fragment, expirationTime, key) { 9643 if (current === null || current.tag !== Fragment) { 9644 // Insert 9645 var created = createFiberFromFragment(fragment, returnFiber.internalContextTag, expirationTime, key); 9646 created['return'] = returnFiber; 9647 return created; 9648 } else { 9649 // Update 9650 var existing = useFiber(current, fragment, expirationTime); 9651 existing['return'] = returnFiber; 9652 return existing; 9653 } 9654 } 9655 9656 function createChild(returnFiber, newChild, expirationTime) { 9657 if (typeof newChild === 'string' || typeof newChild === 'number') { 9658 // Text nodes don't have keys. If the previous node is implicitly keyed 9659 // we can continue to replace it without aborting even if it is not a text 9660 // node. 9661 var created = createFiberFromText('' + newChild, returnFiber.internalContextTag, expirationTime); 9662 created['return'] = returnFiber; 9663 return created; 9664 } 9665 9666 if (typeof newChild === 'object' && newChild !== null) { 9667 switch (newChild.$$typeof) { 9668 case REACT_ELEMENT_TYPE: 9669 { 9670 if (newChild.type === REACT_FRAGMENT_TYPE) { 9671 var _created = createFiberFromFragment(newChild.props.children, returnFiber.internalContextTag, expirationTime, newChild.key); 9672 _created['return'] = returnFiber; 9673 return _created; 9674 } else { 9675 var _created2 = createFiberFromElement(newChild, returnFiber.internalContextTag, expirationTime); 9676 _created2.ref = coerceRef(null, newChild); 9677 _created2['return'] = returnFiber; 9678 return _created2; 9679 } 9680 } 9681 9682 case REACT_CALL_TYPE: 9683 { 9684 var _created3 = createFiberFromCall(newChild, returnFiber.internalContextTag, expirationTime); 9685 _created3['return'] = returnFiber; 9686 return _created3; 9687 } 9688 9689 case REACT_RETURN_TYPE: 9690 { 9691 var _created4 = createFiberFromReturn(newChild, returnFiber.internalContextTag, expirationTime); 9692 _created4.type = newChild.value; 9693 _created4['return'] = returnFiber; 9694 return _created4; 9695 } 9696 9697 case REACT_PORTAL_TYPE: 9698 { 9699 var _created5 = createFiberFromPortal(newChild, returnFiber.internalContextTag, expirationTime); 9700 _created5['return'] = returnFiber; 9701 return _created5; 9702 } 9703 } 9704 9705 if (isArray$1(newChild) || getIteratorFn(newChild)) { 9706 var _created6 = createFiberFromFragment(newChild, returnFiber.internalContextTag, expirationTime, null); 9707 _created6['return'] = returnFiber; 9708 return _created6; 9709 } 9710 9711 throwOnInvalidObjectType(returnFiber, newChild); 9712 } 9713 9714 { 9715 if (typeof newChild === 'function') { 9716 warnOnFunctionType(); 9717 } 9718 } 9719 9720 return null; 9721 } 9722 9723 function updateSlot(returnFiber, oldFiber, newChild, expirationTime) { 9724 // Update the fiber if the keys match, otherwise return null. 9725 9726 var key = oldFiber !== null ? oldFiber.key : null; 9727 9728 if (typeof newChild === 'string' || typeof newChild === 'number') { 9729 // Text nodes don't have keys. If the previous node is implicitly keyed 9730 // we can continue to replace it without aborting even if it is not a text 9731 // node. 9732 if (key !== null) { 9733 return null; 9734 } 9735 return updateTextNode(returnFiber, oldFiber, '' + newChild, expirationTime); 9736 } 9737 9738 if (typeof newChild === 'object' && newChild !== null) { 9739 switch (newChild.$$typeof) { 9740 case REACT_ELEMENT_TYPE: 9741 { 9742 if (newChild.key === key) { 9743 if (newChild.type === REACT_FRAGMENT_TYPE) { 9744 return updateFragment(returnFiber, oldFiber, newChild.props.children, expirationTime, key); 9745 } 9746 return updateElement(returnFiber, oldFiber, newChild, expirationTime); 9747 } else { 9748 return null; 9749 } 9750 } 9751 9752 case REACT_CALL_TYPE: 9753 { 9754 if (newChild.key === key) { 9755 return updateCall(returnFiber, oldFiber, newChild, expirationTime); 9756 } else { 9757 return null; 9758 } 9759 } 9760 9761 case REACT_RETURN_TYPE: 9762 { 9763 // Returns don't have keys. If the previous node is implicitly keyed 9764 // we can continue to replace it without aborting even if it is not a 9765 // yield. 9766 if (key === null) { 9767 return updateReturn(returnFiber, oldFiber, newChild, expirationTime); 9768 } else { 9769 return null; 9770 } 9771 } 9772 9773 case REACT_PORTAL_TYPE: 9774 { 9775 if (newChild.key === key) { 9776 return updatePortal(returnFiber, oldFiber, newChild, expirationTime); 9777 } else { 9778 return null; 9779 } 9780 } 9781 } 9782 9783 if (isArray$1(newChild) || getIteratorFn(newChild)) { 9784 if (key !== null) { 9785 return null; 9786 } 9787 9788 return updateFragment(returnFiber, oldFiber, newChild, expirationTime, null); 9789 } 9790 9791 throwOnInvalidObjectType(returnFiber, newChild); 9792 } 9793 9794 { 9795 if (typeof newChild === 'function') { 9796 warnOnFunctionType(); 9797 } 9798 } 9799 9800 return null; 9801 } 9802 9803 function updateFromMap(existingChildren, returnFiber, newIdx, newChild, expirationTime) { 9804 if (typeof newChild === 'string' || typeof newChild === 'number') { 9805 // Text nodes don't have keys, so we neither have to check the old nor 9806 // new node for the key. If both are text nodes, they match. 9807 var matchedFiber = existingChildren.get(newIdx) || null; 9808 return updateTextNode(returnFiber, matchedFiber, '' + newChild, expirationTime); 9809 } 9810 9811 if (typeof newChild === 'object' && newChild !== null) { 9812 switch (newChild.$$typeof) { 9813 case REACT_ELEMENT_TYPE: 9814 { 9815 var _matchedFiber = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null; 9816 if (newChild.type === REACT_FRAGMENT_TYPE) { 9817 return updateFragment(returnFiber, _matchedFiber, newChild.props.children, expirationTime, newChild.key); 9818 } 9819 return updateElement(returnFiber, _matchedFiber, newChild, expirationTime); 9820 } 9821 9822 case REACT_CALL_TYPE: 9823 { 9824 var _matchedFiber2 = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null; 9825 return updateCall(returnFiber, _matchedFiber2, newChild, expirationTime); 9826 } 9827 9828 case REACT_RETURN_TYPE: 9829 { 9830 // Returns don't have keys, so we neither have to check the old nor 9831 // new node for the key. If both are returns, they match. 9832 var _matchedFiber3 = existingChildren.get(newIdx) || null; 9833 return updateReturn(returnFiber, _matchedFiber3, newChild, expirationTime); 9834 } 9835 9836 case REACT_PORTAL_TYPE: 9837 { 9838 var _matchedFiber4 = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null; 9839 return updatePortal(returnFiber, _matchedFiber4, newChild, expirationTime); 9840 } 9841 } 9842 9843 if (isArray$1(newChild) || getIteratorFn(newChild)) { 9844 var _matchedFiber5 = existingChildren.get(newIdx) || null; 9845 return updateFragment(returnFiber, _matchedFiber5, newChild, expirationTime, null); 9846 } 9847 9848 throwOnInvalidObjectType(returnFiber, newChild); 9849 } 9850 9851 { 9852 if (typeof newChild === 'function') { 9853 warnOnFunctionType(); 9854 } 9855 } 9856 9857 return null; 9858 } 9859 9860 /** 9861 * Warns if there is a duplicate or missing key 9862 */ 9863 function warnOnInvalidKey(child, knownKeys) { 9864 { 9865 if (typeof child !== 'object' || child === null) { 9866 return knownKeys; 9867 } 9868 switch (child.$$typeof) { 9869 case REACT_ELEMENT_TYPE: 9870 case REACT_CALL_TYPE: 9871 case REACT_PORTAL_TYPE: 9872 warnForMissingKey(child); 9873 var key = child.key; 9874 if (typeof key !== 'string') { 9875 break; 9876 } 9877 if (knownKeys === null) { 9878 knownKeys = new Set(); 9879 knownKeys.add(key); 9880 break; 9881 } 9882 if (!knownKeys.has(key)) { 9883 knownKeys.add(key); 9884 break; 9885 } 9886 warning(false, 'Encountered two children with the same key, `%s`. ' + 'Keys should be unique so that components maintain their identity ' + 'across updates. Non-unique keys may cause children to be ' + 'duplicated and/or omitted — the behavior is unsupported and ' + 'could change in a future version.%s', key, getCurrentFiberStackAddendum$1()); 9887 break; 9888 default: 9889 break; 9890 } 9891 } 9892 return knownKeys; 9893 } 9894 9895 function reconcileChildrenArray(returnFiber, currentFirstChild, newChildren, expirationTime) { 9896 // This algorithm can't optimize by searching from boths ends since we 9897 // don't have backpointers on fibers. I'm trying to see how far we can get 9898 // with that model. If it ends up not being worth the tradeoffs, we can 9899 // add it later. 9900 9901 // Even with a two ended optimization, we'd want to optimize for the case 9902 // where there are few changes and brute force the comparison instead of 9903 // going for the Map. It'd like to explore hitting that path first in 9904 // forward-only mode and only go for the Map once we notice that we need 9905 // lots of look ahead. This doesn't handle reversal as well as two ended 9906 // search but that's unusual. Besides, for the two ended optimization to 9907 // work on Iterables, we'd need to copy the whole set. 9908 9909 // In this first iteration, we'll just live with hitting the bad case 9910 // (adding everything to a Map) in for every insert/move. 9911 9912 // If you change this code, also update reconcileChildrenIterator() which 9913 // uses the same algorithm. 9914 9915 { 9916 // First, validate keys. 9917 var knownKeys = null; 9918 for (var i = 0; i < newChildren.length; i++) { 9919 var child = newChildren[i]; 9920 knownKeys = warnOnInvalidKey(child, knownKeys); 9921 } 9922 } 9923 9924 var resultingFirstChild = null; 9925 var previousNewFiber = null; 9926 9927 var oldFiber = currentFirstChild; 9928 var lastPlacedIndex = 0; 9929 var newIdx = 0; 9930 var nextOldFiber = null; 9931 for (; oldFiber !== null && newIdx < newChildren.length; newIdx++) { 9932 if (oldFiber.index > newIdx) { 9933 nextOldFiber = oldFiber; 9934 oldFiber = null; 9935 } else { 9936 nextOldFiber = oldFiber.sibling; 9937 } 9938 var newFiber = updateSlot(returnFiber, oldFiber, newChildren[newIdx], expirationTime); 9939 if (newFiber === null) { 9940 // TODO: This breaks on empty slots like null children. That's 9941 // unfortunate because it triggers the slow path all the time. We need 9942 // a better way to communicate whether this was a miss or null, 9943 // boolean, undefined, etc. 9944 if (oldFiber === null) { 9945 oldFiber = nextOldFiber; 9946 } 9947 break; 9948 } 9949 if (shouldTrackSideEffects) { 9950 if (oldFiber && newFiber.alternate === null) { 9951 // We matched the slot, but we didn't reuse the existing fiber, so we 9952 // need to delete the existing child. 9953 deleteChild(returnFiber, oldFiber); 9954 } 9955 } 9956 lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx); 9957 if (previousNewFiber === null) { 9958 // TODO: Move out of the loop. This only happens for the first run. 9959 resultingFirstChild = newFiber; 9960 } else { 9961 // TODO: Defer siblings if we're not at the right index for this slot. 9962 // I.e. if we had null values before, then we want to defer this 9963 // for each null value. However, we also don't want to call updateSlot 9964 // with the previous one. 9965 previousNewFiber.sibling = newFiber; 9966 } 9967 previousNewFiber = newFiber; 9968 oldFiber = nextOldFiber; 9969 } 9970 9971 if (newIdx === newChildren.length) { 9972 // We've reached the end of the new children. We can delete the rest. 9973 deleteRemainingChildren(returnFiber, oldFiber); 9974 return resultingFirstChild; 9975 } 9976 9977 if (oldFiber === null) { 9978 // If we don't have any more existing children we can choose a fast path 9979 // since the rest will all be insertions. 9980 for (; newIdx < newChildren.length; newIdx++) { 9981 var _newFiber = createChild(returnFiber, newChildren[newIdx], expirationTime); 9982 if (!_newFiber) { 9983 continue; 9984 } 9985 lastPlacedIndex = placeChild(_newFiber, lastPlacedIndex, newIdx); 9986 if (previousNewFiber === null) { 9987 // TODO: Move out of the loop. This only happens for the first run. 9988 resultingFirstChild = _newFiber; 9989 } else { 9990 previousNewFiber.sibling = _newFiber; 9991 } 9992 previousNewFiber = _newFiber; 9993 } 9994 return resultingFirstChild; 9995 } 9996 9997 // Add all children to a key map for quick lookups. 9998 var existingChildren = mapRemainingChildren(returnFiber, oldFiber); 9999 10000 // Keep scanning and use the map to restore deleted items as moves. 10001 for (; newIdx < newChildren.length; newIdx++) { 10002 var _newFiber2 = updateFromMap(existingChildren, returnFiber, newIdx, newChildren[newIdx], expirationTime); 10003 if (_newFiber2) { 10004 if (shouldTrackSideEffects) { 10005 if (_newFiber2.alternate !== null) { 10006 // The new fiber is a work in progress, but if there exists a 10007 // current, that means that we reused the fiber. We need to delete 10008 // it from the child list so that we don't add it to the deletion 10009 // list. 10010 existingChildren['delete'](_newFiber2.key === null ? newIdx : _newFiber2.key); 10011 } 10012 } 10013 lastPlacedIndex = placeChild(_newFiber2, lastPlacedIndex, newIdx); 10014 if (previousNewFiber === null) { 10015 resultingFirstChild = _newFiber2; 10016 } else { 10017 previousNewFiber.sibling = _newFiber2; 10018 } 10019 previousNewFiber = _newFiber2; 10020 } 10021 } 10022 10023 if (shouldTrackSideEffects) { 10024 // Any existing children that weren't consumed above were deleted. We need 10025 // to add them to the deletion list. 10026 existingChildren.forEach(function (child) { 10027 return deleteChild(returnFiber, child); 10028 }); 10029 } 10030 10031 return resultingFirstChild; 10032 } 10033 10034 function reconcileChildrenIterator(returnFiber, currentFirstChild, newChildrenIterable, expirationTime) { 10035 // This is the same implementation as reconcileChildrenArray(), 10036 // but using the iterator instead. 10037 10038 var iteratorFn = getIteratorFn(newChildrenIterable); 10039 !(typeof iteratorFn === 'function') ? invariant(false, 'An object is not an iterable. This error is likely caused by a bug in React. Please file an issue.') : void 0; 10040 10041 { 10042 // Warn about using Maps as children 10043 if (typeof newChildrenIterable.entries === 'function') { 10044 var possibleMap = newChildrenIterable; 10045 if (possibleMap.entries === iteratorFn) { 10046 warning(didWarnAboutMaps, 'Using Maps as children is unsupported and will likely yield ' + 'unexpected results. Convert it to a sequence/iterable of keyed ' + 'ReactElements instead.%s', getCurrentFiberStackAddendum$1()); 10047 didWarnAboutMaps = true; 10048 } 10049 } 10050 10051 // First, validate keys. 10052 // We'll get a different iterator later for the main pass. 10053 var _newChildren = iteratorFn.call(newChildrenIterable); 10054 if (_newChildren) { 10055 var knownKeys = null; 10056 var _step = _newChildren.next(); 10057 for (; !_step.done; _step = _newChildren.next()) { 10058 var child = _step.value; 10059 knownKeys = warnOnInvalidKey(child, knownKeys); 10060 } 10061 } 10062 } 10063 10064 var newChildren = iteratorFn.call(newChildrenIterable); 10065 !(newChildren != null) ? invariant(false, 'An iterable object provided no iterator.') : void 0; 10066 10067 var resultingFirstChild = null; 10068 var previousNewFiber = null; 10069 10070 var oldFiber = currentFirstChild; 10071 var lastPlacedIndex = 0; 10072 var newIdx = 0; 10073 var nextOldFiber = null; 10074 10075 var step = newChildren.next(); 10076 for (; oldFiber !== null && !step.done; newIdx++, step = newChildren.next()) { 10077 if (oldFiber.index > newIdx) { 10078 nextOldFiber = oldFiber; 10079 oldFiber = null; 10080 } else { 10081 nextOldFiber = oldFiber.sibling; 10082 } 10083 var newFiber = updateSlot(returnFiber, oldFiber, step.value, expirationTime); 10084 if (newFiber === null) { 10085 // TODO: This breaks on empty slots like null children. That's 10086 // unfortunate because it triggers the slow path all the time. We need 10087 // a better way to communicate whether this was a miss or null, 10088 // boolean, undefined, etc. 10089 if (!oldFiber) { 10090 oldFiber = nextOldFiber; 10091 } 10092 break; 10093 } 10094 if (shouldTrackSideEffects) { 10095 if (oldFiber && newFiber.alternate === null) { 10096 // We matched the slot, but we didn't reuse the existing fiber, so we 10097 // need to delete the existing child. 10098 deleteChild(returnFiber, oldFiber); 10099 } 10100 } 10101 lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx); 10102 if (previousNewFiber === null) { 10103 // TODO: Move out of the loop. This only happens for the first run. 10104 resultingFirstChild = newFiber; 10105 } else { 10106 // TODO: Defer siblings if we're not at the right index for this slot. 10107 // I.e. if we had null values before, then we want to defer this 10108 // for each null value. However, we also don't want to call updateSlot 10109 // with the previous one. 10110 previousNewFiber.sibling = newFiber; 10111 } 10112 previousNewFiber = newFiber; 10113 oldFiber = nextOldFiber; 10114 } 10115 10116 if (step.done) { 10117 // We've reached the end of the new children. We can delete the rest. 10118 deleteRemainingChildren(returnFiber, oldFiber); 10119 return resultingFirstChild; 10120 } 10121 10122 if (oldFiber === null) { 10123 // If we don't have any more existing children we can choose a fast path 10124 // since the rest will all be insertions. 10125 for (; !step.done; newIdx++, step = newChildren.next()) { 10126 var _newFiber3 = createChild(returnFiber, step.value, expirationTime); 10127 if (_newFiber3 === null) { 10128 continue; 10129 } 10130 lastPlacedIndex = placeChild(_newFiber3, lastPlacedIndex, newIdx); 10131 if (previousNewFiber === null) { 10132 // TODO: Move out of the loop. This only happens for the first run. 10133 resultingFirstChild = _newFiber3; 10134 } else { 10135 previousNewFiber.sibling = _newFiber3; 10136 } 10137 previousNewFiber = _newFiber3; 10138 } 10139 return resultingFirstChild; 10140 } 10141 10142 // Add all children to a key map for quick lookups. 10143 var existingChildren = mapRemainingChildren(returnFiber, oldFiber); 10144 10145 // Keep scanning and use the map to restore deleted items as moves. 10146 for (; !step.done; newIdx++, step = newChildren.next()) { 10147 var _newFiber4 = updateFromMap(existingChildren, returnFiber, newIdx, step.value, expirationTime); 10148 if (_newFiber4 !== null) { 10149 if (shouldTrackSideEffects) { 10150 if (_newFiber4.alternate !== null) { 10151 // The new fiber is a work in progress, but if there exists a 10152 // current, that means that we reused the fiber. We need to delete 10153 // it from the child list so that we don't add it to the deletion 10154 // list. 10155 existingChildren['delete'](_newFiber4.key === null ? newIdx : _newFiber4.key); 10156 } 10157 } 10158 lastPlacedIndex = placeChild(_newFiber4, lastPlacedIndex, newIdx); 10159 if (previousNewFiber === null) { 10160 resultingFirstChild = _newFiber4; 10161 } else { 10162 previousNewFiber.sibling = _newFiber4; 10163 } 10164 previousNewFiber = _newFiber4; 10165 } 10166 } 10167 10168 if (shouldTrackSideEffects) { 10169 // Any existing children that weren't consumed above were deleted. We need 10170 // to add them to the deletion list. 10171 existingChildren.forEach(function (child) { 10172 return deleteChild(returnFiber, child); 10173 }); 10174 } 10175 10176 return resultingFirstChild; 10177 } 10178 10179 function reconcileSingleTextNode(returnFiber, currentFirstChild, textContent, expirationTime) { 10180 // There's no need to check for keys on text nodes since we don't have a 10181 // way to define them. 10182 if (currentFirstChild !== null && currentFirstChild.tag === HostText) { 10183 // We already have an existing node so let's just update it and delete 10184 // the rest. 10185 deleteRemainingChildren(returnFiber, currentFirstChild.sibling); 10186 var existing = useFiber(currentFirstChild, textContent, expirationTime); 10187 existing['return'] = returnFiber; 10188 return existing; 10189 } 10190 // The existing first child is not a text node so we need to create one 10191 // and delete the existing ones. 10192 deleteRemainingChildren(returnFiber, currentFirstChild); 10193 var created = createFiberFromText(textContent, returnFiber.internalContextTag, expirationTime); 10194 created['return'] = returnFiber; 10195 return created; 10196 } 10197 10198 function reconcileSingleElement(returnFiber, currentFirstChild, element, expirationTime) { 10199 var key = element.key; 10200 var child = currentFirstChild; 10201 while (child !== null) { 10202 // TODO: If key === null and child.key === null, then this only applies to 10203 // the first item in the list. 10204 if (child.key === key) { 10205 if (child.tag === Fragment ? element.type === REACT_FRAGMENT_TYPE : child.type === element.type) { 10206 deleteRemainingChildren(returnFiber, child.sibling); 10207 var existing = useFiber(child, element.type === REACT_FRAGMENT_TYPE ? element.props.children : element.props, expirationTime); 10208 existing.ref = coerceRef(child, element); 10209 existing['return'] = returnFiber; 10210 { 10211 existing._debugSource = element._source; 10212 existing._debugOwner = element._owner; 10213 } 10214 return existing; 10215 } else { 10216 deleteRemainingChildren(returnFiber, child); 10217 break; 10218 } 10219 } else { 10220 deleteChild(returnFiber, child); 10221 } 10222 child = child.sibling; 10223 } 10224 10225 if (element.type === REACT_FRAGMENT_TYPE) { 10226 var created = createFiberFromFragment(element.props.children, returnFiber.internalContextTag, expirationTime, element.key); 10227 created['return'] = returnFiber; 10228 return created; 10229 } else { 10230 var _created7 = createFiberFromElement(element, returnFiber.internalContextTag, expirationTime); 10231 _created7.ref = coerceRef(currentFirstChild, element); 10232 _created7['return'] = returnFiber; 10233 return _created7; 10234 } 10235 } 10236 10237 function reconcileSingleCall(returnFiber, currentFirstChild, call, expirationTime) { 10238 var key = call.key; 10239 var child = currentFirstChild; 10240 while (child !== null) { 10241 // TODO: If key === null and child.key === null, then this only applies to 10242 // the first item in the list. 10243 if (child.key === key) { 10244 if (child.tag === CallComponent) { 10245 deleteRemainingChildren(returnFiber, child.sibling); 10246 var existing = useFiber(child, call, expirationTime); 10247 existing['return'] = returnFiber; 10248 return existing; 10249 } else { 10250 deleteRemainingChildren(returnFiber, child); 10251 break; 10252 } 10253 } else { 10254 deleteChild(returnFiber, child); 10255 } 10256 child = child.sibling; 10257 } 10258 10259 var created = createFiberFromCall(call, returnFiber.internalContextTag, expirationTime); 10260 created['return'] = returnFiber; 10261 return created; 10262 } 10263 10264 function reconcileSingleReturn(returnFiber, currentFirstChild, returnNode, expirationTime) { 10265 // There's no need to check for keys on yields since they're stateless. 10266 var child = currentFirstChild; 10267 if (child !== null) { 10268 if (child.tag === ReturnComponent) { 10269 deleteRemainingChildren(returnFiber, child.sibling); 10270 var existing = useFiber(child, null, expirationTime); 10271 existing.type = returnNode.value; 10272 existing['return'] = returnFiber; 10273 return existing; 10274 } else { 10275 deleteRemainingChildren(returnFiber, child); 10276 } 10277 } 10278 10279 var created = createFiberFromReturn(returnNode, returnFiber.internalContextTag, expirationTime); 10280 created.type = returnNode.value; 10281 created['return'] = returnFiber; 10282 return created; 10283 } 10284 10285 function reconcileSinglePortal(returnFiber, currentFirstChild, portal, expirationTime) { 10286 var key = portal.key; 10287 var child = currentFirstChild; 10288 while (child !== null) { 10289 // TODO: If key === null and child.key === null, then this only applies to 10290 // the first item in the list. 10291 if (child.key === key) { 10292 if (child.tag === HostPortal && child.stateNode.containerInfo === portal.containerInfo && child.stateNode.implementation === portal.implementation) { 10293 deleteRemainingChildren(returnFiber, child.sibling); 10294 var existing = useFiber(child, portal.children || [], expirationTime); 10295 existing['return'] = returnFiber; 10296 return existing; 10297 } else { 10298 deleteRemainingChildren(returnFiber, child); 10299 break; 10300 } 10301 } else { 10302 deleteChild(returnFiber, child); 10303 } 10304 child = child.sibling; 10305 } 10306 10307 var created = createFiberFromPortal(portal, returnFiber.internalContextTag, expirationTime); 10308 created['return'] = returnFiber; 10309 return created; 10310 } 10311 10312 // This API will tag the children with the side-effect of the reconciliation 10313 // itself. They will be added to the side-effect list as we pass through the 10314 // children and the parent. 10315 function reconcileChildFibers(returnFiber, currentFirstChild, newChild, expirationTime) { 10316 // This function is not recursive. 10317 // If the top level item is an array, we treat it as a set of children, 10318 // not as a fragment. Nested arrays on the other hand will be treated as 10319 // fragment nodes. Recursion happens at the normal flow. 10320 10321 // Handle top level unkeyed fragments as if they were arrays. 10322 // This leads to an ambiguity between <>{[...]}</> and <>...</>. 10323 // We treat the ambiguous cases above the same. 10324 if (typeof newChild === 'object' && newChild !== null && newChild.type === REACT_FRAGMENT_TYPE && newChild.key === null) { 10325 newChild = newChild.props.children; 10326 } 10327 10328 // Handle object types 10329 var isObject = typeof newChild === 'object' && newChild !== null; 10330 10331 if (isObject) { 10332 switch (newChild.$$typeof) { 10333 case REACT_ELEMENT_TYPE: 10334 return placeSingleChild(reconcileSingleElement(returnFiber, currentFirstChild, newChild, expirationTime)); 10335 10336 case REACT_CALL_TYPE: 10337 return placeSingleChild(reconcileSingleCall(returnFiber, currentFirstChild, newChild, expirationTime)); 10338 case REACT_RETURN_TYPE: 10339 return placeSingleChild(reconcileSingleReturn(returnFiber, currentFirstChild, newChild, expirationTime)); 10340 case REACT_PORTAL_TYPE: 10341 return placeSingleChild(reconcileSinglePortal(returnFiber, currentFirstChild, newChild, expirationTime)); 10342 } 10343 } 10344 10345 if (typeof newChild === 'string' || typeof newChild === 'number') { 10346 return placeSingleChild(reconcileSingleTextNode(returnFiber, currentFirstChild, '' + newChild, expirationTime)); 10347 } 10348 10349 if (isArray$1(newChild)) { 10350 return reconcileChildrenArray(returnFiber, currentFirstChild, newChild, expirationTime); 10351 } 10352 10353 if (getIteratorFn(newChild)) { 10354 return reconcileChildrenIterator(returnFiber, currentFirstChild, newChild, expirationTime); 10355 } 10356 10357 if (isObject) { 10358 throwOnInvalidObjectType(returnFiber, newChild); 10359 } 10360 10361 { 10362 if (typeof newChild === 'function') { 10363 warnOnFunctionType(); 10364 } 10365 } 10366 if (typeof newChild === 'undefined') { 10367 // If the new child is undefined, and the return fiber is a composite 10368 // component, throw an error. If Fiber return types are disabled, 10369 // we already threw above. 10370 switch (returnFiber.tag) { 10371 case ClassComponent: 10372 { 10373 { 10374 var instance = returnFiber.stateNode; 10375 if (instance.render._isMockFunction) { 10376 // We allow auto-mocks to proceed as if they're returning null. 10377 break; 10378 } 10379 } 10380 } 10381 // Intentionally fall through to the next case, which handles both 10382 // functions and classes 10383 // eslint-disable-next-lined no-fallthrough 10384 case FunctionalComponent: 10385 { 10386 var Component = returnFiber.type; 10387 invariant(false, '%s(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.', Component.displayName || Component.name || 'Component'); 10388 } 10389 } 10390 } 10391 10392 // Remaining cases are all treated as empty. 10393 return deleteRemainingChildren(returnFiber, currentFirstChild); 10394 } 10395 10396 return reconcileChildFibers; 10397 } 10398 10399 var reconcileChildFibers = ChildReconciler(true); 10400 var mountChildFibers = ChildReconciler(false); 10401 10402 function cloneChildFibers(current, workInProgress) { 10403 !(current === null || workInProgress.child === current.child) ? invariant(false, 'Resuming work not yet implemented.') : void 0; 10404 10405 if (workInProgress.child === null) { 10406 return; 10407 } 10408 10409 var currentChild = workInProgress.child; 10410 var newChild = createWorkInProgress(currentChild, currentChild.pendingProps, currentChild.expirationTime); 10411 workInProgress.child = newChild; 10412 10413 newChild['return'] = workInProgress; 10414 while (currentChild.sibling !== null) { 10415 currentChild = currentChild.sibling; 10416 newChild = newChild.sibling = createWorkInProgress(currentChild, currentChild.pendingProps, currentChild.expirationTime); 10417 newChild['return'] = workInProgress; 10418 } 10419 newChild.sibling = null; 10420 } 10421 10422 { 10423 var warnedAboutStatelessRefs = {}; 10424 } 10425 10426 var ReactFiberBeginWork = function (config, hostContext, hydrationContext, scheduleWork, computeExpirationForFiber) { 10427 var shouldSetTextContent = config.shouldSetTextContent, 10428 useSyncScheduling = config.useSyncScheduling, 10429 shouldDeprioritizeSubtree = config.shouldDeprioritizeSubtree; 10430 var pushHostContext = hostContext.pushHostContext, 10431 pushHostContainer = hostContext.pushHostContainer; 10432 var enterHydrationState = hydrationContext.enterHydrationState, 10433 resetHydrationState = hydrationContext.resetHydrationState, 10434 tryToClaimNextHydratableInstance = hydrationContext.tryToClaimNextHydratableInstance; 10435 10436 var _ReactFiberClassCompo = ReactFiberClassComponent(scheduleWork, computeExpirationForFiber, memoizeProps, memoizeState), 10437 adoptClassInstance = _ReactFiberClassCompo.adoptClassInstance, 10438 constructClassInstance = _ReactFiberClassCompo.constructClassInstance, 10439 mountClassInstance = _ReactFiberClassCompo.mountClassInstance, 10440 updateClassInstance = _ReactFiberClassCompo.updateClassInstance; 10441 10442 // TODO: Remove this and use reconcileChildrenAtExpirationTime directly. 10443 10444 10445 function reconcileChildren(current, workInProgress, nextChildren) { 10446 reconcileChildrenAtExpirationTime(current, workInProgress, nextChildren, workInProgress.expirationTime); 10447 } 10448 10449 function reconcileChildrenAtExpirationTime(current, workInProgress, nextChildren, renderExpirationTime) { 10450 if (current === null) { 10451 // If this is a fresh new component that hasn't been rendered yet, we 10452 // won't update its child set by applying minimal side-effects. Instead, 10453 // we will add them all to the child before it gets rendered. That means 10454 // we can optimize this reconciliation pass by not tracking side-effects. 10455 workInProgress.child = mountChildFibers(workInProgress, null, nextChildren, renderExpirationTime); 10456 } else { 10457 // If the current child is the same as the work in progress, it means that 10458 // we haven't yet started any work on these children. Therefore, we use 10459 // the clone algorithm to create a copy of all the current children. 10460 10461 // If we had any progressed work already, that is invalid at this point so 10462 // let's throw it out. 10463 workInProgress.child = reconcileChildFibers(workInProgress, current.child, nextChildren, renderExpirationTime); 10464 } 10465 } 10466 10467 function updateFragment(current, workInProgress) { 10468 var nextChildren = workInProgress.pendingProps; 10469 if (hasContextChanged()) { 10470 // Normally we can bail out on props equality but if context has changed 10471 // we don't do the bailout and we have to reuse existing props instead. 10472 if (nextChildren === null) { 10473 nextChildren = workInProgress.memoizedProps; 10474 } 10475 } else if (nextChildren === null || workInProgress.memoizedProps === nextChildren) { 10476 return bailoutOnAlreadyFinishedWork(current, workInProgress); 10477 } 10478 reconcileChildren(current, workInProgress, nextChildren); 10479 memoizeProps(workInProgress, nextChildren); 10480 return workInProgress.child; 10481 } 10482 10483 function markRef(current, workInProgress) { 10484 var ref = workInProgress.ref; 10485 if (ref !== null && (!current || current.ref !== ref)) { 10486 // Schedule a Ref effect 10487 workInProgress.effectTag |= Ref; 10488 } 10489 } 10490 10491 function updateFunctionalComponent(current, workInProgress) { 10492 var fn = workInProgress.type; 10493 var nextProps = workInProgress.pendingProps; 10494 10495 var memoizedProps = workInProgress.memoizedProps; 10496 if (hasContextChanged()) { 10497 // Normally we can bail out on props equality but if context has changed 10498 // we don't do the bailout and we have to reuse existing props instead. 10499 if (nextProps === null) { 10500 nextProps = memoizedProps; 10501 } 10502 } else { 10503 if (nextProps === null || memoizedProps === nextProps) { 10504 return bailoutOnAlreadyFinishedWork(current, workInProgress); 10505 } 10506 // TODO: consider bringing fn.shouldComponentUpdate() back. 10507 // It used to be here. 10508 } 10509 10510 var unmaskedContext = getUnmaskedContext(workInProgress); 10511 var context = getMaskedContext(workInProgress, unmaskedContext); 10512 10513 var nextChildren; 10514 10515 { 10516 ReactCurrentOwner.current = workInProgress; 10517 ReactDebugCurrentFiber.setCurrentPhase('render'); 10518 nextChildren = fn(nextProps, context); 10519 ReactDebugCurrentFiber.setCurrentPhase(null); 10520 } 10521 // React DevTools reads this flag. 10522 workInProgress.effectTag |= PerformedWork; 10523 reconcileChildren(current, workInProgress, nextChildren); 10524 memoizeProps(workInProgress, nextProps); 10525 return workInProgress.child; 10526 } 10527 10528 function updateClassComponent(current, workInProgress, renderExpirationTime) { 10529 // Push context providers early to prevent context stack mismatches. 10530 // During mounting we don't know the child context yet as the instance doesn't exist. 10531 // We will invalidate the child context in finishClassComponent() right after rendering. 10532 var hasContext = pushContextProvider(workInProgress); 10533 10534 var shouldUpdate = void 0; 10535 if (current === null) { 10536 if (!workInProgress.stateNode) { 10537 // In the initial pass we might need to construct the instance. 10538 constructClassInstance(workInProgress, workInProgress.pendingProps); 10539 mountClassInstance(workInProgress, renderExpirationTime); 10540 shouldUpdate = true; 10541 } else { 10542 invariant(false, 'Resuming work not yet implemented.'); 10543 // In a resume, we'll already have an instance we can reuse. 10544 // shouldUpdate = resumeMountClassInstance(workInProgress, renderExpirationTime); 10545 } 10546 } else { 10547 shouldUpdate = updateClassInstance(current, workInProgress, renderExpirationTime); 10548 } 10549 return finishClassComponent(current, workInProgress, shouldUpdate, hasContext); 10550 } 10551 10552 function finishClassComponent(current, workInProgress, shouldUpdate, hasContext) { 10553 // Refs should update even if shouldComponentUpdate returns false 10554 markRef(current, workInProgress); 10555 10556 if (!shouldUpdate) { 10557 // Context providers should defer to sCU for rendering 10558 if (hasContext) { 10559 invalidateContextProvider(workInProgress, false); 10560 } 10561 10562 return bailoutOnAlreadyFinishedWork(current, workInProgress); 10563 } 10564 10565 var instance = workInProgress.stateNode; 10566 10567 // Rerender 10568 ReactCurrentOwner.current = workInProgress; 10569 var nextChildren = void 0; 10570 { 10571 ReactDebugCurrentFiber.setCurrentPhase('render'); 10572 nextChildren = instance.render(); 10573 if (debugRenderPhaseSideEffects) { 10574 instance.render(); 10575 } 10576 ReactDebugCurrentFiber.setCurrentPhase(null); 10577 } 10578 // React DevTools reads this flag. 10579 workInProgress.effectTag |= PerformedWork; 10580 reconcileChildren(current, workInProgress, nextChildren); 10581 // Memoize props and state using the values we just used to render. 10582 // TODO: Restructure so we never read values from the instance. 10583 memoizeState(workInProgress, instance.state); 10584 memoizeProps(workInProgress, instance.props); 10585 10586 // The context might have changed so we need to recalculate it. 10587 if (hasContext) { 10588 invalidateContextProvider(workInProgress, true); 10589 } 10590 10591 return workInProgress.child; 10592 } 10593 10594 function pushHostRootContext(workInProgress) { 10595 var root = workInProgress.stateNode; 10596 if (root.pendingContext) { 10597 pushTopLevelContextObject(workInProgress, root.pendingContext, root.pendingContext !== root.context); 10598 } else if (root.context) { 10599 // Should always be set 10600 pushTopLevelContextObject(workInProgress, root.context, false); 10601 } 10602 pushHostContainer(workInProgress, root.containerInfo); 10603 } 10604 10605 function updateHostRoot(current, workInProgress, renderExpirationTime) { 10606 pushHostRootContext(workInProgress); 10607 var updateQueue = workInProgress.updateQueue; 10608 if (updateQueue !== null) { 10609 var prevState = workInProgress.memoizedState; 10610 var state = processUpdateQueue(current, workInProgress, updateQueue, null, null, renderExpirationTime); 10611 if (prevState === state) { 10612 // If the state is the same as before, that's a bailout because we had 10613 // no work that expires at this time. 10614 resetHydrationState(); 10615 return bailoutOnAlreadyFinishedWork(current, workInProgress); 10616 } 10617 var element = state.element; 10618 var root = workInProgress.stateNode; 10619 if ((current === null || current.child === null) && root.hydrate && enterHydrationState(workInProgress)) { 10620 // If we don't have any current children this might be the first pass. 10621 // We always try to hydrate. If this isn't a hydration pass there won't 10622 // be any children to hydrate which is effectively the same thing as 10623 // not hydrating. 10624 10625 // This is a bit of a hack. We track the host root as a placement to 10626 // know that we're currently in a mounting state. That way isMounted 10627 // works as expected. We must reset this before committing. 10628 // TODO: Delete this when we delete isMounted and findDOMNode. 10629 workInProgress.effectTag |= Placement; 10630 10631 // Ensure that children mount into this root without tracking 10632 // side-effects. This ensures that we don't store Placement effects on 10633 // nodes that will be hydrated. 10634 workInProgress.child = mountChildFibers(workInProgress, null, element, renderExpirationTime); 10635 } else { 10636 // Otherwise reset hydration state in case we aborted and resumed another 10637 // root. 10638 resetHydrationState(); 10639 reconcileChildren(current, workInProgress, element); 10640 } 10641 memoizeState(workInProgress, state); 10642 return workInProgress.child; 10643 } 10644 resetHydrationState(); 10645 // If there is no update queue, that's a bailout because the root has no props. 10646 return bailoutOnAlreadyFinishedWork(current, workInProgress); 10647 } 10648 10649 function updateHostComponent(current, workInProgress, renderExpirationTime) { 10650 pushHostContext(workInProgress); 10651 10652 if (current === null) { 10653 tryToClaimNextHydratableInstance(workInProgress); 10654 } 10655 10656 var type = workInProgress.type; 10657 var memoizedProps = workInProgress.memoizedProps; 10658 var nextProps = workInProgress.pendingProps; 10659 if (nextProps === null) { 10660 nextProps = memoizedProps; 10661 !(nextProps !== null) ? invariant(false, 'We should always have pending or current props. This error is likely caused by a bug in React. Please file an issue.') : void 0; 10662 } 10663 var prevProps = current !== null ? current.memoizedProps : null; 10664 10665 if (hasContextChanged()) { 10666 // Normally we can bail out on props equality but if context has changed 10667 // we don't do the bailout and we have to reuse existing props instead. 10668 } else if (nextProps === null || memoizedProps === nextProps) { 10669 return bailoutOnAlreadyFinishedWork(current, workInProgress); 10670 } 10671 10672 var nextChildren = nextProps.children; 10673 var isDirectTextChild = shouldSetTextContent(type, nextProps); 10674 10675 if (isDirectTextChild) { 10676 // We special case a direct text child of a host node. This is a common 10677 // case. We won't handle it as a reified child. We will instead handle 10678 // this in the host environment that also have access to this prop. That 10679 // avoids allocating another HostText fiber and traversing it. 10680 nextChildren = null; 10681 } else if (prevProps && shouldSetTextContent(type, prevProps)) { 10682 // If we're switching from a direct text child to a normal child, or to 10683 // empty, we need to schedule the text content to be reset. 10684 workInProgress.effectTag |= ContentReset; 10685 } 10686 10687 markRef(current, workInProgress); 10688 10689 // Check the host config to see if the children are offscreen/hidden. 10690 if (renderExpirationTime !== Never && !useSyncScheduling && shouldDeprioritizeSubtree(type, nextProps)) { 10691 // Down-prioritize the children. 10692 workInProgress.expirationTime = Never; 10693 // Bailout and come back to this fiber later. 10694 return null; 10695 } 10696 10697 reconcileChildren(current, workInProgress, nextChildren); 10698 memoizeProps(workInProgress, nextProps); 10699 return workInProgress.child; 10700 } 10701 10702 function updateHostText(current, workInProgress) { 10703 if (current === null) { 10704 tryToClaimNextHydratableInstance(workInProgress); 10705 } 10706 var nextProps = workInProgress.pendingProps; 10707 if (nextProps === null) { 10708 nextProps = workInProgress.memoizedProps; 10709 } 10710 memoizeProps(workInProgress, nextProps); 10711 // Nothing to do here. This is terminal. We'll do the completion step 10712 // immediately after. 10713 return null; 10714 } 10715 10716 function mountIndeterminateComponent(current, workInProgress, renderExpirationTime) { 10717 !(current === null) ? invariant(false, 'An indeterminate component should never have mounted. This error is likely caused by a bug in React. Please file an issue.') : void 0; 10718 var fn = workInProgress.type; 10719 var props = workInProgress.pendingProps; 10720 var unmaskedContext = getUnmaskedContext(workInProgress); 10721 var context = getMaskedContext(workInProgress, unmaskedContext); 10722 10723 var value; 10724 10725 { 10726 if (fn.prototype && typeof fn.prototype.render === 'function') { 10727 var componentName = getComponentName(workInProgress); 10728 warning(false, "The <%s /> component appears to have a render method, but doesn't extend React.Component. " + 'This is likely to cause errors. Change %s to extend React.Component instead.', componentName, componentName); 10729 } 10730 ReactCurrentOwner.current = workInProgress; 10731 value = fn(props, context); 10732 } 10733 // React DevTools reads this flag. 10734 workInProgress.effectTag |= PerformedWork; 10735 10736 if (typeof value === 'object' && value !== null && typeof value.render === 'function') { 10737 // Proceed under the assumption that this is a class instance 10738 workInProgress.tag = ClassComponent; 10739 10740 // Push context providers early to prevent context stack mismatches. 10741 // During mounting we don't know the child context yet as the instance doesn't exist. 10742 // We will invalidate the child context in finishClassComponent() right after rendering. 10743 var hasContext = pushContextProvider(workInProgress); 10744 adoptClassInstance(workInProgress, value); 10745 mountClassInstance(workInProgress, renderExpirationTime); 10746 return finishClassComponent(current, workInProgress, true, hasContext); 10747 } else { 10748 // Proceed under the assumption that this is a functional component 10749 workInProgress.tag = FunctionalComponent; 10750 { 10751 var Component = workInProgress.type; 10752 10753 if (Component) { 10754 warning(!Component.childContextTypes, '%s(...): childContextTypes cannot be defined on a functional component.', Component.displayName || Component.name || 'Component'); 10755 } 10756 if (workInProgress.ref !== null) { 10757 var info = ''; 10758 var ownerName = ReactDebugCurrentFiber.getCurrentFiberOwnerName(); 10759 if (ownerName) { 10760 info += '\n\nCheck the render method of `' + ownerName + '`.'; 10761 } 10762 10763 var warningKey = ownerName || workInProgress._debugID || ''; 10764 var debugSource = workInProgress._debugSource; 10765 if (debugSource) { 10766 warningKey = debugSource.fileName + ':' + debugSource.lineNumber; 10767 } 10768 if (!warnedAboutStatelessRefs[warningKey]) { 10769 warnedAboutStatelessRefs[warningKey] = true; 10770 warning(false, 'Stateless function components cannot be given refs. ' + 'Attempts to access this ref will fail.%s%s', info, ReactDebugCurrentFiber.getCurrentFiberStackAddendum()); 10771 } 10772 } 10773 } 10774 reconcileChildren(current, workInProgress, value); 10775 memoizeProps(workInProgress, props); 10776 return workInProgress.child; 10777 } 10778 } 10779 10780 function updateCallComponent(current, workInProgress, renderExpirationTime) { 10781 var nextCall = workInProgress.pendingProps; 10782 if (hasContextChanged()) { 10783 // Normally we can bail out on props equality but if context has changed 10784 // we don't do the bailout and we have to reuse existing props instead. 10785 if (nextCall === null) { 10786 nextCall = current && current.memoizedProps; 10787 !(nextCall !== null) ? invariant(false, 'We should always have pending or current props. This error is likely caused by a bug in React. Please file an issue.') : void 0; 10788 } 10789 } else if (nextCall === null || workInProgress.memoizedProps === nextCall) { 10790 nextCall = workInProgress.memoizedProps; 10791 // TODO: When bailing out, we might need to return the stateNode instead 10792 // of the child. To check it for work. 10793 // return bailoutOnAlreadyFinishedWork(current, workInProgress); 10794 } 10795 10796 var nextChildren = nextCall.children; 10797 10798 // The following is a fork of reconcileChildrenAtExpirationTime but using 10799 // stateNode to store the child. 10800 if (current === null) { 10801 workInProgress.stateNode = mountChildFibers(workInProgress, workInProgress.stateNode, nextChildren, renderExpirationTime); 10802 } else { 10803 workInProgress.stateNode = reconcileChildFibers(workInProgress, workInProgress.stateNode, nextChildren, renderExpirationTime); 10804 } 10805 10806 memoizeProps(workInProgress, nextCall); 10807 // This doesn't take arbitrary time so we could synchronously just begin 10808 // eagerly do the work of workInProgress.child as an optimization. 10809 return workInProgress.stateNode; 10810 } 10811 10812 function updatePortalComponent(current, workInProgress, renderExpirationTime) { 10813 pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo); 10814 var nextChildren = workInProgress.pendingProps; 10815 if (hasContextChanged()) { 10816 // Normally we can bail out on props equality but if context has changed 10817 // we don't do the bailout and we have to reuse existing props instead. 10818 if (nextChildren === null) { 10819 nextChildren = current && current.memoizedProps; 10820 !(nextChildren != null) ? invariant(false, 'We should always have pending or current props. This error is likely caused by a bug in React. Please file an issue.') : void 0; 10821 } 10822 } else if (nextChildren === null || workInProgress.memoizedProps === nextChildren) { 10823 return bailoutOnAlreadyFinishedWork(current, workInProgress); 10824 } 10825 10826 if (current === null) { 10827 // Portals are special because we don't append the children during mount 10828 // but at commit. Therefore we need to track insertions which the normal 10829 // flow doesn't do during mount. This doesn't happen at the root because 10830 // the root always starts with a "current" with a null child. 10831 // TODO: Consider unifying this with how the root works. 10832 workInProgress.child = reconcileChildFibers(workInProgress, null, nextChildren, renderExpirationTime); 10833 memoizeProps(workInProgress, nextChildren); 10834 } else { 10835 reconcileChildren(current, workInProgress, nextChildren); 10836 memoizeProps(workInProgress, nextChildren); 10837 } 10838 return workInProgress.child; 10839 } 10840 10841 /* 10842 function reuseChildrenEffects(returnFiber : Fiber, firstChild : Fiber) { 10843 let child = firstChild; 10844 do { 10845 // Ensure that the first and last effect of the parent corresponds 10846 // to the children's first and last effect. 10847 if (!returnFiber.firstEffect) { 10848 returnFiber.firstEffect = child.firstEffect; 10849 } 10850 if (child.lastEffect) { 10851 if (returnFiber.lastEffect) { 10852 returnFiber.lastEffect.nextEffect = child.firstEffect; 10853 } 10854 returnFiber.lastEffect = child.lastEffect; 10855 } 10856 } while (child = child.sibling); 10857 } 10858 */ 10859 10860 function bailoutOnAlreadyFinishedWork(current, workInProgress) { 10861 cancelWorkTimer(workInProgress); 10862 10863 // TODO: We should ideally be able to bail out early if the children have no 10864 // more work to do. However, since we don't have a separation of this 10865 // Fiber's priority and its children yet - we don't know without doing lots 10866 // of the same work we do anyway. Once we have that separation we can just 10867 // bail out here if the children has no more work at this priority level. 10868 // if (workInProgress.priorityOfChildren <= priorityLevel) { 10869 // // If there are side-effects in these children that have not yet been 10870 // // committed we need to ensure that they get properly transferred up. 10871 // if (current && current.child !== workInProgress.child) { 10872 // reuseChildrenEffects(workInProgress, child); 10873 // } 10874 // return null; 10875 // } 10876 10877 cloneChildFibers(current, workInProgress); 10878 return workInProgress.child; 10879 } 10880 10881 function bailoutOnLowPriority(current, workInProgress) { 10882 cancelWorkTimer(workInProgress); 10883 10884 // TODO: Handle HostComponent tags here as well and call pushHostContext()? 10885 // See PR 8590 discussion for context 10886 switch (workInProgress.tag) { 10887 case HostRoot: 10888 pushHostRootContext(workInProgress); 10889 break; 10890 case ClassComponent: 10891 pushContextProvider(workInProgress); 10892 break; 10893 case HostPortal: 10894 pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo); 10895 break; 10896 } 10897 // TODO: What if this is currently in progress? 10898 // How can that happen? How is this not being cloned? 10899 return null; 10900 } 10901 10902 // TODO: Delete memoizeProps/State and move to reconcile/bailout instead 10903 function memoizeProps(workInProgress, nextProps) { 10904 workInProgress.memoizedProps = nextProps; 10905 } 10906 10907 function memoizeState(workInProgress, nextState) { 10908 workInProgress.memoizedState = nextState; 10909 // Don't reset the updateQueue, in case there are pending updates. Resetting 10910 // is handled by processUpdateQueue. 10911 } 10912 10913 function beginWork(current, workInProgress, renderExpirationTime) { 10914 if (workInProgress.expirationTime === NoWork || workInProgress.expirationTime > renderExpirationTime) { 10915 return bailoutOnLowPriority(current, workInProgress); 10916 } 10917 10918 switch (workInProgress.tag) { 10919 case IndeterminateComponent: 10920 return mountIndeterminateComponent(current, workInProgress, renderExpirationTime); 10921 case FunctionalComponent: 10922 return updateFunctionalComponent(current, workInProgress); 10923 case ClassComponent: 10924 return updateClassComponent(current, workInProgress, renderExpirationTime); 10925 case HostRoot: 10926 return updateHostRoot(current, workInProgress, renderExpirationTime); 10927 case HostComponent: 10928 return updateHostComponent(current, workInProgress, renderExpirationTime); 10929 case HostText: 10930 return updateHostText(current, workInProgress); 10931 case CallHandlerPhase: 10932 // This is a restart. Reset the tag to the initial phase. 10933 workInProgress.tag = CallComponent; 10934 // Intentionally fall through since this is now the same. 10935 case CallComponent: 10936 return updateCallComponent(current, workInProgress, renderExpirationTime); 10937 case ReturnComponent: 10938 // A return component is just a placeholder, we can just run through the 10939 // next one immediately. 10940 return null; 10941 case HostPortal: 10942 return updatePortalComponent(current, workInProgress, renderExpirationTime); 10943 case Fragment: 10944 return updateFragment(current, workInProgress); 10945 default: 10946 invariant(false, 'Unknown unit of work tag. This error is likely caused by a bug in React. Please file an issue.'); 10947 } 10948 } 10949 10950 function beginFailedWork(current, workInProgress, renderExpirationTime) { 10951 // Push context providers here to avoid a push/pop context mismatch. 10952 switch (workInProgress.tag) { 10953 case ClassComponent: 10954 pushContextProvider(workInProgress); 10955 break; 10956 case HostRoot: 10957 pushHostRootContext(workInProgress); 10958 break; 10959 default: 10960 invariant(false, 'Invalid type of work. This error is likely caused by a bug in React. Please file an issue.'); 10961 } 10962 10963 // Add an error effect so we can handle the error during the commit phase 10964 workInProgress.effectTag |= Err; 10965 10966 // This is a weird case where we do "resume" work — work that failed on 10967 // our first attempt. Because we no longer have a notion of "progressed 10968 // deletions," reset the child to the current child to make sure we delete 10969 // it again. TODO: Find a better way to handle this, perhaps during a more 10970 // general overhaul of error handling. 10971 if (current === null) { 10972 workInProgress.child = null; 10973 } else if (workInProgress.child !== current.child) { 10974 workInProgress.child = current.child; 10975 } 10976 10977 if (workInProgress.expirationTime === NoWork || workInProgress.expirationTime > renderExpirationTime) { 10978 return bailoutOnLowPriority(current, workInProgress); 10979 } 10980 10981 // If we don't bail out, we're going be recomputing our children so we need 10982 // to drop our effect list. 10983 workInProgress.firstEffect = null; 10984 workInProgress.lastEffect = null; 10985 10986 // Unmount the current children as if the component rendered null 10987 var nextChildren = null; 10988 reconcileChildrenAtExpirationTime(current, workInProgress, nextChildren, renderExpirationTime); 10989 10990 if (workInProgress.tag === ClassComponent) { 10991 var instance = workInProgress.stateNode; 10992 workInProgress.memoizedProps = instance.props; 10993 workInProgress.memoizedState = instance.state; 10994 } 10995 10996 return workInProgress.child; 10997 } 10998 10999 return { 11000 beginWork: beginWork, 11001 beginFailedWork: beginFailedWork 11002 }; 11003 }; 11004 11005 var ReactFiberCompleteWork = function (config, hostContext, hydrationContext) { 11006 var createInstance = config.createInstance, 11007 createTextInstance = config.createTextInstance, 11008 appendInitialChild = config.appendInitialChild, 11009 finalizeInitialChildren = config.finalizeInitialChildren, 11010 prepareUpdate = config.prepareUpdate, 11011 mutation = config.mutation, 11012 persistence = config.persistence; 11013 var getRootHostContainer = hostContext.getRootHostContainer, 11014 popHostContext = hostContext.popHostContext, 11015 getHostContext = hostContext.getHostContext, 11016 popHostContainer = hostContext.popHostContainer; 11017 var prepareToHydrateHostInstance = hydrationContext.prepareToHydrateHostInstance, 11018 prepareToHydrateHostTextInstance = hydrationContext.prepareToHydrateHostTextInstance, 11019 popHydrationState = hydrationContext.popHydrationState; 11020 11021 11022 function markUpdate(workInProgress) { 11023 // Tag the fiber with an update effect. This turns a Placement into 11024 // an UpdateAndPlacement. 11025 workInProgress.effectTag |= Update; 11026 } 11027 11028 function markRef(workInProgress) { 11029 workInProgress.effectTag |= Ref; 11030 } 11031 11032 function appendAllReturns(returns, workInProgress) { 11033 var node = workInProgress.stateNode; 11034 if (node) { 11035 node['return'] = workInProgress; 11036 } 11037 while (node !== null) { 11038 if (node.tag === HostComponent || node.tag === HostText || node.tag === HostPortal) { 11039 invariant(false, 'A call cannot have host component children.'); 11040 } else if (node.tag === ReturnComponent) { 11041 returns.push(node.type); 11042 } else if (node.child !== null) { 11043 node.child['return'] = node; 11044 node = node.child; 11045 continue; 11046 } 11047 while (node.sibling === null) { 11048 if (node['return'] === null || node['return'] === workInProgress) { 11049 return; 11050 } 11051 node = node['return']; 11052 } 11053 node.sibling['return'] = node['return']; 11054 node = node.sibling; 11055 } 11056 } 11057 11058 function moveCallToHandlerPhase(current, workInProgress, renderExpirationTime) { 11059 var call = workInProgress.memoizedProps; 11060 !call ? invariant(false, 'Should be resolved by now. This error is likely caused by a bug in React. Please file an issue.') : void 0; 11061 11062 // First step of the call has completed. Now we need to do the second. 11063 // TODO: It would be nice to have a multi stage call represented by a 11064 // single component, or at least tail call optimize nested ones. Currently 11065 // that requires additional fields that we don't want to add to the fiber. 11066 // So this requires nested handlers. 11067 // Note: This doesn't mutate the alternate node. I don't think it needs to 11068 // since this stage is reset for every pass. 11069 workInProgress.tag = CallHandlerPhase; 11070 11071 // Build up the returns. 11072 // TODO: Compare this to a generator or opaque helpers like Children. 11073 var returns = []; 11074 appendAllReturns(returns, workInProgress); 11075 var fn = call.handler; 11076 var props = call.props; 11077 var nextChildren = fn(props, returns); 11078 11079 var currentFirstChild = current !== null ? current.child : null; 11080 workInProgress.child = reconcileChildFibers(workInProgress, currentFirstChild, nextChildren, renderExpirationTime); 11081 return workInProgress.child; 11082 } 11083 11084 function appendAllChildren(parent, workInProgress) { 11085 // We only have the top Fiber that was created but we need recurse down its 11086 // children to find all the terminal nodes. 11087 var node = workInProgress.child; 11088 while (node !== null) { 11089 if (node.tag === HostComponent || node.tag === HostText) { 11090 appendInitialChild(parent, node.stateNode); 11091 } else if (node.tag === HostPortal) { 11092 // If we have a portal child, then we don't want to traverse 11093 // down its children. Instead, we'll get insertions from each child in 11094 // the portal directly. 11095 } else if (node.child !== null) { 11096 node.child['return'] = node; 11097 node = node.child; 11098 continue; 11099 } 11100 if (node === workInProgress) { 11101 return; 11102 } 11103 while (node.sibling === null) { 11104 if (node['return'] === null || node['return'] === workInProgress) { 11105 return; 11106 } 11107 node = node['return']; 11108 } 11109 node.sibling['return'] = node['return']; 11110 node = node.sibling; 11111 } 11112 } 11113 11114 var updateHostContainer = void 0; 11115 var updateHostComponent = void 0; 11116 var updateHostText = void 0; 11117 if (mutation) { 11118 if (enableMutatingReconciler) { 11119 // Mutation mode 11120 updateHostContainer = function (workInProgress) { 11121 // Noop 11122 }; 11123 updateHostComponent = function (current, workInProgress, updatePayload, type, oldProps, newProps, rootContainerInstance) { 11124 // TODO: Type this specific to this type of component. 11125 workInProgress.updateQueue = updatePayload; 11126 // If the update payload indicates that there is a change or if there 11127 // is a new ref we mark this as an update. All the work is done in commitWork. 11128 if (updatePayload) { 11129 markUpdate(workInProgress); 11130 } 11131 }; 11132 updateHostText = function (current, workInProgress, oldText, newText) { 11133 // If the text differs, mark it as an update. All the work in done in commitWork. 11134 if (oldText !== newText) { 11135 markUpdate(workInProgress); 11136 } 11137 }; 11138 } else { 11139 invariant(false, 'Mutating reconciler is disabled.'); 11140 } 11141 } else if (persistence) { 11142 if (enablePersistentReconciler) { 11143 // Persistent host tree mode 11144 var cloneInstance = persistence.cloneInstance, 11145 createContainerChildSet = persistence.createContainerChildSet, 11146 appendChildToContainerChildSet = persistence.appendChildToContainerChildSet, 11147 finalizeContainerChildren = persistence.finalizeContainerChildren; 11148 11149 // An unfortunate fork of appendAllChildren because we have two different parent types. 11150 11151 var appendAllChildrenToContainer = function (containerChildSet, workInProgress) { 11152 // We only have the top Fiber that was created but we need recurse down its 11153 // children to find all the terminal nodes. 11154 var node = workInProgress.child; 11155 while (node !== null) { 11156 if (node.tag === HostComponent || node.tag === HostText) { 11157 appendChildToContainerChildSet(containerChildSet, node.stateNode); 11158 } else if (node.tag === HostPortal) { 11159 // If we have a portal child, then we don't want to traverse 11160 // down its children. Instead, we'll get insertions from each child in 11161 // the portal directly. 11162 } else if (node.child !== null) { 11163 node.child['return'] = node; 11164 node = node.child; 11165 continue; 11166 } 11167 if (node === workInProgress) { 11168 return; 11169 } 11170 while (node.sibling === null) { 11171 if (node['return'] === null || node['return'] === workInProgress) { 11172 return; 11173 } 11174 node = node['return']; 11175 } 11176 node.sibling['return'] = node['return']; 11177 node = node.sibling; 11178 } 11179 }; 11180 updateHostContainer = function (workInProgress) { 11181 var portalOrRoot = workInProgress.stateNode; 11182 var childrenUnchanged = workInProgress.firstEffect === null; 11183 if (childrenUnchanged) { 11184 // No changes, just reuse the existing instance. 11185 } else { 11186 var container = portalOrRoot.containerInfo; 11187 var newChildSet = createContainerChildSet(container); 11188 if (finalizeContainerChildren(container, newChildSet)) { 11189 markUpdate(workInProgress); 11190 } 11191 portalOrRoot.pendingChildren = newChildSet; 11192 // If children might have changed, we have to add them all to the set. 11193 appendAllChildrenToContainer(newChildSet, workInProgress); 11194 // Schedule an update on the container to swap out the container. 11195 markUpdate(workInProgress); 11196 } 11197 }; 11198 updateHostComponent = function (current, workInProgress, updatePayload, type, oldProps, newProps, rootContainerInstance) { 11199 // If there are no effects associated with this node, then none of our children had any updates. 11200 // This guarantees that we can reuse all of them. 11201 var childrenUnchanged = workInProgress.firstEffect === null; 11202 var currentInstance = current.stateNode; 11203 if (childrenUnchanged && updatePayload === null) { 11204 // No changes, just reuse the existing instance. 11205 // Note that this might release a previous clone. 11206 workInProgress.stateNode = currentInstance; 11207 } else { 11208 var recyclableInstance = workInProgress.stateNode; 11209 var newInstance = cloneInstance(currentInstance, updatePayload, type, oldProps, newProps, workInProgress, childrenUnchanged, recyclableInstance); 11210 if (finalizeInitialChildren(newInstance, type, newProps, rootContainerInstance)) { 11211 markUpdate(workInProgress); 11212 } 11213 workInProgress.stateNode = newInstance; 11214 if (childrenUnchanged) { 11215 // If there are no other effects in this tree, we need to flag this node as having one. 11216 // Even though we're not going to use it for anything. 11217 // Otherwise parents won't know that there are new children to propagate upwards. 11218 markUpdate(workInProgress); 11219 } else { 11220 // If children might have changed, we have to add them all to the set. 11221 appendAllChildren(newInstance, workInProgress); 11222 } 11223 } 11224 }; 11225 updateHostText = function (current, workInProgress, oldText, newText) { 11226 if (oldText !== newText) { 11227 // If the text content differs, we'll create a new text instance for it. 11228 var rootContainerInstance = getRootHostContainer(); 11229 var currentHostContext = getHostContext(); 11230 workInProgress.stateNode = createTextInstance(newText, rootContainerInstance, currentHostContext, workInProgress); 11231 // We'll have to mark it as having an effect, even though we won't use the effect for anything. 11232 // This lets the parents know that at least one of their children has changed. 11233 markUpdate(workInProgress); 11234 } 11235 }; 11236 } else { 11237 invariant(false, 'Persistent reconciler is disabled.'); 11238 } 11239 } else { 11240 if (enableNoopReconciler) { 11241 // No host operations 11242 updateHostContainer = function (workInProgress) { 11243 // Noop 11244 }; 11245 updateHostComponent = function (current, workInProgress, updatePayload, type, oldProps, newProps, rootContainerInstance) { 11246 // Noop 11247 }; 11248 updateHostText = function (current, workInProgress, oldText, newText) { 11249 // Noop 11250 }; 11251 } else { 11252 invariant(false, 'Noop reconciler is disabled.'); 11253 } 11254 } 11255 11256 function completeWork(current, workInProgress, renderExpirationTime) { 11257 // Get the latest props. 11258 var newProps = workInProgress.pendingProps; 11259 if (newProps === null) { 11260 newProps = workInProgress.memoizedProps; 11261 } else if (workInProgress.expirationTime !== Never || renderExpirationTime === Never) { 11262 // Reset the pending props, unless this was a down-prioritization. 11263 workInProgress.pendingProps = null; 11264 } 11265 11266 switch (workInProgress.tag) { 11267 case FunctionalComponent: 11268 return null; 11269 case ClassComponent: 11270 { 11271 // We are leaving this subtree, so pop context if any. 11272 popContextProvider(workInProgress); 11273 return null; 11274 } 11275 case HostRoot: 11276 { 11277 popHostContainer(workInProgress); 11278 popTopLevelContextObject(workInProgress); 11279 var fiberRoot = workInProgress.stateNode; 11280 if (fiberRoot.pendingContext) { 11281 fiberRoot.context = fiberRoot.pendingContext; 11282 fiberRoot.pendingContext = null; 11283 } 11284 11285 if (current === null || current.child === null) { 11286 // If we hydrated, pop so that we can delete any remaining children 11287 // that weren't hydrated. 11288 popHydrationState(workInProgress); 11289 // This resets the hacky state to fix isMounted before committing. 11290 // TODO: Delete this when we delete isMounted and findDOMNode. 11291 workInProgress.effectTag &= ~Placement; 11292 } 11293 updateHostContainer(workInProgress); 11294 return null; 11295 } 11296 case HostComponent: 11297 { 11298 popHostContext(workInProgress); 11299 var rootContainerInstance = getRootHostContainer(); 11300 var type = workInProgress.type; 11301 if (current !== null && workInProgress.stateNode != null) { 11302 // If we have an alternate, that means this is an update and we need to 11303 // schedule a side-effect to do the updates. 11304 var oldProps = current.memoizedProps; 11305 // If we get updated because one of our children updated, we don't 11306 // have newProps so we'll have to reuse them. 11307 // TODO: Split the update API as separate for the props vs. children. 11308 // Even better would be if children weren't special cased at all tho. 11309 var instance = workInProgress.stateNode; 11310 var currentHostContext = getHostContext(); 11311 var updatePayload = prepareUpdate(instance, type, oldProps, newProps, rootContainerInstance, currentHostContext); 11312 11313 updateHostComponent(current, workInProgress, updatePayload, type, oldProps, newProps, rootContainerInstance); 11314 11315 if (current.ref !== workInProgress.ref) { 11316 markRef(workInProgress); 11317 } 11318 } else { 11319 if (!newProps) { 11320 !(workInProgress.stateNode !== null) ? invariant(false, 'We must have new props for new mounts. This error is likely caused by a bug in React. Please file an issue.') : void 0; 11321 // This can happen when we abort work. 11322 return null; 11323 } 11324 11325 var _currentHostContext = getHostContext(); 11326 // TODO: Move createInstance to beginWork and keep it on a context 11327 // "stack" as the parent. Then append children as we go in beginWork 11328 // or completeWork depending on we want to add then top->down or 11329 // bottom->up. Top->down is faster in IE11. 11330 var wasHydrated = popHydrationState(workInProgress); 11331 if (wasHydrated) { 11332 // TODO: Move this and createInstance step into the beginPhase 11333 // to consolidate. 11334 if (prepareToHydrateHostInstance(workInProgress, rootContainerInstance, _currentHostContext)) { 11335 // If changes to the hydrated node needs to be applied at the 11336 // commit-phase we mark this as such. 11337 markUpdate(workInProgress); 11338 } 11339 } else { 11340 var _instance = createInstance(type, newProps, rootContainerInstance, _currentHostContext, workInProgress); 11341 11342 appendAllChildren(_instance, workInProgress); 11343 11344 // Certain renderers require commit-time effects for initial mount. 11345 // (eg DOM renderer supports auto-focus for certain elements). 11346 // Make sure such renderers get scheduled for later work. 11347 if (finalizeInitialChildren(_instance, type, newProps, rootContainerInstance)) { 11348 markUpdate(workInProgress); 11349 } 11350 workInProgress.stateNode = _instance; 11351 } 11352 11353 if (workInProgress.ref !== null) { 11354 // If there is a ref on a host node we need to schedule a callback 11355 markRef(workInProgress); 11356 } 11357 } 11358 return null; 11359 } 11360 case HostText: 11361 { 11362 var newText = newProps; 11363 if (current && workInProgress.stateNode != null) { 11364 var oldText = current.memoizedProps; 11365 // If we have an alternate, that means this is an update and we need 11366 // to schedule a side-effect to do the updates. 11367 updateHostText(current, workInProgress, oldText, newText); 11368 } else { 11369 if (typeof newText !== 'string') { 11370 !(workInProgress.stateNode !== null) ? invariant(false, 'We must have new props for new mounts. This error is likely caused by a bug in React. Please file an issue.') : void 0; 11371 // This can happen when we abort work. 11372 return null; 11373 } 11374 var _rootContainerInstance = getRootHostContainer(); 11375 var _currentHostContext2 = getHostContext(); 11376 var _wasHydrated = popHydrationState(workInProgress); 11377 if (_wasHydrated) { 11378 if (prepareToHydrateHostTextInstance(workInProgress)) { 11379 markUpdate(workInProgress); 11380 } 11381 } else { 11382 workInProgress.stateNode = createTextInstance(newText, _rootContainerInstance, _currentHostContext2, workInProgress); 11383 } 11384 } 11385 return null; 11386 } 11387 case CallComponent: 11388 return moveCallToHandlerPhase(current, workInProgress, renderExpirationTime); 11389 case CallHandlerPhase: 11390 // Reset the tag to now be a first phase call. 11391 workInProgress.tag = CallComponent; 11392 return null; 11393 case ReturnComponent: 11394 // Does nothing. 11395 return null; 11396 case Fragment: 11397 return null; 11398 case HostPortal: 11399 popHostContainer(workInProgress); 11400 updateHostContainer(workInProgress); 11401 return null; 11402 // Error cases 11403 case IndeterminateComponent: 11404 invariant(false, 'An indeterminate component should have become determinate before completing. This error is likely caused by a bug in React. Please file an issue.'); 11405 // eslint-disable-next-line no-fallthrough 11406 default: 11407 invariant(false, 'Unknown unit of work tag. This error is likely caused by a bug in React. Please file an issue.'); 11408 } 11409 } 11410 11411 return { 11412 completeWork: completeWork 11413 }; 11414 }; 11415 11416 var invokeGuardedCallback$2 = ReactErrorUtils.invokeGuardedCallback; 11417 var hasCaughtError$1 = ReactErrorUtils.hasCaughtError; 11418 var clearCaughtError$1 = ReactErrorUtils.clearCaughtError; 11419 11420 11421 var ReactFiberCommitWork = function (config, captureError) { 11422 var getPublicInstance = config.getPublicInstance, 11423 mutation = config.mutation, 11424 persistence = config.persistence; 11425 11426 11427 var callComponentWillUnmountWithTimer = function (current, instance) { 11428 startPhaseTimer(current, 'componentWillUnmount'); 11429 instance.props = current.memoizedProps; 11430 instance.state = current.memoizedState; 11431 instance.componentWillUnmount(); 11432 stopPhaseTimer(); 11433 }; 11434 11435 // Capture errors so they don't interrupt unmounting. 11436 function safelyCallComponentWillUnmount(current, instance) { 11437 { 11438 invokeGuardedCallback$2(null, callComponentWillUnmountWithTimer, null, current, instance); 11439 if (hasCaughtError$1()) { 11440 var unmountError = clearCaughtError$1(); 11441 captureError(current, unmountError); 11442 } 11443 } 11444 } 11445 11446 function safelyDetachRef(current) { 11447 var ref = current.ref; 11448 if (ref !== null) { 11449 { 11450 invokeGuardedCallback$2(null, ref, null, null); 11451 if (hasCaughtError$1()) { 11452 var refError = clearCaughtError$1(); 11453 captureError(current, refError); 11454 } 11455 } 11456 } 11457 } 11458 11459 function commitLifeCycles(current, finishedWork) { 11460 switch (finishedWork.tag) { 11461 case ClassComponent: 11462 { 11463 var instance = finishedWork.stateNode; 11464 if (finishedWork.effectTag & Update) { 11465 if (current === null) { 11466 startPhaseTimer(finishedWork, 'componentDidMount'); 11467 instance.props = finishedWork.memoizedProps; 11468 instance.state = finishedWork.memoizedState; 11469 instance.componentDidMount(); 11470 stopPhaseTimer(); 11471 } else { 11472 var prevProps = current.memoizedProps; 11473 var prevState = current.memoizedState; 11474 startPhaseTimer(finishedWork, 'componentDidUpdate'); 11475 instance.props = finishedWork.memoizedProps; 11476 instance.state = finishedWork.memoizedState; 11477 instance.componentDidUpdate(prevProps, prevState); 11478 stopPhaseTimer(); 11479 } 11480 } 11481 var updateQueue = finishedWork.updateQueue; 11482 if (updateQueue !== null) { 11483 commitCallbacks(updateQueue, instance); 11484 } 11485 return; 11486 } 11487 case HostRoot: 11488 { 11489 var _updateQueue = finishedWork.updateQueue; 11490 if (_updateQueue !== null) { 11491 var _instance = finishedWork.child !== null ? finishedWork.child.stateNode : null; 11492 commitCallbacks(_updateQueue, _instance); 11493 } 11494 return; 11495 } 11496 case HostComponent: 11497 { 11498 var _instance2 = finishedWork.stateNode; 11499 11500 // Renderers may schedule work to be done after host components are mounted 11501 // (eg DOM renderer may schedule auto-focus for inputs and form controls). 11502 // These effects should only be committed when components are first mounted, 11503 // aka when there is no current/alternate. 11504 if (current === null && finishedWork.effectTag & Update) { 11505 var type = finishedWork.type; 11506 var props = finishedWork.memoizedProps; 11507 commitMount(_instance2, type, props, finishedWork); 11508 } 11509 11510 return; 11511 } 11512 case HostText: 11513 { 11514 // We have no life-cycles associated with text. 11515 return; 11516 } 11517 case HostPortal: 11518 { 11519 // We have no life-cycles associated with portals. 11520 return; 11521 } 11522 default: 11523 { 11524 invariant(false, 'This unit of work tag should not have side-effects. This error is likely caused by a bug in React. Please file an issue.'); 11525 } 11526 } 11527 } 11528 11529 function commitAttachRef(finishedWork) { 11530 var ref = finishedWork.ref; 11531 if (ref !== null) { 11532 var instance = finishedWork.stateNode; 11533 switch (finishedWork.tag) { 11534 case HostComponent: 11535 ref(getPublicInstance(instance)); 11536 break; 11537 default: 11538 ref(instance); 11539 } 11540 } 11541 } 11542 11543 function commitDetachRef(current) { 11544 var currentRef = current.ref; 11545 if (currentRef !== null) { 11546 currentRef(null); 11547 } 11548 } 11549 11550 // User-originating errors (lifecycles and refs) should not interrupt 11551 // deletion, so don't let them throw. Host-originating errors should 11552 // interrupt deletion, so it's okay 11553 function commitUnmount(current) { 11554 if (typeof onCommitUnmount === 'function') { 11555 onCommitUnmount(current); 11556 } 11557 11558 switch (current.tag) { 11559 case ClassComponent: 11560 { 11561 safelyDetachRef(current); 11562 var instance = current.stateNode; 11563 if (typeof instance.componentWillUnmount === 'function') { 11564 safelyCallComponentWillUnmount(current, instance); 11565 } 11566 return; 11567 } 11568 case HostComponent: 11569 { 11570 safelyDetachRef(current); 11571 return; 11572 } 11573 case CallComponent: 11574 { 11575 commitNestedUnmounts(current.stateNode); 11576 return; 11577 } 11578 case HostPortal: 11579 { 11580 // TODO: this is recursive. 11581 // We are also not using this parent because 11582 // the portal will get pushed immediately. 11583 if (enableMutatingReconciler && mutation) { 11584 unmountHostComponents(current); 11585 } else if (enablePersistentReconciler && persistence) { 11586 emptyPortalContainer(current); 11587 } 11588 return; 11589 } 11590 } 11591 } 11592 11593 function commitNestedUnmounts(root) { 11594 // While we're inside a removed host node we don't want to call 11595 // removeChild on the inner nodes because they're removed by the top 11596 // call anyway. We also want to call componentWillUnmount on all 11597 // composites before this host node is removed from the tree. Therefore 11598 var node = root; 11599 while (true) { 11600 commitUnmount(node); 11601 // Visit children because they may contain more composite or host nodes. 11602 // Skip portals because commitUnmount() currently visits them recursively. 11603 if (node.child !== null && ( 11604 // If we use mutation we drill down into portals using commitUnmount above. 11605 // If we don't use mutation we drill down into portals here instead. 11606 !mutation || node.tag !== HostPortal)) { 11607 node.child['return'] = node; 11608 node = node.child; 11609 continue; 11610 } 11611 if (node === root) { 11612 return; 11613 } 11614 while (node.sibling === null) { 11615 if (node['return'] === null || node['return'] === root) { 11616 return; 11617 } 11618 node = node['return']; 11619 } 11620 node.sibling['return'] = node['return']; 11621 node = node.sibling; 11622 } 11623 } 11624 11625 function detachFiber(current) { 11626 // Cut off the return pointers to disconnect it from the tree. Ideally, we 11627 // should clear the child pointer of the parent alternate to let this 11628 // get GC:ed but we don't know which for sure which parent is the current 11629 // one so we'll settle for GC:ing the subtree of this child. This child 11630 // itself will be GC:ed when the parent updates the next time. 11631 current['return'] = null; 11632 current.child = null; 11633 if (current.alternate) { 11634 current.alternate.child = null; 11635 current.alternate['return'] = null; 11636 } 11637 } 11638 11639 if (!mutation) { 11640 var commitContainer = void 0; 11641 if (persistence) { 11642 var replaceContainerChildren = persistence.replaceContainerChildren, 11643 createContainerChildSet = persistence.createContainerChildSet; 11644 11645 var emptyPortalContainer = function (current) { 11646 var portal = current.stateNode; 11647 var containerInfo = portal.containerInfo; 11648 11649 var emptyChildSet = createContainerChildSet(containerInfo); 11650 replaceContainerChildren(containerInfo, emptyChildSet); 11651 }; 11652 commitContainer = function (finishedWork) { 11653 switch (finishedWork.tag) { 11654 case ClassComponent: 11655 { 11656 return; 11657 } 11658 case HostComponent: 11659 { 11660 return; 11661 } 11662 case HostText: 11663 { 11664 return; 11665 } 11666 case HostRoot: 11667 case HostPortal: 11668 { 11669 var portalOrRoot = finishedWork.stateNode; 11670 var containerInfo = portalOrRoot.containerInfo, 11671 _pendingChildren = portalOrRoot.pendingChildren; 11672 11673 replaceContainerChildren(containerInfo, _pendingChildren); 11674 return; 11675 } 11676 default: 11677 { 11678 invariant(false, 'This unit of work tag should not have side-effects. This error is likely caused by a bug in React. Please file an issue.'); 11679 } 11680 } 11681 }; 11682 } else { 11683 commitContainer = function (finishedWork) { 11684 // Noop 11685 }; 11686 } 11687 if (enablePersistentReconciler || enableNoopReconciler) { 11688 return { 11689 commitResetTextContent: function (finishedWork) {}, 11690 commitPlacement: function (finishedWork) {}, 11691 commitDeletion: function (current) { 11692 // Detach refs and call componentWillUnmount() on the whole subtree. 11693 commitNestedUnmounts(current); 11694 detachFiber(current); 11695 }, 11696 commitWork: function (current, finishedWork) { 11697 commitContainer(finishedWork); 11698 }, 11699 11700 commitLifeCycles: commitLifeCycles, 11701 commitAttachRef: commitAttachRef, 11702 commitDetachRef: commitDetachRef 11703 }; 11704 } else if (persistence) { 11705 invariant(false, 'Persistent reconciler is disabled.'); 11706 } else { 11707 invariant(false, 'Noop reconciler is disabled.'); 11708 } 11709 } 11710 var commitMount = mutation.commitMount, 11711 commitUpdate = mutation.commitUpdate, 11712 resetTextContent = mutation.resetTextContent, 11713 commitTextUpdate = mutation.commitTextUpdate, 11714 appendChild = mutation.appendChild, 11715 appendChildToContainer = mutation.appendChildToContainer, 11716 insertBefore = mutation.insertBefore, 11717 insertInContainerBefore = mutation.insertInContainerBefore, 11718 removeChild = mutation.removeChild, 11719 removeChildFromContainer = mutation.removeChildFromContainer; 11720 11721 11722 function getHostParentFiber(fiber) { 11723 var parent = fiber['return']; 11724 while (parent !== null) { 11725 if (isHostParent(parent)) { 11726 return parent; 11727 } 11728 parent = parent['return']; 11729 } 11730 invariant(false, 'Expected to find a host parent. This error is likely caused by a bug in React. Please file an issue.'); 11731 } 11732 11733 function isHostParent(fiber) { 11734 return fiber.tag === HostComponent || fiber.tag === HostRoot || fiber.tag === HostPortal; 11735 } 11736 11737 function getHostSibling(fiber) { 11738 // We're going to search forward into the tree until we find a sibling host 11739 // node. Unfortunately, if multiple insertions are done in a row we have to 11740 // search past them. This leads to exponential search for the next sibling. 11741 var node = fiber; 11742 siblings: while (true) { 11743 // If we didn't find anything, let's try the next sibling. 11744 while (node.sibling === null) { 11745 if (node['return'] === null || isHostParent(node['return'])) { 11746 // If we pop out of the root or hit the parent the fiber we are the 11747 // last sibling. 11748 return null; 11749 } 11750 node = node['return']; 11751 } 11752 node.sibling['return'] = node['return']; 11753 node = node.sibling; 11754 while (node.tag !== HostComponent && node.tag !== HostText) { 11755 // If it is not host node and, we might have a host node inside it. 11756 // Try to search down until we find one. 11757 if (node.effectTag & Placement) { 11758 // If we don't have a child, try the siblings instead. 11759 continue siblings; 11760 } 11761 // If we don't have a child, try the siblings instead. 11762 // We also skip portals because they are not part of this host tree. 11763 if (node.child === null || node.tag === HostPortal) { 11764 continue siblings; 11765 } else { 11766 node.child['return'] = node; 11767 node = node.child; 11768 } 11769 } 11770 // Check if this host node is stable or about to be placed. 11771 if (!(node.effectTag & Placement)) { 11772 // Found it! 11773 return node.stateNode; 11774 } 11775 } 11776 } 11777 11778 function commitPlacement(finishedWork) { 11779 // Recursively insert all host nodes into the parent. 11780 var parentFiber = getHostParentFiber(finishedWork); 11781 var parent = void 0; 11782 var isContainer = void 0; 11783 switch (parentFiber.tag) { 11784 case HostComponent: 11785 parent = parentFiber.stateNode; 11786 isContainer = false; 11787 break; 11788 case HostRoot: 11789 parent = parentFiber.stateNode.containerInfo; 11790 isContainer = true; 11791 break; 11792 case HostPortal: 11793 parent = parentFiber.stateNode.containerInfo; 11794 isContainer = true; 11795 break; 11796 default: 11797 invariant(false, 'Invalid host parent fiber. This error is likely caused by a bug in React. Please file an issue.'); 11798 } 11799 if (parentFiber.effectTag & ContentReset) { 11800 // Reset the text content of the parent before doing any insertions 11801 resetTextContent(parent); 11802 // Clear ContentReset from the effect tag 11803 parentFiber.effectTag &= ~ContentReset; 11804 } 11805 11806 var before = getHostSibling(finishedWork); 11807 // We only have the top Fiber that was inserted but we need recurse down its 11808 // children to find all the terminal nodes. 11809 var node = finishedWork; 11810 while (true) { 11811 if (node.tag === HostComponent || node.tag === HostText) { 11812 if (before) { 11813 if (isContainer) { 11814 insertInContainerBefore(parent, node.stateNode, before); 11815 } else { 11816 insertBefore(parent, node.stateNode, before); 11817 } 11818 } else { 11819 if (isContainer) { 11820 appendChildToContainer(parent, node.stateNode); 11821 } else { 11822 appendChild(parent, node.stateNode); 11823 } 11824 } 11825 } else if (node.tag === HostPortal) { 11826 // If the insertion itself is a portal, then we don't want to traverse 11827 // down its children. Instead, we'll get insertions from each child in 11828 // the portal directly. 11829 } else if (node.child !== null) { 11830 node.child['return'] = node; 11831 node = node.child; 11832 continue; 11833 } 11834 if (node === finishedWork) { 11835 return; 11836 } 11837 while (node.sibling === null) { 11838 if (node['return'] === null || node['return'] === finishedWork) { 11839 return; 11840 } 11841 node = node['return']; 11842 } 11843 node.sibling['return'] = node['return']; 11844 node = node.sibling; 11845 } 11846 } 11847 11848 function unmountHostComponents(current) { 11849 // We only have the top Fiber that was inserted but we need recurse down its 11850 var node = current; 11851 11852 // Each iteration, currentParent is populated with node's host parent if not 11853 // currentParentIsValid. 11854 var currentParentIsValid = false; 11855 var currentParent = void 0; 11856 var currentParentIsContainer = void 0; 11857 11858 while (true) { 11859 if (!currentParentIsValid) { 11860 var parent = node['return']; 11861 findParent: while (true) { 11862 !(parent !== null) ? invariant(false, 'Expected to find a host parent. This error is likely caused by a bug in React. Please file an issue.') : void 0; 11863 switch (parent.tag) { 11864 case HostComponent: 11865 currentParent = parent.stateNode; 11866 currentParentIsContainer = false; 11867 break findParent; 11868 case HostRoot: 11869 currentParent = parent.stateNode.containerInfo; 11870 currentParentIsContainer = true; 11871 break findParent; 11872 case HostPortal: 11873 currentParent = parent.stateNode.containerInfo; 11874 currentParentIsContainer = true; 11875 break findParent; 11876 } 11877 parent = parent['return']; 11878 } 11879 currentParentIsValid = true; 11880 } 11881 11882 if (node.tag === HostComponent || node.tag === HostText) { 11883 commitNestedUnmounts(node); 11884 // After all the children have unmounted, it is now safe to remove the 11885 // node from the tree. 11886 if (currentParentIsContainer) { 11887 removeChildFromContainer(currentParent, node.stateNode); 11888 } else { 11889 removeChild(currentParent, node.stateNode); 11890 } 11891 // Don't visit children because we already visited them. 11892 } else if (node.tag === HostPortal) { 11893 // When we go into a portal, it becomes the parent to remove from. 11894 // We will reassign it back when we pop the portal on the way up. 11895 currentParent = node.stateNode.containerInfo; 11896 // Visit children because portals might contain host components. 11897 if (node.child !== null) { 11898 node.child['return'] = node; 11899 node = node.child; 11900 continue; 11901 } 11902 } else { 11903 commitUnmount(node); 11904 // Visit children because we may find more host components below. 11905 if (node.child !== null) { 11906 node.child['return'] = node; 11907 node = node.child; 11908 continue; 11909 } 11910 } 11911 if (node === current) { 11912 return; 11913 } 11914 while (node.sibling === null) { 11915 if (node['return'] === null || node['return'] === current) { 11916 return; 11917 } 11918 node = node['return']; 11919 if (node.tag === HostPortal) { 11920 // When we go out of the portal, we need to restore the parent. 11921 // Since we don't keep a stack of them, we will search for it. 11922 currentParentIsValid = false; 11923 } 11924 } 11925 node.sibling['return'] = node['return']; 11926 node = node.sibling; 11927 } 11928 } 11929 11930 function commitDeletion(current) { 11931 // Recursively delete all host nodes from the parent. 11932 // Detach refs and call componentWillUnmount() on the whole subtree. 11933 unmountHostComponents(current); 11934 detachFiber(current); 11935 } 11936 11937 function commitWork(current, finishedWork) { 11938 switch (finishedWork.tag) { 11939 case ClassComponent: 11940 { 11941 return; 11942 } 11943 case HostComponent: 11944 { 11945 var instance = finishedWork.stateNode; 11946 if (instance != null) { 11947 // Commit the work prepared earlier. 11948 var newProps = finishedWork.memoizedProps; 11949 // For hydration we reuse the update path but we treat the oldProps 11950 // as the newProps. The updatePayload will contain the real change in 11951 // this case. 11952 var oldProps = current !== null ? current.memoizedProps : newProps; 11953 var type = finishedWork.type; 11954 // TODO: Type the updateQueue to be specific to host components. 11955 var updatePayload = finishedWork.updateQueue; 11956 finishedWork.updateQueue = null; 11957 if (updatePayload !== null) { 11958 commitUpdate(instance, updatePayload, type, oldProps, newProps, finishedWork); 11959 } 11960 } 11961 return; 11962 } 11963 case HostText: 11964 { 11965 !(finishedWork.stateNode !== null) ? invariant(false, 'This should have a text node initialized. This error is likely caused by a bug in React. Please file an issue.') : void 0; 11966 var textInstance = finishedWork.stateNode; 11967 var newText = finishedWork.memoizedProps; 11968 // For hydration we reuse the update path but we treat the oldProps 11969 // as the newProps. The updatePayload will contain the real change in 11970 // this case. 11971 var oldText = current !== null ? current.memoizedProps : newText; 11972 commitTextUpdate(textInstance, oldText, newText); 11973 return; 11974 } 11975 case HostRoot: 11976 { 11977 return; 11978 } 11979 default: 11980 { 11981 invariant(false, 'This unit of work tag should not have side-effects. This error is likely caused by a bug in React. Please file an issue.'); 11982 } 11983 } 11984 } 11985 11986 function commitResetTextContent(current) { 11987 resetTextContent(current.stateNode); 11988 } 11989 11990 if (enableMutatingReconciler) { 11991 return { 11992 commitResetTextContent: commitResetTextContent, 11993 commitPlacement: commitPlacement, 11994 commitDeletion: commitDeletion, 11995 commitWork: commitWork, 11996 commitLifeCycles: commitLifeCycles, 11997 commitAttachRef: commitAttachRef, 11998 commitDetachRef: commitDetachRef 11999 }; 12000 } else { 12001 invariant(false, 'Mutating reconciler is disabled.'); 12002 } 12003 }; 12004 12005 var NO_CONTEXT = {}; 12006 12007 var ReactFiberHostContext = function (config) { 12008 var getChildHostContext = config.getChildHostContext, 12009 getRootHostContext = config.getRootHostContext; 12010 12011 12012 var contextStackCursor = createCursor(NO_CONTEXT); 12013 var contextFiberStackCursor = createCursor(NO_CONTEXT); 12014 var rootInstanceStackCursor = createCursor(NO_CONTEXT); 12015 12016 function requiredContext(c) { 12017 !(c !== NO_CONTEXT) ? invariant(false, 'Expected host context to exist. This error is likely caused by a bug in React. Please file an issue.') : void 0; 12018 return c; 12019 } 12020 12021 function getRootHostContainer() { 12022 var rootInstance = requiredContext(rootInstanceStackCursor.current); 12023 return rootInstance; 12024 } 12025 12026 function pushHostContainer(fiber, nextRootInstance) { 12027 // Push current root instance onto the stack; 12028 // This allows us to reset root when portals are popped. 12029 push(rootInstanceStackCursor, nextRootInstance, fiber); 12030 12031 var nextRootContext = getRootHostContext(nextRootInstance); 12032 12033 // Track the context and the Fiber that provided it. 12034 // This enables us to pop only Fibers that provide unique contexts. 12035 push(contextFiberStackCursor, fiber, fiber); 12036 push(contextStackCursor, nextRootContext, fiber); 12037 } 12038 12039 function popHostContainer(fiber) { 12040 pop(contextStackCursor, fiber); 12041 pop(contextFiberStackCursor, fiber); 12042 pop(rootInstanceStackCursor, fiber); 12043 } 12044 12045 function getHostContext() { 12046 var context = requiredContext(contextStackCursor.current); 12047 return context; 12048 } 12049 12050 function pushHostContext(fiber) { 12051 var rootInstance = requiredContext(rootInstanceStackCursor.current); 12052 var context = requiredContext(contextStackCursor.current); 12053 var nextContext = getChildHostContext(context, fiber.type, rootInstance); 12054 12055 // Don't push this Fiber's context unless it's unique. 12056 if (context === nextContext) { 12057 return; 12058 } 12059 12060 // Track the context and the Fiber that provided it. 12061 // This enables us to pop only Fibers that provide unique contexts. 12062 push(contextFiberStackCursor, fiber, fiber); 12063 push(contextStackCursor, nextContext, fiber); 12064 } 12065 12066 function popHostContext(fiber) { 12067 // Do not pop unless this Fiber provided the current context. 12068 // pushHostContext() only pushes Fibers that provide unique contexts. 12069 if (contextFiberStackCursor.current !== fiber) { 12070 return; 12071 } 12072 12073 pop(contextStackCursor, fiber); 12074 pop(contextFiberStackCursor, fiber); 12075 } 12076 12077 function resetHostContainer() { 12078 contextStackCursor.current = NO_CONTEXT; 12079 rootInstanceStackCursor.current = NO_CONTEXT; 12080 } 12081 12082 return { 12083 getHostContext: getHostContext, 12084 getRootHostContainer: getRootHostContainer, 12085 popHostContainer: popHostContainer, 12086 popHostContext: popHostContext, 12087 pushHostContainer: pushHostContainer, 12088 pushHostContext: pushHostContext, 12089 resetHostContainer: resetHostContainer 12090 }; 12091 }; 12092 12093 var ReactFiberHydrationContext = function (config) { 12094 var shouldSetTextContent = config.shouldSetTextContent, 12095 hydration = config.hydration; 12096 12097 // If this doesn't have hydration mode. 12098 12099 if (!hydration) { 12100 return { 12101 enterHydrationState: function () { 12102 return false; 12103 }, 12104 resetHydrationState: function () {}, 12105 tryToClaimNextHydratableInstance: function () {}, 12106 prepareToHydrateHostInstance: function () { 12107 invariant(false, 'Expected prepareToHydrateHostInstance() to never be called. This error is likely caused by a bug in React. Please file an issue.'); 12108 }, 12109 prepareToHydrateHostTextInstance: function () { 12110 invariant(false, 'Expected prepareToHydrateHostTextInstance() to never be called. This error is likely caused by a bug in React. Please file an issue.'); 12111 }, 12112 popHydrationState: function (fiber) { 12113 return false; 12114 } 12115 }; 12116 } 12117 12118 var canHydrateInstance = hydration.canHydrateInstance, 12119 canHydrateTextInstance = hydration.canHydrateTextInstance, 12120 getNextHydratableSibling = hydration.getNextHydratableSibling, 12121 getFirstHydratableChild = hydration.getFirstHydratableChild, 12122 hydrateInstance = hydration.hydrateInstance, 12123 hydrateTextInstance = hydration.hydrateTextInstance, 12124 didNotMatchHydratedContainerTextInstance = hydration.didNotMatchHydratedContainerTextInstance, 12125 didNotMatchHydratedTextInstance = hydration.didNotMatchHydratedTextInstance, 12126 didNotHydrateContainerInstance = hydration.didNotHydrateContainerInstance, 12127 didNotHydrateInstance = hydration.didNotHydrateInstance, 12128 didNotFindHydratableContainerInstance = hydration.didNotFindHydratableContainerInstance, 12129 didNotFindHydratableContainerTextInstance = hydration.didNotFindHydratableContainerTextInstance, 12130 didNotFindHydratableInstance = hydration.didNotFindHydratableInstance, 12131 didNotFindHydratableTextInstance = hydration.didNotFindHydratableTextInstance; 12132 12133 // The deepest Fiber on the stack involved in a hydration context. 12134 // This may have been an insertion or a hydration. 12135 12136 var hydrationParentFiber = null; 12137 var nextHydratableInstance = null; 12138 var isHydrating = false; 12139 12140 function enterHydrationState(fiber) { 12141 var parentInstance = fiber.stateNode.containerInfo; 12142 nextHydratableInstance = getFirstHydratableChild(parentInstance); 12143 hydrationParentFiber = fiber; 12144 isHydrating = true; 12145 return true; 12146 } 12147 12148 function deleteHydratableInstance(returnFiber, instance) { 12149 { 12150 switch (returnFiber.tag) { 12151 case HostRoot: 12152 didNotHydrateContainerInstance(returnFiber.stateNode.containerInfo, instance); 12153 break; 12154 case HostComponent: 12155 didNotHydrateInstance(returnFiber.type, returnFiber.memoizedProps, returnFiber.stateNode, instance); 12156 break; 12157 } 12158 } 12159 12160 var childToDelete = createFiberFromHostInstanceForDeletion(); 12161 childToDelete.stateNode = instance; 12162 childToDelete['return'] = returnFiber; 12163 childToDelete.effectTag = Deletion; 12164 12165 // This might seem like it belongs on progressedFirstDeletion. However, 12166 // these children are not part of the reconciliation list of children. 12167 // Even if we abort and rereconcile the children, that will try to hydrate 12168 // again and the nodes are still in the host tree so these will be 12169 // recreated. 12170 if (returnFiber.lastEffect !== null) { 12171 returnFiber.lastEffect.nextEffect = childToDelete; 12172 returnFiber.lastEffect = childToDelete; 12173 } else { 12174 returnFiber.firstEffect = returnFiber.lastEffect = childToDelete; 12175 } 12176 } 12177 12178 function insertNonHydratedInstance(returnFiber, fiber) { 12179 fiber.effectTag |= Placement; 12180 { 12181 switch (returnFiber.tag) { 12182 case HostRoot: 12183 { 12184 var parentContainer = returnFiber.stateNode.containerInfo; 12185 switch (fiber.tag) { 12186 case HostComponent: 12187 var type = fiber.type; 12188 var props = fiber.pendingProps; 12189 didNotFindHydratableContainerInstance(parentContainer, type, props); 12190 break; 12191 case HostText: 12192 var text = fiber.pendingProps; 12193 didNotFindHydratableContainerTextInstance(parentContainer, text); 12194 break; 12195 } 12196 break; 12197 } 12198 case HostComponent: 12199 { 12200 var parentType = returnFiber.type; 12201 var parentProps = returnFiber.memoizedProps; 12202 var parentInstance = returnFiber.stateNode; 12203 switch (fiber.tag) { 12204 case HostComponent: 12205 var _type = fiber.type; 12206 var _props = fiber.pendingProps; 12207 didNotFindHydratableInstance(parentType, parentProps, parentInstance, _type, _props); 12208 break; 12209 case HostText: 12210 var _text = fiber.pendingProps; 12211 didNotFindHydratableTextInstance(parentType, parentProps, parentInstance, _text); 12212 break; 12213 } 12214 break; 12215 } 12216 default: 12217 return; 12218 } 12219 } 12220 } 12221 12222 function tryHydrate(fiber, nextInstance) { 12223 switch (fiber.tag) { 12224 case HostComponent: 12225 { 12226 var type = fiber.type; 12227 var props = fiber.pendingProps; 12228 var instance = canHydrateInstance(nextInstance, type, props); 12229 if (instance !== null) { 12230 fiber.stateNode = instance; 12231 return true; 12232 } 12233 return false; 12234 } 12235 case HostText: 12236 { 12237 var text = fiber.pendingProps; 12238 var textInstance = canHydrateTextInstance(nextInstance, text); 12239 if (textInstance !== null) { 12240 fiber.stateNode = textInstance; 12241 return true; 12242 } 12243 return false; 12244 } 12245 default: 12246 return false; 12247 } 12248 } 12249 12250 function tryToClaimNextHydratableInstance(fiber) { 12251 if (!isHydrating) { 12252 return; 12253 } 12254 var nextInstance = nextHydratableInstance; 12255 if (!nextInstance) { 12256 // Nothing to hydrate. Make it an insertion. 12257 insertNonHydratedInstance(hydrationParentFiber, fiber); 12258 isHydrating = false; 12259 hydrationParentFiber = fiber; 12260 return; 12261 } 12262 if (!tryHydrate(fiber, nextInstance)) { 12263 // If we can't hydrate this instance let's try the next one. 12264 // We use this as a heuristic. It's based on intuition and not data so it 12265 // might be flawed or unnecessary. 12266 nextInstance = getNextHydratableSibling(nextInstance); 12267 if (!nextInstance || !tryHydrate(fiber, nextInstance)) { 12268 // Nothing to hydrate. Make it an insertion. 12269 insertNonHydratedInstance(hydrationParentFiber, fiber); 12270 isHydrating = false; 12271 hydrationParentFiber = fiber; 12272 return; 12273 } 12274 // We matched the next one, we'll now assume that the first one was 12275 // superfluous and we'll delete it. Since we can't eagerly delete it 12276 // we'll have to schedule a deletion. To do that, this node needs a dummy 12277 // fiber associated with it. 12278 deleteHydratableInstance(hydrationParentFiber, nextHydratableInstance); 12279 } 12280 hydrationParentFiber = fiber; 12281 nextHydratableInstance = getFirstHydratableChild(nextInstance); 12282 } 12283 12284 function prepareToHydrateHostInstance(fiber, rootContainerInstance, hostContext) { 12285 var instance = fiber.stateNode; 12286 var updatePayload = hydrateInstance(instance, fiber.type, fiber.memoizedProps, rootContainerInstance, hostContext, fiber); 12287 // TODO: Type this specific to this type of component. 12288 fiber.updateQueue = updatePayload; 12289 // If the update payload indicates that there is a change or if there 12290 // is a new ref we mark this as an update. 12291 if (updatePayload !== null) { 12292 return true; 12293 } 12294 return false; 12295 } 12296 12297 function prepareToHydrateHostTextInstance(fiber) { 12298 var textInstance = fiber.stateNode; 12299 var textContent = fiber.memoizedProps; 12300 var shouldUpdate = hydrateTextInstance(textInstance, textContent, fiber); 12301 { 12302 if (shouldUpdate) { 12303 // We assume that prepareToHydrateHostTextInstance is called in a context where the 12304 // hydration parent is the parent host component of this host text. 12305 var returnFiber = hydrationParentFiber; 12306 if (returnFiber !== null) { 12307 switch (returnFiber.tag) { 12308 case HostRoot: 12309 { 12310 var parentContainer = returnFiber.stateNode.containerInfo; 12311 didNotMatchHydratedContainerTextInstance(parentContainer, textInstance, textContent); 12312 break; 12313 } 12314 case HostComponent: 12315 { 12316 var parentType = returnFiber.type; 12317 var parentProps = returnFiber.memoizedProps; 12318 var parentInstance = returnFiber.stateNode; 12319 didNotMatchHydratedTextInstance(parentType, parentProps, parentInstance, textInstance, textContent); 12320 break; 12321 } 12322 } 12323 } 12324 } 12325 } 12326 return shouldUpdate; 12327 } 12328 12329 function popToNextHostParent(fiber) { 12330 var parent = fiber['return']; 12331 while (parent !== null && parent.tag !== HostComponent && parent.tag !== HostRoot) { 12332 parent = parent['return']; 12333 } 12334 hydrationParentFiber = parent; 12335 } 12336 12337 function popHydrationState(fiber) { 12338 if (fiber !== hydrationParentFiber) { 12339 // We're deeper than the current hydration context, inside an inserted 12340 // tree. 12341 return false; 12342 } 12343 if (!isHydrating) { 12344 // If we're not currently hydrating but we're in a hydration context, then 12345 // we were an insertion and now need to pop up reenter hydration of our 12346 // siblings. 12347 popToNextHostParent(fiber); 12348 isHydrating = true; 12349 return false; 12350 } 12351 12352 var type = fiber.type; 12353 12354 // If we have any remaining hydratable nodes, we need to delete them now. 12355 // We only do this deeper than head and body since they tend to have random 12356 // other nodes in them. We also ignore components with pure text content in 12357 // side of them. 12358 // TODO: Better heuristic. 12359 if (fiber.tag !== HostComponent || type !== 'head' && type !== 'body' && !shouldSetTextContent(type, fiber.memoizedProps)) { 12360 var nextInstance = nextHydratableInstance; 12361 while (nextInstance) { 12362 deleteHydratableInstance(fiber, nextInstance); 12363 nextInstance = getNextHydratableSibling(nextInstance); 12364 } 12365 } 12366 12367 popToNextHostParent(fiber); 12368 nextHydratableInstance = hydrationParentFiber ? getNextHydratableSibling(fiber.stateNode) : null; 12369 return true; 12370 } 12371 12372 function resetHydrationState() { 12373 hydrationParentFiber = null; 12374 nextHydratableInstance = null; 12375 isHydrating = false; 12376 } 12377 12378 return { 12379 enterHydrationState: enterHydrationState, 12380 resetHydrationState: resetHydrationState, 12381 tryToClaimNextHydratableInstance: tryToClaimNextHydratableInstance, 12382 prepareToHydrateHostInstance: prepareToHydrateHostInstance, 12383 prepareToHydrateHostTextInstance: prepareToHydrateHostTextInstance, 12384 popHydrationState: popHydrationState 12385 }; 12386 }; 12387 12388 // This lets us hook into Fiber to debug what it's doing. 12389 // See https://github.com/facebook/react/pull/8033. 12390 // This is not part of the public API, not even for React DevTools. 12391 // You may only inject a debugTool if you work on React Fiber itself. 12392 var ReactFiberInstrumentation = { 12393 debugTool: null 12394 }; 12395 12396 var ReactFiberInstrumentation_1 = ReactFiberInstrumentation; 12397 12398 var defaultShowDialog = function (capturedError) { 12399 return true; 12400 }; 12401 12402 var showDialog = defaultShowDialog; 12403 12404 function logCapturedError(capturedError) { 12405 var logError = showDialog(capturedError); 12406 12407 // Allow injected showDialog() to prevent default console.error logging. 12408 // This enables renderers like ReactNative to better manage redbox behavior. 12409 if (logError === false) { 12410 return; 12411 } 12412 12413 var error = capturedError.error; 12414 var suppressLogging = error && error.suppressReactErrorLogging; 12415 if (suppressLogging) { 12416 return; 12417 } 12418 12419 { 12420 var componentName = capturedError.componentName, 12421 componentStack = capturedError.componentStack, 12422 errorBoundaryName = capturedError.errorBoundaryName, 12423 errorBoundaryFound = capturedError.errorBoundaryFound, 12424 willRetry = capturedError.willRetry; 12425 12426 12427 var componentNameMessage = componentName ? 'The above error occurred in the <' + componentName + '> component:' : 'The above error occurred in one of your React components:'; 12428 12429 var errorBoundaryMessage = void 0; 12430 // errorBoundaryFound check is sufficient; errorBoundaryName check is to satisfy Flow. 12431 if (errorBoundaryFound && errorBoundaryName) { 12432 if (willRetry) { 12433 errorBoundaryMessage = 'React will try to recreate this component tree from scratch ' + ('using the error boundary you provided, ' + errorBoundaryName + '.'); 12434 } else { 12435 errorBoundaryMessage = 'This error was initially handled by the error boundary ' + errorBoundaryName + '.\n' + 'Recreating the tree from scratch failed so React will unmount the tree.'; 12436 } 12437 } else { 12438 errorBoundaryMessage = 'Consider adding an error boundary to your tree to customize error handling behavior.\n' + 'Visit https://fb.me/react-error-boundaries to learn more about error boundaries.'; 12439 } 12440 var combinedMessage = '' + componentNameMessage + componentStack + '\n\n' + ('' + errorBoundaryMessage); 12441 12442 // In development, we provide our own message with just the component stack. 12443 // We don't include the original error message and JS stack because the browser 12444 // has already printed it. Even if the application swallows the error, it is still 12445 // displayed by the browser thanks to the DEV-only fake event trick in ReactErrorUtils. 12446 console.error(combinedMessage); 12447 } 12448 } 12449 12450 var invokeGuardedCallback$1 = ReactErrorUtils.invokeGuardedCallback; 12451 var hasCaughtError = ReactErrorUtils.hasCaughtError; 12452 var clearCaughtError = ReactErrorUtils.clearCaughtError; 12453 12454 12455 { 12456 var didWarnAboutStateTransition = false; 12457 var didWarnSetStateChildContext = false; 12458 var didWarnStateUpdateForUnmountedComponent = {}; 12459 12460 var warnAboutUpdateOnUnmounted = function (fiber) { 12461 var componentName = getComponentName(fiber) || 'ReactClass'; 12462 if (didWarnStateUpdateForUnmountedComponent[componentName]) { 12463 return; 12464 } 12465 warning(false, 'Can only update a mounted or mounting ' + 'component. This usually means you called setState, replaceState, ' + 'or forceUpdate on an unmounted component. This is a no-op.\n\nPlease ' + 'check the code for the %s component.', componentName); 12466 didWarnStateUpdateForUnmountedComponent[componentName] = true; 12467 }; 12468 12469 var warnAboutInvalidUpdates = function (instance) { 12470 switch (ReactDebugCurrentFiber.phase) { 12471 case 'getChildContext': 12472 if (didWarnSetStateChildContext) { 12473 return; 12474 } 12475 warning(false, 'setState(...): Cannot call setState() inside getChildContext()'); 12476 didWarnSetStateChildContext = true; 12477 break; 12478 case 'render': 12479 if (didWarnAboutStateTransition) { 12480 return; 12481 } 12482 warning(false, 'Cannot update during an existing state transition (such as within ' + "`render` or another component's constructor). Render methods should " + 'be a pure function of props and state; constructor side-effects are ' + 'an anti-pattern, but can be moved to `componentWillMount`.'); 12483 didWarnAboutStateTransition = true; 12484 break; 12485 } 12486 }; 12487 } 12488 12489 var ReactFiberScheduler = function (config) { 12490 var hostContext = ReactFiberHostContext(config); 12491 var hydrationContext = ReactFiberHydrationContext(config); 12492 var popHostContainer = hostContext.popHostContainer, 12493 popHostContext = hostContext.popHostContext, 12494 resetHostContainer = hostContext.resetHostContainer; 12495 12496 var _ReactFiberBeginWork = ReactFiberBeginWork(config, hostContext, hydrationContext, scheduleWork, computeExpirationForFiber), 12497 beginWork = _ReactFiberBeginWork.beginWork, 12498 beginFailedWork = _ReactFiberBeginWork.beginFailedWork; 12499 12500 var _ReactFiberCompleteWo = ReactFiberCompleteWork(config, hostContext, hydrationContext), 12501 completeWork = _ReactFiberCompleteWo.completeWork; 12502 12503 var _ReactFiberCommitWork = ReactFiberCommitWork(config, captureError), 12504 commitResetTextContent = _ReactFiberCommitWork.commitResetTextContent, 12505 commitPlacement = _ReactFiberCommitWork.commitPlacement, 12506 commitDeletion = _ReactFiberCommitWork.commitDeletion, 12507 commitWork = _ReactFiberCommitWork.commitWork, 12508 commitLifeCycles = _ReactFiberCommitWork.commitLifeCycles, 12509 commitAttachRef = _ReactFiberCommitWork.commitAttachRef, 12510 commitDetachRef = _ReactFiberCommitWork.commitDetachRef; 12511 12512 var now = config.now, 12513 scheduleDeferredCallback = config.scheduleDeferredCallback, 12514 cancelDeferredCallback = config.cancelDeferredCallback, 12515 useSyncScheduling = config.useSyncScheduling, 12516 prepareForCommit = config.prepareForCommit, 12517 resetAfterCommit = config.resetAfterCommit; 12518 12519 // Represents the current time in ms. 12520 12521 var startTime = now(); 12522 var mostRecentCurrentTime = msToExpirationTime(0); 12523 12524 // Represents the expiration time that incoming updates should use. (If this 12525 // is NoWork, use the default strategy: async updates in async mode, sync 12526 // updates in sync mode.) 12527 var expirationContext = NoWork; 12528 12529 var isWorking = false; 12530 12531 // The next work in progress fiber that we're currently working on. 12532 var nextUnitOfWork = null; 12533 var nextRoot = null; 12534 // The time at which we're currently rendering work. 12535 var nextRenderExpirationTime = NoWork; 12536 12537 // The next fiber with an effect that we're currently committing. 12538 var nextEffect = null; 12539 12540 // Keep track of which fibers have captured an error that need to be handled. 12541 // Work is removed from this collection after componentDidCatch is called. 12542 var capturedErrors = null; 12543 // Keep track of which fibers have failed during the current batch of work. 12544 // This is a different set than capturedErrors, because it is not reset until 12545 // the end of the batch. This is needed to propagate errors correctly if a 12546 // subtree fails more than once. 12547 var failedBoundaries = null; 12548 // Error boundaries that captured an error during the current commit. 12549 var commitPhaseBoundaries = null; 12550 var firstUncaughtError = null; 12551 var didFatal = false; 12552 12553 var isCommitting = false; 12554 var isUnmounting = false; 12555 12556 // Used for performance tracking. 12557 var interruptedBy = null; 12558 12559 function resetContextStack() { 12560 // Reset the stack 12561 reset$1(); 12562 // Reset the cursors 12563 resetContext(); 12564 resetHostContainer(); 12565 } 12566 12567 function commitAllHostEffects() { 12568 while (nextEffect !== null) { 12569 { 12570 ReactDebugCurrentFiber.setCurrentFiber(nextEffect); 12571 } 12572 recordEffect(); 12573 12574 var effectTag = nextEffect.effectTag; 12575 if (effectTag & ContentReset) { 12576 commitResetTextContent(nextEffect); 12577 } 12578 12579 if (effectTag & Ref) { 12580 var current = nextEffect.alternate; 12581 if (current !== null) { 12582 commitDetachRef(current); 12583 } 12584 } 12585 12586 // The following switch statement is only concerned about placement, 12587 // updates, and deletions. To avoid needing to add a case for every 12588 // possible bitmap value, we remove the secondary effects from the 12589 // effect tag and switch on that value. 12590 var primaryEffectTag = effectTag & ~(Callback | Err | ContentReset | Ref | PerformedWork); 12591 switch (primaryEffectTag) { 12592 case Placement: 12593 { 12594 commitPlacement(nextEffect); 12595 // Clear the "placement" from effect tag so that we know that this is inserted, before 12596 // any life-cycles like componentDidMount gets called. 12597 // TODO: findDOMNode doesn't rely on this any more but isMounted 12598 // does and isMounted is deprecated anyway so we should be able 12599 // to kill this. 12600 nextEffect.effectTag &= ~Placement; 12601 break; 12602 } 12603 case PlacementAndUpdate: 12604 { 12605 // Placement 12606 commitPlacement(nextEffect); 12607 // Clear the "placement" from effect tag so that we know that this is inserted, before 12608 // any life-cycles like componentDidMount gets called. 12609 nextEffect.effectTag &= ~Placement; 12610 12611 // Update 12612 var _current = nextEffect.alternate; 12613 commitWork(_current, nextEffect); 12614 break; 12615 } 12616 case Update: 12617 { 12618 var _current2 = nextEffect.alternate; 12619 commitWork(_current2, nextEffect); 12620 break; 12621 } 12622 case Deletion: 12623 { 12624 isUnmounting = true; 12625 commitDeletion(nextEffect); 12626 isUnmounting = false; 12627 break; 12628 } 12629 } 12630 nextEffect = nextEffect.nextEffect; 12631 } 12632 12633 { 12634 ReactDebugCurrentFiber.resetCurrentFiber(); 12635 } 12636 } 12637 12638 function commitAllLifeCycles() { 12639 while (nextEffect !== null) { 12640 var effectTag = nextEffect.effectTag; 12641 12642 if (effectTag & (Update | Callback)) { 12643 recordEffect(); 12644 var current = nextEffect.alternate; 12645 commitLifeCycles(current, nextEffect); 12646 } 12647 12648 if (effectTag & Ref) { 12649 recordEffect(); 12650 commitAttachRef(nextEffect); 12651 } 12652 12653 if (effectTag & Err) { 12654 recordEffect(); 12655 commitErrorHandling(nextEffect); 12656 } 12657 12658 var next = nextEffect.nextEffect; 12659 // Ensure that we clean these up so that we don't accidentally keep them. 12660 // I'm not actually sure this matters because we can't reset firstEffect 12661 // and lastEffect since they're on every node, not just the effectful 12662 // ones. So we have to clean everything as we reuse nodes anyway. 12663 nextEffect.nextEffect = null; 12664 // Ensure that we reset the effectTag here so that we can rely on effect 12665 // tags to reason about the current life-cycle. 12666 nextEffect = next; 12667 } 12668 } 12669 12670 function commitRoot(finishedWork) { 12671 // We keep track of this so that captureError can collect any boundaries 12672 // that capture an error during the commit phase. The reason these aren't 12673 // local to this function is because errors that occur during cWU are 12674 // captured elsewhere, to prevent the unmount from being interrupted. 12675 isWorking = true; 12676 isCommitting = true; 12677 startCommitTimer(); 12678 12679 var root = finishedWork.stateNode; 12680 !(root.current !== finishedWork) ? invariant(false, 'Cannot commit the same tree as before. This is probably a bug related to the return field. This error is likely caused by a bug in React. Please file an issue.') : void 0; 12681 root.isReadyForCommit = false; 12682 12683 // Reset this to null before calling lifecycles 12684 ReactCurrentOwner.current = null; 12685 12686 var firstEffect = void 0; 12687 if (finishedWork.effectTag > PerformedWork) { 12688 // A fiber's effect list consists only of its children, not itself. So if 12689 // the root has an effect, we need to add it to the end of the list. The 12690 // resulting list is the set that would belong to the root's parent, if 12691 // it had one; that is, all the effects in the tree including the root. 12692 if (finishedWork.lastEffect !== null) { 12693 finishedWork.lastEffect.nextEffect = finishedWork; 12694 firstEffect = finishedWork.firstEffect; 12695 } else { 12696 firstEffect = finishedWork; 12697 } 12698 } else { 12699 // There is no effect on the root. 12700 firstEffect = finishedWork.firstEffect; 12701 } 12702 12703 prepareForCommit(); 12704 12705 // Commit all the side-effects within a tree. We'll do this in two passes. 12706 // The first pass performs all the host insertions, updates, deletions and 12707 // ref unmounts. 12708 nextEffect = firstEffect; 12709 startCommitHostEffectsTimer(); 12710 while (nextEffect !== null) { 12711 var didError = false; 12712 var _error = void 0; 12713 { 12714 invokeGuardedCallback$1(null, commitAllHostEffects, null); 12715 if (hasCaughtError()) { 12716 didError = true; 12717 _error = clearCaughtError(); 12718 } 12719 } 12720 if (didError) { 12721 !(nextEffect !== null) ? invariant(false, 'Should have next effect. This error is likely caused by a bug in React. Please file an issue.') : void 0; 12722 captureError(nextEffect, _error); 12723 // Clean-up 12724 if (nextEffect !== null) { 12725 nextEffect = nextEffect.nextEffect; 12726 } 12727 } 12728 } 12729 stopCommitHostEffectsTimer(); 12730 12731 resetAfterCommit(); 12732 12733 // The work-in-progress tree is now the current tree. This must come after 12734 // the first pass of the commit phase, so that the previous tree is still 12735 // current during componentWillUnmount, but before the second pass, so that 12736 // the finished work is current during componentDidMount/Update. 12737 root.current = finishedWork; 12738 12739 // In the second pass we'll perform all life-cycles and ref callbacks. 12740 // Life-cycles happen as a separate pass so that all placements, updates, 12741 // and deletions in the entire tree have already been invoked. 12742 // This pass also triggers any renderer-specific initial effects. 12743 nextEffect = firstEffect; 12744 startCommitLifeCyclesTimer(); 12745 while (nextEffect !== null) { 12746 var _didError = false; 12747 var _error2 = void 0; 12748 { 12749 invokeGuardedCallback$1(null, commitAllLifeCycles, null); 12750 if (hasCaughtError()) { 12751 _didError = true; 12752 _error2 = clearCaughtError(); 12753 } 12754 } 12755 if (_didError) { 12756 !(nextEffect !== null) ? invariant(false, 'Should have next effect. This error is likely caused by a bug in React. Please file an issue.') : void 0; 12757 captureError(nextEffect, _error2); 12758 if (nextEffect !== null) { 12759 nextEffect = nextEffect.nextEffect; 12760 } 12761 } 12762 } 12763 12764 isCommitting = false; 12765 isWorking = false; 12766 stopCommitLifeCyclesTimer(); 12767 stopCommitTimer(); 12768 if (typeof onCommitRoot === 'function') { 12769 onCommitRoot(finishedWork.stateNode); 12770 } 12771 if (true && ReactFiberInstrumentation_1.debugTool) { 12772 ReactFiberInstrumentation_1.debugTool.onCommitWork(finishedWork); 12773 } 12774 12775 // If we caught any errors during this commit, schedule their boundaries 12776 // to update. 12777 if (commitPhaseBoundaries) { 12778 commitPhaseBoundaries.forEach(scheduleErrorRecovery); 12779 commitPhaseBoundaries = null; 12780 } 12781 12782 if (firstUncaughtError !== null) { 12783 var _error3 = firstUncaughtError; 12784 firstUncaughtError = null; 12785 onUncaughtError(_error3); 12786 } 12787 12788 var remainingTime = root.current.expirationTime; 12789 12790 if (remainingTime === NoWork) { 12791 capturedErrors = null; 12792 failedBoundaries = null; 12793 } 12794 12795 return remainingTime; 12796 } 12797 12798 function resetExpirationTime(workInProgress, renderTime) { 12799 if (renderTime !== Never && workInProgress.expirationTime === Never) { 12800 // The children of this component are hidden. Don't bubble their 12801 // expiration times. 12802 return; 12803 } 12804 12805 // Check for pending updates. 12806 var newExpirationTime = getUpdateExpirationTime(workInProgress); 12807 12808 // TODO: Calls need to visit stateNode 12809 12810 // Bubble up the earliest expiration time. 12811 var child = workInProgress.child; 12812 while (child !== null) { 12813 if (child.expirationTime !== NoWork && (newExpirationTime === NoWork || newExpirationTime > child.expirationTime)) { 12814 newExpirationTime = child.expirationTime; 12815 } 12816 child = child.sibling; 12817 } 12818 workInProgress.expirationTime = newExpirationTime; 12819 } 12820 12821 function completeUnitOfWork(workInProgress) { 12822 while (true) { 12823 // The current, flushed, state of this fiber is the alternate. 12824 // Ideally nothing should rely on this, but relying on it here 12825 // means that we don't need an additional field on the work in 12826 // progress. 12827 var current = workInProgress.alternate; 12828 { 12829 ReactDebugCurrentFiber.setCurrentFiber(workInProgress); 12830 } 12831 var next = completeWork(current, workInProgress, nextRenderExpirationTime); 12832 { 12833 ReactDebugCurrentFiber.resetCurrentFiber(); 12834 } 12835 12836 var returnFiber = workInProgress['return']; 12837 var siblingFiber = workInProgress.sibling; 12838 12839 resetExpirationTime(workInProgress, nextRenderExpirationTime); 12840 12841 if (next !== null) { 12842 stopWorkTimer(workInProgress); 12843 if (true && ReactFiberInstrumentation_1.debugTool) { 12844 ReactFiberInstrumentation_1.debugTool.onCompleteWork(workInProgress); 12845 } 12846 // If completing this work spawned new work, do that next. We'll come 12847 // back here again. 12848 return next; 12849 } 12850 12851 if (returnFiber !== null) { 12852 // Append all the effects of the subtree and this fiber onto the effect 12853 // list of the parent. The completion order of the children affects the 12854 // side-effect order. 12855 if (returnFiber.firstEffect === null) { 12856 returnFiber.firstEffect = workInProgress.firstEffect; 12857 } 12858 if (workInProgress.lastEffect !== null) { 12859 if (returnFiber.lastEffect !== null) { 12860 returnFiber.lastEffect.nextEffect = workInProgress.firstEffect; 12861 } 12862 returnFiber.lastEffect = workInProgress.lastEffect; 12863 } 12864 12865 // If this fiber had side-effects, we append it AFTER the children's 12866 // side-effects. We can perform certain side-effects earlier if 12867 // needed, by doing multiple passes over the effect list. We don't want 12868 // to schedule our own side-effect on our own list because if end up 12869 // reusing children we'll schedule this effect onto itself since we're 12870 // at the end. 12871 var effectTag = workInProgress.effectTag; 12872 // Skip both NoWork and PerformedWork tags when creating the effect list. 12873 // PerformedWork effect is read by React DevTools but shouldn't be committed. 12874 if (effectTag > PerformedWork) { 12875 if (returnFiber.lastEffect !== null) { 12876 returnFiber.lastEffect.nextEffect = workInProgress; 12877 } else { 12878 returnFiber.firstEffect = workInProgress; 12879 } 12880 returnFiber.lastEffect = workInProgress; 12881 } 12882 } 12883 12884 stopWorkTimer(workInProgress); 12885 if (true && ReactFiberInstrumentation_1.debugTool) { 12886 ReactFiberInstrumentation_1.debugTool.onCompleteWork(workInProgress); 12887 } 12888 12889 if (siblingFiber !== null) { 12890 // If there is more work to do in this returnFiber, do that next. 12891 return siblingFiber; 12892 } else if (returnFiber !== null) { 12893 // If there's no more work in this returnFiber. Complete the returnFiber. 12894 workInProgress = returnFiber; 12895 continue; 12896 } else { 12897 // We've reached the root. 12898 var root = workInProgress.stateNode; 12899 root.isReadyForCommit = true; 12900 return null; 12901 } 12902 } 12903 12904 // Without this explicit null return Flow complains of invalid return type 12905 // TODO Remove the above while(true) loop 12906 // eslint-disable-next-line no-unreachable 12907 return null; 12908 } 12909 12910 function performUnitOfWork(workInProgress) { 12911 // The current, flushed, state of this fiber is the alternate. 12912 // Ideally nothing should rely on this, but relying on it here 12913 // means that we don't need an additional field on the work in 12914 // progress. 12915 var current = workInProgress.alternate; 12916 12917 // See if beginning this work spawns more work. 12918 startWorkTimer(workInProgress); 12919 { 12920 ReactDebugCurrentFiber.setCurrentFiber(workInProgress); 12921 } 12922 12923 var next = beginWork(current, workInProgress, nextRenderExpirationTime); 12924 { 12925 ReactDebugCurrentFiber.resetCurrentFiber(); 12926 } 12927 if (true && ReactFiberInstrumentation_1.debugTool) { 12928 ReactFiberInstrumentation_1.debugTool.onBeginWork(workInProgress); 12929 } 12930 12931 if (next === null) { 12932 // If this doesn't spawn new work, complete the current work. 12933 next = completeUnitOfWork(workInProgress); 12934 } 12935 12936 ReactCurrentOwner.current = null; 12937 12938 return next; 12939 } 12940 12941 function performFailedUnitOfWork(workInProgress) { 12942 // The current, flushed, state of this fiber is the alternate. 12943 // Ideally nothing should rely on this, but relying on it here 12944 // means that we don't need an additional field on the work in 12945 // progress. 12946 var current = workInProgress.alternate; 12947 12948 // See if beginning this work spawns more work. 12949 startWorkTimer(workInProgress); 12950 { 12951 ReactDebugCurrentFiber.setCurrentFiber(workInProgress); 12952 } 12953 var next = beginFailedWork(current, workInProgress, nextRenderExpirationTime); 12954 { 12955 ReactDebugCurrentFiber.resetCurrentFiber(); 12956 } 12957 if (true && ReactFiberInstrumentation_1.debugTool) { 12958 ReactFiberInstrumentation_1.debugTool.onBeginWork(workInProgress); 12959 } 12960 12961 if (next === null) { 12962 // If this doesn't spawn new work, complete the current work. 12963 next = completeUnitOfWork(workInProgress); 12964 } 12965 12966 ReactCurrentOwner.current = null; 12967 12968 return next; 12969 } 12970 12971 function workLoop(expirationTime) { 12972 if (capturedErrors !== null) { 12973 // If there are unhandled errors, switch to the slow work loop. 12974 // TODO: How to avoid this check in the fast path? Maybe the renderer 12975 // could keep track of which roots have unhandled errors and call a 12976 // forked version of renderRoot. 12977 slowWorkLoopThatChecksForFailedWork(expirationTime); 12978 return; 12979 } 12980 if (nextRenderExpirationTime === NoWork || nextRenderExpirationTime > expirationTime) { 12981 return; 12982 } 12983 12984 if (nextRenderExpirationTime <= mostRecentCurrentTime) { 12985 // Flush all expired work. 12986 while (nextUnitOfWork !== null) { 12987 nextUnitOfWork = performUnitOfWork(nextUnitOfWork); 12988 } 12989 } else { 12990 // Flush asynchronous work until the deadline runs out of time. 12991 while (nextUnitOfWork !== null && !shouldYield()) { 12992 nextUnitOfWork = performUnitOfWork(nextUnitOfWork); 12993 } 12994 } 12995 } 12996 12997 function slowWorkLoopThatChecksForFailedWork(expirationTime) { 12998 if (nextRenderExpirationTime === NoWork || nextRenderExpirationTime > expirationTime) { 12999 return; 13000 } 13001 13002 if (nextRenderExpirationTime <= mostRecentCurrentTime) { 13003 // Flush all expired work. 13004 while (nextUnitOfWork !== null) { 13005 if (hasCapturedError(nextUnitOfWork)) { 13006 // Use a forked version of performUnitOfWork 13007 nextUnitOfWork = performFailedUnitOfWork(nextUnitOfWork); 13008 } else { 13009 nextUnitOfWork = performUnitOfWork(nextUnitOfWork); 13010 } 13011 } 13012 } else { 13013 // Flush asynchronous work until the deadline runs out of time. 13014 while (nextUnitOfWork !== null && !shouldYield()) { 13015 if (hasCapturedError(nextUnitOfWork)) { 13016 // Use a forked version of performUnitOfWork 13017 nextUnitOfWork = performFailedUnitOfWork(nextUnitOfWork); 13018 } else { 13019 nextUnitOfWork = performUnitOfWork(nextUnitOfWork); 13020 } 13021 } 13022 } 13023 } 13024 13025 function renderRootCatchBlock(root, failedWork, boundary, expirationTime) { 13026 // We're going to restart the error boundary that captured the error. 13027 // Conceptually, we're unwinding the stack. We need to unwind the 13028 // context stack, too. 13029 unwindContexts(failedWork, boundary); 13030 13031 // Restart the error boundary using a forked version of 13032 // performUnitOfWork that deletes the boundary's children. The entire 13033 // failed subree will be unmounted. During the commit phase, a special 13034 // lifecycle method is called on the error boundary, which triggers 13035 // a re-render. 13036 nextUnitOfWork = performFailedUnitOfWork(boundary); 13037 13038 // Continue working. 13039 workLoop(expirationTime); 13040 } 13041 13042 function renderRoot(root, expirationTime) { 13043 !!isWorking ? invariant(false, 'renderRoot was called recursively. This error is likely caused by a bug in React. Please file an issue.') : void 0; 13044 isWorking = true; 13045 13046 // We're about to mutate the work-in-progress tree. If the root was pending 13047 // commit, it no longer is: we'll need to complete it again. 13048 root.isReadyForCommit = false; 13049 13050 // Check if we're starting from a fresh stack, or if we're resuming from 13051 // previously yielded work. 13052 if (root !== nextRoot || expirationTime !== nextRenderExpirationTime || nextUnitOfWork === null) { 13053 // Reset the stack and start working from the root. 13054 resetContextStack(); 13055 nextRoot = root; 13056 nextRenderExpirationTime = expirationTime; 13057 nextUnitOfWork = createWorkInProgress(nextRoot.current, null, expirationTime); 13058 } 13059 13060 startWorkLoopTimer(nextUnitOfWork); 13061 13062 var didError = false; 13063 var error = null; 13064 { 13065 invokeGuardedCallback$1(null, workLoop, null, expirationTime); 13066 if (hasCaughtError()) { 13067 didError = true; 13068 error = clearCaughtError(); 13069 } 13070 } 13071 13072 // An error was thrown during the render phase. 13073 while (didError) { 13074 if (didFatal) { 13075 // This was a fatal error. Don't attempt to recover from it. 13076 firstUncaughtError = error; 13077 break; 13078 } 13079 13080 var failedWork = nextUnitOfWork; 13081 if (failedWork === null) { 13082 // An error was thrown but there's no current unit of work. This can 13083 // happen during the commit phase if there's a bug in the renderer. 13084 didFatal = true; 13085 continue; 13086 } 13087 13088 // "Capture" the error by finding the nearest boundary. If there is no 13089 // error boundary, we use the root. 13090 var boundary = captureError(failedWork, error); 13091 !(boundary !== null) ? invariant(false, 'Should have found an error boundary. This error is likely caused by a bug in React. Please file an issue.') : void 0; 13092 13093 if (didFatal) { 13094 // The error we just captured was a fatal error. This happens 13095 // when the error propagates to the root more than once. 13096 continue; 13097 } 13098 13099 didError = false; 13100 error = null; 13101 { 13102 invokeGuardedCallback$1(null, renderRootCatchBlock, null, root, failedWork, boundary, expirationTime); 13103 if (hasCaughtError()) { 13104 didError = true; 13105 error = clearCaughtError(); 13106 continue; 13107 } 13108 } 13109 // We're finished working. Exit the error loop. 13110 break; 13111 } 13112 13113 var uncaughtError = firstUncaughtError; 13114 13115 // We're done performing work. Time to clean up. 13116 stopWorkLoopTimer(interruptedBy); 13117 interruptedBy = null; 13118 isWorking = false; 13119 didFatal = false; 13120 firstUncaughtError = null; 13121 13122 if (uncaughtError !== null) { 13123 onUncaughtError(uncaughtError); 13124 } 13125 13126 return root.isReadyForCommit ? root.current.alternate : null; 13127 } 13128 13129 // Returns the boundary that captured the error, or null if the error is ignored 13130 function captureError(failedWork, error) { 13131 // It is no longer valid because we exited the user code. 13132 ReactCurrentOwner.current = null; 13133 { 13134 ReactDebugCurrentFiber.resetCurrentFiber(); 13135 } 13136 13137 // Search for the nearest error boundary. 13138 var boundary = null; 13139 13140 // Passed to logCapturedError() 13141 var errorBoundaryFound = false; 13142 var willRetry = false; 13143 var errorBoundaryName = null; 13144 13145 // Host containers are a special case. If the failed work itself is a host 13146 // container, then it acts as its own boundary. In all other cases, we 13147 // ignore the work itself and only search through the parents. 13148 if (failedWork.tag === HostRoot) { 13149 boundary = failedWork; 13150 13151 if (isFailedBoundary(failedWork)) { 13152 // If this root already failed, there must have been an error when 13153 // attempting to unmount it. This is a worst-case scenario and 13154 // should only be possible if there's a bug in the renderer. 13155 didFatal = true; 13156 } 13157 } else { 13158 var node = failedWork['return']; 13159 while (node !== null && boundary === null) { 13160 if (node.tag === ClassComponent) { 13161 var instance = node.stateNode; 13162 if (typeof instance.componentDidCatch === 'function') { 13163 errorBoundaryFound = true; 13164 errorBoundaryName = getComponentName(node); 13165 13166 // Found an error boundary! 13167 boundary = node; 13168 willRetry = true; 13169 } 13170 } else if (node.tag === HostRoot) { 13171 // Treat the root like a no-op error boundary 13172 boundary = node; 13173 } 13174 13175 if (isFailedBoundary(node)) { 13176 // This boundary is already in a failed state. 13177 13178 // If we're currently unmounting, that means this error was 13179 // thrown while unmounting a failed subtree. We should ignore 13180 // the error. 13181 if (isUnmounting) { 13182 return null; 13183 } 13184 13185 // If we're in the commit phase, we should check to see if 13186 // this boundary already captured an error during this commit. 13187 // This case exists because multiple errors can be thrown during 13188 // a single commit without interruption. 13189 if (commitPhaseBoundaries !== null && (commitPhaseBoundaries.has(node) || node.alternate !== null && commitPhaseBoundaries.has(node.alternate))) { 13190 // If so, we should ignore this error. 13191 return null; 13192 } 13193 13194 // The error should propagate to the next boundary -— we keep looking. 13195 boundary = null; 13196 willRetry = false; 13197 } 13198 13199 node = node['return']; 13200 } 13201 } 13202 13203 if (boundary !== null) { 13204 // Add to the collection of failed boundaries. This lets us know that 13205 // subsequent errors in this subtree should propagate to the next boundary. 13206 if (failedBoundaries === null) { 13207 failedBoundaries = new Set(); 13208 } 13209 failedBoundaries.add(boundary); 13210 13211 // This method is unsafe outside of the begin and complete phases. 13212 // We might be in the commit phase when an error is captured. 13213 // The risk is that the return path from this Fiber may not be accurate. 13214 // That risk is acceptable given the benefit of providing users more context. 13215 var _componentStack = getStackAddendumByWorkInProgressFiber(failedWork); 13216 var _componentName = getComponentName(failedWork); 13217 13218 // Add to the collection of captured errors. This is stored as a global 13219 // map of errors and their component stack location keyed by the boundaries 13220 // that capture them. We mostly use this Map as a Set; it's a Map only to 13221 // avoid adding a field to Fiber to store the error. 13222 if (capturedErrors === null) { 13223 capturedErrors = new Map(); 13224 } 13225 13226 var capturedError = { 13227 componentName: _componentName, 13228 componentStack: _componentStack, 13229 error: error, 13230 errorBoundary: errorBoundaryFound ? boundary.stateNode : null, 13231 errorBoundaryFound: errorBoundaryFound, 13232 errorBoundaryName: errorBoundaryName, 13233 willRetry: willRetry 13234 }; 13235 13236 capturedErrors.set(boundary, capturedError); 13237 13238 try { 13239 logCapturedError(capturedError); 13240 } catch (e) { 13241 // Prevent cycle if logCapturedError() throws. 13242 // A cycle may still occur if logCapturedError renders a component that throws. 13243 var suppressLogging = e && e.suppressReactErrorLogging; 13244 if (!suppressLogging) { 13245 console.error(e); 13246 } 13247 } 13248 13249 // If we're in the commit phase, defer scheduling an update on the 13250 // boundary until after the commit is complete 13251 if (isCommitting) { 13252 if (commitPhaseBoundaries === null) { 13253 commitPhaseBoundaries = new Set(); 13254 } 13255 commitPhaseBoundaries.add(boundary); 13256 } else { 13257 // Otherwise, schedule an update now. 13258 // TODO: Is this actually necessary during the render phase? Is it 13259 // possible to unwind and continue rendering at the same priority, 13260 // without corrupting internal state? 13261 scheduleErrorRecovery(boundary); 13262 } 13263 return boundary; 13264 } else if (firstUncaughtError === null) { 13265 // If no boundary is found, we'll need to throw the error 13266 firstUncaughtError = error; 13267 } 13268 return null; 13269 } 13270 13271 function hasCapturedError(fiber) { 13272 // TODO: capturedErrors should store the boundary instance, to avoid needing 13273 // to check the alternate. 13274 return capturedErrors !== null && (capturedErrors.has(fiber) || fiber.alternate !== null && capturedErrors.has(fiber.alternate)); 13275 } 13276 13277 function isFailedBoundary(fiber) { 13278 // TODO: failedBoundaries should store the boundary instance, to avoid 13279 // needing to check the alternate. 13280 return failedBoundaries !== null && (failedBoundaries.has(fiber) || fiber.alternate !== null && failedBoundaries.has(fiber.alternate)); 13281 } 13282 13283 function commitErrorHandling(effectfulFiber) { 13284 var capturedError = void 0; 13285 if (capturedErrors !== null) { 13286 capturedError = capturedErrors.get(effectfulFiber); 13287 capturedErrors['delete'](effectfulFiber); 13288 if (capturedError == null) { 13289 if (effectfulFiber.alternate !== null) { 13290 effectfulFiber = effectfulFiber.alternate; 13291 capturedError = capturedErrors.get(effectfulFiber); 13292 capturedErrors['delete'](effectfulFiber); 13293 } 13294 } 13295 } 13296 13297 !(capturedError != null) ? invariant(false, 'No error for given unit of work. This error is likely caused by a bug in React. Please file an issue.') : void 0; 13298 13299 switch (effectfulFiber.tag) { 13300 case ClassComponent: 13301 var instance = effectfulFiber.stateNode; 13302 13303 var info = { 13304 componentStack: capturedError.componentStack 13305 }; 13306 13307 // Allow the boundary to handle the error, usually by scheduling 13308 // an update to itself 13309 instance.componentDidCatch(capturedError.error, info); 13310 return; 13311 case HostRoot: 13312 if (firstUncaughtError === null) { 13313 firstUncaughtError = capturedError.error; 13314 } 13315 return; 13316 default: 13317 invariant(false, 'Invalid type of work. This error is likely caused by a bug in React. Please file an issue.'); 13318 } 13319 } 13320 13321 function unwindContexts(from, to) { 13322 var node = from; 13323 while (node !== null) { 13324 switch (node.tag) { 13325 case ClassComponent: 13326 popContextProvider(node); 13327 break; 13328 case HostComponent: 13329 popHostContext(node); 13330 break; 13331 case HostRoot: 13332 popHostContainer(node); 13333 break; 13334 case HostPortal: 13335 popHostContainer(node); 13336 break; 13337 } 13338 if (node === to || node.alternate === to) { 13339 stopFailedWorkTimer(node); 13340 break; 13341 } else { 13342 stopWorkTimer(node); 13343 } 13344 node = node['return']; 13345 } 13346 } 13347 13348 function computeAsyncExpiration() { 13349 // Given the current clock time, returns an expiration time. We use rounding 13350 // to batch like updates together. 13351 // Should complete within ~1000ms. 1200ms max. 13352 var currentTime = recalculateCurrentTime(); 13353 var expirationMs = 1000; 13354 var bucketSizeMs = 200; 13355 return computeExpirationBucket(currentTime, expirationMs, bucketSizeMs); 13356 } 13357 13358 function computeExpirationForFiber(fiber) { 13359 var expirationTime = void 0; 13360 if (expirationContext !== NoWork) { 13361 // An explicit expiration context was set; 13362 expirationTime = expirationContext; 13363 } else if (isWorking) { 13364 if (isCommitting) { 13365 // Updates that occur during the commit phase should have sync priority 13366 // by default. 13367 expirationTime = Sync; 13368 } else { 13369 // Updates during the render phase should expire at the same time as 13370 // the work that is being rendered. 13371 expirationTime = nextRenderExpirationTime; 13372 } 13373 } else { 13374 // No explicit expiration context was set, and we're not currently 13375 // performing work. Calculate a new expiration time. 13376 if (useSyncScheduling && !(fiber.internalContextTag & AsyncUpdates)) { 13377 // This is a sync update 13378 expirationTime = Sync; 13379 } else { 13380 // This is an async update 13381 expirationTime = computeAsyncExpiration(); 13382 } 13383 } 13384 return expirationTime; 13385 } 13386 13387 function scheduleWork(fiber, expirationTime) { 13388 return scheduleWorkImpl(fiber, expirationTime, false); 13389 } 13390 13391 function checkRootNeedsClearing(root, fiber, expirationTime) { 13392 if (!isWorking && root === nextRoot && expirationTime < nextRenderExpirationTime) { 13393 // Restart the root from the top. 13394 if (nextUnitOfWork !== null) { 13395 // This is an interruption. (Used for performance tracking.) 13396 interruptedBy = fiber; 13397 } 13398 nextRoot = null; 13399 nextUnitOfWork = null; 13400 nextRenderExpirationTime = NoWork; 13401 } 13402 } 13403 13404 function scheduleWorkImpl(fiber, expirationTime, isErrorRecovery) { 13405 recordScheduleUpdate(); 13406 13407 { 13408 if (!isErrorRecovery && fiber.tag === ClassComponent) { 13409 var instance = fiber.stateNode; 13410 warnAboutInvalidUpdates(instance); 13411 } 13412 } 13413 13414 var node = fiber; 13415 while (node !== null) { 13416 // Walk the parent path to the root and update each node's 13417 // expiration time. 13418 if (node.expirationTime === NoWork || node.expirationTime > expirationTime) { 13419 node.expirationTime = expirationTime; 13420 } 13421 if (node.alternate !== null) { 13422 if (node.alternate.expirationTime === NoWork || node.alternate.expirationTime > expirationTime) { 13423 node.alternate.expirationTime = expirationTime; 13424 } 13425 } 13426 if (node['return'] === null) { 13427 if (node.tag === HostRoot) { 13428 var root = node.stateNode; 13429 13430 checkRootNeedsClearing(root, fiber, expirationTime); 13431 requestWork(root, expirationTime); 13432 checkRootNeedsClearing(root, fiber, expirationTime); 13433 } else { 13434 { 13435 if (!isErrorRecovery && fiber.tag === ClassComponent) { 13436 warnAboutUpdateOnUnmounted(fiber); 13437 } 13438 } 13439 return; 13440 } 13441 } 13442 node = node['return']; 13443 } 13444 } 13445 13446 function scheduleErrorRecovery(fiber) { 13447 scheduleWorkImpl(fiber, Sync, true); 13448 } 13449 13450 function recalculateCurrentTime() { 13451 // Subtract initial time so it fits inside 32bits 13452 var ms = now() - startTime; 13453 mostRecentCurrentTime = msToExpirationTime(ms); 13454 return mostRecentCurrentTime; 13455 } 13456 13457 function deferredUpdates(fn) { 13458 var previousExpirationContext = expirationContext; 13459 expirationContext = computeAsyncExpiration(); 13460 try { 13461 return fn(); 13462 } finally { 13463 expirationContext = previousExpirationContext; 13464 } 13465 } 13466 13467 function syncUpdates(fn) { 13468 var previousExpirationContext = expirationContext; 13469 expirationContext = Sync; 13470 try { 13471 return fn(); 13472 } finally { 13473 expirationContext = previousExpirationContext; 13474 } 13475 } 13476 13477 // TODO: Everything below this is written as if it has been lifted to the 13478 // renderers. I'll do this in a follow-up. 13479 13480 // Linked-list of roots 13481 var firstScheduledRoot = null; 13482 var lastScheduledRoot = null; 13483 13484 var callbackExpirationTime = NoWork; 13485 var callbackID = -1; 13486 var isRendering = false; 13487 var nextFlushedRoot = null; 13488 var nextFlushedExpirationTime = NoWork; 13489 var deadlineDidExpire = false; 13490 var hasUnhandledError = false; 13491 var unhandledError = null; 13492 var deadline = null; 13493 13494 var isBatchingUpdates = false; 13495 var isUnbatchingUpdates = false; 13496 13497 // Use these to prevent an infinite loop of nested updates 13498 var NESTED_UPDATE_LIMIT = 1000; 13499 var nestedUpdateCount = 0; 13500 13501 var timeHeuristicForUnitOfWork = 1; 13502 13503 function scheduleCallbackWithExpiration(expirationTime) { 13504 if (callbackExpirationTime !== NoWork) { 13505 // A callback is already scheduled. Check its expiration time (timeout). 13506 if (expirationTime > callbackExpirationTime) { 13507 // Existing callback has sufficient timeout. Exit. 13508 return; 13509 } else { 13510 // Existing callback has insufficient timeout. Cancel and schedule a 13511 // new one. 13512 cancelDeferredCallback(callbackID); 13513 } 13514 // The request callback timer is already running. Don't start a new one. 13515 } else { 13516 startRequestCallbackTimer(); 13517 } 13518 13519 // Compute a timeout for the given expiration time. 13520 var currentMs = now() - startTime; 13521 var expirationMs = expirationTimeToMs(expirationTime); 13522 var timeout = expirationMs - currentMs; 13523 13524 callbackExpirationTime = expirationTime; 13525 callbackID = scheduleDeferredCallback(performAsyncWork, { timeout: timeout }); 13526 } 13527 13528 // requestWork is called by the scheduler whenever a root receives an update. 13529 // It's up to the renderer to call renderRoot at some point in the future. 13530 function requestWork(root, expirationTime) { 13531 if (nestedUpdateCount > NESTED_UPDATE_LIMIT) { 13532 invariant(false, 'Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.'); 13533 } 13534 13535 // Add the root to the schedule. 13536 // Check if this root is already part of the schedule. 13537 if (root.nextScheduledRoot === null) { 13538 // This root is not already scheduled. Add it. 13539 root.remainingExpirationTime = expirationTime; 13540 if (lastScheduledRoot === null) { 13541 firstScheduledRoot = lastScheduledRoot = root; 13542 root.nextScheduledRoot = root; 13543 } else { 13544 lastScheduledRoot.nextScheduledRoot = root; 13545 lastScheduledRoot = root; 13546 lastScheduledRoot.nextScheduledRoot = firstScheduledRoot; 13547 } 13548 } else { 13549 // This root is already scheduled, but its priority may have increased. 13550 var remainingExpirationTime = root.remainingExpirationTime; 13551 if (remainingExpirationTime === NoWork || expirationTime < remainingExpirationTime) { 13552 // Update the priority. 13553 root.remainingExpirationTime = expirationTime; 13554 } 13555 } 13556 13557 if (isRendering) { 13558 // Prevent reentrancy. Remaining work will be scheduled at the end of 13559 // the currently rendering batch. 13560 return; 13561 } 13562 13563 if (isBatchingUpdates) { 13564 // Flush work at the end of the batch. 13565 if (isUnbatchingUpdates) { 13566 // ...unless we're inside unbatchedUpdates, in which case we should 13567 // flush it now. 13568 nextFlushedRoot = root; 13569 nextFlushedExpirationTime = Sync; 13570 performWorkOnRoot(nextFlushedRoot, nextFlushedExpirationTime); 13571 } 13572 return; 13573 } 13574 13575 // TODO: Get rid of Sync and use current time? 13576 if (expirationTime === Sync) { 13577 performWork(Sync, null); 13578 } else { 13579 scheduleCallbackWithExpiration(expirationTime); 13580 } 13581 } 13582 13583 function findHighestPriorityRoot() { 13584 var highestPriorityWork = NoWork; 13585 var highestPriorityRoot = null; 13586 13587 if (lastScheduledRoot !== null) { 13588 var previousScheduledRoot = lastScheduledRoot; 13589 var root = firstScheduledRoot; 13590 while (root !== null) { 13591 var remainingExpirationTime = root.remainingExpirationTime; 13592 if (remainingExpirationTime === NoWork) { 13593 // This root no longer has work. Remove it from the scheduler. 13594 13595 // TODO: This check is redudant, but Flow is confused by the branch 13596 // below where we set lastScheduledRoot to null, even though we break 13597 // from the loop right after. 13598 !(previousScheduledRoot !== null && lastScheduledRoot !== null) ? invariant(false, 'Should have a previous and last root. This error is likely caused by a bug in React. Please file an issue.') : void 0; 13599 if (root === root.nextScheduledRoot) { 13600 // This is the only root in the list. 13601 root.nextScheduledRoot = null; 13602 firstScheduledRoot = lastScheduledRoot = null; 13603 break; 13604 } else if (root === firstScheduledRoot) { 13605 // This is the first root in the list. 13606 var next = root.nextScheduledRoot; 13607 firstScheduledRoot = next; 13608 lastScheduledRoot.nextScheduledRoot = next; 13609 root.nextScheduledRoot = null; 13610 } else if (root === lastScheduledRoot) { 13611 // This is the last root in the list. 13612 lastScheduledRoot = previousScheduledRoot; 13613 lastScheduledRoot.nextScheduledRoot = firstScheduledRoot; 13614 root.nextScheduledRoot = null; 13615 break; 13616 } else { 13617 previousScheduledRoot.nextScheduledRoot = root.nextScheduledRoot; 13618 root.nextScheduledRoot = null; 13619 } 13620 root = previousScheduledRoot.nextScheduledRoot; 13621 } else { 13622 if (highestPriorityWork === NoWork || remainingExpirationTime < highestPriorityWork) { 13623 // Update the priority, if it's higher 13624 highestPriorityWork = remainingExpirationTime; 13625 highestPriorityRoot = root; 13626 } 13627 if (root === lastScheduledRoot) { 13628 break; 13629 } 13630 previousScheduledRoot = root; 13631 root = root.nextScheduledRoot; 13632 } 13633 } 13634 } 13635 13636 // If the next root is the same as the previous root, this is a nested 13637 // update. To prevent an infinite loop, increment the nested update count. 13638 var previousFlushedRoot = nextFlushedRoot; 13639 if (previousFlushedRoot !== null && previousFlushedRoot === highestPriorityRoot) { 13640 nestedUpdateCount++; 13641 } else { 13642 // Reset whenever we switch roots. 13643 nestedUpdateCount = 0; 13644 } 13645 nextFlushedRoot = highestPriorityRoot; 13646 nextFlushedExpirationTime = highestPriorityWork; 13647 } 13648 13649 function performAsyncWork(dl) { 13650 performWork(NoWork, dl); 13651 } 13652 13653 function performWork(minExpirationTime, dl) { 13654 deadline = dl; 13655 13656 // Keep working on roots until there's no more work, or until the we reach 13657 // the deadline. 13658 findHighestPriorityRoot(); 13659 13660 if (enableUserTimingAPI && deadline !== null) { 13661 var didExpire = nextFlushedExpirationTime < recalculateCurrentTime(); 13662 stopRequestCallbackTimer(didExpire); 13663 } 13664 13665 while (nextFlushedRoot !== null && nextFlushedExpirationTime !== NoWork && (minExpirationTime === NoWork || nextFlushedExpirationTime <= minExpirationTime) && !deadlineDidExpire) { 13666 performWorkOnRoot(nextFlushedRoot, nextFlushedExpirationTime); 13667 // Find the next highest priority work. 13668 findHighestPriorityRoot(); 13669 } 13670 13671 // We're done flushing work. Either we ran out of time in this callback, 13672 // or there's no more work left with sufficient priority. 13673 13674 // If we're inside a callback, set this to false since we just completed it. 13675 if (deadline !== null) { 13676 callbackExpirationTime = NoWork; 13677 callbackID = -1; 13678 } 13679 // If there's work left over, schedule a new callback. 13680 if (nextFlushedExpirationTime !== NoWork) { 13681 scheduleCallbackWithExpiration(nextFlushedExpirationTime); 13682 } 13683 13684 // Clean-up. 13685 deadline = null; 13686 deadlineDidExpire = false; 13687 nestedUpdateCount = 0; 13688 13689 if (hasUnhandledError) { 13690 var _error4 = unhandledError; 13691 unhandledError = null; 13692 hasUnhandledError = false; 13693 throw _error4; 13694 } 13695 } 13696 13697 function performWorkOnRoot(root, expirationTime) { 13698 !!isRendering ? invariant(false, 'performWorkOnRoot was called recursively. This error is likely caused by a bug in React. Please file an issue.') : void 0; 13699 13700 isRendering = true; 13701 13702 // Check if this is async work or sync/expired work. 13703 // TODO: Pass current time as argument to renderRoot, commitRoot 13704 if (expirationTime <= recalculateCurrentTime()) { 13705 // Flush sync work. 13706 var finishedWork = root.finishedWork; 13707 if (finishedWork !== null) { 13708 // This root is already complete. We can commit it. 13709 root.finishedWork = null; 13710 root.remainingExpirationTime = commitRoot(finishedWork); 13711 } else { 13712 root.finishedWork = null; 13713 finishedWork = renderRoot(root, expirationTime); 13714 if (finishedWork !== null) { 13715 // We've completed the root. Commit it. 13716 root.remainingExpirationTime = commitRoot(finishedWork); 13717 } 13718 } 13719 } else { 13720 // Flush async work. 13721 var _finishedWork = root.finishedWork; 13722 if (_finishedWork !== null) { 13723 // This root is already complete. We can commit it. 13724 root.finishedWork = null; 13725 root.remainingExpirationTime = commitRoot(_finishedWork); 13726 } else { 13727 root.finishedWork = null; 13728 _finishedWork = renderRoot(root, expirationTime); 13729 if (_finishedWork !== null) { 13730 // We've completed the root. Check the deadline one more time 13731 // before committing. 13732 if (!shouldYield()) { 13733 // Still time left. Commit the root. 13734 root.remainingExpirationTime = commitRoot(_finishedWork); 13735 } else { 13736 // There's no time left. Mark this root as complete. We'll come 13737 // back and commit it later. 13738 root.finishedWork = _finishedWork; 13739 } 13740 } 13741 } 13742 } 13743 13744 isRendering = false; 13745 } 13746 13747 // When working on async work, the reconciler asks the renderer if it should 13748 // yield execution. For DOM, we implement this with requestIdleCallback. 13749 function shouldYield() { 13750 if (deadline === null) { 13751 return false; 13752 } 13753 if (deadline.timeRemaining() > timeHeuristicForUnitOfWork) { 13754 // Disregard deadline.didTimeout. Only expired work should be flushed 13755 // during a timeout. This path is only hit for non-expired work. 13756 return false; 13757 } 13758 deadlineDidExpire = true; 13759 return true; 13760 } 13761 13762 // TODO: Not happy about this hook. Conceptually, renderRoot should return a 13763 // tuple of (isReadyForCommit, didError, error) 13764 function onUncaughtError(error) { 13765 !(nextFlushedRoot !== null) ? invariant(false, 'Should be working on a root. This error is likely caused by a bug in React. Please file an issue.') : void 0; 13766 // Unschedule this root so we don't work on it again until there's 13767 // another update. 13768 nextFlushedRoot.remainingExpirationTime = NoWork; 13769 if (!hasUnhandledError) { 13770 hasUnhandledError = true; 13771 unhandledError = error; 13772 } 13773 } 13774 13775 // TODO: Batching should be implemented at the renderer level, not inside 13776 // the reconciler. 13777 function batchedUpdates(fn, a) { 13778 var previousIsBatchingUpdates = isBatchingUpdates; 13779 isBatchingUpdates = true; 13780 try { 13781 return fn(a); 13782 } finally { 13783 isBatchingUpdates = previousIsBatchingUpdates; 13784 if (!isBatchingUpdates && !isRendering) { 13785 performWork(Sync, null); 13786 } 13787 } 13788 } 13789 13790 // TODO: Batching should be implemented at the renderer level, not inside 13791 // the reconciler. 13792 function unbatchedUpdates(fn) { 13793 if (isBatchingUpdates && !isUnbatchingUpdates) { 13794 isUnbatchingUpdates = true; 13795 try { 13796 return fn(); 13797 } finally { 13798 isUnbatchingUpdates = false; 13799 } 13800 } 13801 return fn(); 13802 } 13803 13804 // TODO: Batching should be implemented at the renderer level, not within 13805 // the reconciler. 13806 function flushSync(fn) { 13807 var previousIsBatchingUpdates = isBatchingUpdates; 13808 isBatchingUpdates = true; 13809 try { 13810 return syncUpdates(fn); 13811 } finally { 13812 isBatchingUpdates = previousIsBatchingUpdates; 13813 !!isRendering ? invariant(false, 'flushSync was called from inside a lifecycle method. It cannot be called when React is already rendering.') : void 0; 13814 performWork(Sync, null); 13815 } 13816 } 13817 13818 return { 13819 computeAsyncExpiration: computeAsyncExpiration, 13820 computeExpirationForFiber: computeExpirationForFiber, 13821 scheduleWork: scheduleWork, 13822 batchedUpdates: batchedUpdates, 13823 unbatchedUpdates: unbatchedUpdates, 13824 flushSync: flushSync, 13825 deferredUpdates: deferredUpdates 13826 }; 13827 }; 13828 13829 { 13830 var didWarnAboutNestedUpdates = false; 13831 } 13832 13833 // 0 is PROD, 1 is DEV. 13834 // Might add PROFILE later. 13835 13836 13837 function getContextForSubtree(parentComponent) { 13838 if (!parentComponent) { 13839 return emptyObject; 13840 } 13841 13842 var fiber = get(parentComponent); 13843 var parentContext = findCurrentUnmaskedContext(fiber); 13844 return isContextProvider(fiber) ? processChildContext(fiber, parentContext) : parentContext; 13845 } 13846 13847 var ReactFiberReconciler$1 = function (config) { 13848 var getPublicInstance = config.getPublicInstance; 13849 13850 var _ReactFiberScheduler = ReactFiberScheduler(config), 13851 computeAsyncExpiration = _ReactFiberScheduler.computeAsyncExpiration, 13852 computeExpirationForFiber = _ReactFiberScheduler.computeExpirationForFiber, 13853 scheduleWork = _ReactFiberScheduler.scheduleWork, 13854 batchedUpdates = _ReactFiberScheduler.batchedUpdates, 13855 unbatchedUpdates = _ReactFiberScheduler.unbatchedUpdates, 13856 flushSync = _ReactFiberScheduler.flushSync, 13857 deferredUpdates = _ReactFiberScheduler.deferredUpdates; 13858 13859 function scheduleTopLevelUpdate(current, element, callback) { 13860 { 13861 if (ReactDebugCurrentFiber.phase === 'render' && ReactDebugCurrentFiber.current !== null && !didWarnAboutNestedUpdates) { 13862 didWarnAboutNestedUpdates = true; 13863 warning(false, 'Render methods should be a pure function of props and state; ' + 'triggering nested component updates from render is not allowed. ' + 'If necessary, trigger nested updates in componentDidUpdate.\n\n' + 'Check the render method of %s.', getComponentName(ReactDebugCurrentFiber.current) || 'Unknown'); 13864 } 13865 } 13866 13867 callback = callback === undefined ? null : callback; 13868 { 13869 warning(callback === null || typeof callback === 'function', 'render(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callback); 13870 } 13871 13872 var expirationTime = void 0; 13873 // Check if the top-level element is an async wrapper component. If so, 13874 // treat updates to the root as async. This is a bit weird but lets us 13875 // avoid a separate `renderAsync` API. 13876 if (enableAsyncSubtreeAPI && element != null && element.type != null && element.type.prototype != null && element.type.prototype.unstable_isAsyncReactComponent === true) { 13877 expirationTime = computeAsyncExpiration(); 13878 } else { 13879 expirationTime = computeExpirationForFiber(current); 13880 } 13881 13882 var update = { 13883 expirationTime: expirationTime, 13884 partialState: { element: element }, 13885 callback: callback, 13886 isReplace: false, 13887 isForced: false, 13888 nextCallback: null, 13889 next: null 13890 }; 13891 insertUpdateIntoFiber(current, update); 13892 scheduleWork(current, expirationTime); 13893 } 13894 13895 function findHostInstance(fiber) { 13896 var hostFiber = findCurrentHostFiber(fiber); 13897 if (hostFiber === null) { 13898 return null; 13899 } 13900 return hostFiber.stateNode; 13901 } 13902 13903 return { 13904 createContainer: function (containerInfo, hydrate) { 13905 return createFiberRoot(containerInfo, hydrate); 13906 }, 13907 updateContainer: function (element, container, parentComponent, callback) { 13908 // TODO: If this is a nested container, this won't be the root. 13909 var current = container.current; 13910 13911 { 13912 if (ReactFiberInstrumentation_1.debugTool) { 13913 if (current.alternate === null) { 13914 ReactFiberInstrumentation_1.debugTool.onMountContainer(container); 13915 } else if (element === null) { 13916 ReactFiberInstrumentation_1.debugTool.onUnmountContainer(container); 13917 } else { 13918 ReactFiberInstrumentation_1.debugTool.onUpdateContainer(container); 13919 } 13920 } 13921 } 13922 13923 var context = getContextForSubtree(parentComponent); 13924 if (container.context === null) { 13925 container.context = context; 13926 } else { 13927 container.pendingContext = context; 13928 } 13929 13930 scheduleTopLevelUpdate(current, element, callback); 13931 }, 13932 13933 13934 batchedUpdates: batchedUpdates, 13935 13936 unbatchedUpdates: unbatchedUpdates, 13937 13938 deferredUpdates: deferredUpdates, 13939 13940 flushSync: flushSync, 13941 13942 getPublicRootInstance: function (container) { 13943 var containerFiber = container.current; 13944 if (!containerFiber.child) { 13945 return null; 13946 } 13947 switch (containerFiber.child.tag) { 13948 case HostComponent: 13949 return getPublicInstance(containerFiber.child.stateNode); 13950 default: 13951 return containerFiber.child.stateNode; 13952 } 13953 }, 13954 13955 13956 findHostInstance: findHostInstance, 13957 13958 findHostInstanceWithNoPortals: function (fiber) { 13959 var hostFiber = findCurrentHostFiberWithNoPortals(fiber); 13960 if (hostFiber === null) { 13961 return null; 13962 } 13963 return hostFiber.stateNode; 13964 }, 13965 injectIntoDevTools: function (devToolsConfig) { 13966 var findFiberByHostInstance = devToolsConfig.findFiberByHostInstance; 13967 13968 return injectInternals(_assign({}, devToolsConfig, { 13969 findHostInstanceByFiber: function (fiber) { 13970 return findHostInstance(fiber); 13971 }, 13972 findFiberByHostInstance: function (instance) { 13973 if (!findFiberByHostInstance) { 13974 // Might not be implemented by the renderer. 13975 return null; 13976 } 13977 return findFiberByHostInstance(instance); 13978 } 13979 })); 13980 } 13981 }; 13982 }; 13983 13984 var ReactFiberReconciler$2 = Object.freeze({ 13985 default: ReactFiberReconciler$1 13986 }); 13987 13988 var ReactFiberReconciler$3 = ( ReactFiberReconciler$2 && ReactFiberReconciler$1 ) || ReactFiberReconciler$2; 13989 13990 // TODO: bundle Flow types with the package. 13991 13992 13993 13994 // TODO: decide on the top-level export form. 13995 // This is hacky but makes it work with both Rollup and Jest. 13996 var reactReconciler = ReactFiberReconciler$3['default'] ? ReactFiberReconciler$3['default'] : ReactFiberReconciler$3; 13997 13998 function createPortal$1(children, containerInfo, 13999 // TODO: figure out the API for cross-renderer implementation. 14000 implementation) { 14001 var key = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null; 14002 14003 return { 14004 // This tag allow us to uniquely identify this as a React Portal 14005 $$typeof: REACT_PORTAL_TYPE, 14006 key: key == null ? null : '' + key, 14007 children: children, 14008 containerInfo: containerInfo, 14009 implementation: implementation 14010 }; 14011 } 14012 14013 // TODO: this is special because it gets imported during build. 14014 14015 var ReactVersion = '16.2.0'; 14016 14017 // a requestAnimationFrame, storing the time for the start of the frame, then 14018 // scheduling a postMessage which gets scheduled after paint. Within the 14019 // postMessage handler do as much work as possible until time + frame rate. 14020 // By separating the idle call into a separate event tick we ensure that 14021 // layout, paint and other browser work is counted against the available time. 14022 // The frame rate is dynamically adjusted. 14023 14024 { 14025 if (ExecutionEnvironment.canUseDOM && typeof requestAnimationFrame !== 'function') { 14026 warning(false, 'React depends on requestAnimationFrame. Make sure that you load a ' + 'polyfill in older browsers. http://fb.me/react-polyfills'); 14027 } 14028 } 14029 14030 var hasNativePerformanceNow = typeof performance === 'object' && typeof performance.now === 'function'; 14031 14032 var now = void 0; 14033 if (hasNativePerformanceNow) { 14034 now = function () { 14035 return performance.now(); 14036 }; 14037 } else { 14038 now = function () { 14039 return Date.now(); 14040 }; 14041 } 14042 14043 // TODO: There's no way to cancel, because Fiber doesn't atm. 14044 var rIC = void 0; 14045 var cIC = void 0; 14046 14047 if (!ExecutionEnvironment.canUseDOM) { 14048 rIC = function (frameCallback) { 14049 return setTimeout(function () { 14050 frameCallback({ 14051 timeRemaining: function () { 14052 return Infinity; 14053 } 14054 }); 14055 }); 14056 }; 14057 cIC = function (timeoutID) { 14058 clearTimeout(timeoutID); 14059 }; 14060 } else if (typeof requestIdleCallback !== 'function' || typeof cancelIdleCallback !== 'function') { 14061 // Polyfill requestIdleCallback and cancelIdleCallback 14062 14063 var scheduledRICCallback = null; 14064 var isIdleScheduled = false; 14065 var timeoutTime = -1; 14066 14067 var isAnimationFrameScheduled = false; 14068 14069 var frameDeadline = 0; 14070 // We start out assuming that we run at 30fps but then the heuristic tracking 14071 // will adjust this value to a faster fps if we get more frequent animation 14072 // frames. 14073 var previousFrameTime = 33; 14074 var activeFrameTime = 33; 14075 14076 var frameDeadlineObject; 14077 if (hasNativePerformanceNow) { 14078 frameDeadlineObject = { 14079 didTimeout: false, 14080 timeRemaining: function () { 14081 // We assume that if we have a performance timer that the rAF callback 14082 // gets a performance timer value. Not sure if this is always true. 14083 var remaining = frameDeadline - performance.now(); 14084 return remaining > 0 ? remaining : 0; 14085 } 14086 }; 14087 } else { 14088 frameDeadlineObject = { 14089 didTimeout: false, 14090 timeRemaining: function () { 14091 // Fallback to Date.now() 14092 var remaining = frameDeadline - Date.now(); 14093 return remaining > 0 ? remaining : 0; 14094 } 14095 }; 14096 } 14097 14098 // We use the postMessage trick to defer idle work until after the repaint. 14099 var messageKey = '__reactIdleCallback$' + Math.random().toString(36).slice(2); 14100 var idleTick = function (event) { 14101 if (event.source !== window || event.data !== messageKey) { 14102 return; 14103 } 14104 14105 isIdleScheduled = false; 14106 14107 var currentTime = now(); 14108 if (frameDeadline - currentTime <= 0) { 14109 // There's no time left in this idle period. Check if the callback has 14110 // a timeout and whether it's been exceeded. 14111 if (timeoutTime !== -1 && timeoutTime <= currentTime) { 14112 // Exceeded the timeout. Invoke the callback even though there's no 14113 // time left. 14114 frameDeadlineObject.didTimeout = true; 14115 } else { 14116 // No timeout. 14117 if (!isAnimationFrameScheduled) { 14118 // Schedule another animation callback so we retry later. 14119 isAnimationFrameScheduled = true; 14120 requestAnimationFrame(animationTick); 14121 } 14122 // Exit without invoking the callback. 14123 return; 14124 } 14125 } else { 14126 // There's still time left in this idle period. 14127 frameDeadlineObject.didTimeout = false; 14128 } 14129 14130 timeoutTime = -1; 14131 var callback = scheduledRICCallback; 14132 scheduledRICCallback = null; 14133 if (callback !== null) { 14134 callback(frameDeadlineObject); 14135 } 14136 }; 14137 // Assumes that we have addEventListener in this environment. Might need 14138 // something better for old IE. 14139 window.addEventListener('message', idleTick, false); 14140 14141 var animationTick = function (rafTime) { 14142 isAnimationFrameScheduled = false; 14143 var nextFrameTime = rafTime - frameDeadline + activeFrameTime; 14144 if (nextFrameTime < activeFrameTime && previousFrameTime < activeFrameTime) { 14145 if (nextFrameTime < 8) { 14146 // Defensive coding. We don't support higher frame rates than 120hz. 14147 // If we get lower than that, it is probably a bug. 14148 nextFrameTime = 8; 14149 } 14150 // If one frame goes long, then the next one can be short to catch up. 14151 // If two frames are short in a row, then that's an indication that we 14152 // actually have a higher frame rate than what we're currently optimizing. 14153 // We adjust our heuristic dynamically accordingly. For example, if we're 14154 // running on 120hz display or 90hz VR display. 14155 // Take the max of the two in case one of them was an anomaly due to 14156 // missed frame deadlines. 14157 activeFrameTime = nextFrameTime < previousFrameTime ? previousFrameTime : nextFrameTime; 14158 } else { 14159 previousFrameTime = nextFrameTime; 14160 } 14161 frameDeadline = rafTime + activeFrameTime; 14162 if (!isIdleScheduled) { 14163 isIdleScheduled = true; 14164 window.postMessage(messageKey, '*'); 14165 } 14166 }; 14167 14168 rIC = function (callback, options) { 14169 // This assumes that we only schedule one callback at a time because that's 14170 // how Fiber uses it. 14171 scheduledRICCallback = callback; 14172 if (options != null && typeof options.timeout === 'number') { 14173 timeoutTime = now() + options.timeout; 14174 } 14175 if (!isAnimationFrameScheduled) { 14176 // If rAF didn't already schedule one, we need to schedule a frame. 14177 // TODO: If this rAF doesn't materialize because the browser throttles, we 14178 // might want to still have setTimeout trigger rIC as a backup to ensure 14179 // that we keep performing work. 14180 isAnimationFrameScheduled = true; 14181 requestAnimationFrame(animationTick); 14182 } 14183 return 0; 14184 }; 14185 14186 cIC = function () { 14187 scheduledRICCallback = null; 14188 isIdleScheduled = false; 14189 timeoutTime = -1; 14190 }; 14191 } else { 14192 rIC = window.requestIdleCallback; 14193 cIC = window.cancelIdleCallback; 14194 } 14195 14196 /** 14197 * Forked from fbjs/warning: 14198 * https://github.com/facebook/fbjs/blob/e66ba20ad5be433eb54423f2b097d829324d9de6/packages/fbjs/src/__forks__/warning.js 14199 * 14200 * Only change is we use console.warn instead of console.error, 14201 * and do nothing when 'console' is not supported. 14202 * This really simplifies the code. 14203 * --- 14204 * Similar to invariant but only logs a warning if the condition is not met. 14205 * This can be used to log issues in development environments in critical 14206 * paths. Removing the logging code for production environments will keep the 14207 * same logic and follow the same code paths. 14208 */ 14209 14210 var lowPriorityWarning = function () {}; 14211 14212 { 14213 var printWarning = function (format) { 14214 for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { 14215 args[_key - 1] = arguments[_key]; 14216 } 14217 14218 var argIndex = 0; 14219 var message = 'Warning: ' + format.replace(/%s/g, function () { 14220 return args[argIndex++]; 14221 }); 14222 if (typeof console !== 'undefined') { 14223 console.warn(message); 14224 } 14225 try { 14226 // --- Welcome to debugging React --- 14227 // This error was thrown as a convenience so that you can use this stack 14228 // to find the callsite that caused this warning to fire. 14229 throw new Error(message); 14230 } catch (x) {} 14231 }; 14232 14233 lowPriorityWarning = function (condition, format) { 14234 if (format === undefined) { 14235 throw new Error('`warning(condition, format, ...args)` requires a warning ' + 'message argument'); 14236 } 14237 if (!condition) { 14238 for (var _len2 = arguments.length, args = Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) { 14239 args[_key2 - 2] = arguments[_key2]; 14240 } 14241 14242 printWarning.apply(undefined, [format].concat(args)); 14243 } 14244 }; 14245 } 14246 14247 var lowPriorityWarning$1 = lowPriorityWarning; 14248 14249 // isAttributeNameSafe() is currently duplicated in DOMMarkupOperations. 14250 // TODO: Find a better place for this. 14251 var VALID_ATTRIBUTE_NAME_REGEX = new RegExp('^[' + ATTRIBUTE_NAME_START_CHAR + '][' + ATTRIBUTE_NAME_CHAR + ']*$'); 14252 var illegalAttributeNameCache = {}; 14253 var validatedAttributeNameCache = {}; 14254 function isAttributeNameSafe(attributeName) { 14255 if (validatedAttributeNameCache.hasOwnProperty(attributeName)) { 14256 return true; 14257 } 14258 if (illegalAttributeNameCache.hasOwnProperty(attributeName)) { 14259 return false; 14260 } 14261 if (VALID_ATTRIBUTE_NAME_REGEX.test(attributeName)) { 14262 validatedAttributeNameCache[attributeName] = true; 14263 return true; 14264 } 14265 illegalAttributeNameCache[attributeName] = true; 14266 { 14267 warning(false, 'Invalid attribute name: `%s`', attributeName); 14268 } 14269 return false; 14270 } 14271 14272 // shouldIgnoreValue() is currently duplicated in DOMMarkupOperations. 14273 // TODO: Find a better place for this. 14274 function shouldIgnoreValue(propertyInfo, value) { 14275 return value == null || propertyInfo.hasBooleanValue && !value || propertyInfo.hasNumericValue && isNaN(value) || propertyInfo.hasPositiveNumericValue && value < 1 || propertyInfo.hasOverloadedBooleanValue && value === false; 14276 } 14277 14278 /** 14279 * Operations for dealing with DOM properties. 14280 */ 14281 14282 14283 14284 14285 14286 /** 14287 * Get the value for a property on a node. Only used in DEV for SSR validation. 14288 * The "expected" argument is used as a hint of what the expected value is. 14289 * Some properties have multiple equivalent values. 14290 */ 14291 function getValueForProperty(node, name, expected) { 14292 { 14293 var propertyInfo = getPropertyInfo(name); 14294 if (propertyInfo) { 14295 var mutationMethod = propertyInfo.mutationMethod; 14296 if (mutationMethod || propertyInfo.mustUseProperty) { 14297 return node[propertyInfo.propertyName]; 14298 } else { 14299 var attributeName = propertyInfo.attributeName; 14300 14301 var stringValue = null; 14302 14303 if (propertyInfo.hasOverloadedBooleanValue) { 14304 if (node.hasAttribute(attributeName)) { 14305 var value = node.getAttribute(attributeName); 14306 if (value === '') { 14307 return true; 14308 } 14309 if (shouldIgnoreValue(propertyInfo, expected)) { 14310 return value; 14311 } 14312 if (value === '' + expected) { 14313 return expected; 14314 } 14315 return value; 14316 } 14317 } else if (node.hasAttribute(attributeName)) { 14318 if (shouldIgnoreValue(propertyInfo, expected)) { 14319 // We had an attribute but shouldn't have had one, so read it 14320 // for the error message. 14321 return node.getAttribute(attributeName); 14322 } 14323 if (propertyInfo.hasBooleanValue) { 14324 // If this was a boolean, it doesn't matter what the value is 14325 // the fact that we have it is the same as the expected. 14326 return expected; 14327 } 14328 // Even if this property uses a namespace we use getAttribute 14329 // because we assume its namespaced name is the same as our config. 14330 // To use getAttributeNS we need the local name which we don't have 14331 // in our config atm. 14332 stringValue = node.getAttribute(attributeName); 14333 } 14334 14335 if (shouldIgnoreValue(propertyInfo, expected)) { 14336 return stringValue === null ? expected : stringValue; 14337 } else if (stringValue === '' + expected) { 14338 return expected; 14339 } else { 14340 return stringValue; 14341 } 14342 } 14343 } 14344 } 14345 } 14346 14347 /** 14348 * Get the value for a attribute on a node. Only used in DEV for SSR validation. 14349 * The third argument is used as a hint of what the expected value is. Some 14350 * attributes have multiple equivalent values. 14351 */ 14352 function getValueForAttribute(node, name, expected) { 14353 { 14354 if (!isAttributeNameSafe(name)) { 14355 return; 14356 } 14357 if (!node.hasAttribute(name)) { 14358 return expected === undefined ? undefined : null; 14359 } 14360 var value = node.getAttribute(name); 14361 if (value === '' + expected) { 14362 return expected; 14363 } 14364 return value; 14365 } 14366 } 14367 14368 /** 14369 * Sets the value for a property on a node. 14370 * 14371 * @param {DOMElement} node 14372 * @param {string} name 14373 * @param {*} value 14374 */ 14375 function setValueForProperty(node, name, value) { 14376 var propertyInfo = getPropertyInfo(name); 14377 14378 if (propertyInfo && shouldSetAttribute(name, value)) { 14379 var mutationMethod = propertyInfo.mutationMethod; 14380 if (mutationMethod) { 14381 mutationMethod(node, value); 14382 } else if (shouldIgnoreValue(propertyInfo, value)) { 14383 deleteValueForProperty(node, name); 14384 return; 14385 } else if (propertyInfo.mustUseProperty) { 14386 // Contrary to `setAttribute`, object properties are properly 14387 // `toString`ed by IE8/9. 14388 node[propertyInfo.propertyName] = value; 14389 } else { 14390 var attributeName = propertyInfo.attributeName; 14391 var namespace = propertyInfo.attributeNamespace; 14392 // `setAttribute` with objects becomes only `[object]` in IE8/9, 14393 // ('' + value) makes it output the correct toString()-value. 14394 if (namespace) { 14395 node.setAttributeNS(namespace, attributeName, '' + value); 14396 } else if (propertyInfo.hasBooleanValue || propertyInfo.hasOverloadedBooleanValue && value === true) { 14397 node.setAttribute(attributeName, ''); 14398 } else { 14399 node.setAttribute(attributeName, '' + value); 14400 } 14401 } 14402 } else { 14403 setValueForAttribute(node, name, shouldSetAttribute(name, value) ? value : null); 14404 return; 14405 } 14406 14407 { 14408 14409 } 14410 } 14411 14412 function setValueForAttribute(node, name, value) { 14413 if (!isAttributeNameSafe(name)) { 14414 return; 14415 } 14416 if (value == null) { 14417 node.removeAttribute(name); 14418 } else { 14419 node.setAttribute(name, '' + value); 14420 } 14421 14422 { 14423 14424 } 14425 } 14426 14427 /** 14428 * Deletes an attributes from a node. 14429 * 14430 * @param {DOMElement} node 14431 * @param {string} name 14432 */ 14433 function deleteValueForAttribute(node, name) { 14434 node.removeAttribute(name); 14435 } 14436 14437 /** 14438 * Deletes the value for a property on a node. 14439 * 14440 * @param {DOMElement} node 14441 * @param {string} name 14442 */ 14443 function deleteValueForProperty(node, name) { 14444 var propertyInfo = getPropertyInfo(name); 14445 if (propertyInfo) { 14446 var mutationMethod = propertyInfo.mutationMethod; 14447 if (mutationMethod) { 14448 mutationMethod(node, undefined); 14449 } else if (propertyInfo.mustUseProperty) { 14450 var propName = propertyInfo.propertyName; 14451 if (propertyInfo.hasBooleanValue) { 14452 node[propName] = false; 14453 } else { 14454 node[propName] = ''; 14455 } 14456 } else { 14457 node.removeAttribute(propertyInfo.attributeName); 14458 } 14459 } else { 14460 node.removeAttribute(name); 14461 } 14462 } 14463 14464 var ReactControlledValuePropTypes = { 14465 checkPropTypes: null 14466 }; 14467 14468 { 14469 var hasReadOnlyValue = { 14470 button: true, 14471 checkbox: true, 14472 image: true, 14473 hidden: true, 14474 radio: true, 14475 reset: true, 14476 submit: true 14477 }; 14478 14479 var propTypes = { 14480 value: function (props, propName, componentName) { 14481 if (!props[propName] || hasReadOnlyValue[props.type] || props.onChange || props.readOnly || props.disabled) { 14482 return null; 14483 } 14484 return new 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`.'); 14485 }, 14486 checked: function (props, propName, componentName) { 14487 if (!props[propName] || props.onChange || props.readOnly || props.disabled) { 14488 return null; 14489 } 14490 return new 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`.'); 14491 } 14492 }; 14493 14494 /** 14495 * Provide a linked `value` attribute for controlled forms. You should not use 14496 * this outside of the ReactDOM controlled form components. 14497 */ 14498 ReactControlledValuePropTypes.checkPropTypes = function (tagName, props, getStack) { 14499 checkPropTypes(propTypes, props, 'prop', tagName, getStack); 14500 }; 14501 } 14502 14503 // TODO: direct imports like some-package/src/* are bad. Fix me. 14504 var getCurrentFiberOwnerName$2 = ReactDebugCurrentFiber.getCurrentFiberOwnerName; 14505 var getCurrentFiberStackAddendum$3 = ReactDebugCurrentFiber.getCurrentFiberStackAddendum; 14506 14507 var didWarnValueDefaultValue = false; 14508 var didWarnCheckedDefaultChecked = false; 14509 var didWarnControlledToUncontrolled = false; 14510 var didWarnUncontrolledToControlled = false; 14511 14512 function isControlled(props) { 14513 var usesChecked = props.type === 'checkbox' || props.type === 'radio'; 14514 return usesChecked ? props.checked != null : props.value != null; 14515 } 14516 14517 /** 14518 * Implements an <input> host component that allows setting these optional 14519 * props: `checked`, `value`, `defaultChecked`, and `defaultValue`. 14520 * 14521 * If `checked` or `value` are not supplied (or null/undefined), user actions 14522 * that affect the checked state or value will trigger updates to the element. 14523 * 14524 * If they are supplied (and not null/undefined), the rendered element will not 14525 * trigger updates to the element. Instead, the props must change in order for 14526 * the rendered element to be updated. 14527 * 14528 * The rendered element will be initialized as unchecked (or `defaultChecked`) 14529 * with an empty value (or `defaultValue`). 14530 * 14531 * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html 14532 */ 14533 14534 function getHostProps(element, props) { 14535 var node = element; 14536 var value = props.value; 14537 var checked = props.checked; 14538 14539 var hostProps = _assign({ 14540 // Make sure we set .type before any other properties (setting .value 14541 // before .type means .value is lost in IE11 and below) 14542 type: undefined, 14543 // Make sure we set .step before .value (setting .value before .step 14544 // means .value is rounded on mount, based upon step precision) 14545 step: undefined, 14546 // Make sure we set .min & .max before .value (to ensure proper order 14547 // in corner cases such as min or max deriving from value, e.g. Issue #7170) 14548 min: undefined, 14549 max: undefined 14550 }, props, { 14551 defaultChecked: undefined, 14552 defaultValue: undefined, 14553 value: value != null ? value : node._wrapperState.initialValue, 14554 checked: checked != null ? checked : node._wrapperState.initialChecked 14555 }); 14556 14557 return hostProps; 14558 } 14559 14560 function initWrapperState(element, props) { 14561 { 14562 ReactControlledValuePropTypes.checkPropTypes('input', props, getCurrentFiberStackAddendum$3); 14563 14564 if (props.checked !== undefined && props.defaultChecked !== undefined && !didWarnCheckedDefaultChecked) { 14565 warning(false, '%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://fb.me/react-controlled-components', getCurrentFiberOwnerName$2() || 'A component', props.type); 14566 didWarnCheckedDefaultChecked = true; 14567 } 14568 if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue) { 14569 warning(false, '%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://fb.me/react-controlled-components', getCurrentFiberOwnerName$2() || 'A component', props.type); 14570 didWarnValueDefaultValue = true; 14571 } 14572 } 14573 14574 var defaultValue = props.defaultValue; 14575 var node = element; 14576 node._wrapperState = { 14577 initialChecked: props.checked != null ? props.checked : props.defaultChecked, 14578 initialValue: props.value != null ? props.value : defaultValue, 14579 controlled: isControlled(props) 14580 }; 14581 } 14582 14583 function updateChecked(element, props) { 14584 var node = element; 14585 var checked = props.checked; 14586 if (checked != null) { 14587 setValueForProperty(node, 'checked', checked); 14588 } 14589 } 14590 14591 function updateWrapper(element, props) { 14592 var node = element; 14593 { 14594 var controlled = isControlled(props); 14595 14596 if (!node._wrapperState.controlled && controlled && !didWarnUncontrolledToControlled) { 14597 warning(false, 'A component is changing an uncontrolled input of type %s to be controlled. ' + 'Input elements should not switch from uncontrolled to controlled (or vice versa). ' + 'Decide between using a controlled or uncontrolled input ' + 'element for the lifetime of the component. More info: https://fb.me/react-controlled-components%s', props.type, getCurrentFiberStackAddendum$3()); 14598 didWarnUncontrolledToControlled = true; 14599 } 14600 if (node._wrapperState.controlled && !controlled && !didWarnControlledToUncontrolled) { 14601 warning(false, 'A component is changing a controlled input of type %s to be uncontrolled. ' + 'Input elements should not switch from controlled to uncontrolled (or vice versa). ' + 'Decide between using a controlled or uncontrolled input ' + 'element for the lifetime of the component. More info: https://fb.me/react-controlled-components%s', props.type, getCurrentFiberStackAddendum$3()); 14602 didWarnControlledToUncontrolled = true; 14603 } 14604 } 14605 14606 updateChecked(element, props); 14607 14608 var value = props.value; 14609 if (value != null) { 14610 if (value === 0 && node.value === '') { 14611 node.value = '0'; 14612 // Note: IE9 reports a number inputs as 'text', so check props instead. 14613 } else if (props.type === 'number') { 14614 // Simulate `input.valueAsNumber`. IE9 does not support it 14615 var valueAsNumber = parseFloat(node.value) || 0; 14616 14617 if ( 14618 // eslint-disable-next-line 14619 value != valueAsNumber || 14620 // eslint-disable-next-line 14621 value == valueAsNumber && node.value != value) { 14622 // Cast `value` to a string to ensure the value is set correctly. While 14623 // browsers typically do this as necessary, jsdom doesn't. 14624 node.value = '' + value; 14625 } 14626 } else if (node.value !== '' + value) { 14627 // Cast `value` to a string to ensure the value is set correctly. While 14628 // browsers typically do this as necessary, jsdom doesn't. 14629 node.value = '' + value; 14630 } 14631 } else { 14632 if (props.value == null && props.defaultValue != null) { 14633 // In Chrome, assigning defaultValue to certain input types triggers input validation. 14634 // For number inputs, the display value loses trailing decimal points. For email inputs, 14635 // Chrome raises "The specified value <x> is not a valid email address". 14636 // 14637 // Here we check to see if the defaultValue has actually changed, avoiding these problems 14638 // when the user is inputting text 14639 // 14640 // https://github.com/facebook/react/issues/7253 14641 if (node.defaultValue !== '' + props.defaultValue) { 14642 node.defaultValue = '' + props.defaultValue; 14643 } 14644 } 14645 if (props.checked == null && props.defaultChecked != null) { 14646 node.defaultChecked = !!props.defaultChecked; 14647 } 14648 } 14649 } 14650 14651 function postMountWrapper(element, props) { 14652 var node = element; 14653 14654 // Detach value from defaultValue. We won't do anything if we're working on 14655 // submit or reset inputs as those values & defaultValues are linked. They 14656 // are not resetable nodes so this operation doesn't matter and actually 14657 // removes browser-default values (eg "Submit Query") when no value is 14658 // provided. 14659 14660 switch (props.type) { 14661 case 'submit': 14662 case 'reset': 14663 break; 14664 case 'color': 14665 case 'date': 14666 case 'datetime': 14667 case 'datetime-local': 14668 case 'month': 14669 case 'time': 14670 case 'week': 14671 // This fixes the no-show issue on iOS Safari and Android Chrome: 14672 // https://github.com/facebook/react/issues/7233 14673 node.value = ''; 14674 node.value = node.defaultValue; 14675 break; 14676 default: 14677 node.value = node.value; 14678 break; 14679 } 14680 14681 // Normally, we'd just do `node.checked = node.checked` upon initial mount, less this bug 14682 // this is needed to work around a chrome bug where setting defaultChecked 14683 // will sometimes influence the value of checked (even after detachment). 14684 // Reference: https://bugs.chromium.org/p/chromium/issues/detail?id=608416 14685 // We need to temporarily unset name to avoid disrupting radio button groups. 14686 var name = node.name; 14687 if (name !== '') { 14688 node.name = ''; 14689 } 14690 node.defaultChecked = !node.defaultChecked; 14691 node.defaultChecked = !node.defaultChecked; 14692 if (name !== '') { 14693 node.name = name; 14694 } 14695 } 14696 14697 function restoreControlledState$1(element, props) { 14698 var node = element; 14699 updateWrapper(node, props); 14700 updateNamedCousins(node, props); 14701 } 14702 14703 function updateNamedCousins(rootNode, props) { 14704 var name = props.name; 14705 if (props.type === 'radio' && name != null) { 14706 var queryRoot = rootNode; 14707 14708 while (queryRoot.parentNode) { 14709 queryRoot = queryRoot.parentNode; 14710 } 14711 14712 // If `rootNode.form` was non-null, then we could try `form.elements`, 14713 // but that sometimes behaves strangely in IE8. We could also try using 14714 // `form.getElementsByName`, but that will only return direct children 14715 // and won't include inputs that use the HTML5 `form=` attribute. Since 14716 // the input might not even be in a form. It might not even be in the 14717 // document. Let's just use the local `querySelectorAll` to ensure we don't 14718 // miss anything. 14719 var group = queryRoot.querySelectorAll('input[name=' + JSON.stringify('' + name) + '][type="radio"]'); 14720 14721 for (var i = 0; i < group.length; i++) { 14722 var otherNode = group[i]; 14723 if (otherNode === rootNode || otherNode.form !== rootNode.form) { 14724 continue; 14725 } 14726 // This will throw if radio buttons rendered by different copies of React 14727 // and the same name are rendered into the same form (same as #1939). 14728 // That's probably okay; we don't support it just as we don't support 14729 // mixing React radio buttons with non-React ones. 14730 var otherProps = getFiberCurrentPropsFromNode$1(otherNode); 14731 !otherProps ? invariant(false, 'ReactDOMInput: Mixing React and non-React radio inputs with the same `name` is not supported.') : void 0; 14732 14733 // We need update the tracked value on the named cousin since the value 14734 // was changed but the input saw no event or value set 14735 updateValueIfChanged(otherNode); 14736 14737 // If this is a controlled radio button group, forcing the input that 14738 // was previously checked to update will cause it to be come re-checked 14739 // as appropriate. 14740 updateWrapper(otherNode, otherProps); 14741 } 14742 } 14743 } 14744 14745 function flattenChildren(children) { 14746 var content = ''; 14747 14748 // Flatten children and warn if they aren't strings or numbers; 14749 // invalid types are ignored. 14750 // We can silently skip them because invalid DOM nesting warning 14751 // catches these cases in Fiber. 14752 React.Children.forEach(children, function (child) { 14753 if (child == null) { 14754 return; 14755 } 14756 if (typeof child === 'string' || typeof child === 'number') { 14757 content += child; 14758 } 14759 }); 14760 14761 return content; 14762 } 14763 14764 /** 14765 * Implements an <option> host component that warns when `selected` is set. 14766 */ 14767 14768 function validateProps(element, props) { 14769 // TODO (yungsters): Remove support for `selected` in <option>. 14770 { 14771 warning(props.selected == null, 'Use the `defaultValue` or `value` props on <select> instead of ' + 'setting `selected` on <option>.'); 14772 } 14773 } 14774 14775 function postMountWrapper$1(element, props) { 14776 // value="" should make a value attribute (#6219) 14777 if (props.value != null) { 14778 element.setAttribute('value', props.value); 14779 } 14780 } 14781 14782 function getHostProps$1(element, props) { 14783 var hostProps = _assign({ children: undefined }, props); 14784 var content = flattenChildren(props.children); 14785 14786 if (content) { 14787 hostProps.children = content; 14788 } 14789 14790 return hostProps; 14791 } 14792 14793 // TODO: direct imports like some-package/src/* are bad. Fix me. 14794 var getCurrentFiberOwnerName$3 = ReactDebugCurrentFiber.getCurrentFiberOwnerName; 14795 var getCurrentFiberStackAddendum$4 = ReactDebugCurrentFiber.getCurrentFiberStackAddendum; 14796 14797 14798 { 14799 var didWarnValueDefaultValue$1 = false; 14800 } 14801 14802 function getDeclarationErrorAddendum() { 14803 var ownerName = getCurrentFiberOwnerName$3(); 14804 if (ownerName) { 14805 return '\n\nCheck the render method of `' + ownerName + '`.'; 14806 } 14807 return ''; 14808 } 14809 14810 var valuePropNames = ['value', 'defaultValue']; 14811 14812 /** 14813 * Validation function for `value` and `defaultValue`. 14814 */ 14815 function checkSelectPropTypes(props) { 14816 ReactControlledValuePropTypes.checkPropTypes('select', props, getCurrentFiberStackAddendum$4); 14817 14818 for (var i = 0; i < valuePropNames.length; i++) { 14819 var propName = valuePropNames[i]; 14820 if (props[propName] == null) { 14821 continue; 14822 } 14823 var isArray = Array.isArray(props[propName]); 14824 if (props.multiple && !isArray) { 14825 warning(false, 'The `%s` prop supplied to <select> must be an array if ' + '`multiple` is true.%s', propName, getDeclarationErrorAddendum()); 14826 } else if (!props.multiple && isArray) { 14827 warning(false, 'The `%s` prop supplied to <select> must be a scalar ' + 'value if `multiple` is false.%s', propName, getDeclarationErrorAddendum()); 14828 } 14829 } 14830 } 14831 14832 function updateOptions(node, multiple, propValue, setDefaultSelected) { 14833 var options = node.options; 14834 14835 if (multiple) { 14836 var selectedValues = propValue; 14837 var selectedValue = {}; 14838 for (var i = 0; i < selectedValues.length; i++) { 14839 // Prefix to avoid chaos with special keys. 14840 selectedValue['$' + selectedValues[i]] = true; 14841 } 14842 for (var _i = 0; _i < options.length; _i++) { 14843 var selected = selectedValue.hasOwnProperty('$' + options[_i].value); 14844 if (options[_i].selected !== selected) { 14845 options[_i].selected = selected; 14846 } 14847 if (selected && setDefaultSelected) { 14848 options[_i].defaultSelected = true; 14849 } 14850 } 14851 } else { 14852 // Do not set `select.value` as exact behavior isn't consistent across all 14853 // browsers for all cases. 14854 var _selectedValue = '' + propValue; 14855 var defaultSelected = null; 14856 for (var _i2 = 0; _i2 < options.length; _i2++) { 14857 if (options[_i2].value === _selectedValue) { 14858 options[_i2].selected = true; 14859 if (setDefaultSelected) { 14860 options[_i2].defaultSelected = true; 14861 } 14862 return; 14863 } 14864 if (defaultSelected === null && !options[_i2].disabled) { 14865 defaultSelected = options[_i2]; 14866 } 14867 } 14868 if (defaultSelected !== null) { 14869 defaultSelected.selected = true; 14870 } 14871 } 14872 } 14873 14874 /** 14875 * Implements a <select> host component that allows optionally setting the 14876 * props `value` and `defaultValue`. If `multiple` is false, the prop must be a 14877 * stringable. If `multiple` is true, the prop must be an array of stringables. 14878 * 14879 * If `value` is not supplied (or null/undefined), user actions that change the 14880 * selected option will trigger updates to the rendered options. 14881 * 14882 * If it is supplied (and not null/undefined), the rendered options will not 14883 * update in response to user actions. Instead, the `value` prop must change in 14884 * order for the rendered options to update. 14885 * 14886 * If `defaultValue` is provided, any options with the supplied values will be 14887 * selected. 14888 */ 14889 14890 function getHostProps$2(element, props) { 14891 return _assign({}, props, { 14892 value: undefined 14893 }); 14894 } 14895 14896 function initWrapperState$1(element, props) { 14897 var node = element; 14898 { 14899 checkSelectPropTypes(props); 14900 } 14901 14902 var value = props.value; 14903 node._wrapperState = { 14904 initialValue: value != null ? value : props.defaultValue, 14905 wasMultiple: !!props.multiple 14906 }; 14907 14908 { 14909 if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue$1) { 14910 warning(false, '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://fb.me/react-controlled-components'); 14911 didWarnValueDefaultValue$1 = true; 14912 } 14913 } 14914 } 14915 14916 function postMountWrapper$2(element, props) { 14917 var node = element; 14918 node.multiple = !!props.multiple; 14919 var value = props.value; 14920 if (value != null) { 14921 updateOptions(node, !!props.multiple, value, false); 14922 } else if (props.defaultValue != null) { 14923 updateOptions(node, !!props.multiple, props.defaultValue, true); 14924 } 14925 } 14926 14927 function postUpdateWrapper(element, props) { 14928 var node = element; 14929 // After the initial mount, we control selected-ness manually so don't pass 14930 // this value down 14931 node._wrapperState.initialValue = undefined; 14932 14933 var wasMultiple = node._wrapperState.wasMultiple; 14934 node._wrapperState.wasMultiple = !!props.multiple; 14935 14936 var value = props.value; 14937 if (value != null) { 14938 updateOptions(node, !!props.multiple, value, false); 14939 } else if (wasMultiple !== !!props.multiple) { 14940 // For simplicity, reapply `defaultValue` if `multiple` is toggled. 14941 if (props.defaultValue != null) { 14942 updateOptions(node, !!props.multiple, props.defaultValue, true); 14943 } else { 14944 // Revert the select back to its default unselected state. 14945 updateOptions(node, !!props.multiple, props.multiple ? [] : '', false); 14946 } 14947 } 14948 } 14949 14950 function restoreControlledState$2(element, props) { 14951 var node = element; 14952 var value = props.value; 14953 14954 if (value != null) { 14955 updateOptions(node, !!props.multiple, value, false); 14956 } 14957 } 14958 14959 // TODO: direct imports like some-package/src/* are bad. Fix me. 14960 var getCurrentFiberStackAddendum$5 = ReactDebugCurrentFiber.getCurrentFiberStackAddendum; 14961 14962 var didWarnValDefaultVal = false; 14963 14964 /** 14965 * Implements a <textarea> host component that allows setting `value`, and 14966 * `defaultValue`. This differs from the traditional DOM API because value is 14967 * usually set as PCDATA children. 14968 * 14969 * If `value` is not supplied (or null/undefined), user actions that affect the 14970 * value will trigger updates to the element. 14971 * 14972 * If `value` is supplied (and not null/undefined), the rendered element will 14973 * not trigger updates to the element. Instead, the `value` prop must change in 14974 * order for the rendered element to be updated. 14975 * 14976 * The rendered element will be initialized with an empty value, the prop 14977 * `defaultValue` if specified, or the children content (deprecated). 14978 */ 14979 14980 function getHostProps$3(element, props) { 14981 var node = element; 14982 !(props.dangerouslySetInnerHTML == null) ? invariant(false, '`dangerouslySetInnerHTML` does not make sense on <textarea>.') : void 0; 14983 14984 // Always set children to the same thing. In IE9, the selection range will 14985 // get reset if `textContent` is mutated. We could add a check in setTextContent 14986 // to only set the value if/when the value differs from the node value (which would 14987 // completely solve this IE9 bug), but Sebastian+Sophie seemed to like this 14988 // solution. The value can be a boolean or object so that's why it's forced 14989 // to be a string. 14990 var hostProps = _assign({}, props, { 14991 value: undefined, 14992 defaultValue: undefined, 14993 children: '' + node._wrapperState.initialValue 14994 }); 14995 14996 return hostProps; 14997 } 14998 14999 function initWrapperState$2(element, props) { 15000 var node = element; 15001 { 15002 ReactControlledValuePropTypes.checkPropTypes('textarea', props, getCurrentFiberStackAddendum$5); 15003 if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValDefaultVal) { 15004 warning(false, '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://fb.me/react-controlled-components'); 15005 didWarnValDefaultVal = true; 15006 } 15007 } 15008 15009 var initialValue = props.value; 15010 15011 // Only bother fetching default value if we're going to use it 15012 if (initialValue == null) { 15013 var defaultValue = props.defaultValue; 15014 // TODO (yungsters): Remove support for children content in <textarea>. 15015 var children = props.children; 15016 if (children != null) { 15017 { 15018 warning(false, 'Use the `defaultValue` or `value` props instead of setting ' + 'children on <textarea>.'); 15019 } 15020 !(defaultValue == null) ? invariant(false, 'If you supply `defaultValue` on a <textarea>, do not pass children.') : void 0; 15021 if (Array.isArray(children)) { 15022 !(children.length <= 1) ? invariant(false, '<textarea> can only have at most one child.') : void 0; 15023 children = children[0]; 15024 } 15025 15026 defaultValue = '' + children; 15027 } 15028 if (defaultValue == null) { 15029 defaultValue = ''; 15030 } 15031 initialValue = defaultValue; 15032 } 15033 15034 node._wrapperState = { 15035 initialValue: '' + initialValue 15036 }; 15037 } 15038 15039 function updateWrapper$1(element, props) { 15040 var node = element; 15041 var value = props.value; 15042 if (value != null) { 15043 // Cast `value` to a string to ensure the value is set correctly. While 15044 // browsers typically do this as necessary, jsdom doesn't. 15045 var newValue = '' + value; 15046 15047 // To avoid side effects (such as losing text selection), only set value if changed 15048 if (newValue !== node.value) { 15049 node.value = newValue; 15050 } 15051 if (props.defaultValue == null) { 15052 node.defaultValue = newValue; 15053 } 15054 } 15055 if (props.defaultValue != null) { 15056 node.defaultValue = props.defaultValue; 15057 } 15058 } 15059 15060 function postMountWrapper$3(element, props) { 15061 var node = element; 15062 // This is in postMount because we need access to the DOM node, which is not 15063 // available until after the component has mounted. 15064 var textContent = node.textContent; 15065 15066 // Only set node.value if textContent is equal to the expected 15067 // initial value. In IE10/IE11 there is a bug where the placeholder attribute 15068 // will populate textContent as well. 15069 // https://developer.microsoft.com/microsoft-edge/platform/issues/101525/ 15070 if (textContent === node._wrapperState.initialValue) { 15071 node.value = textContent; 15072 } 15073 } 15074 15075 function restoreControlledState$3(element, props) { 15076 // DOM component is still mounted; update 15077 updateWrapper$1(element, props); 15078 } 15079 15080 var HTML_NAMESPACE$1 = 'http://www.w3.org/1999/xhtml'; 15081 var MATH_NAMESPACE = 'http://www.w3.org/1998/Math/MathML'; 15082 var SVG_NAMESPACE = 'http://www.w3.org/2000/svg'; 15083 15084 var Namespaces = { 15085 html: HTML_NAMESPACE$1, 15086 mathml: MATH_NAMESPACE, 15087 svg: SVG_NAMESPACE 15088 }; 15089 15090 // Assumes there is no parent namespace. 15091 function getIntrinsicNamespace(type) { 15092 switch (type) { 15093 case 'svg': 15094 return SVG_NAMESPACE; 15095 case 'math': 15096 return MATH_NAMESPACE; 15097 default: 15098 return HTML_NAMESPACE$1; 15099 } 15100 } 15101 15102 function getChildNamespace(parentNamespace, type) { 15103 if (parentNamespace == null || parentNamespace === HTML_NAMESPACE$1) { 15104 // No (or default) parent namespace: potential entry point. 15105 return getIntrinsicNamespace(type); 15106 } 15107 if (parentNamespace === SVG_NAMESPACE && type === 'foreignObject') { 15108 // We're leaving SVG. 15109 return HTML_NAMESPACE$1; 15110 } 15111 // By default, pass namespace below. 15112 return parentNamespace; 15113 } 15114 15115 /* globals MSApp */ 15116 15117 /** 15118 * Create a function which has 'unsafe' privileges (required by windows8 apps) 15119 */ 15120 var createMicrosoftUnsafeLocalFunction = function (func) { 15121 if (typeof MSApp !== 'undefined' && MSApp.execUnsafeLocalFunction) { 15122 return function (arg0, arg1, arg2, arg3) { 15123 MSApp.execUnsafeLocalFunction(function () { 15124 return func(arg0, arg1, arg2, arg3); 15125 }); 15126 }; 15127 } else { 15128 return func; 15129 } 15130 }; 15131 15132 // SVG temp container for IE lacking innerHTML 15133 var reusableSVGContainer = void 0; 15134 15135 /** 15136 * Set the innerHTML property of a node 15137 * 15138 * @param {DOMElement} node 15139 * @param {string} html 15140 * @internal 15141 */ 15142 var setInnerHTML = createMicrosoftUnsafeLocalFunction(function (node, html) { 15143 // IE does not have innerHTML for SVG nodes, so instead we inject the 15144 // new markup in a temp node and then move the child nodes across into 15145 // the target node 15146 15147 if (node.namespaceURI === Namespaces.svg && !('innerHTML' in node)) { 15148 reusableSVGContainer = reusableSVGContainer || document.createElement('div'); 15149 reusableSVGContainer.innerHTML = '<svg>' + html + '</svg>'; 15150 var svgNode = reusableSVGContainer.firstChild; 15151 while (node.firstChild) { 15152 node.removeChild(node.firstChild); 15153 } 15154 while (svgNode.firstChild) { 15155 node.appendChild(svgNode.firstChild); 15156 } 15157 } else { 15158 node.innerHTML = html; 15159 } 15160 }); 15161 15162 /** 15163 * Set the textContent property of a node, ensuring that whitespace is preserved 15164 * even in IE8. innerText is a poor substitute for textContent and, among many 15165 * issues, inserts <br> instead of the literal newline chars. innerHTML behaves 15166 * as it should. 15167 * 15168 * @param {DOMElement} node 15169 * @param {string} text 15170 * @internal 15171 */ 15172 var setTextContent = function (node, text) { 15173 if (text) { 15174 var firstChild = node.firstChild; 15175 15176 if (firstChild && firstChild === node.lastChild && firstChild.nodeType === TEXT_NODE) { 15177 firstChild.nodeValue = text; 15178 return; 15179 } 15180 } 15181 node.textContent = text; 15182 }; 15183 15184 /** 15185 * CSS properties which accept numbers but are not in units of "px". 15186 */ 15187 var isUnitlessNumber = { 15188 animationIterationCount: true, 15189 borderImageOutset: true, 15190 borderImageSlice: true, 15191 borderImageWidth: true, 15192 boxFlex: true, 15193 boxFlexGroup: true, 15194 boxOrdinalGroup: true, 15195 columnCount: true, 15196 columns: true, 15197 flex: true, 15198 flexGrow: true, 15199 flexPositive: true, 15200 flexShrink: true, 15201 flexNegative: true, 15202 flexOrder: true, 15203 gridRow: true, 15204 gridRowEnd: true, 15205 gridRowSpan: true, 15206 gridRowStart: true, 15207 gridColumn: true, 15208 gridColumnEnd: true, 15209 gridColumnSpan: true, 15210 gridColumnStart: true, 15211 fontWeight: true, 15212 lineClamp: true, 15213 lineHeight: true, 15214 opacity: true, 15215 order: true, 15216 orphans: true, 15217 tabSize: true, 15218 widows: true, 15219 zIndex: true, 15220 zoom: true, 15221 15222 // SVG-related properties 15223 fillOpacity: true, 15224 floodOpacity: true, 15225 stopOpacity: true, 15226 strokeDasharray: true, 15227 strokeDashoffset: true, 15228 strokeMiterlimit: true, 15229 strokeOpacity: true, 15230 strokeWidth: true 15231 }; 15232 15233 /** 15234 * @param {string} prefix vendor-specific prefix, eg: Webkit 15235 * @param {string} key style name, eg: transitionDuration 15236 * @return {string} style name prefixed with `prefix`, properly camelCased, eg: 15237 * WebkitTransitionDuration 15238 */ 15239 function prefixKey(prefix, key) { 15240 return prefix + key.charAt(0).toUpperCase() + key.substring(1); 15241 } 15242 15243 /** 15244 * Support style names that may come passed in prefixed by adding permutations 15245 * of vendor prefixes. 15246 */ 15247 var prefixes = ['Webkit', 'ms', 'Moz', 'O']; 15248 15249 // Using Object.keys here, or else the vanilla for-in loop makes IE8 go into an 15250 // infinite loop, because it iterates over the newly added props too. 15251 Object.keys(isUnitlessNumber).forEach(function (prop) { 15252 prefixes.forEach(function (prefix) { 15253 isUnitlessNumber[prefixKey(prefix, prop)] = isUnitlessNumber[prop]; 15254 }); 15255 }); 15256 15257 /** 15258 * Convert a value into the proper css writable value. The style name `name` 15259 * should be logical (no hyphens), as specified 15260 * in `CSSProperty.isUnitlessNumber`. 15261 * 15262 * @param {string} name CSS property name such as `topMargin`. 15263 * @param {*} value CSS property value such as `10px`. 15264 * @return {string} Normalized style value with dimensions applied. 15265 */ 15266 function dangerousStyleValue(name, value, isCustomProperty) { 15267 // Note that we've removed escapeTextForBrowser() calls here since the 15268 // whole string will be escaped when the attribute is injected into 15269 // the markup. If you provide unsafe user data here they can inject 15270 // arbitrary CSS which may be problematic (I couldn't repro this): 15271 // https://www.owasp.org/index.php/XSS_Filter_Evasion_Cheat_Sheet 15272 // http://www.thespanner.co.uk/2007/11/26/ultimate-xss-css-injection/ 15273 // This is not an XSS hole but instead a potential CSS injection issue 15274 // which has lead to a greater discussion about how we're going to 15275 // trust URLs moving forward. See #2115901 15276 15277 var isEmpty = value == null || typeof value === 'boolean' || value === ''; 15278 if (isEmpty) { 15279 return ''; 15280 } 15281 15282 if (!isCustomProperty && typeof value === 'number' && value !== 0 && !(isUnitlessNumber.hasOwnProperty(name) && isUnitlessNumber[name])) { 15283 return value + 'px'; // Presumes implicit 'px' suffix for unitless numbers 15284 } 15285 15286 return ('' + value).trim(); 15287 } 15288 15289 var warnValidStyle = emptyFunction; 15290 15291 { 15292 // 'msTransform' is correct, but the other prefixes should be capitalized 15293 var badVendoredStyleNamePattern = /^(?:webkit|moz|o)[A-Z]/; 15294 15295 // style values shouldn't contain a semicolon 15296 var badStyleValueWithSemicolonPattern = /;\s*$/; 15297 15298 var warnedStyleNames = {}; 15299 var warnedStyleValues = {}; 15300 var warnedForNaNValue = false; 15301 var warnedForInfinityValue = false; 15302 15303 var warnHyphenatedStyleName = function (name, getStack) { 15304 if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) { 15305 return; 15306 } 15307 15308 warnedStyleNames[name] = true; 15309 warning(false, 'Unsupported style property %s. Did you mean %s?%s', name, camelizeStyleName(name), getStack()); 15310 }; 15311 15312 var warnBadVendoredStyleName = function (name, getStack) { 15313 if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) { 15314 return; 15315 } 15316 15317 warnedStyleNames[name] = true; 15318 warning(false, 'Unsupported vendor-prefixed style property %s. Did you mean %s?%s', name, name.charAt(0).toUpperCase() + name.slice(1), getStack()); 15319 }; 15320 15321 var warnStyleValueWithSemicolon = function (name, value, getStack) { 15322 if (warnedStyleValues.hasOwnProperty(value) && warnedStyleValues[value]) { 15323 return; 15324 } 15325 15326 warnedStyleValues[value] = true; 15327 warning(false, "Style property values shouldn't contain a semicolon. " + 'Try "%s: %s" instead.%s', name, value.replace(badStyleValueWithSemicolonPattern, ''), getStack()); 15328 }; 15329 15330 var warnStyleValueIsNaN = function (name, value, getStack) { 15331 if (warnedForNaNValue) { 15332 return; 15333 } 15334 15335 warnedForNaNValue = true; 15336 warning(false, '`NaN` is an invalid value for the `%s` css style property.%s', name, getStack()); 15337 }; 15338 15339 var warnStyleValueIsInfinity = function (name, value, getStack) { 15340 if (warnedForInfinityValue) { 15341 return; 15342 } 15343 15344 warnedForInfinityValue = true; 15345 warning(false, '`Infinity` is an invalid value for the `%s` css style property.%s', name, getStack()); 15346 }; 15347 15348 warnValidStyle = function (name, value, getStack) { 15349 if (name.indexOf('-') > -1) { 15350 warnHyphenatedStyleName(name, getStack); 15351 } else if (badVendoredStyleNamePattern.test(name)) { 15352 warnBadVendoredStyleName(name, getStack); 15353 } else if (badStyleValueWithSemicolonPattern.test(value)) { 15354 warnStyleValueWithSemicolon(name, value, getStack); 15355 } 15356 15357 if (typeof value === 'number') { 15358 if (isNaN(value)) { 15359 warnStyleValueIsNaN(name, value, getStack); 15360 } else if (!isFinite(value)) { 15361 warnStyleValueIsInfinity(name, value, getStack); 15362 } 15363 } 15364 }; 15365 } 15366 15367 var warnValidStyle$1 = warnValidStyle; 15368 15369 /** 15370 * Operations for dealing with CSS properties. 15371 */ 15372 15373 /** 15374 * This creates a string that is expected to be equivalent to the style 15375 * attribute generated by server-side rendering. It by-passes warnings and 15376 * security checks so it's not safe to use this value for anything other than 15377 * comparison. It is only used in DEV for SSR validation. 15378 */ 15379 function createDangerousStringForStyles(styles) { 15380 { 15381 var serialized = ''; 15382 var delimiter = ''; 15383 for (var styleName in styles) { 15384 if (!styles.hasOwnProperty(styleName)) { 15385 continue; 15386 } 15387 var styleValue = styles[styleName]; 15388 if (styleValue != null) { 15389 var isCustomProperty = styleName.indexOf('--') === 0; 15390 serialized += delimiter + hyphenateStyleName(styleName) + ':'; 15391 serialized += dangerousStyleValue(styleName, styleValue, isCustomProperty); 15392 15393 delimiter = ';'; 15394 } 15395 } 15396 return serialized || null; 15397 } 15398 } 15399 15400 /** 15401 * Sets the value for multiple styles on a node. If a value is specified as 15402 * '' (empty string), the corresponding style property will be unset. 15403 * 15404 * @param {DOMElement} node 15405 * @param {object} styles 15406 */ 15407 function setValueForStyles(node, styles, getStack) { 15408 var style = node.style; 15409 for (var styleName in styles) { 15410 if (!styles.hasOwnProperty(styleName)) { 15411 continue; 15412 } 15413 var isCustomProperty = styleName.indexOf('--') === 0; 15414 { 15415 if (!isCustomProperty) { 15416 warnValidStyle$1(styleName, styles[styleName], getStack); 15417 } 15418 } 15419 var styleValue = dangerousStyleValue(styleName, styles[styleName], isCustomProperty); 15420 if (styleName === 'float') { 15421 styleName = 'cssFloat'; 15422 } 15423 if (isCustomProperty) { 15424 style.setProperty(styleName, styleValue); 15425 } else { 15426 style[styleName] = styleValue; 15427 } 15428 } 15429 } 15430 15431 // For HTML, certain tags should omit their close tag. We keep a whitelist for 15432 // those special-case tags. 15433 15434 var omittedCloseTags = { 15435 area: true, 15436 base: true, 15437 br: true, 15438 col: true, 15439 embed: true, 15440 hr: true, 15441 img: true, 15442 input: true, 15443 keygen: true, 15444 link: true, 15445 meta: true, 15446 param: true, 15447 source: true, 15448 track: true, 15449 wbr: true 15450 }; 15451 15452 // For HTML, certain tags cannot have children. This has the same purpose as 15453 // `omittedCloseTags` except that `menuitem` should still have its closing tag. 15454 15455 var voidElementTags = _assign({ 15456 menuitem: true 15457 }, omittedCloseTags); 15458 15459 var HTML$1 = '__html'; 15460 15461 function assertValidProps(tag, props, getStack) { 15462 if (!props) { 15463 return; 15464 } 15465 // Note the use of `==` which checks for null or undefined. 15466 if (voidElementTags[tag]) { 15467 !(props.children == null && props.dangerouslySetInnerHTML == null) ? invariant(false, '%s is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`.%s', tag, getStack()) : void 0; 15468 } 15469 if (props.dangerouslySetInnerHTML != null) { 15470 !(props.children == null) ? invariant(false, 'Can only set one of `children` or `props.dangerouslySetInnerHTML`.') : void 0; 15471 !(typeof props.dangerouslySetInnerHTML === 'object' && HTML$1 in props.dangerouslySetInnerHTML) ? invariant(false, '`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. Please visit https://fb.me/react-invariant-dangerously-set-inner-html for more information.') : void 0; 15472 } 15473 { 15474 warning(props.suppressContentEditableWarning || !props.contentEditable || props.children == null, '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.%s', getStack()); 15475 } 15476 !(props.style == null || typeof props.style === 'object') ? invariant(false, 'The `style` prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + \'em\'}} when using JSX.%s', getStack()) : void 0; 15477 } 15478 15479 function isCustomComponent(tagName, props) { 15480 if (tagName.indexOf('-') === -1) { 15481 return typeof props.is === 'string'; 15482 } 15483 switch (tagName) { 15484 // These are reserved SVG and MathML elements. 15485 // We don't mind this whitelist too much because we expect it to never grow. 15486 // The alternative is to track the namespace in a few places which is convoluted. 15487 // https://w3c.github.io/webcomponents/spec/custom/#custom-elements-core-concepts 15488 case 'annotation-xml': 15489 case 'color-profile': 15490 case 'font-face': 15491 case 'font-face-src': 15492 case 'font-face-uri': 15493 case 'font-face-format': 15494 case 'font-face-name': 15495 case 'missing-glyph': 15496 return false; 15497 default: 15498 return true; 15499 } 15500 } 15501 15502 var ariaProperties = { 15503 'aria-current': 0, // state 15504 'aria-details': 0, 15505 'aria-disabled': 0, // state 15506 'aria-hidden': 0, // state 15507 'aria-invalid': 0, // state 15508 'aria-keyshortcuts': 0, 15509 'aria-label': 0, 15510 'aria-roledescription': 0, 15511 // Widget Attributes 15512 'aria-autocomplete': 0, 15513 'aria-checked': 0, 15514 'aria-expanded': 0, 15515 'aria-haspopup': 0, 15516 'aria-level': 0, 15517 'aria-modal': 0, 15518 'aria-multiline': 0, 15519 'aria-multiselectable': 0, 15520 'aria-orientation': 0, 15521 'aria-placeholder': 0, 15522 'aria-pressed': 0, 15523 'aria-readonly': 0, 15524 'aria-required': 0, 15525 'aria-selected': 0, 15526 'aria-sort': 0, 15527 'aria-valuemax': 0, 15528 'aria-valuemin': 0, 15529 'aria-valuenow': 0, 15530 'aria-valuetext': 0, 15531 // Live Region Attributes 15532 'aria-atomic': 0, 15533 'aria-busy': 0, 15534 'aria-live': 0, 15535 'aria-relevant': 0, 15536 // Drag-and-Drop Attributes 15537 'aria-dropeffect': 0, 15538 'aria-grabbed': 0, 15539 // Relationship Attributes 15540 'aria-activedescendant': 0, 15541 'aria-colcount': 0, 15542 'aria-colindex': 0, 15543 'aria-colspan': 0, 15544 'aria-controls': 0, 15545 'aria-describedby': 0, 15546 'aria-errormessage': 0, 15547 'aria-flowto': 0, 15548 'aria-labelledby': 0, 15549 'aria-owns': 0, 15550 'aria-posinset': 0, 15551 'aria-rowcount': 0, 15552 'aria-rowindex': 0, 15553 'aria-rowspan': 0, 15554 'aria-setsize': 0 15555 }; 15556 15557 var warnedProperties = {}; 15558 var rARIA = new RegExp('^(aria)-[' + ATTRIBUTE_NAME_CHAR + ']*$'); 15559 var rARIACamel = new RegExp('^(aria)[A-Z][' + ATTRIBUTE_NAME_CHAR + ']*$'); 15560 15561 var hasOwnProperty = Object.prototype.hasOwnProperty; 15562 15563 function getStackAddendum() { 15564 var stack = ReactDebugCurrentFrame.getStackAddendum(); 15565 return stack != null ? stack : ''; 15566 } 15567 15568 function validateProperty(tagName, name) { 15569 if (hasOwnProperty.call(warnedProperties, name) && warnedProperties[name]) { 15570 return true; 15571 } 15572 15573 if (rARIACamel.test(name)) { 15574 var ariaName = 'aria-' + name.slice(4).toLowerCase(); 15575 var correctName = ariaProperties.hasOwnProperty(ariaName) ? ariaName : null; 15576 15577 // If this is an aria-* attribute, but is not listed in the known DOM 15578 // DOM properties, then it is an invalid aria-* attribute. 15579 if (correctName == null) { 15580 warning(false, 'Invalid ARIA attribute `%s`. ARIA attributes follow the pattern aria-* and must be lowercase.%s', name, getStackAddendum()); 15581 warnedProperties[name] = true; 15582 return true; 15583 } 15584 // aria-* attributes should be lowercase; suggest the lowercase version. 15585 if (name !== correctName) { 15586 warning(false, 'Invalid ARIA attribute `%s`. Did you mean `%s`?%s', name, correctName, getStackAddendum()); 15587 warnedProperties[name] = true; 15588 return true; 15589 } 15590 } 15591 15592 if (rARIA.test(name)) { 15593 var lowerCasedName = name.toLowerCase(); 15594 var standardName = ariaProperties.hasOwnProperty(lowerCasedName) ? lowerCasedName : null; 15595 15596 // If this is an aria-* attribute, but is not listed in the known DOM 15597 // DOM properties, then it is an invalid aria-* attribute. 15598 if (standardName == null) { 15599 warnedProperties[name] = true; 15600 return false; 15601 } 15602 // aria-* attributes should be lowercase; suggest the lowercase version. 15603 if (name !== standardName) { 15604 warning(false, 'Unknown ARIA attribute `%s`. Did you mean `%s`?%s', name, standardName, getStackAddendum()); 15605 warnedProperties[name] = true; 15606 return true; 15607 } 15608 } 15609 15610 return true; 15611 } 15612 15613 function warnInvalidARIAProps(type, props) { 15614 var invalidProps = []; 15615 15616 for (var key in props) { 15617 var isValid = validateProperty(type, key); 15618 if (!isValid) { 15619 invalidProps.push(key); 15620 } 15621 } 15622 15623 var unknownPropString = invalidProps.map(function (prop) { 15624 return '`' + prop + '`'; 15625 }).join(', '); 15626 15627 if (invalidProps.length === 1) { 15628 warning(false, 'Invalid aria prop %s on <%s> tag. ' + 'For details, see https://fb.me/invalid-aria-prop%s', unknownPropString, type, getStackAddendum()); 15629 } else if (invalidProps.length > 1) { 15630 warning(false, 'Invalid aria props %s on <%s> tag. ' + 'For details, see https://fb.me/invalid-aria-prop%s', unknownPropString, type, getStackAddendum()); 15631 } 15632 } 15633 15634 function validateProperties(type, props) { 15635 if (isCustomComponent(type, props)) { 15636 return; 15637 } 15638 warnInvalidARIAProps(type, props); 15639 } 15640 15641 var didWarnValueNull = false; 15642 15643 function getStackAddendum$1() { 15644 var stack = ReactDebugCurrentFrame.getStackAddendum(); 15645 return stack != null ? stack : ''; 15646 } 15647 15648 function validateProperties$1(type, props) { 15649 if (type !== 'input' && type !== 'textarea' && type !== 'select') { 15650 return; 15651 } 15652 15653 if (props != null && props.value === null && !didWarnValueNull) { 15654 didWarnValueNull = true; 15655 if (type === 'select' && props.multiple) { 15656 warning(false, '`value` prop on `%s` should not be null. ' + 'Consider using an empty array when `multiple` is set to `true` ' + 'to clear the component or `undefined` for uncontrolled components.%s', type, getStackAddendum$1()); 15657 } else { 15658 warning(false, '`value` prop on `%s` should not be null. ' + 'Consider using an empty string to clear the component or `undefined` ' + 'for uncontrolled components.%s', type, getStackAddendum$1()); 15659 } 15660 } 15661 } 15662 15663 // When adding attributes to the HTML or SVG whitelist, be sure to 15664 // also add them to this module to ensure casing and incorrect name 15665 // warnings. 15666 var possibleStandardNames = { 15667 // HTML 15668 accept: 'accept', 15669 acceptcharset: 'acceptCharset', 15670 'accept-charset': 'acceptCharset', 15671 accesskey: 'accessKey', 15672 action: 'action', 15673 allowfullscreen: 'allowFullScreen', 15674 alt: 'alt', 15675 as: 'as', 15676 async: 'async', 15677 autocapitalize: 'autoCapitalize', 15678 autocomplete: 'autoComplete', 15679 autocorrect: 'autoCorrect', 15680 autofocus: 'autoFocus', 15681 autoplay: 'autoPlay', 15682 autosave: 'autoSave', 15683 capture: 'capture', 15684 cellpadding: 'cellPadding', 15685 cellspacing: 'cellSpacing', 15686 challenge: 'challenge', 15687 charset: 'charSet', 15688 checked: 'checked', 15689 children: 'children', 15690 cite: 'cite', 15691 'class': 'className', 15692 classid: 'classID', 15693 classname: 'className', 15694 cols: 'cols', 15695 colspan: 'colSpan', 15696 content: 'content', 15697 contenteditable: 'contentEditable', 15698 contextmenu: 'contextMenu', 15699 controls: 'controls', 15700 controlslist: 'controlsList', 15701 coords: 'coords', 15702 crossorigin: 'crossOrigin', 15703 dangerouslysetinnerhtml: 'dangerouslySetInnerHTML', 15704 data: 'data', 15705 datetime: 'dateTime', 15706 'default': 'default', 15707 defaultchecked: 'defaultChecked', 15708 defaultvalue: 'defaultValue', 15709 defer: 'defer', 15710 dir: 'dir', 15711 disabled: 'disabled', 15712 download: 'download', 15713 draggable: 'draggable', 15714 enctype: 'encType', 15715 'for': 'htmlFor', 15716 form: 'form', 15717 formmethod: 'formMethod', 15718 formaction: 'formAction', 15719 formenctype: 'formEncType', 15720 formnovalidate: 'formNoValidate', 15721 formtarget: 'formTarget', 15722 frameborder: 'frameBorder', 15723 headers: 'headers', 15724 height: 'height', 15725 hidden: 'hidden', 15726 high: 'high', 15727 href: 'href', 15728 hreflang: 'hrefLang', 15729 htmlfor: 'htmlFor', 15730 httpequiv: 'httpEquiv', 15731 'http-equiv': 'httpEquiv', 15732 icon: 'icon', 15733 id: 'id', 15734 innerhtml: 'innerHTML', 15735 inputmode: 'inputMode', 15736 integrity: 'integrity', 15737 is: 'is', 15738 itemid: 'itemID', 15739 itemprop: 'itemProp', 15740 itemref: 'itemRef', 15741 itemscope: 'itemScope', 15742 itemtype: 'itemType', 15743 keyparams: 'keyParams', 15744 keytype: 'keyType', 15745 kind: 'kind', 15746 label: 'label', 15747 lang: 'lang', 15748 list: 'list', 15749 loop: 'loop', 15750 low: 'low', 15751 manifest: 'manifest', 15752 marginwidth: 'marginWidth', 15753 marginheight: 'marginHeight', 15754 max: 'max', 15755 maxlength: 'maxLength', 15756 media: 'media', 15757 mediagroup: 'mediaGroup', 15758 method: 'method', 15759 min: 'min', 15760 minlength: 'minLength', 15761 multiple: 'multiple', 15762 muted: 'muted', 15763 name: 'name', 15764 nonce: 'nonce', 15765 novalidate: 'noValidate', 15766 open: 'open', 15767 optimum: 'optimum', 15768 pattern: 'pattern', 15769 placeholder: 'placeholder', 15770 playsinline: 'playsInline', 15771 poster: 'poster', 15772 preload: 'preload', 15773 profile: 'profile', 15774 radiogroup: 'radioGroup', 15775 readonly: 'readOnly', 15776 referrerpolicy: 'referrerPolicy', 15777 rel: 'rel', 15778 required: 'required', 15779 reversed: 'reversed', 15780 role: 'role', 15781 rows: 'rows', 15782 rowspan: 'rowSpan', 15783 sandbox: 'sandbox', 15784 scope: 'scope', 15785 scoped: 'scoped', 15786 scrolling: 'scrolling', 15787 seamless: 'seamless', 15788 selected: 'selected', 15789 shape: 'shape', 15790 size: 'size', 15791 sizes: 'sizes', 15792 span: 'span', 15793 spellcheck: 'spellCheck', 15794 src: 'src', 15795 srcdoc: 'srcDoc', 15796 srclang: 'srcLang', 15797 srcset: 'srcSet', 15798 start: 'start', 15799 step: 'step', 15800 style: 'style', 15801 summary: 'summary', 15802 tabindex: 'tabIndex', 15803 target: 'target', 15804 title: 'title', 15805 type: 'type', 15806 usemap: 'useMap', 15807 value: 'value', 15808 width: 'width', 15809 wmode: 'wmode', 15810 wrap: 'wrap', 15811 15812 // SVG 15813 about: 'about', 15814 accentheight: 'accentHeight', 15815 'accent-height': 'accentHeight', 15816 accumulate: 'accumulate', 15817 additive: 'additive', 15818 alignmentbaseline: 'alignmentBaseline', 15819 'alignment-baseline': 'alignmentBaseline', 15820 allowreorder: 'allowReorder', 15821 alphabetic: 'alphabetic', 15822 amplitude: 'amplitude', 15823 arabicform: 'arabicForm', 15824 'arabic-form': 'arabicForm', 15825 ascent: 'ascent', 15826 attributename: 'attributeName', 15827 attributetype: 'attributeType', 15828 autoreverse: 'autoReverse', 15829 azimuth: 'azimuth', 15830 basefrequency: 'baseFrequency', 15831 baselineshift: 'baselineShift', 15832 'baseline-shift': 'baselineShift', 15833 baseprofile: 'baseProfile', 15834 bbox: 'bbox', 15835 begin: 'begin', 15836 bias: 'bias', 15837 by: 'by', 15838 calcmode: 'calcMode', 15839 capheight: 'capHeight', 15840 'cap-height': 'capHeight', 15841 clip: 'clip', 15842 clippath: 'clipPath', 15843 'clip-path': 'clipPath', 15844 clippathunits: 'clipPathUnits', 15845 cliprule: 'clipRule', 15846 'clip-rule': 'clipRule', 15847 color: 'color', 15848 colorinterpolation: 'colorInterpolation', 15849 'color-interpolation': 'colorInterpolation', 15850 colorinterpolationfilters: 'colorInterpolationFilters', 15851 'color-interpolation-filters': 'colorInterpolationFilters', 15852 colorprofile: 'colorProfile', 15853 'color-profile': 'colorProfile', 15854 colorrendering: 'colorRendering', 15855 'color-rendering': 'colorRendering', 15856 contentscripttype: 'contentScriptType', 15857 contentstyletype: 'contentStyleType', 15858 cursor: 'cursor', 15859 cx: 'cx', 15860 cy: 'cy', 15861 d: 'd', 15862 datatype: 'datatype', 15863 decelerate: 'decelerate', 15864 descent: 'descent', 15865 diffuseconstant: 'diffuseConstant', 15866 direction: 'direction', 15867 display: 'display', 15868 divisor: 'divisor', 15869 dominantbaseline: 'dominantBaseline', 15870 'dominant-baseline': 'dominantBaseline', 15871 dur: 'dur', 15872 dx: 'dx', 15873 dy: 'dy', 15874 edgemode: 'edgeMode', 15875 elevation: 'elevation', 15876 enablebackground: 'enableBackground', 15877 'enable-background': 'enableBackground', 15878 end: 'end', 15879 exponent: 'exponent', 15880 externalresourcesrequired: 'externalResourcesRequired', 15881 fill: 'fill', 15882 fillopacity: 'fillOpacity', 15883 'fill-opacity': 'fillOpacity', 15884 fillrule: 'fillRule', 15885 'fill-rule': 'fillRule', 15886 filter: 'filter', 15887 filterres: 'filterRes', 15888 filterunits: 'filterUnits', 15889 floodopacity: 'floodOpacity', 15890 'flood-opacity': 'floodOpacity', 15891 floodcolor: 'floodColor', 15892 'flood-color': 'floodColor', 15893 focusable: 'focusable', 15894 fontfamily: 'fontFamily', 15895 'font-family': 'fontFamily', 15896 fontsize: 'fontSize', 15897 'font-size': 'fontSize', 15898 fontsizeadjust: 'fontSizeAdjust', 15899 'font-size-adjust': 'fontSizeAdjust', 15900 fontstretch: 'fontStretch', 15901 'font-stretch': 'fontStretch', 15902 fontstyle: 'fontStyle', 15903 'font-style': 'fontStyle', 15904 fontvariant: 'fontVariant', 15905 'font-variant': 'fontVariant', 15906 fontweight: 'fontWeight', 15907 'font-weight': 'fontWeight', 15908 format: 'format', 15909 from: 'from', 15910 fx: 'fx', 15911 fy: 'fy', 15912 g1: 'g1', 15913 g2: 'g2', 15914 glyphname: 'glyphName', 15915 'glyph-name': 'glyphName', 15916 glyphorientationhorizontal: 'glyphOrientationHorizontal', 15917 'glyph-orientation-horizontal': 'glyphOrientationHorizontal', 15918 glyphorientationvertical: 'glyphOrientationVertical', 15919 'glyph-orientation-vertical': 'glyphOrientationVertical', 15920 glyphref: 'glyphRef', 15921 gradienttransform: 'gradientTransform', 15922 gradientunits: 'gradientUnits', 15923 hanging: 'hanging', 15924 horizadvx: 'horizAdvX', 15925 'horiz-adv-x': 'horizAdvX', 15926 horizoriginx: 'horizOriginX', 15927 'horiz-origin-x': 'horizOriginX', 15928 ideographic: 'ideographic', 15929 imagerendering: 'imageRendering', 15930 'image-rendering': 'imageRendering', 15931 in2: 'in2', 15932 'in': 'in', 15933 inlist: 'inlist', 15934 intercept: 'intercept', 15935 k1: 'k1', 15936 k2: 'k2', 15937 k3: 'k3', 15938 k4: 'k4', 15939 k: 'k', 15940 kernelmatrix: 'kernelMatrix', 15941 kernelunitlength: 'kernelUnitLength', 15942 kerning: 'kerning', 15943 keypoints: 'keyPoints', 15944 keysplines: 'keySplines', 15945 keytimes: 'keyTimes', 15946 lengthadjust: 'lengthAdjust', 15947 letterspacing: 'letterSpacing', 15948 'letter-spacing': 'letterSpacing', 15949 lightingcolor: 'lightingColor', 15950 'lighting-color': 'lightingColor', 15951 limitingconeangle: 'limitingConeAngle', 15952 local: 'local', 15953 markerend: 'markerEnd', 15954 'marker-end': 'markerEnd', 15955 markerheight: 'markerHeight', 15956 markermid: 'markerMid', 15957 'marker-mid': 'markerMid', 15958 markerstart: 'markerStart', 15959 'marker-start': 'markerStart', 15960 markerunits: 'markerUnits', 15961 markerwidth: 'markerWidth', 15962 mask: 'mask', 15963 maskcontentunits: 'maskContentUnits', 15964 maskunits: 'maskUnits', 15965 mathematical: 'mathematical', 15966 mode: 'mode', 15967 numoctaves: 'numOctaves', 15968 offset: 'offset', 15969 opacity: 'opacity', 15970 operator: 'operator', 15971 order: 'order', 15972 orient: 'orient', 15973 orientation: 'orientation', 15974 origin: 'origin', 15975 overflow: 'overflow', 15976 overlineposition: 'overlinePosition', 15977 'overline-position': 'overlinePosition', 15978 overlinethickness: 'overlineThickness', 15979 'overline-thickness': 'overlineThickness', 15980 paintorder: 'paintOrder', 15981 'paint-order': 'paintOrder', 15982 panose1: 'panose1', 15983 'panose-1': 'panose1', 15984 pathlength: 'pathLength', 15985 patterncontentunits: 'patternContentUnits', 15986 patterntransform: 'patternTransform', 15987 patternunits: 'patternUnits', 15988 pointerevents: 'pointerEvents', 15989 'pointer-events': 'pointerEvents', 15990 points: 'points', 15991 pointsatx: 'pointsAtX', 15992 pointsaty: 'pointsAtY', 15993 pointsatz: 'pointsAtZ', 15994 prefix: 'prefix', 15995 preservealpha: 'preserveAlpha', 15996 preserveaspectratio: 'preserveAspectRatio', 15997 primitiveunits: 'primitiveUnits', 15998 property: 'property', 15999 r: 'r', 16000 radius: 'radius', 16001 refx: 'refX', 16002 refy: 'refY', 16003 renderingintent: 'renderingIntent', 16004 'rendering-intent': 'renderingIntent', 16005 repeatcount: 'repeatCount', 16006 repeatdur: 'repeatDur', 16007 requiredextensions: 'requiredExtensions', 16008 requiredfeatures: 'requiredFeatures', 16009 resource: 'resource', 16010 restart: 'restart', 16011 result: 'result', 16012 results: 'results', 16013 rotate: 'rotate', 16014 rx: 'rx', 16015 ry: 'ry', 16016 scale: 'scale', 16017 security: 'security', 16018 seed: 'seed', 16019 shaperendering: 'shapeRendering', 16020 'shape-rendering': 'shapeRendering', 16021 slope: 'slope', 16022 spacing: 'spacing', 16023 specularconstant: 'specularConstant', 16024 specularexponent: 'specularExponent', 16025 speed: 'speed', 16026 spreadmethod: 'spreadMethod', 16027 startoffset: 'startOffset', 16028 stddeviation: 'stdDeviation', 16029 stemh: 'stemh', 16030 stemv: 'stemv', 16031 stitchtiles: 'stitchTiles', 16032 stopcolor: 'stopColor', 16033 'stop-color': 'stopColor', 16034 stopopacity: 'stopOpacity', 16035 'stop-opacity': 'stopOpacity', 16036 strikethroughposition: 'strikethroughPosition', 16037 'strikethrough-position': 'strikethroughPosition', 16038 strikethroughthickness: 'strikethroughThickness', 16039 'strikethrough-thickness': 'strikethroughThickness', 16040 string: 'string', 16041 stroke: 'stroke', 16042 strokedasharray: 'strokeDasharray', 16043 'stroke-dasharray': 'strokeDasharray', 16044 strokedashoffset: 'strokeDashoffset', 16045 'stroke-dashoffset': 'strokeDashoffset', 16046 strokelinecap: 'strokeLinecap', 16047 'stroke-linecap': 'strokeLinecap', 16048 strokelinejoin: 'strokeLinejoin', 16049 'stroke-linejoin': 'strokeLinejoin', 16050 strokemiterlimit: 'strokeMiterlimit', 16051 'stroke-miterlimit': 'strokeMiterlimit', 16052 strokewidth: 'strokeWidth', 16053 'stroke-width': 'strokeWidth', 16054 strokeopacity: 'strokeOpacity', 16055 'stroke-opacity': 'strokeOpacity', 16056 suppresscontenteditablewarning: 'suppressContentEditableWarning', 16057 suppresshydrationwarning: 'suppressHydrationWarning', 16058 surfacescale: 'surfaceScale', 16059 systemlanguage: 'systemLanguage', 16060 tablevalues: 'tableValues', 16061 targetx: 'targetX', 16062 targety: 'targetY', 16063 textanchor: 'textAnchor', 16064 'text-anchor': 'textAnchor', 16065 textdecoration: 'textDecoration', 16066 'text-decoration': 'textDecoration', 16067 textlength: 'textLength', 16068 textrendering: 'textRendering', 16069 'text-rendering': 'textRendering', 16070 to: 'to', 16071 transform: 'transform', 16072 'typeof': 'typeof', 16073 u1: 'u1', 16074 u2: 'u2', 16075 underlineposition: 'underlinePosition', 16076 'underline-position': 'underlinePosition', 16077 underlinethickness: 'underlineThickness', 16078 'underline-thickness': 'underlineThickness', 16079 unicode: 'unicode', 16080 unicodebidi: 'unicodeBidi', 16081 'unicode-bidi': 'unicodeBidi', 16082 unicoderange: 'unicodeRange', 16083 'unicode-range': 'unicodeRange', 16084 unitsperem: 'unitsPerEm', 16085 'units-per-em': 'unitsPerEm', 16086 unselectable: 'unselectable', 16087 valphabetic: 'vAlphabetic', 16088 'v-alphabetic': 'vAlphabetic', 16089 values: 'values', 16090 vectoreffect: 'vectorEffect', 16091 'vector-effect': 'vectorEffect', 16092 version: 'version', 16093 vertadvy: 'vertAdvY', 16094 'vert-adv-y': 'vertAdvY', 16095 vertoriginx: 'vertOriginX', 16096 'vert-origin-x': 'vertOriginX', 16097 vertoriginy: 'vertOriginY', 16098 'vert-origin-y': 'vertOriginY', 16099 vhanging: 'vHanging', 16100 'v-hanging': 'vHanging', 16101 videographic: 'vIdeographic', 16102 'v-ideographic': 'vIdeographic', 16103 viewbox: 'viewBox', 16104 viewtarget: 'viewTarget', 16105 visibility: 'visibility', 16106 vmathematical: 'vMathematical', 16107 'v-mathematical': 'vMathematical', 16108 vocab: 'vocab', 16109 widths: 'widths', 16110 wordspacing: 'wordSpacing', 16111 'word-spacing': 'wordSpacing', 16112 writingmode: 'writingMode', 16113 'writing-mode': 'writingMode', 16114 x1: 'x1', 16115 x2: 'x2', 16116 x: 'x', 16117 xchannelselector: 'xChannelSelector', 16118 xheight: 'xHeight', 16119 'x-height': 'xHeight', 16120 xlinkactuate: 'xlinkActuate', 16121 'xlink:actuate': 'xlinkActuate', 16122 xlinkarcrole: 'xlinkArcrole', 16123 'xlink:arcrole': 'xlinkArcrole', 16124 xlinkhref: 'xlinkHref', 16125 'xlink:href': 'xlinkHref', 16126 xlinkrole: 'xlinkRole', 16127 'xlink:role': 'xlinkRole', 16128 xlinkshow: 'xlinkShow', 16129 'xlink:show': 'xlinkShow', 16130 xlinktitle: 'xlinkTitle', 16131 'xlink:title': 'xlinkTitle', 16132 xlinktype: 'xlinkType', 16133 'xlink:type': 'xlinkType', 16134 xmlbase: 'xmlBase', 16135 'xml:base': 'xmlBase', 16136 xmllang: 'xmlLang', 16137 'xml:lang': 'xmlLang', 16138 xmlns: 'xmlns', 16139 'xml:space': 'xmlSpace', 16140 xmlnsxlink: 'xmlnsXlink', 16141 'xmlns:xlink': 'xmlnsXlink', 16142 xmlspace: 'xmlSpace', 16143 y1: 'y1', 16144 y2: 'y2', 16145 y: 'y', 16146 ychannelselector: 'yChannelSelector', 16147 z: 'z', 16148 zoomandpan: 'zoomAndPan' 16149 }; 16150 16151 function getStackAddendum$2() { 16152 var stack = ReactDebugCurrentFrame.getStackAddendum(); 16153 return stack != null ? stack : ''; 16154 } 16155 16156 { 16157 var warnedProperties$1 = {}; 16158 var hasOwnProperty$1 = Object.prototype.hasOwnProperty; 16159 var EVENT_NAME_REGEX = /^on./; 16160 var INVALID_EVENT_NAME_REGEX = /^on[^A-Z]/; 16161 var rARIA$1 = new RegExp('^(aria)-[' + ATTRIBUTE_NAME_CHAR + ']*$'); 16162 var rARIACamel$1 = new RegExp('^(aria)[A-Z][' + ATTRIBUTE_NAME_CHAR + ']*$'); 16163 16164 var validateProperty$1 = function (tagName, name, value, canUseEventSystem) { 16165 if (hasOwnProperty$1.call(warnedProperties$1, name) && warnedProperties$1[name]) { 16166 return true; 16167 } 16168 16169 var lowerCasedName = name.toLowerCase(); 16170 if (lowerCasedName === 'onfocusin' || lowerCasedName === 'onfocusout') { 16171 warning(false, 'React uses onFocus and onBlur instead of onFocusIn and onFocusOut. ' + 'All React events are normalized to bubble, so onFocusIn and onFocusOut ' + 'are not needed/supported by React.'); 16172 warnedProperties$1[name] = true; 16173 return true; 16174 } 16175 16176 // We can't rely on the event system being injected on the server. 16177 if (canUseEventSystem) { 16178 if (registrationNameModules.hasOwnProperty(name)) { 16179 return true; 16180 } 16181 var registrationName = possibleRegistrationNames.hasOwnProperty(lowerCasedName) ? possibleRegistrationNames[lowerCasedName] : null; 16182 if (registrationName != null) { 16183 warning(false, 'Invalid event handler property `%s`. Did you mean `%s`?%s', name, registrationName, getStackAddendum$2()); 16184 warnedProperties$1[name] = true; 16185 return true; 16186 } 16187 if (EVENT_NAME_REGEX.test(name)) { 16188 warning(false, 'Unknown event handler property `%s`. It will be ignored.%s', name, getStackAddendum$2()); 16189 warnedProperties$1[name] = true; 16190 return true; 16191 } 16192 } else if (EVENT_NAME_REGEX.test(name)) { 16193 // If no event plugins have been injected, we are in a server environment. 16194 // So we can't tell if the event name is correct for sure, but we can filter 16195 // out known bad ones like `onclick`. We can't suggest a specific replacement though. 16196 if (INVALID_EVENT_NAME_REGEX.test(name)) { 16197 warning(false, 'Invalid event handler property `%s`. ' + 'React events use the camelCase naming convention, for example `onClick`.%s', name, getStackAddendum$2()); 16198 } 16199 warnedProperties$1[name] = true; 16200 return true; 16201 } 16202 16203 // Let the ARIA attribute hook validate ARIA attributes 16204 if (rARIA$1.test(name) || rARIACamel$1.test(name)) { 16205 return true; 16206 } 16207 16208 if (lowerCasedName === 'innerhtml') { 16209 warning(false, 'Directly setting property `innerHTML` is not permitted. ' + 'For more information, lookup documentation on `dangerouslySetInnerHTML`.'); 16210 warnedProperties$1[name] = true; 16211 return true; 16212 } 16213 16214 if (lowerCasedName === 'aria') { 16215 warning(false, 'The `aria` attribute is reserved for future use in React. ' + 'Pass individual `aria-` attributes instead.'); 16216 warnedProperties$1[name] = true; 16217 return true; 16218 } 16219 16220 if (lowerCasedName === 'is' && value !== null && value !== undefined && typeof value !== 'string') { 16221 warning(false, 'Received a `%s` for a string attribute `is`. If this is expected, cast ' + 'the value to a string.%s', typeof value, getStackAddendum$2()); 16222 warnedProperties$1[name] = true; 16223 return true; 16224 } 16225 16226 if (typeof value === 'number' && isNaN(value)) { 16227 warning(false, 'Received NaN for the `%s` attribute. If this is expected, cast ' + 'the value to a string.%s', name, getStackAddendum$2()); 16228 warnedProperties$1[name] = true; 16229 return true; 16230 } 16231 16232 var isReserved = isReservedProp(name); 16233 16234 // Known attributes should match the casing specified in the property config. 16235 if (possibleStandardNames.hasOwnProperty(lowerCasedName)) { 16236 var standardName = possibleStandardNames[lowerCasedName]; 16237 if (standardName !== name) { 16238 warning(false, 'Invalid DOM property `%s`. Did you mean `%s`?%s', name, standardName, getStackAddendum$2()); 16239 warnedProperties$1[name] = true; 16240 return true; 16241 } 16242 } else if (!isReserved && name !== lowerCasedName) { 16243 // Unknown attributes should have lowercase casing since that's how they 16244 // will be cased anyway with server rendering. 16245 warning(false, 'React does not recognize the `%s` prop on a DOM element. If you ' + 'intentionally want it to appear in the DOM as a custom ' + 'attribute, spell it as lowercase `%s` instead. ' + 'If you accidentally passed it from a parent component, remove ' + 'it from the DOM element.%s', name, lowerCasedName, getStackAddendum$2()); 16246 warnedProperties$1[name] = true; 16247 return true; 16248 } 16249 16250 if (typeof value === 'boolean' && !shouldAttributeAcceptBooleanValue(name)) { 16251 if (value) { 16252 warning(false, 'Received `%s` for a non-boolean attribute `%s`.\n\n' + 'If you want to write it to the DOM, pass a string instead: ' + '%s="%s" or %s={value.toString()}.%s', value, name, name, value, name, getStackAddendum$2()); 16253 } else { 16254 warning(false, 'Received `%s` for a non-boolean attribute `%s`.\n\n' + 'If you want to write it to the DOM, pass a string instead: ' + '%s="%s" or %s={value.toString()}.\n\n' + 'If you used to conditionally omit it with %s={condition && value}, ' + 'pass %s={condition ? value : undefined} instead.%s', value, name, name, value, name, name, name, getStackAddendum$2()); 16255 } 16256 warnedProperties$1[name] = true; 16257 return true; 16258 } 16259 16260 // Now that we've validated casing, do not validate 16261 // data types for reserved props 16262 if (isReserved) { 16263 return true; 16264 } 16265 16266 // Warn when a known attribute is a bad type 16267 if (!shouldSetAttribute(name, value)) { 16268 warnedProperties$1[name] = true; 16269 return false; 16270 } 16271 16272 return true; 16273 }; 16274 } 16275 16276 var warnUnknownProperties = function (type, props, canUseEventSystem) { 16277 var unknownProps = []; 16278 for (var key in props) { 16279 var isValid = validateProperty$1(type, key, props[key], canUseEventSystem); 16280 if (!isValid) { 16281 unknownProps.push(key); 16282 } 16283 } 16284 16285 var unknownPropString = unknownProps.map(function (prop) { 16286 return '`' + prop + '`'; 16287 }).join(', '); 16288 if (unknownProps.length === 1) { 16289 warning(false, 'Invalid value for prop %s on <%s> tag. Either remove it from the element, ' + 'or pass a string or number value to keep it in the DOM. ' + 'For details, see https://fb.me/react-attribute-behavior%s', unknownPropString, type, getStackAddendum$2()); 16290 } else if (unknownProps.length > 1) { 16291 warning(false, 'Invalid values for props %s on <%s> tag. Either remove them from the element, ' + 'or pass a string or number value to keep them in the DOM. ' + 'For details, see https://fb.me/react-attribute-behavior%s', unknownPropString, type, getStackAddendum$2()); 16292 } 16293 }; 16294 16295 function validateProperties$2(type, props, canUseEventSystem) { 16296 if (isCustomComponent(type, props)) { 16297 return; 16298 } 16299 warnUnknownProperties(type, props, canUseEventSystem); 16300 } 16301 16302 // TODO: direct imports like some-package/src/* are bad. Fix me. 16303 var getCurrentFiberOwnerName$1 = ReactDebugCurrentFiber.getCurrentFiberOwnerName; 16304 var getCurrentFiberStackAddendum$2 = ReactDebugCurrentFiber.getCurrentFiberStackAddendum; 16305 16306 var didWarnInvalidHydration = false; 16307 var didWarnShadyDOM = false; 16308 16309 var DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML'; 16310 var SUPPRESS_CONTENT_EDITABLE_WARNING = 'suppressContentEditableWarning'; 16311 var SUPPRESS_HYDRATION_WARNING$1 = 'suppressHydrationWarning'; 16312 var AUTOFOCUS = 'autoFocus'; 16313 var CHILDREN = 'children'; 16314 var STYLE = 'style'; 16315 var HTML = '__html'; 16316 16317 var HTML_NAMESPACE = Namespaces.html; 16318 16319 16320 var getStack = emptyFunction.thatReturns(''); 16321 16322 { 16323 getStack = getCurrentFiberStackAddendum$2; 16324 16325 var warnedUnknownTags = { 16326 // Chrome is the only major browser not shipping <time>. But as of July 16327 // 2017 it intends to ship it due to widespread usage. We intentionally 16328 // *don't* warn for <time> even if it's unrecognized by Chrome because 16329 // it soon will be, and many apps have been using it anyway. 16330 time: true, 16331 // There are working polyfills for <dialog>. Let people use it. 16332 dialog: true 16333 }; 16334 16335 var validatePropertiesInDevelopment = function (type, props) { 16336 validateProperties(type, props); 16337 validateProperties$1(type, props); 16338 validateProperties$2(type, props, /* canUseEventSystem */true); 16339 }; 16340 16341 // HTML parsing normalizes CR and CRLF to LF. 16342 // It also can turn \u0000 into \uFFFD inside attributes. 16343 // https://www.w3.org/TR/html5/single-page.html#preprocessing-the-input-stream 16344 // If we have a mismatch, it might be caused by that. 16345 // We will still patch up in this case but not fire the warning. 16346 var NORMALIZE_NEWLINES_REGEX = /\r\n?/g; 16347 var NORMALIZE_NULL_AND_REPLACEMENT_REGEX = /\u0000|\uFFFD/g; 16348 16349 var normalizeMarkupForTextOrAttribute = function (markup) { 16350 var markupString = typeof markup === 'string' ? markup : '' + markup; 16351 return markupString.replace(NORMALIZE_NEWLINES_REGEX, '\n').replace(NORMALIZE_NULL_AND_REPLACEMENT_REGEX, ''); 16352 }; 16353 16354 var warnForTextDifference = function (serverText, clientText) { 16355 if (didWarnInvalidHydration) { 16356 return; 16357 } 16358 var normalizedClientText = normalizeMarkupForTextOrAttribute(clientText); 16359 var normalizedServerText = normalizeMarkupForTextOrAttribute(serverText); 16360 if (normalizedServerText === normalizedClientText) { 16361 return; 16362 } 16363 didWarnInvalidHydration = true; 16364 warning(false, 'Text content did not match. Server: "%s" Client: "%s"', normalizedServerText, normalizedClientText); 16365 }; 16366 16367 var warnForPropDifference = function (propName, serverValue, clientValue) { 16368 if (didWarnInvalidHydration) { 16369 return; 16370 } 16371 var normalizedClientValue = normalizeMarkupForTextOrAttribute(clientValue); 16372 var normalizedServerValue = normalizeMarkupForTextOrAttribute(serverValue); 16373 if (normalizedServerValue === normalizedClientValue) { 16374 return; 16375 } 16376 didWarnInvalidHydration = true; 16377 warning(false, 'Prop `%s` did not match. Server: %s Client: %s', propName, JSON.stringify(normalizedServerValue), JSON.stringify(normalizedClientValue)); 16378 }; 16379 16380 var warnForExtraAttributes = function (attributeNames) { 16381 if (didWarnInvalidHydration) { 16382 return; 16383 } 16384 didWarnInvalidHydration = true; 16385 var names = []; 16386 attributeNames.forEach(function (name) { 16387 names.push(name); 16388 }); 16389 warning(false, 'Extra attributes from the server: %s', names); 16390 }; 16391 16392 var warnForInvalidEventListener = function (registrationName, listener) { 16393 if (listener === false) { 16394 warning(false, 'Expected `%s` listener to be a function, instead got `false`.\n\n' + 'If you used to conditionally omit it with %s={condition && value}, ' + 'pass %s={condition ? value : undefined} instead.%s', registrationName, registrationName, registrationName, getCurrentFiberStackAddendum$2()); 16395 } else { 16396 warning(false, 'Expected `%s` listener to be a function, instead got a value of `%s` type.%s', registrationName, typeof listener, getCurrentFiberStackAddendum$2()); 16397 } 16398 }; 16399 16400 // Parse the HTML and read it back to normalize the HTML string so that it 16401 // can be used for comparison. 16402 var normalizeHTML = function (parent, html) { 16403 // We could have created a separate document here to avoid 16404 // re-initializing custom elements if they exist. But this breaks 16405 // how <noscript> is being handled. So we use the same document. 16406 // See the discussion in https://github.com/facebook/react/pull/11157. 16407 var testElement = parent.namespaceURI === HTML_NAMESPACE ? parent.ownerDocument.createElement(parent.tagName) : parent.ownerDocument.createElementNS(parent.namespaceURI, parent.tagName); 16408 testElement.innerHTML = html; 16409 return testElement.innerHTML; 16410 }; 16411 } 16412 16413 function ensureListeningTo(rootContainerElement, registrationName) { 16414 var isDocumentOrFragment = rootContainerElement.nodeType === DOCUMENT_NODE || rootContainerElement.nodeType === DOCUMENT_FRAGMENT_NODE; 16415 var doc = isDocumentOrFragment ? rootContainerElement : rootContainerElement.ownerDocument; 16416 listenTo(registrationName, doc); 16417 } 16418 16419 function getOwnerDocumentFromRootContainer(rootContainerElement) { 16420 return rootContainerElement.nodeType === DOCUMENT_NODE ? rootContainerElement : rootContainerElement.ownerDocument; 16421 } 16422 16423 // There are so many media events, it makes sense to just 16424 // maintain a list rather than create a `trapBubbledEvent` for each 16425 var mediaEvents = { 16426 topAbort: 'abort', 16427 topCanPlay: 'canplay', 16428 topCanPlayThrough: 'canplaythrough', 16429 topDurationChange: 'durationchange', 16430 topEmptied: 'emptied', 16431 topEncrypted: 'encrypted', 16432 topEnded: 'ended', 16433 topError: 'error', 16434 topLoadedData: 'loadeddata', 16435 topLoadedMetadata: 'loadedmetadata', 16436 topLoadStart: 'loadstart', 16437 topPause: 'pause', 16438 topPlay: 'play', 16439 topPlaying: 'playing', 16440 topProgress: 'progress', 16441 topRateChange: 'ratechange', 16442 topSeeked: 'seeked', 16443 topSeeking: 'seeking', 16444 topStalled: 'stalled', 16445 topSuspend: 'suspend', 16446 topTimeUpdate: 'timeupdate', 16447 topVolumeChange: 'volumechange', 16448 topWaiting: 'waiting' 16449 }; 16450 16451 function trapClickOnNonInteractiveElement(node) { 16452 // Mobile Safari does not fire properly bubble click events on 16453 // non-interactive elements, which means delegated click listeners do not 16454 // fire. The workaround for this bug involves attaching an empty click 16455 // listener on the target node. 16456 // http://www.quirksmode.org/blog/archives/2010/09/click_event_del.html 16457 // Just set it using the onclick property so that we don't have to manage any 16458 // bookkeeping for it. Not sure if we need to clear it when the listener is 16459 // removed. 16460 // TODO: Only do this for the relevant Safaris maybe? 16461 node.onclick = emptyFunction; 16462 } 16463 16464 function setInitialDOMProperties(tag, domElement, rootContainerElement, nextProps, isCustomComponentTag) { 16465 for (var propKey in nextProps) { 16466 if (!nextProps.hasOwnProperty(propKey)) { 16467 continue; 16468 } 16469 var nextProp = nextProps[propKey]; 16470 if (propKey === STYLE) { 16471 { 16472 if (nextProp) { 16473 // Freeze the next style object so that we can assume it won't be 16474 // mutated. We have already warned for this in the past. 16475 Object.freeze(nextProp); 16476 } 16477 } 16478 // Relies on `updateStylesByID` not mutating `styleUpdates`. 16479 setValueForStyles(domElement, nextProp, getStack); 16480 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) { 16481 var nextHtml = nextProp ? nextProp[HTML] : undefined; 16482 if (nextHtml != null) { 16483 setInnerHTML(domElement, nextHtml); 16484 } 16485 } else if (propKey === CHILDREN) { 16486 if (typeof nextProp === 'string') { 16487 // Avoid setting initial textContent when the text is empty. In IE11 setting 16488 // textContent on a <textarea> will cause the placeholder to not 16489 // show within the <textarea> until it has been focused and blurred again. 16490 // https://github.com/facebook/react/issues/6731#issuecomment-254874553 16491 var canSetTextContent = tag !== 'textarea' || nextProp !== ''; 16492 if (canSetTextContent) { 16493 setTextContent(domElement, nextProp); 16494 } 16495 } else if (typeof nextProp === 'number') { 16496 setTextContent(domElement, '' + nextProp); 16497 } 16498 } else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING$1) { 16499 // Noop 16500 } else if (propKey === AUTOFOCUS) { 16501 // We polyfill it separately on the client during commit. 16502 // We blacklist it here rather than in the property list because we emit it in SSR. 16503 } else if (registrationNameModules.hasOwnProperty(propKey)) { 16504 if (nextProp != null) { 16505 if (true && typeof nextProp !== 'function') { 16506 warnForInvalidEventListener(propKey, nextProp); 16507 } 16508 ensureListeningTo(rootContainerElement, propKey); 16509 } 16510 } else if (isCustomComponentTag) { 16511 setValueForAttribute(domElement, propKey, nextProp); 16512 } else if (nextProp != null) { 16513 // If we're updating to null or undefined, we should remove the property 16514 // from the DOM node instead of inadvertently setting to a string. This 16515 // brings us in line with the same behavior we have on initial render. 16516 setValueForProperty(domElement, propKey, nextProp); 16517 } 16518 } 16519 } 16520 16521 function updateDOMProperties(domElement, updatePayload, wasCustomComponentTag, isCustomComponentTag) { 16522 // TODO: Handle wasCustomComponentTag 16523 for (var i = 0; i < updatePayload.length; i += 2) { 16524 var propKey = updatePayload[i]; 16525 var propValue = updatePayload[i + 1]; 16526 if (propKey === STYLE) { 16527 setValueForStyles(domElement, propValue, getStack); 16528 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) { 16529 setInnerHTML(domElement, propValue); 16530 } else if (propKey === CHILDREN) { 16531 setTextContent(domElement, propValue); 16532 } else if (isCustomComponentTag) { 16533 if (propValue != null) { 16534 setValueForAttribute(domElement, propKey, propValue); 16535 } else { 16536 deleteValueForAttribute(domElement, propKey); 16537 } 16538 } else if (propValue != null) { 16539 setValueForProperty(domElement, propKey, propValue); 16540 } else { 16541 // If we're updating to null or undefined, we should remove the property 16542 // from the DOM node instead of inadvertently setting to a string. This 16543 // brings us in line with the same behavior we have on initial render. 16544 deleteValueForProperty(domElement, propKey); 16545 } 16546 } 16547 } 16548 16549 function createElement$1(type, props, rootContainerElement, parentNamespace) { 16550 // We create tags in the namespace of their parent container, except HTML 16551 var ownerDocument = getOwnerDocumentFromRootContainer(rootContainerElement); 16552 var domElement; 16553 var namespaceURI = parentNamespace; 16554 if (namespaceURI === HTML_NAMESPACE) { 16555 namespaceURI = getIntrinsicNamespace(type); 16556 } 16557 if (namespaceURI === HTML_NAMESPACE) { 16558 { 16559 var isCustomComponentTag = isCustomComponent(type, props); 16560 // Should this check be gated by parent namespace? Not sure we want to 16561 // allow <SVG> or <mATH>. 16562 warning(isCustomComponentTag || type === type.toLowerCase(), '<%s /> is using uppercase HTML. Always use lowercase HTML tags ' + 'in React.', type); 16563 } 16564 16565 if (type === 'script') { 16566 // Create the script via .innerHTML so its "parser-inserted" flag is 16567 // set to true and it does not execute 16568 var div = ownerDocument.createElement('div'); 16569 div.innerHTML = '<script><' + '/script>'; // eslint-disable-line 16570 // This is guaranteed to yield a script element. 16571 var firstChild = div.firstChild; 16572 domElement = div.removeChild(firstChild); 16573 } else if (typeof props.is === 'string') { 16574 // $FlowIssue `createElement` should be updated for Web Components 16575 domElement = ownerDocument.createElement(type, { is: props.is }); 16576 } else { 16577 // Separate else branch instead of using `props.is || undefined` above because of a Firefox bug. 16578 // See discussion in https://github.com/facebook/react/pull/6896 16579 // and discussion in https://bugzilla.mozilla.org/show_bug.cgi?id=1276240 16580 domElement = ownerDocument.createElement(type); 16581 } 16582 } else { 16583 domElement = ownerDocument.createElementNS(namespaceURI, type); 16584 } 16585 16586 { 16587 if (namespaceURI === HTML_NAMESPACE) { 16588 if (!isCustomComponentTag && Object.prototype.toString.call(domElement) === '[object HTMLUnknownElement]' && !Object.prototype.hasOwnProperty.call(warnedUnknownTags, type)) { 16589 warnedUnknownTags[type] = true; 16590 warning(false, 'The tag <%s> is unrecognized in this browser. ' + 'If you meant to render a React component, start its name with ' + 'an uppercase letter.', type); 16591 } 16592 } 16593 } 16594 16595 return domElement; 16596 } 16597 16598 function createTextNode$1(text, rootContainerElement) { 16599 return getOwnerDocumentFromRootContainer(rootContainerElement).createTextNode(text); 16600 } 16601 16602 function setInitialProperties$1(domElement, tag, rawProps, rootContainerElement) { 16603 var isCustomComponentTag = isCustomComponent(tag, rawProps); 16604 { 16605 validatePropertiesInDevelopment(tag, rawProps); 16606 if (isCustomComponentTag && !didWarnShadyDOM && domElement.shadyRoot) { 16607 warning(false, '%s is using shady DOM. Using shady DOM with React can ' + 'cause things to break subtly.', getCurrentFiberOwnerName$1() || 'A component'); 16608 didWarnShadyDOM = true; 16609 } 16610 } 16611 16612 // TODO: Make sure that we check isMounted before firing any of these events. 16613 var props; 16614 switch (tag) { 16615 case 'iframe': 16616 case 'object': 16617 trapBubbledEvent('topLoad', 'load', domElement); 16618 props = rawProps; 16619 break; 16620 case 'video': 16621 case 'audio': 16622 // Create listener for each media event 16623 for (var event in mediaEvents) { 16624 if (mediaEvents.hasOwnProperty(event)) { 16625 trapBubbledEvent(event, mediaEvents[event], domElement); 16626 } 16627 } 16628 props = rawProps; 16629 break; 16630 case 'source': 16631 trapBubbledEvent('topError', 'error', domElement); 16632 props = rawProps; 16633 break; 16634 case 'img': 16635 case 'image': 16636 trapBubbledEvent('topError', 'error', domElement); 16637 trapBubbledEvent('topLoad', 'load', domElement); 16638 props = rawProps; 16639 break; 16640 case 'form': 16641 trapBubbledEvent('topReset', 'reset', domElement); 16642 trapBubbledEvent('topSubmit', 'submit', domElement); 16643 props = rawProps; 16644 break; 16645 case 'details': 16646 trapBubbledEvent('topToggle', 'toggle', domElement); 16647 props = rawProps; 16648 break; 16649 case 'input': 16650 initWrapperState(domElement, rawProps); 16651 props = getHostProps(domElement, rawProps); 16652 trapBubbledEvent('topInvalid', 'invalid', domElement); 16653 // For controlled components we always need to ensure we're listening 16654 // to onChange. Even if there is no listener. 16655 ensureListeningTo(rootContainerElement, 'onChange'); 16656 break; 16657 case 'option': 16658 validateProps(domElement, rawProps); 16659 props = getHostProps$1(domElement, rawProps); 16660 break; 16661 case 'select': 16662 initWrapperState$1(domElement, rawProps); 16663 props = getHostProps$2(domElement, rawProps); 16664 trapBubbledEvent('topInvalid', 'invalid', domElement); 16665 // For controlled components we always need to ensure we're listening 16666 // to onChange. Even if there is no listener. 16667 ensureListeningTo(rootContainerElement, 'onChange'); 16668 break; 16669 case 'textarea': 16670 initWrapperState$2(domElement, rawProps); 16671 props = getHostProps$3(domElement, rawProps); 16672 trapBubbledEvent('topInvalid', 'invalid', domElement); 16673 // For controlled components we always need to ensure we're listening 16674 // to onChange. Even if there is no listener. 16675 ensureListeningTo(rootContainerElement, 'onChange'); 16676 break; 16677 default: 16678 props = rawProps; 16679 } 16680 16681 assertValidProps(tag, props, getStack); 16682 16683 setInitialDOMProperties(tag, domElement, rootContainerElement, props, isCustomComponentTag); 16684 16685 switch (tag) { 16686 case 'input': 16687 // TODO: Make sure we check if this is still unmounted or do any clean 16688 // up necessary since we never stop tracking anymore. 16689 track(domElement); 16690 postMountWrapper(domElement, rawProps); 16691 break; 16692 case 'textarea': 16693 // TODO: Make sure we check if this is still unmounted or do any clean 16694 // up necessary since we never stop tracking anymore. 16695 track(domElement); 16696 postMountWrapper$3(domElement, rawProps); 16697 break; 16698 case 'option': 16699 postMountWrapper$1(domElement, rawProps); 16700 break; 16701 case 'select': 16702 postMountWrapper$2(domElement, rawProps); 16703 break; 16704 default: 16705 if (typeof props.onClick === 'function') { 16706 // TODO: This cast may not be sound for SVG, MathML or custom elements. 16707 trapClickOnNonInteractiveElement(domElement); 16708 } 16709 break; 16710 } 16711 } 16712 16713 // Calculate the diff between the two objects. 16714 function diffProperties$1(domElement, tag, lastRawProps, nextRawProps, rootContainerElement) { 16715 { 16716 validatePropertiesInDevelopment(tag, nextRawProps); 16717 } 16718 16719 var updatePayload = null; 16720 16721 var lastProps; 16722 var nextProps; 16723 switch (tag) { 16724 case 'input': 16725 lastProps = getHostProps(domElement, lastRawProps); 16726 nextProps = getHostProps(domElement, nextRawProps); 16727 updatePayload = []; 16728 break; 16729 case 'option': 16730 lastProps = getHostProps$1(domElement, lastRawProps); 16731 nextProps = getHostProps$1(domElement, nextRawProps); 16732 updatePayload = []; 16733 break; 16734 case 'select': 16735 lastProps = getHostProps$2(domElement, lastRawProps); 16736 nextProps = getHostProps$2(domElement, nextRawProps); 16737 updatePayload = []; 16738 break; 16739 case 'textarea': 16740 lastProps = getHostProps$3(domElement, lastRawProps); 16741 nextProps = getHostProps$3(domElement, nextRawProps); 16742 updatePayload = []; 16743 break; 16744 default: 16745 lastProps = lastRawProps; 16746 nextProps = nextRawProps; 16747 if (typeof lastProps.onClick !== 'function' && typeof nextProps.onClick === 'function') { 16748 // TODO: This cast may not be sound for SVG, MathML or custom elements. 16749 trapClickOnNonInteractiveElement(domElement); 16750 } 16751 break; 16752 } 16753 16754 assertValidProps(tag, nextProps, getStack); 16755 16756 var propKey; 16757 var styleName; 16758 var styleUpdates = null; 16759 for (propKey in lastProps) { 16760 if (nextProps.hasOwnProperty(propKey) || !lastProps.hasOwnProperty(propKey) || lastProps[propKey] == null) { 16761 continue; 16762 } 16763 if (propKey === STYLE) { 16764 var lastStyle = lastProps[propKey]; 16765 for (styleName in lastStyle) { 16766 if (lastStyle.hasOwnProperty(styleName)) { 16767 if (!styleUpdates) { 16768 styleUpdates = {}; 16769 } 16770 styleUpdates[styleName] = ''; 16771 } 16772 } 16773 } else if (propKey === DANGEROUSLY_SET_INNER_HTML || propKey === CHILDREN) { 16774 // Noop. This is handled by the clear text mechanism. 16775 } else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING$1) { 16776 // Noop 16777 } else if (propKey === AUTOFOCUS) { 16778 // Noop. It doesn't work on updates anyway. 16779 } else if (registrationNameModules.hasOwnProperty(propKey)) { 16780 // This is a special case. If any listener updates we need to ensure 16781 // that the "current" fiber pointer gets updated so we need a commit 16782 // to update this element. 16783 if (!updatePayload) { 16784 updatePayload = []; 16785 } 16786 } else { 16787 // For all other deleted properties we add it to the queue. We use 16788 // the whitelist in the commit phase instead. 16789 (updatePayload = updatePayload || []).push(propKey, null); 16790 } 16791 } 16792 for (propKey in nextProps) { 16793 var nextProp = nextProps[propKey]; 16794 var lastProp = lastProps != null ? lastProps[propKey] : undefined; 16795 if (!nextProps.hasOwnProperty(propKey) || nextProp === lastProp || nextProp == null && lastProp == null) { 16796 continue; 16797 } 16798 if (propKey === STYLE) { 16799 { 16800 if (nextProp) { 16801 // Freeze the next style object so that we can assume it won't be 16802 // mutated. We have already warned for this in the past. 16803 Object.freeze(nextProp); 16804 } 16805 } 16806 if (lastProp) { 16807 // Unset styles on `lastProp` but not on `nextProp`. 16808 for (styleName in lastProp) { 16809 if (lastProp.hasOwnProperty(styleName) && (!nextProp || !nextProp.hasOwnProperty(styleName))) { 16810 if (!styleUpdates) { 16811 styleUpdates = {}; 16812 } 16813 styleUpdates[styleName] = ''; 16814 } 16815 } 16816 // Update styles that changed since `lastProp`. 16817 for (styleName in nextProp) { 16818 if (nextProp.hasOwnProperty(styleName) && lastProp[styleName] !== nextProp[styleName]) { 16819 if (!styleUpdates) { 16820 styleUpdates = {}; 16821 } 16822 styleUpdates[styleName] = nextProp[styleName]; 16823 } 16824 } 16825 } else { 16826 // Relies on `updateStylesByID` not mutating `styleUpdates`. 16827 if (!styleUpdates) { 16828 if (!updatePayload) { 16829 updatePayload = []; 16830 } 16831 updatePayload.push(propKey, styleUpdates); 16832 } 16833 styleUpdates = nextProp; 16834 } 16835 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) { 16836 var nextHtml = nextProp ? nextProp[HTML] : undefined; 16837 var lastHtml = lastProp ? lastProp[HTML] : undefined; 16838 if (nextHtml != null) { 16839 if (lastHtml !== nextHtml) { 16840 (updatePayload = updatePayload || []).push(propKey, '' + nextHtml); 16841 } 16842 } else { 16843 // TODO: It might be too late to clear this if we have children 16844 // inserted already. 16845 } 16846 } else if (propKey === CHILDREN) { 16847 if (lastProp !== nextProp && (typeof nextProp === 'string' || typeof nextProp === 'number')) { 16848 (updatePayload = updatePayload || []).push(propKey, '' + nextProp); 16849 } 16850 } else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING$1) { 16851 // Noop 16852 } else if (registrationNameModules.hasOwnProperty(propKey)) { 16853 if (nextProp != null) { 16854 // We eagerly listen to this even though we haven't committed yet. 16855 if (true && typeof nextProp !== 'function') { 16856 warnForInvalidEventListener(propKey, nextProp); 16857 } 16858 ensureListeningTo(rootContainerElement, propKey); 16859 } 16860 if (!updatePayload && lastProp !== nextProp) { 16861 // This is a special case. If any listener updates we need to ensure 16862 // that the "current" props pointer gets updated so we need a commit 16863 // to update this element. 16864 updatePayload = []; 16865 } 16866 } else { 16867 // For any other property we always add it to the queue and then we 16868 // filter it out using the whitelist during the commit. 16869 (updatePayload = updatePayload || []).push(propKey, nextProp); 16870 } 16871 } 16872 if (styleUpdates) { 16873 (updatePayload = updatePayload || []).push(STYLE, styleUpdates); 16874 } 16875 return updatePayload; 16876 } 16877 16878 // Apply the diff. 16879 function updateProperties$1(domElement, updatePayload, tag, lastRawProps, nextRawProps) { 16880 // Update checked *before* name. 16881 // In the middle of an update, it is possible to have multiple checked. 16882 // When a checked radio tries to change name, browser makes another radio's checked false. 16883 if (tag === 'input' && nextRawProps.type === 'radio' && nextRawProps.name != null) { 16884 updateChecked(domElement, nextRawProps); 16885 } 16886 16887 var wasCustomComponentTag = isCustomComponent(tag, lastRawProps); 16888 var isCustomComponentTag = isCustomComponent(tag, nextRawProps); 16889 // Apply the diff. 16890 updateDOMProperties(domElement, updatePayload, wasCustomComponentTag, isCustomComponentTag); 16891 16892 // TODO: Ensure that an update gets scheduled if any of the special props 16893 // changed. 16894 switch (tag) { 16895 case 'input': 16896 // Update the wrapper around inputs *after* updating props. This has to 16897 // happen after `updateDOMProperties`. Otherwise HTML5 input validations 16898 // raise warnings and prevent the new value from being assigned. 16899 updateWrapper(domElement, nextRawProps); 16900 break; 16901 case 'textarea': 16902 updateWrapper$1(domElement, nextRawProps); 16903 break; 16904 case 'select': 16905 // <select> value update needs to occur after <option> children 16906 // reconciliation 16907 postUpdateWrapper(domElement, nextRawProps); 16908 break; 16909 } 16910 } 16911 16912 function diffHydratedProperties$1(domElement, tag, rawProps, parentNamespace, rootContainerElement) { 16913 { 16914 var suppressHydrationWarning = rawProps[SUPPRESS_HYDRATION_WARNING$1] === true; 16915 var isCustomComponentTag = isCustomComponent(tag, rawProps); 16916 validatePropertiesInDevelopment(tag, rawProps); 16917 if (isCustomComponentTag && !didWarnShadyDOM && domElement.shadyRoot) { 16918 warning(false, '%s is using shady DOM. Using shady DOM with React can ' + 'cause things to break subtly.', getCurrentFiberOwnerName$1() || 'A component'); 16919 didWarnShadyDOM = true; 16920 } 16921 } 16922 16923 // TODO: Make sure that we check isMounted before firing any of these events. 16924 switch (tag) { 16925 case 'iframe': 16926 case 'object': 16927 trapBubbledEvent('topLoad', 'load', domElement); 16928 break; 16929 case 'video': 16930 case 'audio': 16931 // Create listener for each media event 16932 for (var event in mediaEvents) { 16933 if (mediaEvents.hasOwnProperty(event)) { 16934 trapBubbledEvent(event, mediaEvents[event], domElement); 16935 } 16936 } 16937 break; 16938 case 'source': 16939 trapBubbledEvent('topError', 'error', domElement); 16940 break; 16941 case 'img': 16942 case 'image': 16943 trapBubbledEvent('topError', 'error', domElement); 16944 trapBubbledEvent('topLoad', 'load', domElement); 16945 break; 16946 case 'form': 16947 trapBubbledEvent('topReset', 'reset', domElement); 16948 trapBubbledEvent('topSubmit', 'submit', domElement); 16949 break; 16950 case 'details': 16951 trapBubbledEvent('topToggle', 'toggle', domElement); 16952 break; 16953 case 'input': 16954 initWrapperState(domElement, rawProps); 16955 trapBubbledEvent('topInvalid', 'invalid', domElement); 16956 // For controlled components we always need to ensure we're listening 16957 // to onChange. Even if there is no listener. 16958 ensureListeningTo(rootContainerElement, 'onChange'); 16959 break; 16960 case 'option': 16961 validateProps(domElement, rawProps); 16962 break; 16963 case 'select': 16964 initWrapperState$1(domElement, rawProps); 16965 trapBubbledEvent('topInvalid', 'invalid', domElement); 16966 // For controlled components we always need to ensure we're listening 16967 // to onChange. Even if there is no listener. 16968 ensureListeningTo(rootContainerElement, 'onChange'); 16969 break; 16970 case 'textarea': 16971 initWrapperState$2(domElement, rawProps); 16972 trapBubbledEvent('topInvalid', 'invalid', domElement); 16973 // For controlled components we always need to ensure we're listening 16974 // to onChange. Even if there is no listener. 16975 ensureListeningTo(rootContainerElement, 'onChange'); 16976 break; 16977 } 16978 16979 assertValidProps(tag, rawProps, getStack); 16980 16981 { 16982 var extraAttributeNames = new Set(); 16983 var attributes = domElement.attributes; 16984 for (var i = 0; i < attributes.length; i++) { 16985 var name = attributes[i].name.toLowerCase(); 16986 switch (name) { 16987 // Built-in SSR attribute is whitelisted 16988 case 'data-reactroot': 16989 break; 16990 // Controlled attributes are not validated 16991 // TODO: Only ignore them on controlled tags. 16992 case 'value': 16993 break; 16994 case 'checked': 16995 break; 16996 case 'selected': 16997 break; 16998 default: 16999 // Intentionally use the original name. 17000 // See discussion in https://github.com/facebook/react/pull/10676. 17001 extraAttributeNames.add(attributes[i].name); 17002 } 17003 } 17004 } 17005 17006 var updatePayload = null; 17007 for (var propKey in rawProps) { 17008 if (!rawProps.hasOwnProperty(propKey)) { 17009 continue; 17010 } 17011 var nextProp = rawProps[propKey]; 17012 if (propKey === CHILDREN) { 17013 // For text content children we compare against textContent. This 17014 // might match additional HTML that is hidden when we read it using 17015 // textContent. E.g. "foo" will match "f<span>oo</span>" but that still 17016 // satisfies our requirement. Our requirement is not to produce perfect 17017 // HTML and attributes. Ideally we should preserve structure but it's 17018 // ok not to if the visible content is still enough to indicate what 17019 // even listeners these nodes might be wired up to. 17020 // TODO: Warn if there is more than a single textNode as a child. 17021 // TODO: Should we use domElement.firstChild.nodeValue to compare? 17022 if (typeof nextProp === 'string') { 17023 if (domElement.textContent !== nextProp) { 17024 if (true && !suppressHydrationWarning) { 17025 warnForTextDifference(domElement.textContent, nextProp); 17026 } 17027 updatePayload = [CHILDREN, nextProp]; 17028 } 17029 } else if (typeof nextProp === 'number') { 17030 if (domElement.textContent !== '' + nextProp) { 17031 if (true && !suppressHydrationWarning) { 17032 warnForTextDifference(domElement.textContent, nextProp); 17033 } 17034 updatePayload = [CHILDREN, '' + nextProp]; 17035 } 17036 } 17037 } else if (registrationNameModules.hasOwnProperty(propKey)) { 17038 if (nextProp != null) { 17039 if (true && typeof nextProp !== 'function') { 17040 warnForInvalidEventListener(propKey, nextProp); 17041 } 17042 ensureListeningTo(rootContainerElement, propKey); 17043 } 17044 } else { 17045 // Validate that the properties correspond to their expected values. 17046 var serverValue; 17047 var propertyInfo; 17048 if (suppressHydrationWarning) { 17049 // Don't bother comparing. We're ignoring all these warnings. 17050 } else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING$1 || 17051 // Controlled attributes are not validated 17052 // TODO: Only ignore them on controlled tags. 17053 propKey === 'value' || propKey === 'checked' || propKey === 'selected') { 17054 // Noop 17055 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) { 17056 var rawHtml = nextProp ? nextProp[HTML] || '' : ''; 17057 var serverHTML = domElement.innerHTML; 17058 var expectedHTML = normalizeHTML(domElement, rawHtml); 17059 if (expectedHTML !== serverHTML) { 17060 warnForPropDifference(propKey, serverHTML, expectedHTML); 17061 } 17062 } else if (propKey === STYLE) { 17063 // $FlowFixMe - Should be inferred as not undefined. 17064 extraAttributeNames['delete'](propKey); 17065 var expectedStyle = createDangerousStringForStyles(nextProp); 17066 serverValue = domElement.getAttribute('style'); 17067 if (expectedStyle !== serverValue) { 17068 warnForPropDifference(propKey, serverValue, expectedStyle); 17069 } 17070 } else if (isCustomComponentTag) { 17071 // $FlowFixMe - Should be inferred as not undefined. 17072 extraAttributeNames['delete'](propKey.toLowerCase()); 17073 serverValue = getValueForAttribute(domElement, propKey, nextProp); 17074 17075 if (nextProp !== serverValue) { 17076 warnForPropDifference(propKey, serverValue, nextProp); 17077 } 17078 } else if (shouldSetAttribute(propKey, nextProp)) { 17079 if (propertyInfo = getPropertyInfo(propKey)) { 17080 // $FlowFixMe - Should be inferred as not undefined. 17081 extraAttributeNames['delete'](propertyInfo.attributeName); 17082 serverValue = getValueForProperty(domElement, propKey, nextProp); 17083 } else { 17084 var ownNamespace = parentNamespace; 17085 if (ownNamespace === HTML_NAMESPACE) { 17086 ownNamespace = getIntrinsicNamespace(tag); 17087 } 17088 if (ownNamespace === HTML_NAMESPACE) { 17089 // $FlowFixMe - Should be inferred as not undefined. 17090 extraAttributeNames['delete'](propKey.toLowerCase()); 17091 } else { 17092 // $FlowFixMe - Should be inferred as not undefined. 17093 extraAttributeNames['delete'](propKey); 17094 } 17095 serverValue = getValueForAttribute(domElement, propKey, nextProp); 17096 } 17097 17098 if (nextProp !== serverValue) { 17099 warnForPropDifference(propKey, serverValue, nextProp); 17100 } 17101 } 17102 } 17103 } 17104 17105 { 17106 // $FlowFixMe - Should be inferred as not undefined. 17107 if (extraAttributeNames.size > 0 && !suppressHydrationWarning) { 17108 // $FlowFixMe - Should be inferred as not undefined. 17109 warnForExtraAttributes(extraAttributeNames); 17110 } 17111 } 17112 17113 switch (tag) { 17114 case 'input': 17115 // TODO: Make sure we check if this is still unmounted or do any clean 17116 // up necessary since we never stop tracking anymore. 17117 track(domElement); 17118 postMountWrapper(domElement, rawProps); 17119 break; 17120 case 'textarea': 17121 // TODO: Make sure we check if this is still unmounted or do any clean 17122 // up necessary since we never stop tracking anymore. 17123 track(domElement); 17124 postMountWrapper$3(domElement, rawProps); 17125 break; 17126 case 'select': 17127 case 'option': 17128 // For input and textarea we current always set the value property at 17129 // post mount to force it to diverge from attributes. However, for 17130 // option and select we don't quite do the same thing and select 17131 // is not resilient to the DOM state changing so we don't do that here. 17132 // TODO: Consider not doing this for input and textarea. 17133 break; 17134 default: 17135 if (typeof rawProps.onClick === 'function') { 17136 // TODO: This cast may not be sound for SVG, MathML or custom elements. 17137 trapClickOnNonInteractiveElement(domElement); 17138 } 17139 break; 17140 } 17141 17142 return updatePayload; 17143 } 17144 17145 function diffHydratedText$1(textNode, text) { 17146 var isDifferent = textNode.nodeValue !== text; 17147 return isDifferent; 17148 } 17149 17150 function warnForUnmatchedText$1(textNode, text) { 17151 { 17152 warnForTextDifference(textNode.nodeValue, text); 17153 } 17154 } 17155 17156 function warnForDeletedHydratableElement$1(parentNode, child) { 17157 { 17158 if (didWarnInvalidHydration) { 17159 return; 17160 } 17161 didWarnInvalidHydration = true; 17162 warning(false, 'Did not expect server HTML to contain a <%s> in <%s>.', child.nodeName.toLowerCase(), parentNode.nodeName.toLowerCase()); 17163 } 17164 } 17165 17166 function warnForDeletedHydratableText$1(parentNode, child) { 17167 { 17168 if (didWarnInvalidHydration) { 17169 return; 17170 } 17171 didWarnInvalidHydration = true; 17172 warning(false, 'Did not expect server HTML to contain the text node "%s" in <%s>.', child.nodeValue, parentNode.nodeName.toLowerCase()); 17173 } 17174 } 17175 17176 function warnForInsertedHydratedElement$1(parentNode, tag, props) { 17177 { 17178 if (didWarnInvalidHydration) { 17179 return; 17180 } 17181 didWarnInvalidHydration = true; 17182 warning(false, 'Expected server HTML to contain a matching <%s> in <%s>.', tag, parentNode.nodeName.toLowerCase()); 17183 } 17184 } 17185 17186 function warnForInsertedHydratedText$1(parentNode, text) { 17187 { 17188 if (text === '') { 17189 // We expect to insert empty text nodes since they're not represented in 17190 // the HTML. 17191 // TODO: Remove this special case if we can just avoid inserting empty 17192 // text nodes. 17193 return; 17194 } 17195 if (didWarnInvalidHydration) { 17196 return; 17197 } 17198 didWarnInvalidHydration = true; 17199 warning(false, 'Expected server HTML to contain a matching text node for "%s" in <%s>.', text, parentNode.nodeName.toLowerCase()); 17200 } 17201 } 17202 17203 function restoreControlledState(domElement, tag, props) { 17204 switch (tag) { 17205 case 'input': 17206 restoreControlledState$1(domElement, props); 17207 return; 17208 case 'textarea': 17209 restoreControlledState$3(domElement, props); 17210 return; 17211 case 'select': 17212 restoreControlledState$2(domElement, props); 17213 return; 17214 } 17215 } 17216 17217 var ReactDOMFiberComponent = Object.freeze({ 17218 createElement: createElement$1, 17219 createTextNode: createTextNode$1, 17220 setInitialProperties: setInitialProperties$1, 17221 diffProperties: diffProperties$1, 17222 updateProperties: updateProperties$1, 17223 diffHydratedProperties: diffHydratedProperties$1, 17224 diffHydratedText: diffHydratedText$1, 17225 warnForUnmatchedText: warnForUnmatchedText$1, 17226 warnForDeletedHydratableElement: warnForDeletedHydratableElement$1, 17227 warnForDeletedHydratableText: warnForDeletedHydratableText$1, 17228 warnForInsertedHydratedElement: warnForInsertedHydratedElement$1, 17229 warnForInsertedHydratedText: warnForInsertedHydratedText$1, 17230 restoreControlledState: restoreControlledState 17231 }); 17232 17233 // TODO: direct imports like some-package/src/* are bad. Fix me. 17234 var getCurrentFiberStackAddendum$6 = ReactDebugCurrentFiber.getCurrentFiberStackAddendum; 17235 17236 var validateDOMNesting = emptyFunction; 17237 17238 { 17239 // This validation code was written based on the HTML5 parsing spec: 17240 // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-scope 17241 // 17242 // Note: this does not catch all invalid nesting, nor does it try to (as it's 17243 // not clear what practical benefit doing so provides); instead, we warn only 17244 // for cases where the parser will give a parse tree differing from what React 17245 // intended. For example, <b><div></div></b> is invalid but we don't warn 17246 // because it still parses correctly; we do warn for other cases like nested 17247 // <p> tags where the beginning of the second element implicitly closes the 17248 // first, causing a confusing mess. 17249 17250 // https://html.spec.whatwg.org/multipage/syntax.html#special 17251 var specialTags = ['address', 'applet', 'area', 'article', 'aside', 'base', 'basefont', 'bgsound', 'blockquote', 'body', 'br', 'button', 'caption', 'center', 'col', 'colgroup', 'dd', 'details', 'dir', 'div', 'dl', 'dt', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'frame', 'frameset', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'iframe', 'img', 'input', 'isindex', 'li', 'link', 'listing', 'main', 'marquee', 'menu', 'menuitem', 'meta', 'nav', 'noembed', 'noframes', 'noscript', 'object', 'ol', 'p', 'param', 'plaintext', 'pre', 'script', 'section', 'select', 'source', 'style', 'summary', 'table', 'tbody', 'td', 'template', 'textarea', 'tfoot', 'th', 'thead', 'title', 'tr', 'track', 'ul', 'wbr', 'xmp']; 17252 17253 // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-scope 17254 var inScopeTags = ['applet', 'caption', 'html', 'table', 'td', 'th', 'marquee', 'object', 'template', 17255 17256 // https://html.spec.whatwg.org/multipage/syntax.html#html-integration-point 17257 // TODO: Distinguish by namespace here -- for <title>, including it here 17258 // errs on the side of fewer warnings 17259 'foreignObject', 'desc', 'title']; 17260 17261 // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-button-scope 17262 var buttonScopeTags = inScopeTags.concat(['button']); 17263 17264 // https://html.spec.whatwg.org/multipage/syntax.html#generate-implied-end-tags 17265 var impliedEndTags = ['dd', 'dt', 'li', 'option', 'optgroup', 'p', 'rp', 'rt']; 17266 17267 var emptyAncestorInfo = { 17268 current: null, 17269 17270 formTag: null, 17271 aTagInScope: null, 17272 buttonTagInScope: null, 17273 nobrTagInScope: null, 17274 pTagInButtonScope: null, 17275 17276 listItemTagAutoclosing: null, 17277 dlItemTagAutoclosing: null 17278 }; 17279 17280 var updatedAncestorInfo$1 = function (oldInfo, tag, instance) { 17281 var ancestorInfo = _assign({}, oldInfo || emptyAncestorInfo); 17282 var info = { tag: tag, instance: instance }; 17283 17284 if (inScopeTags.indexOf(tag) !== -1) { 17285 ancestorInfo.aTagInScope = null; 17286 ancestorInfo.buttonTagInScope = null; 17287 ancestorInfo.nobrTagInScope = null; 17288 } 17289 if (buttonScopeTags.indexOf(tag) !== -1) { 17290 ancestorInfo.pTagInButtonScope = null; 17291 } 17292 17293 // See rules for 'li', 'dd', 'dt' start tags in 17294 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inbody 17295 if (specialTags.indexOf(tag) !== -1 && tag !== 'address' && tag !== 'div' && tag !== 'p') { 17296 ancestorInfo.listItemTagAutoclosing = null; 17297 ancestorInfo.dlItemTagAutoclosing = null; 17298 } 17299 17300 ancestorInfo.current = info; 17301 17302 if (tag === 'form') { 17303 ancestorInfo.formTag = info; 17304 } 17305 if (tag === 'a') { 17306 ancestorInfo.aTagInScope = info; 17307 } 17308 if (tag === 'button') { 17309 ancestorInfo.buttonTagInScope = info; 17310 } 17311 if (tag === 'nobr') { 17312 ancestorInfo.nobrTagInScope = info; 17313 } 17314 if (tag === 'p') { 17315 ancestorInfo.pTagInButtonScope = info; 17316 } 17317 if (tag === 'li') { 17318 ancestorInfo.listItemTagAutoclosing = info; 17319 } 17320 if (tag === 'dd' || tag === 'dt') { 17321 ancestorInfo.dlItemTagAutoclosing = info; 17322 } 17323 17324 return ancestorInfo; 17325 }; 17326 17327 /** 17328 * Returns whether 17329 */ 17330 var isTagValidWithParent = function (tag, parentTag) { 17331 // First, let's check if we're in an unusual parsing mode... 17332 switch (parentTag) { 17333 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inselect 17334 case 'select': 17335 return tag === 'option' || tag === 'optgroup' || tag === '#text'; 17336 case 'optgroup': 17337 return tag === 'option' || tag === '#text'; 17338 // Strictly speaking, seeing an <option> doesn't mean we're in a <select> 17339 // but 17340 case 'option': 17341 return tag === '#text'; 17342 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intd 17343 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-incaption 17344 // No special behavior since these rules fall back to "in body" mode for 17345 // all except special table nodes which cause bad parsing behavior anyway. 17346 17347 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intr 17348 case 'tr': 17349 return tag === 'th' || tag === 'td' || tag === 'style' || tag === 'script' || tag === 'template'; 17350 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intbody 17351 case 'tbody': 17352 case 'thead': 17353 case 'tfoot': 17354 return tag === 'tr' || tag === 'style' || tag === 'script' || tag === 'template'; 17355 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-incolgroup 17356 case 'colgroup': 17357 return tag === 'col' || tag === 'template'; 17358 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intable 17359 case 'table': 17360 return tag === 'caption' || tag === 'colgroup' || tag === 'tbody' || tag === 'tfoot' || tag === 'thead' || tag === 'style' || tag === 'script' || tag === 'template'; 17361 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inhead 17362 case 'head': 17363 return tag === 'base' || tag === 'basefont' || tag === 'bgsound' || tag === 'link' || tag === 'meta' || tag === 'title' || tag === 'noscript' || tag === 'noframes' || tag === 'style' || tag === 'script' || tag === 'template'; 17364 // https://html.spec.whatwg.org/multipage/semantics.html#the-html-element 17365 case 'html': 17366 return tag === 'head' || tag === 'body'; 17367 case '#document': 17368 return tag === 'html'; 17369 } 17370 17371 // Probably in the "in body" parsing mode, so we outlaw only tag combos 17372 // where the parsing rules cause implicit opens or closes to be added. 17373 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inbody 17374 switch (tag) { 17375 case 'h1': 17376 case 'h2': 17377 case 'h3': 17378 case 'h4': 17379 case 'h5': 17380 case 'h6': 17381 return parentTag !== 'h1' && parentTag !== 'h2' && parentTag !== 'h3' && parentTag !== 'h4' && parentTag !== 'h5' && parentTag !== 'h6'; 17382 17383 case 'rp': 17384 case 'rt': 17385 return impliedEndTags.indexOf(parentTag) === -1; 17386 17387 case 'body': 17388 case 'caption': 17389 case 'col': 17390 case 'colgroup': 17391 case 'frame': 17392 case 'head': 17393 case 'html': 17394 case 'tbody': 17395 case 'td': 17396 case 'tfoot': 17397 case 'th': 17398 case 'thead': 17399 case 'tr': 17400 // These tags are only valid with a few parents that have special child 17401 // parsing rules -- if we're down here, then none of those matched and 17402 // so we allow it only if we don't know what the parent is, as all other 17403 // cases are invalid. 17404 return parentTag == null; 17405 } 17406 17407 return true; 17408 }; 17409 17410 /** 17411 * Returns whether 17412 */ 17413 var findInvalidAncestorForTag = function (tag, ancestorInfo) { 17414 switch (tag) { 17415 case 'address': 17416 case 'article': 17417 case 'aside': 17418 case 'blockquote': 17419 case 'center': 17420 case 'details': 17421 case 'dialog': 17422 case 'dir': 17423 case 'div': 17424 case 'dl': 17425 case 'fieldset': 17426 case 'figcaption': 17427 case 'figure': 17428 case 'footer': 17429 case 'header': 17430 case 'hgroup': 17431 case 'main': 17432 case 'menu': 17433 case 'nav': 17434 case 'ol': 17435 case 'p': 17436 case 'section': 17437 case 'summary': 17438 case 'ul': 17439 case 'pre': 17440 case 'listing': 17441 case 'table': 17442 case 'hr': 17443 case 'xmp': 17444 case 'h1': 17445 case 'h2': 17446 case 'h3': 17447 case 'h4': 17448 case 'h5': 17449 case 'h6': 17450 return ancestorInfo.pTagInButtonScope; 17451 17452 case 'form': 17453 return ancestorInfo.formTag || ancestorInfo.pTagInButtonScope; 17454 17455 case 'li': 17456 return ancestorInfo.listItemTagAutoclosing; 17457 17458 case 'dd': 17459 case 'dt': 17460 return ancestorInfo.dlItemTagAutoclosing; 17461 17462 case 'button': 17463 return ancestorInfo.buttonTagInScope; 17464 17465 case 'a': 17466 // Spec says something about storing a list of markers, but it sounds 17467 // equivalent to this check. 17468 return ancestorInfo.aTagInScope; 17469 17470 case 'nobr': 17471 return ancestorInfo.nobrTagInScope; 17472 } 17473 17474 return null; 17475 }; 17476 17477 var didWarn = {}; 17478 17479 validateDOMNesting = function (childTag, childText, ancestorInfo) { 17480 ancestorInfo = ancestorInfo || emptyAncestorInfo; 17481 var parentInfo = ancestorInfo.current; 17482 var parentTag = parentInfo && parentInfo.tag; 17483 17484 if (childText != null) { 17485 warning(childTag == null, 'validateDOMNesting: when childText is passed, childTag should be null'); 17486 childTag = '#text'; 17487 } 17488 17489 var invalidParent = isTagValidWithParent(childTag, parentTag) ? null : parentInfo; 17490 var invalidAncestor = invalidParent ? null : findInvalidAncestorForTag(childTag, ancestorInfo); 17491 var invalidParentOrAncestor = invalidParent || invalidAncestor; 17492 if (!invalidParentOrAncestor) { 17493 return; 17494 } 17495 17496 var ancestorTag = invalidParentOrAncestor.tag; 17497 var addendum = getCurrentFiberStackAddendum$6(); 17498 17499 var warnKey = !!invalidParent + '|' + childTag + '|' + ancestorTag + '|' + addendum; 17500 if (didWarn[warnKey]) { 17501 return; 17502 } 17503 didWarn[warnKey] = true; 17504 17505 var tagDisplayName = childTag; 17506 var whitespaceInfo = ''; 17507 if (childTag === '#text') { 17508 if (/\S/.test(childText)) { 17509 tagDisplayName = 'Text nodes'; 17510 } else { 17511 tagDisplayName = 'Whitespace text nodes'; 17512 whitespaceInfo = " Make sure you don't have any extra whitespace between tags on " + 'each line of your source code.'; 17513 } 17514 } else { 17515 tagDisplayName = '<' + childTag + '>'; 17516 } 17517 17518 if (invalidParent) { 17519 var info = ''; 17520 if (ancestorTag === 'table' && childTag === 'tr') { 17521 info += ' Add a <tbody> to your code to match the DOM tree generated by ' + 'the browser.'; 17522 } 17523 warning(false, 'validateDOMNesting(...): %s cannot appear as a child of <%s>.%s%s%s', tagDisplayName, ancestorTag, whitespaceInfo, info, addendum); 17524 } else { 17525 warning(false, 'validateDOMNesting(...): %s cannot appear as a descendant of ' + '<%s>.%s', tagDisplayName, ancestorTag, addendum); 17526 } 17527 }; 17528 17529 // TODO: turn this into a named export 17530 validateDOMNesting.updatedAncestorInfo = updatedAncestorInfo$1; 17531 17532 // For testing 17533 validateDOMNesting.isTagValidInContext = function (tag, ancestorInfo) { 17534 ancestorInfo = ancestorInfo || emptyAncestorInfo; 17535 var parentInfo = ancestorInfo.current; 17536 var parentTag = parentInfo && parentInfo.tag; 17537 return isTagValidWithParent(tag, parentTag) && !findInvalidAncestorForTag(tag, ancestorInfo); 17538 }; 17539 } 17540 17541 var validateDOMNesting$1 = validateDOMNesting; 17542 17543 // TODO: direct imports like some-package/src/* are bad. Fix me. 17544 var createElement = createElement$1; 17545 var createTextNode = createTextNode$1; 17546 var setInitialProperties = setInitialProperties$1; 17547 var diffProperties = diffProperties$1; 17548 var updateProperties = updateProperties$1; 17549 var diffHydratedProperties = diffHydratedProperties$1; 17550 var diffHydratedText = diffHydratedText$1; 17551 var warnForUnmatchedText = warnForUnmatchedText$1; 17552 var warnForDeletedHydratableElement = warnForDeletedHydratableElement$1; 17553 var warnForDeletedHydratableText = warnForDeletedHydratableText$1; 17554 var warnForInsertedHydratedElement = warnForInsertedHydratedElement$1; 17555 var warnForInsertedHydratedText = warnForInsertedHydratedText$1; 17556 var updatedAncestorInfo = validateDOMNesting$1.updatedAncestorInfo; 17557 var precacheFiberNode = precacheFiberNode$1; 17558 var updateFiberProps = updateFiberProps$1; 17559 17560 17561 { 17562 var SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning'; 17563 if (typeof Map !== 'function' || Map.prototype == null || typeof Map.prototype.forEach !== 'function' || typeof Set !== 'function' || Set.prototype == null || typeof Set.prototype.clear !== 'function' || typeof Set.prototype.forEach !== 'function') { 17564 warning(false, 'React depends on Map and Set built-in types. Make sure that you load a ' + 'polyfill in older browsers. http://fb.me/react-polyfills'); 17565 } 17566 } 17567 17568 injection$3.injectFiberControlledHostComponent(ReactDOMFiberComponent); 17569 17570 var eventsEnabled = null; 17571 var selectionInformation = null; 17572 17573 /** 17574 * True if the supplied DOM node is a valid node element. 17575 * 17576 * @param {?DOMElement} node The candidate DOM node. 17577 * @return {boolean} True if the DOM is a valid DOM node. 17578 * @internal 17579 */ 17580 function isValidContainer(node) { 17581 return !!(node && (node.nodeType === ELEMENT_NODE || node.nodeType === DOCUMENT_NODE || node.nodeType === DOCUMENT_FRAGMENT_NODE || node.nodeType === COMMENT_NODE && node.nodeValue === ' react-mount-point-unstable ')); 17582 } 17583 17584 function getReactRootElementInContainer(container) { 17585 if (!container) { 17586 return null; 17587 } 17588 17589 if (container.nodeType === DOCUMENT_NODE) { 17590 return container.documentElement; 17591 } else { 17592 return container.firstChild; 17593 } 17594 } 17595 17596 function shouldHydrateDueToLegacyHeuristic(container) { 17597 var rootElement = getReactRootElementInContainer(container); 17598 return !!(rootElement && rootElement.nodeType === ELEMENT_NODE && rootElement.hasAttribute(ROOT_ATTRIBUTE_NAME)); 17599 } 17600 17601 function shouldAutoFocusHostComponent(type, props) { 17602 switch (type) { 17603 case 'button': 17604 case 'input': 17605 case 'select': 17606 case 'textarea': 17607 return !!props.autoFocus; 17608 } 17609 return false; 17610 } 17611 17612 var DOMRenderer = reactReconciler({ 17613 getRootHostContext: function (rootContainerInstance) { 17614 var type = void 0; 17615 var namespace = void 0; 17616 var nodeType = rootContainerInstance.nodeType; 17617 switch (nodeType) { 17618 case DOCUMENT_NODE: 17619 case DOCUMENT_FRAGMENT_NODE: 17620 { 17621 type = nodeType === DOCUMENT_NODE ? '#document' : '#fragment'; 17622 var root = rootContainerInstance.documentElement; 17623 namespace = root ? root.namespaceURI : getChildNamespace(null, ''); 17624 break; 17625 } 17626 default: 17627 { 17628 var container = nodeType === COMMENT_NODE ? rootContainerInstance.parentNode : rootContainerInstance; 17629 var ownNamespace = container.namespaceURI || null; 17630 type = container.tagName; 17631 namespace = getChildNamespace(ownNamespace, type); 17632 break; 17633 } 17634 } 17635 { 17636 var validatedTag = type.toLowerCase(); 17637 var _ancestorInfo = updatedAncestorInfo(null, validatedTag, null); 17638 return { namespace: namespace, ancestorInfo: _ancestorInfo }; 17639 } 17640 return namespace; 17641 }, 17642 getChildHostContext: function (parentHostContext, type) { 17643 { 17644 var parentHostContextDev = parentHostContext; 17645 var _namespace = getChildNamespace(parentHostContextDev.namespace, type); 17646 var _ancestorInfo2 = updatedAncestorInfo(parentHostContextDev.ancestorInfo, type, null); 17647 return { namespace: _namespace, ancestorInfo: _ancestorInfo2 }; 17648 } 17649 var parentNamespace = parentHostContext; 17650 return getChildNamespace(parentNamespace, type); 17651 }, 17652 getPublicInstance: function (instance) { 17653 return instance; 17654 }, 17655 prepareForCommit: function () { 17656 eventsEnabled = isEnabled(); 17657 selectionInformation = getSelectionInformation(); 17658 setEnabled(false); 17659 }, 17660 resetAfterCommit: function () { 17661 restoreSelection(selectionInformation); 17662 selectionInformation = null; 17663 setEnabled(eventsEnabled); 17664 eventsEnabled = null; 17665 }, 17666 createInstance: function (type, props, rootContainerInstance, hostContext, internalInstanceHandle) { 17667 var parentNamespace = void 0; 17668 { 17669 // TODO: take namespace into account when validating. 17670 var hostContextDev = hostContext; 17671 validateDOMNesting$1(type, null, hostContextDev.ancestorInfo); 17672 if (typeof props.children === 'string' || typeof props.children === 'number') { 17673 var string = '' + props.children; 17674 var ownAncestorInfo = updatedAncestorInfo(hostContextDev.ancestorInfo, type, null); 17675 validateDOMNesting$1(null, string, ownAncestorInfo); 17676 } 17677 parentNamespace = hostContextDev.namespace; 17678 } 17679 var domElement = createElement(type, props, rootContainerInstance, parentNamespace); 17680 precacheFiberNode(internalInstanceHandle, domElement); 17681 updateFiberProps(domElement, props); 17682 return domElement; 17683 }, 17684 appendInitialChild: function (parentInstance, child) { 17685 parentInstance.appendChild(child); 17686 }, 17687 finalizeInitialChildren: function (domElement, type, props, rootContainerInstance) { 17688 setInitialProperties(domElement, type, props, rootContainerInstance); 17689 return shouldAutoFocusHostComponent(type, props); 17690 }, 17691 prepareUpdate: function (domElement, type, oldProps, newProps, rootContainerInstance, hostContext) { 17692 { 17693 var hostContextDev = hostContext; 17694 if (typeof newProps.children !== typeof oldProps.children && (typeof newProps.children === 'string' || typeof newProps.children === 'number')) { 17695 var string = '' + newProps.children; 17696 var ownAncestorInfo = updatedAncestorInfo(hostContextDev.ancestorInfo, type, null); 17697 validateDOMNesting$1(null, string, ownAncestorInfo); 17698 } 17699 } 17700 return diffProperties(domElement, type, oldProps, newProps, rootContainerInstance); 17701 }, 17702 shouldSetTextContent: function (type, props) { 17703 return type === 'textarea' || typeof props.children === 'string' || typeof props.children === 'number' || typeof props.dangerouslySetInnerHTML === 'object' && props.dangerouslySetInnerHTML !== null && typeof props.dangerouslySetInnerHTML.__html === 'string'; 17704 }, 17705 shouldDeprioritizeSubtree: function (type, props) { 17706 return !!props.hidden; 17707 }, 17708 createTextInstance: function (text, rootContainerInstance, hostContext, internalInstanceHandle) { 17709 { 17710 var hostContextDev = hostContext; 17711 validateDOMNesting$1(null, text, hostContextDev.ancestorInfo); 17712 } 17713 var textNode = createTextNode(text, rootContainerInstance); 17714 precacheFiberNode(internalInstanceHandle, textNode); 17715 return textNode; 17716 }, 17717 17718 17719 now: now, 17720 17721 mutation: { 17722 commitMount: function (domElement, type, newProps, internalInstanceHandle) { 17723 domElement.focus(); 17724 }, 17725 commitUpdate: function (domElement, updatePayload, type, oldProps, newProps, internalInstanceHandle) { 17726 // Update the props handle so that we know which props are the ones with 17727 // with current event handlers. 17728 updateFiberProps(domElement, newProps); 17729 // Apply the diff to the DOM node. 17730 updateProperties(domElement, updatePayload, type, oldProps, newProps); 17731 }, 17732 resetTextContent: function (domElement) { 17733 domElement.textContent = ''; 17734 }, 17735 commitTextUpdate: function (textInstance, oldText, newText) { 17736 textInstance.nodeValue = newText; 17737 }, 17738 appendChild: function (parentInstance, child) { 17739 parentInstance.appendChild(child); 17740 }, 17741 appendChildToContainer: function (container, child) { 17742 if (container.nodeType === COMMENT_NODE) { 17743 container.parentNode.insertBefore(child, container); 17744 } else { 17745 container.appendChild(child); 17746 } 17747 }, 17748 insertBefore: function (parentInstance, child, beforeChild) { 17749 parentInstance.insertBefore(child, beforeChild); 17750 }, 17751 insertInContainerBefore: function (container, child, beforeChild) { 17752 if (container.nodeType === COMMENT_NODE) { 17753 container.parentNode.insertBefore(child, beforeChild); 17754 } else { 17755 container.insertBefore(child, beforeChild); 17756 } 17757 }, 17758 removeChild: function (parentInstance, child) { 17759 parentInstance.removeChild(child); 17760 }, 17761 removeChildFromContainer: function (container, child) { 17762 if (container.nodeType === COMMENT_NODE) { 17763 container.parentNode.removeChild(child); 17764 } else { 17765 container.removeChild(child); 17766 } 17767 } 17768 }, 17769 17770 hydration: { 17771 canHydrateInstance: function (instance, type, props) { 17772 if (instance.nodeType !== ELEMENT_NODE || type.toLowerCase() !== instance.nodeName.toLowerCase()) { 17773 return null; 17774 } 17775 // This has now been refined to an element node. 17776 return instance; 17777 }, 17778 canHydrateTextInstance: function (instance, text) { 17779 if (text === '' || instance.nodeType !== TEXT_NODE) { 17780 // Empty strings are not parsed by HTML so there won't be a correct match here. 17781 return null; 17782 } 17783 // This has now been refined to a text node. 17784 return instance; 17785 }, 17786 getNextHydratableSibling: function (instance) { 17787 var node = instance.nextSibling; 17788 // Skip non-hydratable nodes. 17789 while (node && node.nodeType !== ELEMENT_NODE && node.nodeType !== TEXT_NODE) { 17790 node = node.nextSibling; 17791 } 17792 return node; 17793 }, 17794 getFirstHydratableChild: function (parentInstance) { 17795 var next = parentInstance.firstChild; 17796 // Skip non-hydratable nodes. 17797 while (next && next.nodeType !== ELEMENT_NODE && next.nodeType !== TEXT_NODE) { 17798 next = next.nextSibling; 17799 } 17800 return next; 17801 }, 17802 hydrateInstance: function (instance, type, props, rootContainerInstance, hostContext, internalInstanceHandle) { 17803 precacheFiberNode(internalInstanceHandle, instance); 17804 // TODO: Possibly defer this until the commit phase where all the events 17805 // get attached. 17806 updateFiberProps(instance, props); 17807 var parentNamespace = void 0; 17808 { 17809 var hostContextDev = hostContext; 17810 parentNamespace = hostContextDev.namespace; 17811 } 17812 return diffHydratedProperties(instance, type, props, parentNamespace, rootContainerInstance); 17813 }, 17814 hydrateTextInstance: function (textInstance, text, internalInstanceHandle) { 17815 precacheFiberNode(internalInstanceHandle, textInstance); 17816 return diffHydratedText(textInstance, text); 17817 }, 17818 didNotMatchHydratedContainerTextInstance: function (parentContainer, textInstance, text) { 17819 { 17820 warnForUnmatchedText(textInstance, text); 17821 } 17822 }, 17823 didNotMatchHydratedTextInstance: function (parentType, parentProps, parentInstance, textInstance, text) { 17824 if (true && parentProps[SUPPRESS_HYDRATION_WARNING] !== true) { 17825 warnForUnmatchedText(textInstance, text); 17826 } 17827 }, 17828 didNotHydrateContainerInstance: function (parentContainer, instance) { 17829 { 17830 if (instance.nodeType === 1) { 17831 warnForDeletedHydratableElement(parentContainer, instance); 17832 } else { 17833 warnForDeletedHydratableText(parentContainer, instance); 17834 } 17835 } 17836 }, 17837 didNotHydrateInstance: function (parentType, parentProps, parentInstance, instance) { 17838 if (true && parentProps[SUPPRESS_HYDRATION_WARNING] !== true) { 17839 if (instance.nodeType === 1) { 17840 warnForDeletedHydratableElement(parentInstance, instance); 17841 } else { 17842 warnForDeletedHydratableText(parentInstance, instance); 17843 } 17844 } 17845 }, 17846 didNotFindHydratableContainerInstance: function (parentContainer, type, props) { 17847 { 17848 warnForInsertedHydratedElement(parentContainer, type, props); 17849 } 17850 }, 17851 didNotFindHydratableContainerTextInstance: function (parentContainer, text) { 17852 { 17853 warnForInsertedHydratedText(parentContainer, text); 17854 } 17855 }, 17856 didNotFindHydratableInstance: function (parentType, parentProps, parentInstance, type, props) { 17857 if (true && parentProps[SUPPRESS_HYDRATION_WARNING] !== true) { 17858 warnForInsertedHydratedElement(parentInstance, type, props); 17859 } 17860 }, 17861 didNotFindHydratableTextInstance: function (parentType, parentProps, parentInstance, text) { 17862 if (true && parentProps[SUPPRESS_HYDRATION_WARNING] !== true) { 17863 warnForInsertedHydratedText(parentInstance, text); 17864 } 17865 } 17866 }, 17867 17868 scheduleDeferredCallback: rIC, 17869 cancelDeferredCallback: cIC, 17870 17871 useSyncScheduling: !enableAsyncSchedulingByDefaultInReactDOM 17872 }); 17873 17874 injection$4.injectFiberBatchedUpdates(DOMRenderer.batchedUpdates); 17875 17876 var warnedAboutHydrateAPI = false; 17877 17878 function renderSubtreeIntoContainer(parentComponent, children, container, forceHydrate, callback) { 17879 !isValidContainer(container) ? invariant(false, 'Target container is not a DOM element.') : void 0; 17880 17881 { 17882 if (container._reactRootContainer && container.nodeType !== COMMENT_NODE) { 17883 var hostInstance = DOMRenderer.findHostInstanceWithNoPortals(container._reactRootContainer.current); 17884 if (hostInstance) { 17885 warning(hostInstance.parentNode === container, 'render(...): It looks like the React-rendered content of this ' + 'container was removed without using React. This is not ' + 'supported and will cause errors. Instead, call ' + 'ReactDOM.unmountComponentAtNode to empty a container.'); 17886 } 17887 } 17888 17889 var isRootRenderedBySomeReact = !!container._reactRootContainer; 17890 var rootEl = getReactRootElementInContainer(container); 17891 var hasNonRootReactChild = !!(rootEl && getInstanceFromNode$1(rootEl)); 17892 17893 warning(!hasNonRootReactChild || isRootRenderedBySomeReact, 'render(...): Replacing React-rendered children with a new root ' + 'component. If you intended to update the children of this node, ' + 'you should instead have the existing children update their state ' + 'and render the new components instead of calling ReactDOM.render.'); 17894 17895 warning(container.nodeType !== ELEMENT_NODE || !container.tagName || container.tagName.toUpperCase() !== 'BODY', 'render(): Rendering components directly into document.body is ' + 'discouraged, since its children are often manipulated by third-party ' + 'scripts and browser extensions. This may lead to subtle ' + 'reconciliation issues. Try rendering into a container element created ' + 'for your app.'); 17896 } 17897 17898 var root = container._reactRootContainer; 17899 if (!root) { 17900 var shouldHydrate = forceHydrate || shouldHydrateDueToLegacyHeuristic(container); 17901 // First clear any existing content. 17902 if (!shouldHydrate) { 17903 var warned = false; 17904 var rootSibling = void 0; 17905 while (rootSibling = container.lastChild) { 17906 { 17907 if (!warned && rootSibling.nodeType === ELEMENT_NODE && rootSibling.hasAttribute(ROOT_ATTRIBUTE_NAME)) { 17908 warned = true; 17909 warning(false, 'render(): Target node has markup rendered by React, but there ' + 'are unrelated nodes as well. This is most commonly caused by ' + 'white-space inserted around server-rendered markup.'); 17910 } 17911 } 17912 container.removeChild(rootSibling); 17913 } 17914 } 17915 { 17916 if (shouldHydrate && !forceHydrate && !warnedAboutHydrateAPI) { 17917 warnedAboutHydrateAPI = true; 17918 lowPriorityWarning$1(false, 'render(): Calling ReactDOM.render() to hydrate server-rendered markup ' + 'will stop working in React v17. Replace the ReactDOM.render() call ' + 'with ReactDOM.hydrate() if you want React to attach to the server HTML.'); 17919 } 17920 } 17921 var newRoot = DOMRenderer.createContainer(container, shouldHydrate); 17922 root = container._reactRootContainer = newRoot; 17923 // Initial mount should not be batched. 17924 DOMRenderer.unbatchedUpdates(function () { 17925 DOMRenderer.updateContainer(children, newRoot, parentComponent, callback); 17926 }); 17927 } else { 17928 DOMRenderer.updateContainer(children, root, parentComponent, callback); 17929 } 17930 return DOMRenderer.getPublicRootInstance(root); 17931 } 17932 17933 function createPortal(children, container) { 17934 var key = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null; 17935 17936 !isValidContainer(container) ? invariant(false, 'Target container is not a DOM element.') : void 0; 17937 // TODO: pass ReactDOM portal implementation as third argument 17938 return createPortal$1(children, container, null, key); 17939 } 17940 17941 function ReactRoot(container, hydrate) { 17942 var root = DOMRenderer.createContainer(container, hydrate); 17943 this._reactRootContainer = root; 17944 } 17945 ReactRoot.prototype.render = function (children, callback) { 17946 var root = this._reactRootContainer; 17947 DOMRenderer.updateContainer(children, root, null, callback); 17948 }; 17949 ReactRoot.prototype.unmount = function (callback) { 17950 var root = this._reactRootContainer; 17951 DOMRenderer.updateContainer(null, root, null, callback); 17952 }; 17953 17954 var ReactDOM = { 17955 createPortal: createPortal, 17956 17957 findDOMNode: function (componentOrElement) { 17958 { 17959 var owner = ReactCurrentOwner.current; 17960 if (owner !== null) { 17961 var warnedAboutRefsInRender = owner.stateNode._warnedAboutRefsInRender; 17962 warning(warnedAboutRefsInRender, '%s is accessing findDOMNode inside its render(). ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', getComponentName(owner) || 'A component'); 17963 owner.stateNode._warnedAboutRefsInRender = true; 17964 } 17965 } 17966 if (componentOrElement == null) { 17967 return null; 17968 } 17969 if (componentOrElement.nodeType === ELEMENT_NODE) { 17970 return componentOrElement; 17971 } 17972 17973 var inst = get(componentOrElement); 17974 if (inst) { 17975 return DOMRenderer.findHostInstance(inst); 17976 } 17977 17978 if (typeof componentOrElement.render === 'function') { 17979 invariant(false, 'Unable to find node on an unmounted component.'); 17980 } else { 17981 invariant(false, 'Element appears to be neither ReactComponent nor DOMNode. Keys: %s', Object.keys(componentOrElement)); 17982 } 17983 }, 17984 hydrate: function (element, container, callback) { 17985 // TODO: throw or warn if we couldn't hydrate? 17986 return renderSubtreeIntoContainer(null, element, container, true, callback); 17987 }, 17988 render: function (element, container, callback) { 17989 return renderSubtreeIntoContainer(null, element, container, false, callback); 17990 }, 17991 unstable_renderSubtreeIntoContainer: function (parentComponent, element, containerNode, callback) { 17992 !(parentComponent != null && has(parentComponent)) ? invariant(false, 'parentComponent must be a valid React Component') : void 0; 17993 return renderSubtreeIntoContainer(parentComponent, element, containerNode, false, callback); 17994 }, 17995 unmountComponentAtNode: function (container) { 17996 !isValidContainer(container) ? invariant(false, 'unmountComponentAtNode(...): Target container is not a DOM element.') : void 0; 17997 17998 if (container._reactRootContainer) { 17999 { 18000 var rootEl = getReactRootElementInContainer(container); 18001 var renderedByDifferentReact = rootEl && !getInstanceFromNode$1(rootEl); 18002 warning(!renderedByDifferentReact, "unmountComponentAtNode(): The node you're attempting to unmount " + 'was rendered by another copy of React.'); 18003 } 18004 18005 // Unmount should not be batched. 18006 DOMRenderer.unbatchedUpdates(function () { 18007 renderSubtreeIntoContainer(null, null, container, false, function () { 18008 container._reactRootContainer = null; 18009 }); 18010 }); 18011 // If you call unmountComponentAtNode twice in quick succession, you'll 18012 // get `true` twice. That's probably fine? 18013 return true; 18014 } else { 18015 { 18016 var _rootEl = getReactRootElementInContainer(container); 18017 var hasNonRootReactChild = !!(_rootEl && getInstanceFromNode$1(_rootEl)); 18018 18019 // Check if the container itself is a React root node. 18020 var isContainerReactRoot = container.nodeType === 1 && isValidContainer(container.parentNode) && !!container.parentNode._reactRootContainer; 18021 18022 warning(!hasNonRootReactChild, "unmountComponentAtNode(): The node you're attempting to unmount " + 'was rendered by React and is not a top-level container. %s', isContainerReactRoot ? 'You may have accidentally passed in a React root node instead ' + 'of its container.' : 'Instead, have the parent component update its state and ' + 'rerender in order to remove this component.'); 18023 } 18024 18025 return false; 18026 } 18027 }, 18028 18029 18030 // Temporary alias since we already shipped React 16 RC with it. 18031 // TODO: remove in React 17. 18032 unstable_createPortal: createPortal, 18033 18034 unstable_batchedUpdates: batchedUpdates, 18035 18036 unstable_deferredUpdates: DOMRenderer.deferredUpdates, 18037 18038 flushSync: DOMRenderer.flushSync, 18039 18040 __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: { 18041 // For TapEventPlugin which is popular in open source 18042 EventPluginHub: EventPluginHub, 18043 // Used by test-utils 18044 EventPluginRegistry: EventPluginRegistry, 18045 EventPropagators: EventPropagators, 18046 ReactControlledComponent: ReactControlledComponent, 18047 ReactDOMComponentTree: ReactDOMComponentTree, 18048 ReactDOMEventListener: ReactDOMEventListener 18049 } 18050 }; 18051 18052 if (enableCreateRoot) { 18053 ReactDOM.createRoot = function createRoot(container, options) { 18054 var hydrate = options != null && options.hydrate === true; 18055 return new ReactRoot(container, hydrate); 18056 }; 18057 } 18058 18059 var foundDevTools = DOMRenderer.injectIntoDevTools({ 18060 findFiberByHostInstance: getClosestInstanceFromNode, 18061 bundleType: 1, 18062 version: ReactVersion, 18063 rendererPackageName: 'react-dom' 18064 }); 18065 18066 { 18067 if (!foundDevTools && ExecutionEnvironment.canUseDOM && window.top === window.self) { 18068 // If we're in Chrome or Firefox, provide a download link if not installed. 18069 if (navigator.userAgent.indexOf('Chrome') > -1 && navigator.userAgent.indexOf('Edge') === -1 || navigator.userAgent.indexOf('Firefox') > -1) { 18070 var protocol = window.location.protocol; 18071 // Don't warn in exotic cases like chrome-extension://. 18072 if (/^(https?|file):$/.test(protocol)) { 18073 console.info('%cDownload the React DevTools ' + 'for a better development experience: ' + 'https://fb.me/react-devtools' + (protocol === 'file:' ? '\nYou might need to use a local HTTP server (instead of file://): ' + 'https://fb.me/react-devtools-faq' : ''), 'font-weight:bold'); 18074 } 18075 } 18076 } 18077 } 18078 18079 18080 18081 var ReactDOM$2 = Object.freeze({ 18082 default: ReactDOM 18083 }); 18084 18085 var ReactDOM$3 = ( ReactDOM$2 && ReactDOM ) || ReactDOM$2; 18086 18087 // TODO: decide on the top-level export form. 18088 // This is hacky but makes it work with both Rollup and Jest. 18089 var reactDom = ReactDOM$3['default'] ? ReactDOM$3['default'] : ReactDOM$3; 18090 18091 module.exports = reactDom; 18092 })(); 18093 } 18094 18095 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 18096 18097 /***/ }), 18098 /* 23 */ 18099 /***/ (function(module, exports, __webpack_require__) { 18100 18101 "use strict"; 18102 /** 18103 * Copyright (c) 2013-present, Facebook, Inc. 18104 * 18105 * This source code is licensed under the MIT license found in the 18106 * LICENSE file in the root directory of this source tree. 18107 * 18108 * @typechecks 18109 */ 18110 18111 18112 18113 var hyphenate = __webpack_require__(24); 18114 18115 var msPattern = /^ms-/; 18116 18117 /** 18118 * Hyphenates a camelcased CSS property name, for example: 18119 * 18120 * > hyphenateStyleName('backgroundColor') 18121 * < "background-color" 18122 * > hyphenateStyleName('MozTransition') 18123 * < "-moz-transition" 18124 * > hyphenateStyleName('msTransition') 18125 * < "-ms-transition" 18126 * 18127 * As Modernizr suggests (http://modernizr.com/docs/#prefixed), an `ms` prefix 18128 * is converted to `-ms-`. 18129 * 18130 * @param {string} string 18131 * @return {string} 18132 */ 18133 function hyphenateStyleName(string) { 18134 return hyphenate(string).replace(msPattern, '-ms-'); 18135 } 18136 18137 module.exports = hyphenateStyleName; 18138 18139 /***/ }), 18140 /* 24 */ 18141 /***/ (function(module, exports, __webpack_require__) { 18142 18143 "use strict"; 18144 18145 18146 /** 18147 * Copyright (c) 2013-present, Facebook, Inc. 18148 * 18149 * This source code is licensed under the MIT license found in the 18150 * LICENSE file in the root directory of this source tree. 18151 * 18152 * @typechecks 18153 */ 18154 18155 var _uppercasePattern = /([A-Z])/g; 18156 18157 /** 18158 * Hyphenates a camelcased string, for example: 18159 * 18160 * > hyphenate('backgroundColor') 18161 * < "background-color" 18162 * 18163 * For CSS style names, use `hyphenateStyleName` instead which works properly 18164 * with all vendor prefixes, including `ms`. 18165 * 18166 * @param {string} string 18167 * @return {string} 18168 */ 18169 function hyphenate(string) { 18170 return string.replace(_uppercasePattern, '-$1').toLowerCase(); 18171 } 18172 18173 module.exports = hyphenate; 18174 18175 /***/ }), 18176 /* 25 */ 18177 /***/ (function(module, exports, __webpack_require__) { 18178 18179 "use strict"; 18180 /** 18181 * Copyright (c) 2013-present, Facebook, Inc. 18182 * 18183 * This source code is licensed under the MIT license found in the 18184 * LICENSE file in the root directory of this source tree. 18185 * 18186 * @typechecks 18187 */ 18188 18189 18190 18191 var camelize = __webpack_require__(26); 18192 18193 var msPattern = /^-ms-/; 18194 18195 /** 18196 * Camelcases a hyphenated CSS property name, for example: 18197 * 18198 * > camelizeStyleName('background-color') 18199 * < "backgroundColor" 18200 * > camelizeStyleName('-moz-transition') 18201 * < "MozTransition" 18202 * > camelizeStyleName('-ms-transition') 18203 * < "msTransition" 18204 * 18205 * As Andi Smith suggests 18206 * (http://www.andismith.com/blog/2012/02/modernizr-prefixed/), an `-ms` prefix 18207 * is converted to lowercase `ms`. 18208 * 18209 * @param {string} string 18210 * @return {string} 18211 */ 18212 function camelizeStyleName(string) { 18213 return camelize(string.replace(msPattern, 'ms-')); 18214 } 18215 18216 module.exports = camelizeStyleName; 18217 18218 /***/ }), 18219 /* 26 */ 18220 /***/ (function(module, exports, __webpack_require__) { 18221 18222 "use strict"; 18223 18224 18225 /** 18226 * Copyright (c) 2013-present, Facebook, Inc. 18227 * 18228 * This source code is licensed under the MIT license found in the 18229 * LICENSE file in the root directory of this source tree. 18230 * 18231 * @typechecks 18232 */ 18233 18234 var _hyphenPattern = /-(.)/g; 18235 18236 /** 18237 * Camelcases a hyphenated string, for example: 18238 * 18239 * > camelize('background-color') 18240 * < "backgroundColor" 18241 * 18242 * @param {string} string 18243 * @return {string} 18244 */ 18245 function camelize(string) { 18246 return string.replace(_hyphenPattern, function (_, character) { 18247 return character.toUpperCase(); 18248 }); 18249 } 18250 18251 module.exports = camelize; 18252 18253 /***/ }), 18254 /* 27 */ 18255 /***/ (function(module, exports, __webpack_require__) { 18256 18257 "use strict"; 18258 /** 18259 * Copyright (c) 2013-present, Facebook, Inc. 18260 * 18261 * This source code is licensed under the MIT license found in the 18262 * LICENSE file in the root directory of this source tree. 18263 * 18264 */ 18265 18266 18267 18268 var React = __webpack_require__(4); 18269 var factory = __webpack_require__(28); 18270 18271 if (typeof React === 'undefined') { 18272 throw Error( 18273 'create-react-class could not find the React object. If you are using script tags, ' + 18274 'make sure that React is being loaded before create-react-class.' 18275 ); 18276 } 18277 18278 // Hack to grab NoopUpdateQueue from isomorphic React 18279 var ReactNoopUpdateQueue = new React.Component().updater; 18280 18281 module.exports = factory( 18282 React.Component, 18283 React.isValidElement, 18284 ReactNoopUpdateQueue 18285 ); 18286 18287 18288 /***/ }), 18289 /* 28 */ 18290 /***/ (function(module, exports, __webpack_require__) { 18291 18292 "use strict"; 18293 /* WEBPACK VAR INJECTION */(function(process) {/** 18294 * Copyright (c) 2013-present, Facebook, Inc. 18295 * 18296 * This source code is licensed under the MIT license found in the 18297 * LICENSE file in the root directory of this source tree. 18298 * 18299 */ 18300 18301 18302 18303 var _assign = __webpack_require__(2); 18304 18305 var emptyObject = __webpack_require__(3); 18306 var _invariant = __webpack_require__(5); 18307 18308 if (process.env.NODE_ENV !== 'production') { 18309 var warning = __webpack_require__(6); 18310 } 18311 18312 var MIXINS_KEY = 'mixins'; 18313 18314 // Helper function to allow the creation of anonymous functions which do not 18315 // have .name set to the name of the variable being assigned to. 18316 function identity(fn) { 18317 return fn; 18318 } 18319 18320 var ReactPropTypeLocationNames; 18321 if (process.env.NODE_ENV !== 'production') { 18322 ReactPropTypeLocationNames = { 18323 prop: 'prop', 18324 context: 'context', 18325 childContext: 'child context' 18326 }; 18327 } else { 18328 ReactPropTypeLocationNames = {}; 18329 } 18330 18331 function factory(ReactComponent, isValidElement, ReactNoopUpdateQueue) { 18332 /** 18333 * Policies that describe methods in `ReactClassInterface`. 18334 */ 18335 18336 var injectedMixins = []; 18337 18338 /** 18339 * Composite components are higher-level components that compose other composite 18340 * or host components. 18341 * 18342 * To create a new type of `ReactClass`, pass a specification of 18343 * your new class to `React.createClass`. The only requirement of your class 18344 * specification is that you implement a `render` method. 18345 * 18346 * var MyComponent = React.createClass({ 18347 * render: function() { 18348 * return <div>Hello World</div>; 18349 * } 18350 * }); 18351 * 18352 * The class specification supports a specific protocol of methods that have 18353 * special meaning (e.g. `render`). See `ReactClassInterface` for 18354 * more the comprehensive protocol. Any other properties and methods in the 18355 * class specification will be available on the prototype. 18356 * 18357 * @interface ReactClassInterface 18358 * @internal 18359 */ 18360 var ReactClassInterface = { 18361 /** 18362 * An array of Mixin objects to include when defining your component. 18363 * 18364 * @type {array} 18365 * @optional 18366 */ 18367 mixins: 'DEFINE_MANY', 18368 18369 /** 18370 * An object containing properties and methods that should be defined on 18371 * the component's constructor instead of its prototype (static methods). 18372 * 18373 * @type {object} 18374 * @optional 18375 */ 18376 statics: 'DEFINE_MANY', 18377 18378 /** 18379 * Definition of prop types for this component. 18380 * 18381 * @type {object} 18382 * @optional 18383 */ 18384 propTypes: 'DEFINE_MANY', 18385 18386 /** 18387 * Definition of context types for this component. 18388 * 18389 * @type {object} 18390 * @optional 18391 */ 18392 contextTypes: 'DEFINE_MANY', 18393 18394 /** 18395 * Definition of context types this component sets for its children. 18396 * 18397 * @type {object} 18398 * @optional 18399 */ 18400 childContextTypes: 'DEFINE_MANY', 18401 18402 // ==== Definition methods ==== 18403 18404 /** 18405 * Invoked when the component is mounted. Values in the mapping will be set on 18406 * `this.props` if that prop is not specified (i.e. using an `in` check). 18407 * 18408 * This method is invoked before `getInitialState` and therefore cannot rely 18409 * on `this.state` or use `this.setState`. 18410 * 18411 * @return {object} 18412 * @optional 18413 */ 18414 getDefaultProps: 'DEFINE_MANY_MERGED', 18415 18416 /** 18417 * Invoked once before the component is mounted. The return value will be used 18418 * as the initial value of `this.state`. 18419 * 18420 * getInitialState: function() { 18421 * return { 18422 * isOn: false, 18423 * fooBaz: new BazFoo() 18424 * } 18425 * } 18426 * 18427 * @return {object} 18428 * @optional 18429 */ 18430 getInitialState: 'DEFINE_MANY_MERGED', 18431 18432 /** 18433 * @return {object} 18434 * @optional 18435 */ 18436 getChildContext: 'DEFINE_MANY_MERGED', 18437 18438 /** 18439 * Uses props from `this.props` and state from `this.state` to render the 18440 * structure of the component. 18441 * 18442 * No guarantees are made about when or how often this method is invoked, so 18443 * it must not have side effects. 18444 * 18445 * render: function() { 18446 * var name = this.props.name; 18447 * return <div>Hello, {name}!</div>; 18448 * } 18449 * 18450 * @return {ReactComponent} 18451 * @required 18452 */ 18453 render: 'DEFINE_ONCE', 18454 18455 // ==== Delegate methods ==== 18456 18457 /** 18458 * Invoked when the component is initially created and about to be mounted. 18459 * This may have side effects, but any external subscriptions or data created 18460 * by this method must be cleaned up in `componentWillUnmount`. 18461 * 18462 * @optional 18463 */ 18464 componentWillMount: 'DEFINE_MANY', 18465 18466 /** 18467 * Invoked when the component has been mounted and has a DOM representation. 18468 * However, there is no guarantee that the DOM node is in the document. 18469 * 18470 * Use this as an opportunity to operate on the DOM when the component has 18471 * been mounted (initialized and rendered) for the first time. 18472 * 18473 * @param {DOMElement} rootNode DOM element representing the component. 18474 * @optional 18475 */ 18476 componentDidMount: 'DEFINE_MANY', 18477 18478 /** 18479 * Invoked before the component receives new props. 18480 * 18481 * Use this as an opportunity to react to a prop transition by updating the 18482 * state using `this.setState`. Current props are accessed via `this.props`. 18483 * 18484 * componentWillReceiveProps: function(nextProps, nextContext) { 18485 * this.setState({ 18486 * likesIncreasing: nextProps.likeCount > this.props.likeCount 18487 * }); 18488 * } 18489 * 18490 * NOTE: There is no equivalent `componentWillReceiveState`. An incoming prop 18491 * transition may cause a state change, but the opposite is not true. If you 18492 * need it, you are probably looking for `componentWillUpdate`. 18493 * 18494 * @param {object} nextProps 18495 * @optional 18496 */ 18497 componentWillReceiveProps: 'DEFINE_MANY', 18498 18499 /** 18500 * Invoked while deciding if the component should be updated as a result of 18501 * receiving new props, state and/or context. 18502 * 18503 * Use this as an opportunity to `return false` when you're certain that the 18504 * transition to the new props/state/context will not require a component 18505 * update. 18506 * 18507 * shouldComponentUpdate: function(nextProps, nextState, nextContext) { 18508 * return !equal(nextProps, this.props) || 18509 * !equal(nextState, this.state) || 18510 * !equal(nextContext, this.context); 18511 * } 18512 * 18513 * @param {object} nextProps 18514 * @param {?object} nextState 18515 * @param {?object} nextContext 18516 * @return {boolean} True if the component should update. 18517 * @optional 18518 */ 18519 shouldComponentUpdate: 'DEFINE_ONCE', 18520 18521 /** 18522 * Invoked when the component is about to update due to a transition from 18523 * `this.props`, `this.state` and `this.context` to `nextProps`, `nextState` 18524 * and `nextContext`. 18525 * 18526 * Use this as an opportunity to perform preparation before an update occurs. 18527 * 18528 * NOTE: You **cannot** use `this.setState()` in this method. 18529 * 18530 * @param {object} nextProps 18531 * @param {?object} nextState 18532 * @param {?object} nextContext 18533 * @param {ReactReconcileTransaction} transaction 18534 * @optional 18535 */ 18536 componentWillUpdate: 'DEFINE_MANY', 18537 18538 /** 18539 * Invoked when the component's DOM representation has been updated. 18540 * 18541 * Use this as an opportunity to operate on the DOM when the component has 18542 * been updated. 18543 * 18544 * @param {object} prevProps 18545 * @param {?object} prevState 18546 * @param {?object} prevContext 18547 * @param {DOMElement} rootNode DOM element representing the component. 18548 * @optional 18549 */ 18550 componentDidUpdate: 'DEFINE_MANY', 18551 18552 /** 18553 * Invoked when the component is about to be removed from its parent and have 18554 * its DOM representation destroyed. 18555 * 18556 * Use this as an opportunity to deallocate any external resources. 18557 * 18558 * NOTE: There is no `componentDidUnmount` since your component will have been 18559 * destroyed by that point. 18560 * 18561 * @optional 18562 */ 18563 componentWillUnmount: 'DEFINE_MANY', 18564 18565 // ==== Advanced methods ==== 18566 18567 /** 18568 * Updates the component's currently mounted DOM representation. 18569 * 18570 * By default, this implements React's rendering and reconciliation algorithm. 18571 * Sophisticated clients may wish to override this. 18572 * 18573 * @param {ReactReconcileTransaction} transaction 18574 * @internal 18575 * @overridable 18576 */ 18577 updateComponent: 'OVERRIDE_BASE' 18578 }; 18579 18580 /** 18581 * Mapping from class specification keys to special processing functions. 18582 * 18583 * Although these are declared like instance properties in the specification 18584 * when defining classes using `React.createClass`, they are actually static 18585 * and are accessible on the constructor instead of the prototype. Despite 18586 * being static, they must be defined outside of the "statics" key under 18587 * which all other static methods are defined. 18588 */ 18589 var RESERVED_SPEC_KEYS = { 18590 displayName: function(Constructor, displayName) { 18591 Constructor.displayName = displayName; 18592 }, 18593 mixins: function(Constructor, mixins) { 18594 if (mixins) { 18595 for (var i = 0; i < mixins.length; i++) { 18596 mixSpecIntoComponent(Constructor, mixins[i]); 18597 } 18598 } 18599 }, 18600 childContextTypes: function(Constructor, childContextTypes) { 18601 if (process.env.NODE_ENV !== 'production') { 18602 validateTypeDef(Constructor, childContextTypes, 'childContext'); 18603 } 18604 Constructor.childContextTypes = _assign( 18605 {}, 18606 Constructor.childContextTypes, 18607 childContextTypes 18608 ); 18609 }, 18610 contextTypes: function(Constructor, contextTypes) { 18611 if (process.env.NODE_ENV !== 'production') { 18612 validateTypeDef(Constructor, contextTypes, 'context'); 18613 } 18614 Constructor.contextTypes = _assign( 18615 {}, 18616 Constructor.contextTypes, 18617 contextTypes 18618 ); 18619 }, 18620 /** 18621 * Special case getDefaultProps which should move into statics but requires 18622 * automatic merging. 18623 */ 18624 getDefaultProps: function(Constructor, getDefaultProps) { 18625 if (Constructor.getDefaultProps) { 18626 Constructor.getDefaultProps = createMergedResultFunction( 18627 Constructor.getDefaultProps, 18628 getDefaultProps 18629 ); 18630 } else { 18631 Constructor.getDefaultProps = getDefaultProps; 18632 } 18633 }, 18634 propTypes: function(Constructor, propTypes) { 18635 if (process.env.NODE_ENV !== 'production') { 18636 validateTypeDef(Constructor, propTypes, 'prop'); 18637 } 18638 Constructor.propTypes = _assign({}, Constructor.propTypes, propTypes); 18639 }, 18640 statics: function(Constructor, statics) { 18641 mixStaticSpecIntoComponent(Constructor, statics); 18642 }, 18643 autobind: function() {} 18644 }; 18645 18646 function validateTypeDef(Constructor, typeDef, location) { 18647 for (var propName in typeDef) { 18648 if (typeDef.hasOwnProperty(propName)) { 18649 // use a warning instead of an _invariant so components 18650 // don't show up in prod but only in __DEV__ 18651 if (process.env.NODE_ENV !== 'production') { 18652 warning( 18653 typeof typeDef[propName] === 'function', 18654 '%s: %s type `%s` is invalid; it must be a function, usually from ' + 18655 'React.PropTypes.', 18656 Constructor.displayName || 'ReactClass', 18657 ReactPropTypeLocationNames[location], 18658 propName 18659 ); 18660 } 18661 } 18662 } 18663 } 18664 18665 function validateMethodOverride(isAlreadyDefined, name) { 18666 var specPolicy = ReactClassInterface.hasOwnProperty(name) 18667 ? ReactClassInterface[name] 18668 : null; 18669 18670 // Disallow overriding of base class methods unless explicitly allowed. 18671 if (ReactClassMixin.hasOwnProperty(name)) { 18672 _invariant( 18673 specPolicy === 'OVERRIDE_BASE', 18674 'ReactClassInterface: You are attempting to override ' + 18675 '`%s` from your class specification. Ensure that your method names ' + 18676 'do not overlap with React methods.', 18677 name 18678 ); 18679 } 18680 18681 // Disallow defining methods more than once unless explicitly allowed. 18682 if (isAlreadyDefined) { 18683 _invariant( 18684 specPolicy === 'DEFINE_MANY' || specPolicy === 'DEFINE_MANY_MERGED', 18685 'ReactClassInterface: You are attempting to define ' + 18686 '`%s` on your component more than once. This conflict may be due ' + 18687 'to a mixin.', 18688 name 18689 ); 18690 } 18691 } 18692 18693 /** 18694 * Mixin helper which handles policy validation and reserved 18695 * specification keys when building React classes. 18696 */ 18697 function mixSpecIntoComponent(Constructor, spec) { 18698 if (!spec) { 18699 if (process.env.NODE_ENV !== 'production') { 18700 var typeofSpec = typeof spec; 18701 var isMixinValid = typeofSpec === 'object' && spec !== null; 18702 18703 if (process.env.NODE_ENV !== 'production') { 18704 warning( 18705 isMixinValid, 18706 "%s: You're attempting to include a mixin that is either null " + 18707 'or not an object. Check the mixins included by the component, ' + 18708 'as well as any mixins they include themselves. ' + 18709 'Expected object but got %s.', 18710 Constructor.displayName || 'ReactClass', 18711 spec === null ? null : typeofSpec 18712 ); 18713 } 18714 } 18715 18716 return; 18717 } 18718 18719 _invariant( 18720 typeof spec !== 'function', 18721 "ReactClass: You're attempting to " + 18722 'use a component class or function as a mixin. Instead, just use a ' + 18723 'regular object.' 18724 ); 18725 _invariant( 18726 !isValidElement(spec), 18727 "ReactClass: You're attempting to " + 18728 'use a component as a mixin. Instead, just use a regular object.' 18729 ); 18730 18731 var proto = Constructor.prototype; 18732 var autoBindPairs = proto.__reactAutoBindPairs; 18733 18734 // By handling mixins before any other properties, we ensure the same 18735 // chaining order is applied to methods with DEFINE_MANY policy, whether 18736 // mixins are listed before or after these methods in the spec. 18737 if (spec.hasOwnProperty(MIXINS_KEY)) { 18738 RESERVED_SPEC_KEYS.mixins(Constructor, spec.mixins); 18739 } 18740 18741 for (var name in spec) { 18742 if (!spec.hasOwnProperty(name)) { 18743 continue; 18744 } 18745 18746 if (name === MIXINS_KEY) { 18747 // We have already handled mixins in a special case above. 18748 continue; 18749 } 18750 18751 var property = spec[name]; 18752 var isAlreadyDefined = proto.hasOwnProperty(name); 18753 validateMethodOverride(isAlreadyDefined, name); 18754 18755 if (RESERVED_SPEC_KEYS.hasOwnProperty(name)) { 18756 RESERVED_SPEC_KEYS[name](Constructor, property); 18757 } else { 18758 // Setup methods on prototype: 18759 // The following member methods should not be automatically bound: 18760 // 1. Expected ReactClass methods (in the "interface"). 18761 // 2. Overridden methods (that were mixed in). 18762 var isReactClassMethod = ReactClassInterface.hasOwnProperty(name); 18763 var isFunction = typeof property === 'function'; 18764 var shouldAutoBind = 18765 isFunction && 18766 !isReactClassMethod && 18767 !isAlreadyDefined && 18768 spec.autobind !== false; 18769 18770 if (shouldAutoBind) { 18771 autoBindPairs.push(name, property); 18772 proto[name] = property; 18773 } else { 18774 if (isAlreadyDefined) { 18775 var specPolicy = ReactClassInterface[name]; 18776 18777 // These cases should already be caught by validateMethodOverride. 18778 _invariant( 18779 isReactClassMethod && 18780 (specPolicy === 'DEFINE_MANY_MERGED' || 18781 specPolicy === 'DEFINE_MANY'), 18782 'ReactClass: Unexpected spec policy %s for key %s ' + 18783 'when mixing in component specs.', 18784 specPolicy, 18785 name 18786 ); 18787 18788 // For methods which are defined more than once, call the existing 18789 // methods before calling the new property, merging if appropriate. 18790 if (specPolicy === 'DEFINE_MANY_MERGED') { 18791 proto[name] = createMergedResultFunction(proto[name], property); 18792 } else if (specPolicy === 'DEFINE_MANY') { 18793 proto[name] = createChainedFunction(proto[name], property); 18794 } 18795 } else { 18796 proto[name] = property; 18797 if (process.env.NODE_ENV !== 'production') { 18798 // Add verbose displayName to the function, which helps when looking 18799 // at profiling tools. 18800 if (typeof property === 'function' && spec.displayName) { 18801 proto[name].displayName = spec.displayName + '_' + name; 18802 } 18803 } 18804 } 18805 } 18806 } 18807 } 18808 } 18809 18810 function mixStaticSpecIntoComponent(Constructor, statics) { 18811 if (!statics) { 18812 return; 18813 } 18814 for (var name in statics) { 18815 var property = statics[name]; 18816 if (!statics.hasOwnProperty(name)) { 18817 continue; 18818 } 18819 18820 var isReserved = name in RESERVED_SPEC_KEYS; 18821 _invariant( 18822 !isReserved, 18823 'ReactClass: You are attempting to define a reserved ' + 18824 'property, `%s`, that shouldn\'t be on the "statics" key. Define it ' + 18825 'as an instance property instead; it will still be accessible on the ' + 18826 'constructor.', 18827 name 18828 ); 18829 18830 var isInherited = name in Constructor; 18831 _invariant( 18832 !isInherited, 18833 'ReactClass: You are attempting to define ' + 18834 '`%s` on your component more than once. This conflict may be ' + 18835 'due to a mixin.', 18836 name 18837 ); 18838 Constructor[name] = property; 18839 } 18840 } 18841 18842 /** 18843 * Merge two objects, but throw if both contain the same key. 18844 * 18845 * @param {object} one The first object, which is mutated. 18846 * @param {object} two The second object 18847 * @return {object} one after it has been mutated to contain everything in two. 18848 */ 18849 function mergeIntoWithNoDuplicateKeys(one, two) { 18850 _invariant( 18851 one && two && typeof one === 'object' && typeof two === 'object', 18852 'mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.' 18853 ); 18854 18855 for (var key in two) { 18856 if (two.hasOwnProperty(key)) { 18857 _invariant( 18858 one[key] === undefined, 18859 'mergeIntoWithNoDuplicateKeys(): ' + 18860 'Tried to merge two objects with the same key: `%s`. This conflict ' + 18861 'may be due to a mixin; in particular, this may be caused by two ' + 18862 'getInitialState() or getDefaultProps() methods returning objects ' + 18863 'with clashing keys.', 18864 key 18865 ); 18866 one[key] = two[key]; 18867 } 18868 } 18869 return one; 18870 } 18871 18872 /** 18873 * Creates a function that invokes two functions and merges their return values. 18874 * 18875 * @param {function} one Function to invoke first. 18876 * @param {function} two Function to invoke second. 18877 * @return {function} Function that invokes the two argument functions. 18878 * @private 18879 */ 18880 function createMergedResultFunction(one, two) { 18881 return function mergedResult() { 18882 var a = one.apply(this, arguments); 18883 var b = two.apply(this, arguments); 18884 if (a == null) { 18885 return b; 18886 } else if (b == null) { 18887 return a; 18888 } 18889 var c = {}; 18890 mergeIntoWithNoDuplicateKeys(c, a); 18891 mergeIntoWithNoDuplicateKeys(c, b); 18892 return c; 18893 }; 18894 } 18895 18896 /** 18897 * Creates a function that invokes two functions and ignores their return vales. 18898 * 18899 * @param {function} one Function to invoke first. 18900 * @param {function} two Function to invoke second. 18901 * @return {function} Function that invokes the two argument functions. 18902 * @private 18903 */ 18904 function createChainedFunction(one, two) { 18905 return function chainedFunction() { 18906 one.apply(this, arguments); 18907 two.apply(this, arguments); 18908 }; 18909 } 18910 18911 /** 18912 * Binds a method to the component. 18913 * 18914 * @param {object} component Component whose method is going to be bound. 18915 * @param {function} method Method to be bound. 18916 * @return {function} The bound method. 18917 */ 18918 function bindAutoBindMethod(component, method) { 18919 var boundMethod = method.bind(component); 18920 if (process.env.NODE_ENV !== 'production') { 18921 boundMethod.__reactBoundContext = component; 18922 boundMethod.__reactBoundMethod = method; 18923 boundMethod.__reactBoundArguments = null; 18924 var componentName = component.constructor.displayName; 18925 var _bind = boundMethod.bind; 18926 boundMethod.bind = function(newThis) { 18927 for ( 18928 var _len = arguments.length, 18929 args = Array(_len > 1 ? _len - 1 : 0), 18930 _key = 1; 18931 _key < _len; 18932 _key++ 18933 ) { 18934 args[_key - 1] = arguments[_key]; 18935 } 18936 18937 // User is trying to bind() an autobound method; we effectively will 18938 // ignore the value of "this" that the user is trying to use, so 18939 // let's warn. 18940 if (newThis !== component && newThis !== null) { 18941 if (process.env.NODE_ENV !== 'production') { 18942 warning( 18943 false, 18944 'bind(): React component methods may only be bound to the ' + 18945 'component instance. See %s', 18946 componentName 18947 ); 18948 } 18949 } else if (!args.length) { 18950 if (process.env.NODE_ENV !== 'production') { 18951 warning( 18952 false, 18953 'bind(): You are binding a component method to the component. ' + 18954 'React does this for you automatically in a high-performance ' + 18955 'way, so you can safely remove this call. See %s', 18956 componentName 18957 ); 18958 } 18959 return boundMethod; 18960 } 18961 var reboundMethod = _bind.apply(boundMethod, arguments); 18962 reboundMethod.__reactBoundContext = component; 18963 reboundMethod.__reactBoundMethod = method; 18964 reboundMethod.__reactBoundArguments = args; 18965 return reboundMethod; 18966 }; 18967 } 18968 return boundMethod; 18969 } 18970 18971 /** 18972 * Binds all auto-bound methods in a component. 18973 * 18974 * @param {object} component Component whose method is going to be bound. 18975 */ 18976 function bindAutoBindMethods(component) { 18977 var pairs = component.__reactAutoBindPairs; 18978 for (var i = 0; i < pairs.length; i += 2) { 18979 var autoBindKey = pairs[i]; 18980 var method = pairs[i + 1]; 18981 component[autoBindKey] = bindAutoBindMethod(component, method); 18982 } 18983 } 18984 18985 var IsMountedPreMixin = { 18986 componentDidMount: function() { 18987 this.__isMounted = true; 18988 } 18989 }; 18990 18991 var IsMountedPostMixin = { 18992 componentWillUnmount: function() { 18993 this.__isMounted = false; 18994 } 18995 }; 18996 18997 /** 18998 * Add more to the ReactClass base class. These are all legacy features and 18999 * therefore not already part of the modern ReactComponent. 19000 */ 19001 var ReactClassMixin = { 19002 /** 19003 * TODO: This will be deprecated because state should always keep a consistent 19004 * type signature and the only use case for this, is to avoid that. 19005 */ 19006 replaceState: function(newState, callback) { 19007 this.updater.enqueueReplaceState(this, newState, callback); 19008 }, 19009 19010 /** 19011 * Checks whether or not this composite component is mounted. 19012 * @return {boolean} True if mounted, false otherwise. 19013 * @protected 19014 * @final 19015 */ 19016 isMounted: function() { 19017 if (process.env.NODE_ENV !== 'production') { 19018 warning( 19019 this.__didWarnIsMounted, 19020 '%s: isMounted is deprecated. Instead, make sure to clean up ' + 19021 'subscriptions and pending requests in componentWillUnmount to ' + 19022 'prevent memory leaks.', 19023 (this.constructor && this.constructor.displayName) || 19024 this.name || 19025 'Component' 19026 ); 19027 this.__didWarnIsMounted = true; 19028 } 19029 return !!this.__isMounted; 19030 } 19031 }; 19032 19033 var ReactClassComponent = function() {}; 19034 _assign( 19035 ReactClassComponent.prototype, 19036 ReactComponent.prototype, 19037 ReactClassMixin 19038 ); 19039 19040 /** 19041 * Creates a composite component class given a class specification. 19042 * See https://facebook.github.io/react/docs/top-level-api.html#react.createclass 19043 * 19044 * @param {object} spec Class specification (which must define `render`). 19045 * @return {function} Component constructor function. 19046 * @public 19047 */ 19048 function createClass(spec) { 19049 // To keep our warnings more understandable, we'll use a little hack here to 19050 // ensure that Constructor.name !== 'Constructor'. This makes sure we don't 19051 // unnecessarily identify a class without displayName as 'Constructor'. 19052 var Constructor = identity(function(props, context, updater) { 19053 // This constructor gets overridden by mocks. The argument is used 19054 // by mocks to assert on what gets mounted. 19055 19056 if (process.env.NODE_ENV !== 'production') { 19057 warning( 19058 this instanceof Constructor, 19059 'Something is calling a React component directly. Use a factory or ' + 19060 'JSX instead. See: https://fb.me/react-legacyfactory' 19061 ); 19062 } 19063 19064 // Wire up auto-binding 19065 if (this.__reactAutoBindPairs.length) { 19066 bindAutoBindMethods(this); 19067 } 19068 19069 this.props = props; 19070 this.context = context; 19071 this.refs = emptyObject; 19072 this.updater = updater || ReactNoopUpdateQueue; 19073 19074 this.state = null; 19075 19076 // ReactClasses doesn't have constructors. Instead, they use the 19077 // getInitialState and componentWillMount methods for initialization. 19078 19079 var initialState = this.getInitialState ? this.getInitialState() : null; 19080 if (process.env.NODE_ENV !== 'production') { 19081 // We allow auto-mocks to proceed as if they're returning null. 19082 if ( 19083 initialState === undefined && 19084 this.getInitialState._isMockFunction 19085 ) { 19086 // This is probably bad practice. Consider warning here and 19087 // deprecating this convenience. 19088 initialState = null; 19089 } 19090 } 19091 _invariant( 19092 typeof initialState === 'object' && !Array.isArray(initialState), 19093 '%s.getInitialState(): must return an object or null', 19094 Constructor.displayName || 'ReactCompositeComponent' 19095 ); 19096 19097 this.state = initialState; 19098 }); 19099 Constructor.prototype = new ReactClassComponent(); 19100 Constructor.prototype.constructor = Constructor; 19101 Constructor.prototype.__reactAutoBindPairs = []; 19102 19103 injectedMixins.forEach(mixSpecIntoComponent.bind(null, Constructor)); 19104 19105 mixSpecIntoComponent(Constructor, IsMountedPreMixin); 19106 mixSpecIntoComponent(Constructor, spec); 19107 mixSpecIntoComponent(Constructor, IsMountedPostMixin); 19108 19109 // Initialize the defaultProps property after all mixins have been merged. 19110 if (Constructor.getDefaultProps) { 19111 Constructor.defaultProps = Constructor.getDefaultProps(); 19112 } 19113 19114 if (process.env.NODE_ENV !== 'production') { 19115 // This is a tag to indicate that the use of these method names is ok, 19116 // since it's used with createClass. If it's not, then it's likely a 19117 // mistake so we'll warn you to use the static property, property 19118 // initializer or constructor respectively. 19119 if (Constructor.getDefaultProps) { 19120 Constructor.getDefaultProps.isReactClassApproved = {}; 19121 } 19122 if (Constructor.prototype.getInitialState) { 19123 Constructor.prototype.getInitialState.isReactClassApproved = {}; 19124 } 19125 } 19126 19127 _invariant( 19128 Constructor.prototype.render, 19129 'createClass(...): Class specification must implement a `render` method.' 19130 ); 19131 19132 if (process.env.NODE_ENV !== 'production') { 19133 warning( 19134 !Constructor.prototype.componentShouldUpdate, 19135 '%s has a method called ' + 19136 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' + 19137 'The name is phrased as a question because the function is ' + 19138 'expected to return a value.', 19139 spec.displayName || 'A component' 19140 ); 19141 warning( 19142 !Constructor.prototype.componentWillRecieveProps, 19143 '%s has a method called ' + 19144 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?', 19145 spec.displayName || 'A component' 19146 ); 19147 } 19148 19149 // Reduce time spent doing lookups by setting these on the prototype. 19150 for (var methodName in ReactClassInterface) { 19151 if (!Constructor.prototype[methodName]) { 19152 Constructor.prototype[methodName] = null; 19153 } 19154 } 19155 19156 return Constructor; 19157 } 19158 19159 return createClass; 19160 } 19161 19162 module.exports = factory; 19163 19164 /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(0))) 19165 19166 /***/ }) 19167 /******/ ])));