UNPKG

581 kBJavaScriptView Raw
1/** @license React v17.0.1
2 * react-art.development.js
3 *
4 * Copyright (c) Facebook, Inc. and its affiliates.
5 *
6 * This source code is licensed under the MIT license found in the
7 * LICENSE file in the root directory of this source tree.
8 */
9
10'use strict';
11
12if (process.env.NODE_ENV !== "production") {
13 (function() {
14'use strict';
15
16var React = require('react');
17var _assign = require('object-assign');
18var Transform = require('art/core/transform');
19var Mode$1 = require('art/modes/current');
20var Scheduler = require('scheduler');
21var tracing = require('scheduler/tracing');
22var FastNoSideEffects = require('art/modes/fast-noSideEffects');
23
24function _extends() {
25 _extends = Object.assign || function (target) {
26 for (var i = 1; i < arguments.length; i++) {
27 var source = arguments[i];
28
29 for (var key in source) {
30 if (Object.prototype.hasOwnProperty.call(source, key)) {
31 target[key] = source[key];
32 }
33 }
34 }
35
36 return target;
37 };
38
39 return _extends.apply(this, arguments);
40}
41
42function _inheritsLoose(subClass, superClass) {
43 subClass.prototype = Object.create(superClass.prototype);
44 subClass.prototype.constructor = subClass;
45 subClass.__proto__ = superClass;
46}
47
48function _assertThisInitialized(self) {
49 if (self === void 0) {
50 throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
51 }
52
53 return self;
54}
55
56// TODO: this is special because it gets imported during build.
57var ReactVersion = '17.0.1';
58
59var LegacyRoot = 0;
60var BlockingRoot = 1;
61var ConcurrentRoot = 2;
62
63var ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
64
65// by calls to these methods by a Babel plugin.
66//
67// In PROD (or in packages without access to React internals),
68// they are left as they are instead.
69
70function warn(format) {
71 {
72 for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
73 args[_key - 1] = arguments[_key];
74 }
75
76 printWarning('warn', format, args);
77 }
78}
79function error(format) {
80 {
81 for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
82 args[_key2 - 1] = arguments[_key2];
83 }
84
85 printWarning('error', format, args);
86 }
87}
88
89function printWarning(level, format, args) {
90 // When changing this logic, you might want to also
91 // update consoleWithStackDev.www.js as well.
92 {
93 var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
94 var stack = ReactDebugCurrentFrame.getStackAddendum();
95
96 if (stack !== '') {
97 format += '%s';
98 args = args.concat([stack]);
99 }
100
101 var argsWithFormat = args.map(function (item) {
102 return '' + item;
103 }); // Careful: RN currently depends on this prefix
104
105 argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
106 // breaks IE9: https://github.com/facebook/react/issues/13610
107 // eslint-disable-next-line react-internal/no-production-logging
108
109 Function.prototype.apply.call(console[level], console, argsWithFormat);
110 }
111}
112
113var FunctionComponent = 0;
114var ClassComponent = 1;
115var IndeterminateComponent = 2; // Before we know whether it is function or class
116
117var HostRoot = 3; // Root of a host tree. Could be nested inside another node.
118
119var HostPortal = 4; // A subtree. Could be an entry point to a different renderer.
120
121var HostComponent = 5;
122var HostText = 6;
123var Fragment = 7;
124var Mode = 8;
125var ContextConsumer = 9;
126var ContextProvider = 10;
127var ForwardRef = 11;
128var Profiler = 12;
129var SuspenseComponent = 13;
130var MemoComponent = 14;
131var SimpleMemoComponent = 15;
132var LazyComponent = 16;
133var IncompleteClassComponent = 17;
134var DehydratedFragment = 18;
135var SuspenseListComponent = 19;
136var FundamentalComponent = 20;
137var ScopeComponent = 21;
138var Block = 22;
139var OffscreenComponent = 23;
140var LegacyHiddenComponent = 24;
141
142/**
143 * `ReactInstanceMap` maintains a mapping from a public facing stateful
144 * instance (key) and the internal representation (value). This allows public
145 * methods to accept the user facing instance as an argument and map them back
146 * to internal methods.
147 *
148 * Note that this module is currently shared and assumed to be stateless.
149 * If this becomes an actual Map, that will break.
150 */
151function get(key) {
152 return key._reactInternals;
153}
154function set(key, value) {
155 key._reactInternals = value;
156}
157
158// ATTENTION
159// When adding new symbols to this file,
160// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
161// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
162// nor polyfill, then a plain number is used for performance.
163var REACT_ELEMENT_TYPE = 0xeac7;
164var REACT_PORTAL_TYPE = 0xeaca;
165var REACT_FRAGMENT_TYPE = 0xeacb;
166var REACT_STRICT_MODE_TYPE = 0xeacc;
167var REACT_PROFILER_TYPE = 0xead2;
168var REACT_PROVIDER_TYPE = 0xeacd;
169var REACT_CONTEXT_TYPE = 0xeace;
170var REACT_FORWARD_REF_TYPE = 0xead0;
171var REACT_SUSPENSE_TYPE = 0xead1;
172var REACT_SUSPENSE_LIST_TYPE = 0xead8;
173var REACT_MEMO_TYPE = 0xead3;
174var REACT_LAZY_TYPE = 0xead4;
175var REACT_BLOCK_TYPE = 0xead9;
176var REACT_SERVER_BLOCK_TYPE = 0xeada;
177var REACT_FUNDAMENTAL_TYPE = 0xead5;
178var REACT_SCOPE_TYPE = 0xead7;
179var REACT_OPAQUE_ID_TYPE = 0xeae0;
180var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
181var REACT_OFFSCREEN_TYPE = 0xeae2;
182var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
183
184if (typeof Symbol === 'function' && Symbol.for) {
185 var symbolFor = Symbol.for;
186 REACT_ELEMENT_TYPE = symbolFor('react.element');
187 REACT_PORTAL_TYPE = symbolFor('react.portal');
188 REACT_FRAGMENT_TYPE = symbolFor('react.fragment');
189 REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
190 REACT_PROFILER_TYPE = symbolFor('react.profiler');
191 REACT_PROVIDER_TYPE = symbolFor('react.provider');
192 REACT_CONTEXT_TYPE = symbolFor('react.context');
193 REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
194 REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
195 REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
196 REACT_MEMO_TYPE = symbolFor('react.memo');
197 REACT_LAZY_TYPE = symbolFor('react.lazy');
198 REACT_BLOCK_TYPE = symbolFor('react.block');
199 REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
200 REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
201 REACT_SCOPE_TYPE = symbolFor('react.scope');
202 REACT_OPAQUE_ID_TYPE = symbolFor('react.opaque.id');
203 REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
204 REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
205 REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
206}
207
208var MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
209var FAUX_ITERATOR_SYMBOL = '@@iterator';
210function getIteratorFn(maybeIterable) {
211 if (maybeIterable === null || typeof maybeIterable !== 'object') {
212 return null;
213 }
214
215 var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
216
217 if (typeof maybeIterator === 'function') {
218 return maybeIterator;
219 }
220
221 return null;
222}
223
224function getWrappedName(outerType, innerType, wrapperName) {
225 var functionName = innerType.displayName || innerType.name || '';
226 return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
227}
228
229function getContextName(type) {
230 return type.displayName || 'Context';
231}
232
233function getComponentName(type) {
234 if (type == null) {
235 // Host root, text node or just invalid type.
236 return null;
237 }
238
239 {
240 if (typeof type.tag === 'number') {
241 error('Received an unexpected object in getComponentName(). ' + 'This is likely a bug in React. Please file an issue.');
242 }
243 }
244
245 if (typeof type === 'function') {
246 return type.displayName || type.name || null;
247 }
248
249 if (typeof type === 'string') {
250 return type;
251 }
252
253 switch (type) {
254 case REACT_FRAGMENT_TYPE:
255 return 'Fragment';
256
257 case REACT_PORTAL_TYPE:
258 return 'Portal';
259
260 case REACT_PROFILER_TYPE:
261 return 'Profiler';
262
263 case REACT_STRICT_MODE_TYPE:
264 return 'StrictMode';
265
266 case REACT_SUSPENSE_TYPE:
267 return 'Suspense';
268
269 case REACT_SUSPENSE_LIST_TYPE:
270 return 'SuspenseList';
271 }
272
273 if (typeof type === 'object') {
274 switch (type.$$typeof) {
275 case REACT_CONTEXT_TYPE:
276 var context = type;
277 return getContextName(context) + '.Consumer';
278
279 case REACT_PROVIDER_TYPE:
280 var provider = type;
281 return getContextName(provider._context) + '.Provider';
282
283 case REACT_FORWARD_REF_TYPE:
284 return getWrappedName(type, type.render, 'ForwardRef');
285
286 case REACT_MEMO_TYPE:
287 return getComponentName(type.type);
288
289 case REACT_BLOCK_TYPE:
290 return getComponentName(type._render);
291
292 case REACT_LAZY_TYPE:
293 {
294 var lazyComponent = type;
295 var payload = lazyComponent._payload;
296 var init = lazyComponent._init;
297
298 try {
299 return getComponentName(init(payload));
300 } catch (x) {
301 return null;
302 }
303 }
304 }
305 }
306
307 return null;
308}
309
310// Don't change these two values. They're used by React Dev Tools.
311var NoFlags =
312/* */
3130;
314var PerformedWork =
315/* */
3161; // You can change the rest (and add more).
317
318var Placement =
319/* */
3202;
321var Update =
322/* */
3234;
324var PlacementAndUpdate =
325/* */
3266;
327var Deletion =
328/* */
3298;
330var ContentReset =
331/* */
33216;
333var Callback =
334/* */
33532;
336var DidCapture =
337/* */
33864;
339var Ref =
340/* */
341128;
342var Snapshot =
343/* */
344256;
345var Passive =
346/* */
347512; // TODO (effects) Remove this bit once the new reconciler is synced to the old.
348
349var PassiveUnmountPendingDev =
350/* */
3518192;
352var Hydrating =
353/* */
3541024;
355var HydratingAndUpdate =
356/* */
3571028; // Passive & Update & Callback & Ref & Snapshot
358
359var LifecycleEffectMask =
360/* */
361932; // Union of all host effects
362
363var HostEffectMask =
364/* */
3652047; // These are not really side effects, but we still reuse this field.
366
367var Incomplete =
368/* */
3692048;
370var ShouldCapture =
371/* */
3724096;
373var ForceUpdateForLegacySuspense =
374/* */
37516384; // Static tags describe aspects of a fiber that are not specific to a render,
376
377// Filter certain DOM attributes (e.g. src, href) if their values are empty strings.
378
379var enableProfilerTimer = true; // Record durations for commit and passive effects phases.
380
381var enableFundamentalAPI = false; // Experimental Scope support.
382var enableNewReconciler = false; // Errors that are thrown while unmounting (or after in the case of passive effects)
383var warnAboutStringRefs = false;
384
385var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
386function getNearestMountedFiber(fiber) {
387 var node = fiber;
388 var nearestMounted = fiber;
389
390 if (!fiber.alternate) {
391 // If there is no alternate, this might be a new tree that isn't inserted
392 // yet. If it is, then it will have a pending insertion effect on it.
393 var nextNode = node;
394
395 do {
396 node = nextNode;
397
398 if ((node.flags & (Placement | Hydrating)) !== NoFlags) {
399 // This is an insertion or in-progress hydration. The nearest possible
400 // mounted fiber is the parent but we need to continue to figure out
401 // if that one is still mounted.
402 nearestMounted = node.return;
403 }
404
405 nextNode = node.return;
406 } while (nextNode);
407 } else {
408 while (node.return) {
409 node = node.return;
410 }
411 }
412
413 if (node.tag === HostRoot) {
414 // TODO: Check if this was a nested HostRoot when used with
415 // renderContainerIntoSubtree.
416 return nearestMounted;
417 } // If we didn't hit the root, that means that we're in an disconnected tree
418 // that has been unmounted.
419
420
421 return null;
422}
423function isFiberMounted(fiber) {
424 return getNearestMountedFiber(fiber) === fiber;
425}
426function isMounted(component) {
427 {
428 var owner = ReactCurrentOwner.current;
429
430 if (owner !== null && owner.tag === ClassComponent) {
431 var ownerFiber = owner;
432 var instance = ownerFiber.stateNode;
433
434 if (!instance._warnedAboutRefsInRender) {
435 error('%s is accessing isMounted inside its render() function. ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', getComponentName(ownerFiber.type) || 'A component');
436 }
437
438 instance._warnedAboutRefsInRender = true;
439 }
440 }
441
442 var fiber = get(component);
443
444 if (!fiber) {
445 return false;
446 }
447
448 return getNearestMountedFiber(fiber) === fiber;
449}
450
451function assertIsMounted(fiber) {
452 if (!(getNearestMountedFiber(fiber) === fiber)) {
453 {
454 throw Error( "Unable to find node on an unmounted component." );
455 }
456 }
457}
458
459function findCurrentFiberUsingSlowPath(fiber) {
460 var alternate = fiber.alternate;
461
462 if (!alternate) {
463 // If there is no alternate, then we only need to check if it is mounted.
464 var nearestMounted = getNearestMountedFiber(fiber);
465
466 if (!(nearestMounted !== null)) {
467 {
468 throw Error( "Unable to find node on an unmounted component." );
469 }
470 }
471
472 if (nearestMounted !== fiber) {
473 return null;
474 }
475
476 return fiber;
477 } // If we have two possible branches, we'll walk backwards up to the root
478 // to see what path the root points to. On the way we may hit one of the
479 // special cases and we'll deal with them.
480
481
482 var a = fiber;
483 var b = alternate;
484
485 while (true) {
486 var parentA = a.return;
487
488 if (parentA === null) {
489 // We're at the root.
490 break;
491 }
492
493 var parentB = parentA.alternate;
494
495 if (parentB === null) {
496 // There is no alternate. This is an unusual case. Currently, it only
497 // happens when a Suspense component is hidden. An extra fragment fiber
498 // is inserted in between the Suspense fiber and its children. Skip
499 // over this extra fragment fiber and proceed to the next parent.
500 var nextParent = parentA.return;
501
502 if (nextParent !== null) {
503 a = b = nextParent;
504 continue;
505 } // If there's no parent, we're at the root.
506
507
508 break;
509 } // If both copies of the parent fiber point to the same child, we can
510 // assume that the child is current. This happens when we bailout on low
511 // priority: the bailed out fiber's child reuses the current child.
512
513
514 if (parentA.child === parentB.child) {
515 var child = parentA.child;
516
517 while (child) {
518 if (child === a) {
519 // We've determined that A is the current branch.
520 assertIsMounted(parentA);
521 return fiber;
522 }
523
524 if (child === b) {
525 // We've determined that B is the current branch.
526 assertIsMounted(parentA);
527 return alternate;
528 }
529
530 child = child.sibling;
531 } // We should never have an alternate for any mounting node. So the only
532 // way this could possibly happen is if this was unmounted, if at all.
533
534
535 {
536 {
537 throw Error( "Unable to find node on an unmounted component." );
538 }
539 }
540 }
541
542 if (a.return !== b.return) {
543 // The return pointer of A and the return pointer of B point to different
544 // fibers. We assume that return pointers never criss-cross, so A must
545 // belong to the child set of A.return, and B must belong to the child
546 // set of B.return.
547 a = parentA;
548 b = parentB;
549 } else {
550 // The return pointers point to the same fiber. We'll have to use the
551 // default, slow path: scan the child sets of each parent alternate to see
552 // which child belongs to which set.
553 //
554 // Search parent A's child set
555 var didFindChild = false;
556 var _child = parentA.child;
557
558 while (_child) {
559 if (_child === a) {
560 didFindChild = true;
561 a = parentA;
562 b = parentB;
563 break;
564 }
565
566 if (_child === b) {
567 didFindChild = true;
568 b = parentA;
569 a = parentB;
570 break;
571 }
572
573 _child = _child.sibling;
574 }
575
576 if (!didFindChild) {
577 // Search parent B's child set
578 _child = parentB.child;
579
580 while (_child) {
581 if (_child === a) {
582 didFindChild = true;
583 a = parentB;
584 b = parentA;
585 break;
586 }
587
588 if (_child === b) {
589 didFindChild = true;
590 b = parentB;
591 a = parentA;
592 break;
593 }
594
595 _child = _child.sibling;
596 }
597
598 if (!didFindChild) {
599 {
600 throw Error( "Child was not found in either parent set. This indicates a bug in React related to the return pointer. Please file an issue." );
601 }
602 }
603 }
604 }
605
606 if (!(a.alternate === b)) {
607 {
608 throw Error( "Return fibers should always be each others' alternates. This error is likely caused by a bug in React. Please file an issue." );
609 }
610 }
611 } // If the root is not a host container, we're in a disconnected tree. I.e.
612 // unmounted.
613
614
615 if (!(a.tag === HostRoot)) {
616 {
617 throw Error( "Unable to find node on an unmounted component." );
618 }
619 }
620
621 if (a.stateNode.current === a) {
622 // We've determined that A is the current branch.
623 return fiber;
624 } // Otherwise B has to be current branch.
625
626
627 return alternate;
628}
629function findCurrentHostFiber(parent) {
630 var currentParent = findCurrentFiberUsingSlowPath(parent);
631
632 if (!currentParent) {
633 return null;
634 } // Next we'll drill down this component to find the first HostComponent/Text.
635
636
637 var node = currentParent;
638
639 while (true) {
640 if (node.tag === HostComponent || node.tag === HostText) {
641 return node;
642 } else if (node.child) {
643 node.child.return = node;
644 node = node.child;
645 continue;
646 }
647
648 if (node === currentParent) {
649 return null;
650 }
651
652 while (!node.sibling) {
653 if (!node.return || node.return === currentParent) {
654 return null;
655 }
656
657 node = node.return;
658 }
659
660 node.sibling.return = node.return;
661 node = node.sibling;
662 } // Flow needs the return null here, but ESLint complains about it.
663 // eslint-disable-next-line no-unreachable
664
665
666 return null;
667}
668function doesFiberContain(parentFiber, childFiber) {
669 var node = childFiber;
670 var parentFiberAlternate = parentFiber.alternate;
671
672 while (node !== null) {
673 if (node === parentFiber || node === parentFiberAlternate) {
674 return true;
675 }
676
677 node = node.return;
678 }
679
680 return false;
681}
682
683var TYPES = {
684 CLIPPING_RECTANGLE: 'ClippingRectangle',
685 GROUP: 'Group',
686 SHAPE: 'Shape',
687 TEXT: 'Text'
688};
689var EVENT_TYPES = {
690 onClick: 'click',
691 onMouseMove: 'mousemove',
692 onMouseOver: 'mouseover',
693 onMouseOut: 'mouseout',
694 onMouseUp: 'mouseup',
695 onMouseDown: 'mousedown'
696};
697function childrenAsString(children) {
698 if (!children) {
699 return '';
700 } else if (typeof children === 'string') {
701 return children;
702 } else if (children.length) {
703 return children.join('');
704 } else {
705 return '';
706 }
707}
708
709// can re-export everything from this module.
710
711function shim() {
712 {
713 {
714 throw Error( "The current renderer does not support hydration. This error is likely caused by a bug in React. Please file an issue." );
715 }
716 }
717} // Hydration (when unsupported)
718var isSuspenseInstancePending = shim;
719var isSuspenseInstanceFallback = shim;
720var hydrateTextInstance = shim;
721
722var pooledTransform = new Transform();
723var NO_CONTEXT = {};
724var UPDATE_SIGNAL = {};
725
726{
727 Object.freeze(NO_CONTEXT);
728 Object.freeze(UPDATE_SIGNAL);
729}
730/** Helper Methods */
731
732
733function addEventListeners(instance, type, listener) {
734 // We need to explicitly unregister before unmount.
735 // For this reason we need to track subscriptions.
736 if (!instance._listeners) {
737 instance._listeners = {};
738 instance._subscriptions = {};
739 }
740
741 instance._listeners[type] = listener;
742
743 if (listener) {
744 if (!instance._subscriptions[type]) {
745 instance._subscriptions[type] = instance.subscribe(type, createEventHandler(instance), instance);
746 }
747 } else {
748 if (instance._subscriptions[type]) {
749 instance._subscriptions[type]();
750
751 delete instance._subscriptions[type];
752 }
753 }
754}
755
756function createEventHandler(instance) {
757 return function handleEvent(event) {
758 var listener = instance._listeners[event.type];
759
760 if (!listener) ; else if (typeof listener === 'function') {
761 listener.call(instance, event);
762 } else if (listener.handleEvent) {
763 listener.handleEvent(event);
764 }
765 };
766}
767
768function destroyEventListeners(instance) {
769 if (instance._subscriptions) {
770 for (var type in instance._subscriptions) {
771 instance._subscriptions[type]();
772 }
773 }
774
775 instance._subscriptions = null;
776 instance._listeners = null;
777}
778
779function getScaleX(props) {
780 if (props.scaleX != null) {
781 return props.scaleX;
782 } else if (props.scale != null) {
783 return props.scale;
784 } else {
785 return 1;
786 }
787}
788
789function getScaleY(props) {
790 if (props.scaleY != null) {
791 return props.scaleY;
792 } else if (props.scale != null) {
793 return props.scale;
794 } else {
795 return 1;
796 }
797}
798
799function isSameFont(oldFont, newFont) {
800 if (oldFont === newFont) {
801 return true;
802 } else if (typeof newFont === 'string' || typeof oldFont === 'string') {
803 return false;
804 } else {
805 return newFont.fontSize === oldFont.fontSize && newFont.fontStyle === oldFont.fontStyle && newFont.fontVariant === oldFont.fontVariant && newFont.fontWeight === oldFont.fontWeight && newFont.fontFamily === oldFont.fontFamily;
806 }
807}
808/** Render Methods */
809
810
811function applyClippingRectangleProps(instance, props) {
812 var prevProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
813 applyNodeProps(instance, props, prevProps);
814 instance.width = props.width;
815 instance.height = props.height;
816}
817
818function applyGroupProps(instance, props) {
819 var prevProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
820 applyNodeProps(instance, props, prevProps);
821 instance.width = props.width;
822 instance.height = props.height;
823}
824
825function applyNodeProps(instance, props) {
826 var prevProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
827 var scaleX = getScaleX(props);
828 var scaleY = getScaleY(props);
829 pooledTransform.transformTo(1, 0, 0, 1, 0, 0).move(props.x || 0, props.y || 0).rotate(props.rotation || 0, props.originX, props.originY).scale(scaleX, scaleY, props.originX, props.originY);
830
831 if (props.transform != null) {
832 pooledTransform.transform(props.transform);
833 }
834
835 if (instance.xx !== pooledTransform.xx || instance.yx !== pooledTransform.yx || instance.xy !== pooledTransform.xy || instance.yy !== pooledTransform.yy || instance.x !== pooledTransform.x || instance.y !== pooledTransform.y) {
836 instance.transformTo(pooledTransform);
837 }
838
839 if (props.cursor !== prevProps.cursor || props.title !== prevProps.title) {
840 instance.indicate(props.cursor, props.title);
841 }
842
843 if (instance.blend && props.opacity !== prevProps.opacity) {
844 instance.blend(props.opacity == null ? 1 : props.opacity);
845 }
846
847 if (props.visible !== prevProps.visible) {
848 if (props.visible == null || props.visible) {
849 instance.show();
850 } else {
851 instance.hide();
852 }
853 }
854
855 for (var type in EVENT_TYPES) {
856 addEventListeners(instance, EVENT_TYPES[type], props[type]);
857 }
858}
859
860function applyRenderableNodeProps(instance, props) {
861 var prevProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
862 applyNodeProps(instance, props, prevProps);
863
864 if (prevProps.fill !== props.fill) {
865 if (props.fill && props.fill.applyFill) {
866 props.fill.applyFill(instance);
867 } else {
868 instance.fill(props.fill);
869 }
870 }
871
872 if (prevProps.stroke !== props.stroke || prevProps.strokeWidth !== props.strokeWidth || prevProps.strokeCap !== props.strokeCap || prevProps.strokeJoin !== props.strokeJoin || // TODO: Consider deep check of stokeDash; may benefit VML in IE.
873 prevProps.strokeDash !== props.strokeDash) {
874 instance.stroke(props.stroke, props.strokeWidth, props.strokeCap, props.strokeJoin, props.strokeDash);
875 }
876}
877
878function applyShapeProps(instance, props) {
879 var prevProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
880 applyRenderableNodeProps(instance, props, prevProps);
881 var path = props.d || childrenAsString(props.children);
882 var prevDelta = instance._prevDelta;
883 var prevPath = instance._prevPath;
884
885 if (path !== prevPath || path.delta !== prevDelta || prevProps.height !== props.height || prevProps.width !== props.width) {
886 instance.draw(path, props.width, props.height);
887 instance._prevDelta = path.delta;
888 instance._prevPath = path;
889 }
890}
891
892function applyTextProps(instance, props) {
893 var prevProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
894 applyRenderableNodeProps(instance, props, prevProps);
895 var string = props.children;
896
897 if (instance._currentString !== string || !isSameFont(props.font, prevProps.font) || props.alignment !== prevProps.alignment || props.path !== prevProps.path) {
898 instance.draw(string, props.font, props.alignment, props.path);
899 instance._currentString = string;
900 }
901}
902function appendInitialChild(parentInstance, child) {
903 if (typeof child === 'string') {
904 // Noop for string children of Text (eg <Text>{'foo'}{'bar'}</Text>)
905 {
906 {
907 throw Error( "Text children should already be flattened." );
908 }
909 }
910 }
911
912 child.inject(parentInstance);
913}
914function createInstance(type, props, internalInstanceHandle) {
915 var instance;
916
917 switch (type) {
918 case TYPES.CLIPPING_RECTANGLE:
919 instance = Mode$1.ClippingRectangle();
920 instance._applyProps = applyClippingRectangleProps;
921 break;
922
923 case TYPES.GROUP:
924 instance = Mode$1.Group();
925 instance._applyProps = applyGroupProps;
926 break;
927
928 case TYPES.SHAPE:
929 instance = Mode$1.Shape();
930 instance._applyProps = applyShapeProps;
931 break;
932
933 case TYPES.TEXT:
934 instance = Mode$1.Text(props.children, props.font, props.alignment, props.path);
935 instance._applyProps = applyTextProps;
936 break;
937 }
938
939 if (!instance) {
940 {
941 throw Error( "ReactART does not support the type \"" + type + "\"" );
942 }
943 }
944
945 instance._applyProps(instance, props);
946
947 return instance;
948}
949function createTextInstance(text, rootContainerInstance, internalInstanceHandle) {
950 return text;
951}
952function getPublicInstance(instance) {
953 return instance;
954}
955function prepareForCommit() {
956 // Noop
957 return null;
958}
959function prepareUpdate(domElement, type, oldProps, newProps) {
960 return UPDATE_SIGNAL;
961}
962function resetAfterCommit() {// Noop
963}
964function resetTextContent(domElement) {// Noop
965}
966function getRootHostContext() {
967 return NO_CONTEXT;
968}
969function getChildHostContext() {
970 return NO_CONTEXT;
971}
972var scheduleTimeout = setTimeout;
973var cancelTimeout = clearTimeout;
974var noTimeout = -1;
975function shouldSetTextContent(type, props) {
976 return typeof props.children === 'string' || typeof props.children === 'number';
977} // The ART renderer is secondary to the React DOM renderer.
978function appendChild(parentInstance, child) {
979 if (child.parentNode === parentInstance) {
980 child.eject();
981 }
982
983 child.inject(parentInstance);
984}
985function appendChildToContainer(parentInstance, child) {
986 if (child.parentNode === parentInstance) {
987 child.eject();
988 }
989
990 child.inject(parentInstance);
991}
992function insertBefore(parentInstance, child, beforeChild) {
993 if (!(child !== beforeChild)) {
994 {
995 throw Error( "ReactART: Can not insert node before itself" );
996 }
997 }
998
999 child.injectBefore(beforeChild);
1000}
1001function insertInContainerBefore(parentInstance, child, beforeChild) {
1002 if (!(child !== beforeChild)) {
1003 {
1004 throw Error( "ReactART: Can not insert node before itself" );
1005 }
1006 }
1007
1008 child.injectBefore(beforeChild);
1009}
1010function removeChild(parentInstance, child) {
1011 destroyEventListeners(child);
1012 child.eject();
1013}
1014function removeChildFromContainer(parentInstance, child) {
1015 destroyEventListeners(child);
1016 child.eject();
1017}
1018function commitUpdate(instance, updatePayload, type, oldProps, newProps) {
1019 instance._applyProps(instance, newProps, oldProps);
1020}
1021function hideInstance(instance) {
1022 instance.hide();
1023}
1024function unhideInstance(instance, props) {
1025 if (props.visible == null || props.visible) {
1026 instance.show();
1027 }
1028}
1029function unhideTextInstance(textInstance, text) {// Noop
1030}
1031function clearContainer(container) {// TODO Implement this
1032}
1033function makeClientIdInDEV(warnOnAccessInDEV) {
1034 throw new Error('Not yet implemented');
1035}
1036function preparePortalMount(portalInstance) {// noop
1037}
1038
1039// Helpers to patch console.logs to avoid logging during side-effect free
1040// replaying on render function. This currently only patches the object
1041// lazily which won't cover if the log function was extracted eagerly.
1042// We could also eagerly patch the method.
1043var disabledDepth = 0;
1044var prevLog;
1045var prevInfo;
1046var prevWarn;
1047var prevError;
1048var prevGroup;
1049var prevGroupCollapsed;
1050var prevGroupEnd;
1051
1052function disabledLog() {}
1053
1054disabledLog.__reactDisabledLog = true;
1055function disableLogs() {
1056 {
1057 if (disabledDepth === 0) {
1058 /* eslint-disable react-internal/no-production-logging */
1059 prevLog = console.log;
1060 prevInfo = console.info;
1061 prevWarn = console.warn;
1062 prevError = console.error;
1063 prevGroup = console.group;
1064 prevGroupCollapsed = console.groupCollapsed;
1065 prevGroupEnd = console.groupEnd; // https://github.com/facebook/react/issues/19099
1066
1067 var props = {
1068 configurable: true,
1069 enumerable: true,
1070 value: disabledLog,
1071 writable: true
1072 }; // $FlowFixMe Flow thinks console is immutable.
1073
1074 Object.defineProperties(console, {
1075 info: props,
1076 log: props,
1077 warn: props,
1078 error: props,
1079 group: props,
1080 groupCollapsed: props,
1081 groupEnd: props
1082 });
1083 /* eslint-enable react-internal/no-production-logging */
1084 }
1085
1086 disabledDepth++;
1087 }
1088}
1089function reenableLogs() {
1090 {
1091 disabledDepth--;
1092
1093 if (disabledDepth === 0) {
1094 /* eslint-disable react-internal/no-production-logging */
1095 var props = {
1096 configurable: true,
1097 enumerable: true,
1098 writable: true
1099 }; // $FlowFixMe Flow thinks console is immutable.
1100
1101 Object.defineProperties(console, {
1102 log: _assign({}, props, {
1103 value: prevLog
1104 }),
1105 info: _assign({}, props, {
1106 value: prevInfo
1107 }),
1108 warn: _assign({}, props, {
1109 value: prevWarn
1110 }),
1111 error: _assign({}, props, {
1112 value: prevError
1113 }),
1114 group: _assign({}, props, {
1115 value: prevGroup
1116 }),
1117 groupCollapsed: _assign({}, props, {
1118 value: prevGroupCollapsed
1119 }),
1120 groupEnd: _assign({}, props, {
1121 value: prevGroupEnd
1122 })
1123 });
1124 /* eslint-enable react-internal/no-production-logging */
1125 }
1126
1127 if (disabledDepth < 0) {
1128 error('disabledDepth fell below zero. ' + 'This is a bug in React. Please file an issue.');
1129 }
1130 }
1131}
1132
1133var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
1134var prefix;
1135function describeBuiltInComponentFrame(name, source, ownerFn) {
1136 {
1137 if (prefix === undefined) {
1138 // Extract the VM specific prefix used by each line.
1139 try {
1140 throw Error();
1141 } catch (x) {
1142 var match = x.stack.trim().match(/\n( *(at )?)/);
1143 prefix = match && match[1] || '';
1144 }
1145 } // We use the prefix to ensure our stacks line up with native stack frames.
1146
1147
1148 return '\n' + prefix + name;
1149 }
1150}
1151var reentry = false;
1152var componentFrameCache;
1153
1154{
1155 var PossiblyWeakMap = typeof WeakMap === 'function' ? WeakMap : Map;
1156 componentFrameCache = new PossiblyWeakMap();
1157}
1158
1159function describeNativeComponentFrame(fn, construct) {
1160 // If something asked for a stack inside a fake render, it should get ignored.
1161 if (!fn || reentry) {
1162 return '';
1163 }
1164
1165 {
1166 var frame = componentFrameCache.get(fn);
1167
1168 if (frame !== undefined) {
1169 return frame;
1170 }
1171 }
1172
1173 var control;
1174 reentry = true;
1175 var previousPrepareStackTrace = Error.prepareStackTrace; // $FlowFixMe It does accept undefined.
1176
1177 Error.prepareStackTrace = undefined;
1178 var previousDispatcher;
1179
1180 {
1181 previousDispatcher = ReactCurrentDispatcher.current; // Set the dispatcher in DEV because this might be call in the render function
1182 // for warnings.
1183
1184 ReactCurrentDispatcher.current = null;
1185 disableLogs();
1186 }
1187
1188 try {
1189 // This should throw.
1190 if (construct) {
1191 // Something should be setting the props in the constructor.
1192 var Fake = function () {
1193 throw Error();
1194 }; // $FlowFixMe
1195
1196
1197 Object.defineProperty(Fake.prototype, 'props', {
1198 set: function () {
1199 // We use a throwing setter instead of frozen or non-writable props
1200 // because that won't throw in a non-strict mode function.
1201 throw Error();
1202 }
1203 });
1204
1205 if (typeof Reflect === 'object' && Reflect.construct) {
1206 // We construct a different control for this case to include any extra
1207 // frames added by the construct call.
1208 try {
1209 Reflect.construct(Fake, []);
1210 } catch (x) {
1211 control = x;
1212 }
1213
1214 Reflect.construct(fn, [], Fake);
1215 } else {
1216 try {
1217 Fake.call();
1218 } catch (x) {
1219 control = x;
1220 }
1221
1222 fn.call(Fake.prototype);
1223 }
1224 } else {
1225 try {
1226 throw Error();
1227 } catch (x) {
1228 control = x;
1229 }
1230
1231 fn();
1232 }
1233 } catch (sample) {
1234 // This is inlined manually because closure doesn't do it for us.
1235 if (sample && control && typeof sample.stack === 'string') {
1236 // This extracts the first frame from the sample that isn't also in the control.
1237 // Skipping one frame that we assume is the frame that calls the two.
1238 var sampleLines = sample.stack.split('\n');
1239 var controlLines = control.stack.split('\n');
1240 var s = sampleLines.length - 1;
1241 var c = controlLines.length - 1;
1242
1243 while (s >= 1 && c >= 0 && sampleLines[s] !== controlLines[c]) {
1244 // We expect at least one stack frame to be shared.
1245 // Typically this will be the root most one. However, stack frames may be
1246 // cut off due to maximum stack limits. In this case, one maybe cut off
1247 // earlier than the other. We assume that the sample is longer or the same
1248 // and there for cut off earlier. So we should find the root most frame in
1249 // the sample somewhere in the control.
1250 c--;
1251 }
1252
1253 for (; s >= 1 && c >= 0; s--, c--) {
1254 // Next we find the first one that isn't the same which should be the
1255 // frame that called our sample function and the control.
1256 if (sampleLines[s] !== controlLines[c]) {
1257 // In V8, the first line is describing the message but other VMs don't.
1258 // If we're about to return the first line, and the control is also on the same
1259 // line, that's a pretty good indicator that our sample threw at same line as
1260 // the control. I.e. before we entered the sample frame. So we ignore this result.
1261 // This can happen if you passed a class to function component, or non-function.
1262 if (s !== 1 || c !== 1) {
1263 do {
1264 s--;
1265 c--; // We may still have similar intermediate frames from the construct call.
1266 // The next one that isn't the same should be our match though.
1267
1268 if (c < 0 || sampleLines[s] !== controlLines[c]) {
1269 // V8 adds a "new" prefix for native classes. Let's remove it to make it prettier.
1270 var _frame = '\n' + sampleLines[s].replace(' at new ', ' at ');
1271
1272 {
1273 if (typeof fn === 'function') {
1274 componentFrameCache.set(fn, _frame);
1275 }
1276 } // Return the line we found.
1277
1278
1279 return _frame;
1280 }
1281 } while (s >= 1 && c >= 0);
1282 }
1283
1284 break;
1285 }
1286 }
1287 }
1288 } finally {
1289 reentry = false;
1290
1291 {
1292 ReactCurrentDispatcher.current = previousDispatcher;
1293 reenableLogs();
1294 }
1295
1296 Error.prepareStackTrace = previousPrepareStackTrace;
1297 } // Fallback to just using the name if we couldn't make it throw.
1298
1299
1300 var name = fn ? fn.displayName || fn.name : '';
1301 var syntheticFrame = name ? describeBuiltInComponentFrame(name) : '';
1302
1303 {
1304 if (typeof fn === 'function') {
1305 componentFrameCache.set(fn, syntheticFrame);
1306 }
1307 }
1308
1309 return syntheticFrame;
1310}
1311
1312function describeClassComponentFrame(ctor, source, ownerFn) {
1313 {
1314 return describeNativeComponentFrame(ctor, true);
1315 }
1316}
1317function describeFunctionComponentFrame(fn, source, ownerFn) {
1318 {
1319 return describeNativeComponentFrame(fn, false);
1320 }
1321}
1322
1323function shouldConstruct(Component) {
1324 var prototype = Component.prototype;
1325 return !!(prototype && prototype.isReactComponent);
1326}
1327
1328function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) {
1329
1330 if (type == null) {
1331 return '';
1332 }
1333
1334 if (typeof type === 'function') {
1335 {
1336 return describeNativeComponentFrame(type, shouldConstruct(type));
1337 }
1338 }
1339
1340 if (typeof type === 'string') {
1341 return describeBuiltInComponentFrame(type);
1342 }
1343
1344 switch (type) {
1345 case REACT_SUSPENSE_TYPE:
1346 return describeBuiltInComponentFrame('Suspense');
1347
1348 case REACT_SUSPENSE_LIST_TYPE:
1349 return describeBuiltInComponentFrame('SuspenseList');
1350 }
1351
1352 if (typeof type === 'object') {
1353 switch (type.$$typeof) {
1354 case REACT_FORWARD_REF_TYPE:
1355 return describeFunctionComponentFrame(type.render);
1356
1357 case REACT_MEMO_TYPE:
1358 // Memo may contain any component type so we recursively resolve it.
1359 return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn);
1360
1361 case REACT_BLOCK_TYPE:
1362 return describeFunctionComponentFrame(type._render);
1363
1364 case REACT_LAZY_TYPE:
1365 {
1366 var lazyComponent = type;
1367 var payload = lazyComponent._payload;
1368 var init = lazyComponent._init;
1369
1370 try {
1371 // Lazy may contain any component type so we recursively resolve it.
1372 return describeUnknownElementTypeFrameInDEV(init(payload), source, ownerFn);
1373 } catch (x) {}
1374 }
1375 }
1376 }
1377
1378 return '';
1379}
1380
1381var loggedTypeFailures = {};
1382var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
1383
1384function setCurrentlyValidatingElement(element) {
1385 {
1386 if (element) {
1387 var owner = element._owner;
1388 var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null);
1389 ReactDebugCurrentFrame.setExtraStackFrame(stack);
1390 } else {
1391 ReactDebugCurrentFrame.setExtraStackFrame(null);
1392 }
1393 }
1394}
1395
1396function checkPropTypes(typeSpecs, values, location, componentName, element) {
1397 {
1398 // $FlowFixMe This is okay but Flow doesn't know it.
1399 var has = Function.call.bind(Object.prototype.hasOwnProperty);
1400
1401 for (var typeSpecName in typeSpecs) {
1402 if (has(typeSpecs, typeSpecName)) {
1403 var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
1404 // fail the render phase where it didn't fail before. So we log it.
1405 // After these have been cleaned up, we'll let them throw.
1406
1407 try {
1408 // This is intentionally an invariant that gets caught. It's the same
1409 // behavior as without this statement except with a better message.
1410 if (typeof typeSpecs[typeSpecName] !== 'function') {
1411 var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
1412 err.name = 'Invariant Violation';
1413 throw err;
1414 }
1415
1416 error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
1417 } catch (ex) {
1418 error$1 = ex;
1419 }
1420
1421 if (error$1 && !(error$1 instanceof Error)) {
1422 setCurrentlyValidatingElement(element);
1423
1424 error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
1425
1426 setCurrentlyValidatingElement(null);
1427 }
1428
1429 if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
1430 // Only monitor this failure once because there tends to be a lot of the
1431 // same error.
1432 loggedTypeFailures[error$1.message] = true;
1433 setCurrentlyValidatingElement(element);
1434
1435 error('Failed %s type: %s', location, error$1.message);
1436
1437 setCurrentlyValidatingElement(null);
1438 }
1439 }
1440 }
1441 }
1442}
1443
1444var valueStack = [];
1445var fiberStack;
1446
1447{
1448 fiberStack = [];
1449}
1450
1451var index = -1;
1452
1453function createCursor(defaultValue) {
1454 return {
1455 current: defaultValue
1456 };
1457}
1458
1459function pop(cursor, fiber) {
1460 if (index < 0) {
1461 {
1462 error('Unexpected pop.');
1463 }
1464
1465 return;
1466 }
1467
1468 {
1469 if (fiber !== fiberStack[index]) {
1470 error('Unexpected Fiber popped.');
1471 }
1472 }
1473
1474 cursor.current = valueStack[index];
1475 valueStack[index] = null;
1476
1477 {
1478 fiberStack[index] = null;
1479 }
1480
1481 index--;
1482}
1483
1484function push(cursor, value, fiber) {
1485 index++;
1486 valueStack[index] = cursor.current;
1487
1488 {
1489 fiberStack[index] = fiber;
1490 }
1491
1492 cursor.current = value;
1493}
1494
1495var warnedAboutMissingGetChildContext;
1496
1497{
1498 warnedAboutMissingGetChildContext = {};
1499}
1500
1501var emptyContextObject = {};
1502
1503{
1504 Object.freeze(emptyContextObject);
1505} // A cursor to the current merged context object on the stack.
1506
1507
1508var contextStackCursor = createCursor(emptyContextObject); // A cursor to a boolean indicating whether the context has changed.
1509
1510var didPerformWorkStackCursor = createCursor(false); // Keep track of the previous context object that was on the stack.
1511// We use this to get access to the parent context after we have already
1512// pushed the next context provider, and now need to merge their contexts.
1513
1514var previousContext = emptyContextObject;
1515
1516function getUnmaskedContext(workInProgress, Component, didPushOwnContextIfProvider) {
1517 {
1518 if (didPushOwnContextIfProvider && isContextProvider(Component)) {
1519 // If the fiber is a context provider itself, when we read its context
1520 // we may have already pushed its own child context on the stack. A context
1521 // provider should not "see" its own child context. Therefore we read the
1522 // previous (parent) context instead for a context provider.
1523 return previousContext;
1524 }
1525
1526 return contextStackCursor.current;
1527 }
1528}
1529
1530function cacheContext(workInProgress, unmaskedContext, maskedContext) {
1531 {
1532 var instance = workInProgress.stateNode;
1533 instance.__reactInternalMemoizedUnmaskedChildContext = unmaskedContext;
1534 instance.__reactInternalMemoizedMaskedChildContext = maskedContext;
1535 }
1536}
1537
1538function getMaskedContext(workInProgress, unmaskedContext) {
1539 {
1540 var type = workInProgress.type;
1541 var contextTypes = type.contextTypes;
1542
1543 if (!contextTypes) {
1544 return emptyContextObject;
1545 } // Avoid recreating masked context unless unmasked context has changed.
1546 // Failing to do this will result in unnecessary calls to componentWillReceiveProps.
1547 // This may trigger infinite loops if componentWillReceiveProps calls setState.
1548
1549
1550 var instance = workInProgress.stateNode;
1551
1552 if (instance && instance.__reactInternalMemoizedUnmaskedChildContext === unmaskedContext) {
1553 return instance.__reactInternalMemoizedMaskedChildContext;
1554 }
1555
1556 var context = {};
1557
1558 for (var key in contextTypes) {
1559 context[key] = unmaskedContext[key];
1560 }
1561
1562 {
1563 var name = getComponentName(type) || 'Unknown';
1564 checkPropTypes(contextTypes, context, 'context', name);
1565 } // Cache unmasked context so we can avoid recreating masked context unless necessary.
1566 // Context is created before the class component is instantiated so check for instance.
1567
1568
1569 if (instance) {
1570 cacheContext(workInProgress, unmaskedContext, context);
1571 }
1572
1573 return context;
1574 }
1575}
1576
1577function hasContextChanged() {
1578 {
1579 return didPerformWorkStackCursor.current;
1580 }
1581}
1582
1583function isContextProvider(type) {
1584 {
1585 var childContextTypes = type.childContextTypes;
1586 return childContextTypes !== null && childContextTypes !== undefined;
1587 }
1588}
1589
1590function popContext(fiber) {
1591 {
1592 pop(didPerformWorkStackCursor, fiber);
1593 pop(contextStackCursor, fiber);
1594 }
1595}
1596
1597function popTopLevelContextObject(fiber) {
1598 {
1599 pop(didPerformWorkStackCursor, fiber);
1600 pop(contextStackCursor, fiber);
1601 }
1602}
1603
1604function pushTopLevelContextObject(fiber, context, didChange) {
1605 {
1606 if (!(contextStackCursor.current === emptyContextObject)) {
1607 {
1608 throw Error( "Unexpected context found on stack. This error is likely caused by a bug in React. Please file an issue." );
1609 }
1610 }
1611
1612 push(contextStackCursor, context, fiber);
1613 push(didPerformWorkStackCursor, didChange, fiber);
1614 }
1615}
1616
1617function processChildContext(fiber, type, parentContext) {
1618 {
1619 var instance = fiber.stateNode;
1620 var childContextTypes = type.childContextTypes; // TODO (bvaughn) Replace this behavior with an invariant() in the future.
1621 // It has only been added in Fiber to match the (unintentional) behavior in Stack.
1622
1623 if (typeof instance.getChildContext !== 'function') {
1624 {
1625 var componentName = getComponentName(type) || 'Unknown';
1626
1627 if (!warnedAboutMissingGetChildContext[componentName]) {
1628 warnedAboutMissingGetChildContext[componentName] = true;
1629
1630 error('%s.childContextTypes is specified but there is no getChildContext() method ' + 'on the instance. You can either define getChildContext() on %s or remove ' + 'childContextTypes from it.', componentName, componentName);
1631 }
1632 }
1633
1634 return parentContext;
1635 }
1636
1637 var childContext = instance.getChildContext();
1638
1639 for (var contextKey in childContext) {
1640 if (!(contextKey in childContextTypes)) {
1641 {
1642 throw Error( (getComponentName(type) || 'Unknown') + ".getChildContext(): key \"" + contextKey + "\" is not defined in childContextTypes." );
1643 }
1644 }
1645 }
1646
1647 {
1648 var name = getComponentName(type) || 'Unknown';
1649 checkPropTypes(childContextTypes, childContext, 'child context', name);
1650 }
1651
1652 return _assign({}, parentContext, childContext);
1653 }
1654}
1655
1656function pushContextProvider(workInProgress) {
1657 {
1658 var instance = workInProgress.stateNode; // We push the context as early as possible to ensure stack integrity.
1659 // If the instance does not exist yet, we will push null at first,
1660 // and replace it on the stack later when invalidating the context.
1661
1662 var memoizedMergedChildContext = instance && instance.__reactInternalMemoizedMergedChildContext || emptyContextObject; // Remember the parent context so we can merge with it later.
1663 // Inherit the parent's did-perform-work value to avoid inadvertently blocking updates.
1664
1665 previousContext = contextStackCursor.current;
1666 push(contextStackCursor, memoizedMergedChildContext, workInProgress);
1667 push(didPerformWorkStackCursor, didPerformWorkStackCursor.current, workInProgress);
1668 return true;
1669 }
1670}
1671
1672function invalidateContextProvider(workInProgress, type, didChange) {
1673 {
1674 var instance = workInProgress.stateNode;
1675
1676 if (!instance) {
1677 {
1678 throw Error( "Expected to have an instance by this point. This error is likely caused by a bug in React. Please file an issue." );
1679 }
1680 }
1681
1682 if (didChange) {
1683 // Merge parent and own context.
1684 // Skip this if we're not updating due to sCU.
1685 // This avoids unnecessarily recomputing memoized values.
1686 var mergedContext = processChildContext(workInProgress, type, previousContext);
1687 instance.__reactInternalMemoizedMergedChildContext = mergedContext; // Replace the old (or empty) context with the new one.
1688 // It is important to unwind the context in the reverse order.
1689
1690 pop(didPerformWorkStackCursor, workInProgress);
1691 pop(contextStackCursor, workInProgress); // Now push the new context and mark that it has changed.
1692
1693 push(contextStackCursor, mergedContext, workInProgress);
1694 push(didPerformWorkStackCursor, didChange, workInProgress);
1695 } else {
1696 pop(didPerformWorkStackCursor, workInProgress);
1697 push(didPerformWorkStackCursor, didChange, workInProgress);
1698 }
1699 }
1700}
1701
1702function findCurrentUnmaskedContext(fiber) {
1703 {
1704 // Currently this is only used with renderSubtreeIntoContainer; not sure if it
1705 // makes sense elsewhere
1706 if (!(isFiberMounted(fiber) && fiber.tag === ClassComponent)) {
1707 {
1708 throw Error( "Expected subtree parent to be a mounted class component. This error is likely caused by a bug in React. Please file an issue." );
1709 }
1710 }
1711
1712 var node = fiber;
1713
1714 do {
1715 switch (node.tag) {
1716 case HostRoot:
1717 return node.stateNode.context;
1718
1719 case ClassComponent:
1720 {
1721 var Component = node.type;
1722
1723 if (isContextProvider(Component)) {
1724 return node.stateNode.__reactInternalMemoizedMergedChildContext;
1725 }
1726
1727 break;
1728 }
1729 }
1730
1731 node = node.return;
1732 } while (node !== null);
1733
1734 {
1735 {
1736 throw Error( "Found unexpected detached subtree parent. This error is likely caused by a bug in React. Please file an issue." );
1737 }
1738 }
1739 }
1740}
1741
1742var rendererID = null;
1743var injectedHook = null;
1744var hasLoggedError = false;
1745var isDevToolsPresent = typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined';
1746function injectInternals(internals) {
1747 if (typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined') {
1748 // No DevTools
1749 return false;
1750 }
1751
1752 var hook = __REACT_DEVTOOLS_GLOBAL_HOOK__;
1753
1754 if (hook.isDisabled) {
1755 // This isn't a real property on the hook, but it can be set to opt out
1756 // of DevTools integration and associated warnings and logs.
1757 // https://github.com/facebook/react/issues/3877
1758 return true;
1759 }
1760
1761 if (!hook.supportsFiber) {
1762 {
1763 error('The installed version of React DevTools is too old and will not work ' + 'with the current version of React. Please update React DevTools. ' + 'https://reactjs.org/link/react-devtools');
1764 } // DevTools exists, even though it doesn't support Fiber.
1765
1766
1767 return true;
1768 }
1769
1770 try {
1771 rendererID = hook.inject(internals); // We have successfully injected, so now it is safe to set up hooks.
1772
1773 injectedHook = hook;
1774 } catch (err) {
1775 // Catch all errors because it is unsafe to throw during initialization.
1776 {
1777 error('React instrumentation encountered an error: %s.', err);
1778 }
1779 } // DevTools exists
1780
1781
1782 return true;
1783}
1784function onScheduleRoot(root, children) {
1785 {
1786 if (injectedHook && typeof injectedHook.onScheduleFiberRoot === 'function') {
1787 try {
1788 injectedHook.onScheduleFiberRoot(rendererID, root, children);
1789 } catch (err) {
1790 if ( !hasLoggedError) {
1791 hasLoggedError = true;
1792
1793 error('React instrumentation encountered an error: %s', err);
1794 }
1795 }
1796 }
1797 }
1798}
1799function onCommitRoot(root, priorityLevel) {
1800 if (injectedHook && typeof injectedHook.onCommitFiberRoot === 'function') {
1801 try {
1802 var didError = (root.current.flags & DidCapture) === DidCapture;
1803
1804 if (enableProfilerTimer) {
1805 injectedHook.onCommitFiberRoot(rendererID, root, priorityLevel, didError);
1806 } else {
1807 injectedHook.onCommitFiberRoot(rendererID, root, undefined, didError);
1808 }
1809 } catch (err) {
1810 {
1811 if (!hasLoggedError) {
1812 hasLoggedError = true;
1813
1814 error('React instrumentation encountered an error: %s', err);
1815 }
1816 }
1817 }
1818 }
1819}
1820function onCommitUnmount(fiber) {
1821 if (injectedHook && typeof injectedHook.onCommitFiberUnmount === 'function') {
1822 try {
1823 injectedHook.onCommitFiberUnmount(rendererID, fiber);
1824 } catch (err) {
1825 {
1826 if (!hasLoggedError) {
1827 hasLoggedError = true;
1828
1829 error('React instrumentation encountered an error: %s', err);
1830 }
1831 }
1832 }
1833 }
1834}
1835
1836var Scheduler_now = Scheduler.unstable_now;
1837
1838{
1839 // Provide explicit error message when production+profiling bundle of e.g.
1840 // react-dom is used with production (non-profiling) bundle of
1841 // scheduler/tracing
1842 if (!(tracing.__interactionsRef != null && tracing.__interactionsRef.current != null)) {
1843 {
1844 throw Error( "It is not supported to run the profiling version of a renderer (for example, `react-dom/profiling`) without also replacing the `scheduler/tracing` module with `scheduler/tracing-profiling`. Your bundler might have a setting for aliasing both modules. Learn more at https://reactjs.org/link/profiling" );
1845 }
1846 }
1847}
1848// ascending numbers so we can compare them like numbers. They start at 90 to
1849// avoid clashing with Scheduler's priorities.
1850
1851var ImmediatePriority = 99;
1852var UserBlockingPriority = 98;
1853var NormalPriority = 97;
1854var LowPriority = 96;
1855var IdlePriority = 95; // NoPriority is the absence of priority. Also React-only.
1856
1857var NoPriority = 90;
1858var initialTimeMs = Scheduler_now(); // If the initial timestamp is reasonably small, use Scheduler's `now` directly.
1859
1860var SyncLanePriority = 15;
1861var SyncBatchedLanePriority = 14;
1862var InputDiscreteHydrationLanePriority = 13;
1863var InputDiscreteLanePriority = 12;
1864var InputContinuousHydrationLanePriority = 11;
1865var InputContinuousLanePriority = 10;
1866var DefaultHydrationLanePriority = 9;
1867var DefaultLanePriority = 8;
1868var TransitionHydrationPriority = 7;
1869var TransitionPriority = 6;
1870var RetryLanePriority = 5;
1871var SelectiveHydrationLanePriority = 4;
1872var IdleHydrationLanePriority = 3;
1873var IdleLanePriority = 2;
1874var OffscreenLanePriority = 1;
1875var NoLanePriority = 0;
1876var TotalLanes = 31;
1877var NoLanes =
1878/* */
18790;
1880var NoLane =
1881/* */
18820;
1883var SyncLane =
1884/* */
18851;
1886var SyncBatchedLane =
1887/* */
18882;
1889var InputDiscreteHydrationLane =
1890/* */
18914;
1892var InputDiscreteLanes =
1893/* */
189424;
1895var InputContinuousHydrationLane =
1896/* */
189732;
1898var InputContinuousLanes =
1899/* */
1900192;
1901var DefaultHydrationLane =
1902/* */
1903256;
1904var DefaultLanes =
1905/* */
19063584;
1907var TransitionHydrationLane =
1908/* */
19094096;
1910var TransitionLanes =
1911/* */
19124186112;
1913var RetryLanes =
1914/* */
191562914560;
1916var SomeRetryLane =
1917/* */
191833554432;
1919var SelectiveHydrationLane =
1920/* */
192167108864;
1922var NonIdleLanes =
1923/* */
1924134217727;
1925var IdleHydrationLane =
1926/* */
1927134217728;
1928var IdleLanes =
1929/* */
1930805306368;
1931var OffscreenLane =
1932/* */
19331073741824;
1934var NoTimestamp = -1;
1935// Used by getHighestPriorityLanes and getNextLanes:
1936
1937var return_highestLanePriority = DefaultLanePriority;
1938
1939function getHighestPriorityLanes(lanes) {
1940 if ((SyncLane & lanes) !== NoLanes) {
1941 return_highestLanePriority = SyncLanePriority;
1942 return SyncLane;
1943 }
1944
1945 if ((SyncBatchedLane & lanes) !== NoLanes) {
1946 return_highestLanePriority = SyncBatchedLanePriority;
1947 return SyncBatchedLane;
1948 }
1949
1950 if ((InputDiscreteHydrationLane & lanes) !== NoLanes) {
1951 return_highestLanePriority = InputDiscreteHydrationLanePriority;
1952 return InputDiscreteHydrationLane;
1953 }
1954
1955 var inputDiscreteLanes = InputDiscreteLanes & lanes;
1956
1957 if (inputDiscreteLanes !== NoLanes) {
1958 return_highestLanePriority = InputDiscreteLanePriority;
1959 return inputDiscreteLanes;
1960 }
1961
1962 if ((lanes & InputContinuousHydrationLane) !== NoLanes) {
1963 return_highestLanePriority = InputContinuousHydrationLanePriority;
1964 return InputContinuousHydrationLane;
1965 }
1966
1967 var inputContinuousLanes = InputContinuousLanes & lanes;
1968
1969 if (inputContinuousLanes !== NoLanes) {
1970 return_highestLanePriority = InputContinuousLanePriority;
1971 return inputContinuousLanes;
1972 }
1973
1974 if ((lanes & DefaultHydrationLane) !== NoLanes) {
1975 return_highestLanePriority = DefaultHydrationLanePriority;
1976 return DefaultHydrationLane;
1977 }
1978
1979 var defaultLanes = DefaultLanes & lanes;
1980
1981 if (defaultLanes !== NoLanes) {
1982 return_highestLanePriority = DefaultLanePriority;
1983 return defaultLanes;
1984 }
1985
1986 if ((lanes & TransitionHydrationLane) !== NoLanes) {
1987 return_highestLanePriority = TransitionHydrationPriority;
1988 return TransitionHydrationLane;
1989 }
1990
1991 var transitionLanes = TransitionLanes & lanes;
1992
1993 if (transitionLanes !== NoLanes) {
1994 return_highestLanePriority = TransitionPriority;
1995 return transitionLanes;
1996 }
1997
1998 var retryLanes = RetryLanes & lanes;
1999
2000 if (retryLanes !== NoLanes) {
2001 return_highestLanePriority = RetryLanePriority;
2002 return retryLanes;
2003 }
2004
2005 if (lanes & SelectiveHydrationLane) {
2006 return_highestLanePriority = SelectiveHydrationLanePriority;
2007 return SelectiveHydrationLane;
2008 }
2009
2010 if ((lanes & IdleHydrationLane) !== NoLanes) {
2011 return_highestLanePriority = IdleHydrationLanePriority;
2012 return IdleHydrationLane;
2013 }
2014
2015 var idleLanes = IdleLanes & lanes;
2016
2017 if (idleLanes !== NoLanes) {
2018 return_highestLanePriority = IdleLanePriority;
2019 return idleLanes;
2020 }
2021
2022 if ((OffscreenLane & lanes) !== NoLanes) {
2023 return_highestLanePriority = OffscreenLanePriority;
2024 return OffscreenLane;
2025 }
2026
2027 {
2028 error('Should have found matching lanes. This is a bug in React.');
2029 } // This shouldn't be reachable, but as a fallback, return the entire bitmask.
2030
2031
2032 return_highestLanePriority = DefaultLanePriority;
2033 return lanes;
2034}
2035
2036function schedulerPriorityToLanePriority(schedulerPriorityLevel) {
2037 switch (schedulerPriorityLevel) {
2038 case ImmediatePriority:
2039 return SyncLanePriority;
2040
2041 case UserBlockingPriority:
2042 return InputContinuousLanePriority;
2043
2044 case NormalPriority:
2045 case LowPriority:
2046 // TODO: Handle LowSchedulerPriority, somehow. Maybe the same lane as hydration.
2047 return DefaultLanePriority;
2048
2049 case IdlePriority:
2050 return IdleLanePriority;
2051
2052 default:
2053 return NoLanePriority;
2054 }
2055}
2056function lanePriorityToSchedulerPriority(lanePriority) {
2057 switch (lanePriority) {
2058 case SyncLanePriority:
2059 case SyncBatchedLanePriority:
2060 return ImmediatePriority;
2061
2062 case InputDiscreteHydrationLanePriority:
2063 case InputDiscreteLanePriority:
2064 case InputContinuousHydrationLanePriority:
2065 case InputContinuousLanePriority:
2066 return UserBlockingPriority;
2067
2068 case DefaultHydrationLanePriority:
2069 case DefaultLanePriority:
2070 case TransitionHydrationPriority:
2071 case TransitionPriority:
2072 case SelectiveHydrationLanePriority:
2073 case RetryLanePriority:
2074 return NormalPriority;
2075
2076 case IdleHydrationLanePriority:
2077 case IdleLanePriority:
2078 case OffscreenLanePriority:
2079 return IdlePriority;
2080
2081 case NoLanePriority:
2082 return NoPriority;
2083
2084 default:
2085 {
2086 {
2087 throw Error( "Invalid update priority: " + lanePriority + ". This is a bug in React." );
2088 }
2089 }
2090
2091 }
2092}
2093function getNextLanes(root, wipLanes) {
2094 // Early bailout if there's no pending work left.
2095 var pendingLanes = root.pendingLanes;
2096
2097 if (pendingLanes === NoLanes) {
2098 return_highestLanePriority = NoLanePriority;
2099 return NoLanes;
2100 }
2101
2102 var nextLanes = NoLanes;
2103 var nextLanePriority = NoLanePriority;
2104 var expiredLanes = root.expiredLanes;
2105 var suspendedLanes = root.suspendedLanes;
2106 var pingedLanes = root.pingedLanes; // Check if any work has expired.
2107
2108 if (expiredLanes !== NoLanes) {
2109 nextLanes = expiredLanes;
2110 nextLanePriority = return_highestLanePriority = SyncLanePriority;
2111 } else {
2112 // Do not work on any idle work until all the non-idle work has finished,
2113 // even if the work is suspended.
2114 var nonIdlePendingLanes = pendingLanes & NonIdleLanes;
2115
2116 if (nonIdlePendingLanes !== NoLanes) {
2117 var nonIdleUnblockedLanes = nonIdlePendingLanes & ~suspendedLanes;
2118
2119 if (nonIdleUnblockedLanes !== NoLanes) {
2120 nextLanes = getHighestPriorityLanes(nonIdleUnblockedLanes);
2121 nextLanePriority = return_highestLanePriority;
2122 } else {
2123 var nonIdlePingedLanes = nonIdlePendingLanes & pingedLanes;
2124
2125 if (nonIdlePingedLanes !== NoLanes) {
2126 nextLanes = getHighestPriorityLanes(nonIdlePingedLanes);
2127 nextLanePriority = return_highestLanePriority;
2128 }
2129 }
2130 } else {
2131 // The only remaining work is Idle.
2132 var unblockedLanes = pendingLanes & ~suspendedLanes;
2133
2134 if (unblockedLanes !== NoLanes) {
2135 nextLanes = getHighestPriorityLanes(unblockedLanes);
2136 nextLanePriority = return_highestLanePriority;
2137 } else {
2138 if (pingedLanes !== NoLanes) {
2139 nextLanes = getHighestPriorityLanes(pingedLanes);
2140 nextLanePriority = return_highestLanePriority;
2141 }
2142 }
2143 }
2144 }
2145
2146 if (nextLanes === NoLanes) {
2147 // This should only be reachable if we're suspended
2148 // TODO: Consider warning in this path if a fallback timer is not scheduled.
2149 return NoLanes;
2150 } // If there are higher priority lanes, we'll include them even if they
2151 // are suspended.
2152
2153
2154 nextLanes = pendingLanes & getEqualOrHigherPriorityLanes(nextLanes); // If we're already in the middle of a render, switching lanes will interrupt
2155 // it and we'll lose our progress. We should only do this if the new lanes are
2156 // higher priority.
2157
2158 if (wipLanes !== NoLanes && wipLanes !== nextLanes && // If we already suspended with a delay, then interrupting is fine. Don't
2159 // bother waiting until the root is complete.
2160 (wipLanes & suspendedLanes) === NoLanes) {
2161 getHighestPriorityLanes(wipLanes);
2162 var wipLanePriority = return_highestLanePriority;
2163
2164 if (nextLanePriority <= wipLanePriority) {
2165 return wipLanes;
2166 } else {
2167 return_highestLanePriority = nextLanePriority;
2168 }
2169 } // Check for entangled lanes and add them to the batch.
2170 //
2171 // A lane is said to be entangled with another when it's not allowed to render
2172 // in a batch that does not also include the other lane. Typically we do this
2173 // when multiple updates have the same source, and we only want to respond to
2174 // the most recent event from that source.
2175 //
2176 // Note that we apply entanglements *after* checking for partial work above.
2177 // This means that if a lane is entangled during an interleaved event while
2178 // it's already rendering, we won't interrupt it. This is intentional, since
2179 // entanglement is usually "best effort": we'll try our best to render the
2180 // lanes in the same batch, but it's not worth throwing out partially
2181 // completed work in order to do it.
2182 //
2183 // For those exceptions where entanglement is semantically important, like
2184 // useMutableSource, we should ensure that there is no partial work at the
2185 // time we apply the entanglement.
2186
2187
2188 var entangledLanes = root.entangledLanes;
2189
2190 if (entangledLanes !== NoLanes) {
2191 var entanglements = root.entanglements;
2192 var lanes = nextLanes & entangledLanes;
2193
2194 while (lanes > 0) {
2195 var index = pickArbitraryLaneIndex(lanes);
2196 var lane = 1 << index;
2197 nextLanes |= entanglements[index];
2198 lanes &= ~lane;
2199 }
2200 }
2201
2202 return nextLanes;
2203}
2204function getMostRecentEventTime(root, lanes) {
2205 var eventTimes = root.eventTimes;
2206 var mostRecentEventTime = NoTimestamp;
2207
2208 while (lanes > 0) {
2209 var index = pickArbitraryLaneIndex(lanes);
2210 var lane = 1 << index;
2211 var eventTime = eventTimes[index];
2212
2213 if (eventTime > mostRecentEventTime) {
2214 mostRecentEventTime = eventTime;
2215 }
2216
2217 lanes &= ~lane;
2218 }
2219
2220 return mostRecentEventTime;
2221}
2222
2223function computeExpirationTime(lane, currentTime) {
2224 // TODO: Expiration heuristic is constant per lane, so could use a map.
2225 getHighestPriorityLanes(lane);
2226 var priority = return_highestLanePriority;
2227
2228 if (priority >= InputContinuousLanePriority) {
2229 // User interactions should expire slightly more quickly.
2230 //
2231 // NOTE: This is set to the corresponding constant as in Scheduler.js. When
2232 // we made it larger, a product metric in www regressed, suggesting there's
2233 // a user interaction that's being starved by a series of synchronous
2234 // updates. If that theory is correct, the proper solution is to fix the
2235 // starvation. However, this scenario supports the idea that expiration
2236 // times are an important safeguard when starvation does happen.
2237 //
2238 // Also note that, in the case of user input specifically, this will soon no
2239 // longer be an issue because we plan to make user input synchronous by
2240 // default (until you enter `startTransition`, of course.)
2241 //
2242 // If weren't planning to make these updates synchronous soon anyway, I
2243 // would probably make this number a configurable parameter.
2244 return currentTime + 250;
2245 } else if (priority >= TransitionPriority) {
2246 return currentTime + 5000;
2247 } else {
2248 // Anything idle priority or lower should never expire.
2249 return NoTimestamp;
2250 }
2251}
2252
2253function markStarvedLanesAsExpired(root, currentTime) {
2254 // TODO: This gets called every time we yield. We can optimize by storing
2255 // the earliest expiration time on the root. Then use that to quickly bail out
2256 // of this function.
2257 var pendingLanes = root.pendingLanes;
2258 var suspendedLanes = root.suspendedLanes;
2259 var pingedLanes = root.pingedLanes;
2260 var expirationTimes = root.expirationTimes; // Iterate through the pending lanes and check if we've reached their
2261 // expiration time. If so, we'll assume the update is being starved and mark
2262 // it as expired to force it to finish.
2263
2264 var lanes = pendingLanes;
2265
2266 while (lanes > 0) {
2267 var index = pickArbitraryLaneIndex(lanes);
2268 var lane = 1 << index;
2269 var expirationTime = expirationTimes[index];
2270
2271 if (expirationTime === NoTimestamp) {
2272 // Found a pending lane with no expiration time. If it's not suspended, or
2273 // if it's pinged, assume it's CPU-bound. Compute a new expiration time
2274 // using the current time.
2275 if ((lane & suspendedLanes) === NoLanes || (lane & pingedLanes) !== NoLanes) {
2276 // Assumes timestamps are monotonically increasing.
2277 expirationTimes[index] = computeExpirationTime(lane, currentTime);
2278 }
2279 } else if (expirationTime <= currentTime) {
2280 // This lane expired
2281 root.expiredLanes |= lane;
2282 }
2283
2284 lanes &= ~lane;
2285 }
2286} // This returns the highest priority pending lanes regardless of whether they
2287function getLanesToRetrySynchronouslyOnError(root) {
2288 var everythingButOffscreen = root.pendingLanes & ~OffscreenLane;
2289
2290 if (everythingButOffscreen !== NoLanes) {
2291 return everythingButOffscreen;
2292 }
2293
2294 if (everythingButOffscreen & OffscreenLane) {
2295 return OffscreenLane;
2296 }
2297
2298 return NoLanes;
2299}
2300function returnNextLanesPriority() {
2301 return return_highestLanePriority;
2302}
2303function includesNonIdleWork(lanes) {
2304 return (lanes & NonIdleLanes) !== NoLanes;
2305}
2306function includesOnlyRetries(lanes) {
2307 return (lanes & RetryLanes) === lanes;
2308}
2309function includesOnlyTransitions(lanes) {
2310 return (lanes & TransitionLanes) === lanes;
2311} // To ensure consistency across multiple updates in the same event, this should
2312// be a pure function, so that it always returns the same lane for given inputs.
2313
2314function findUpdateLane(lanePriority, wipLanes) {
2315 switch (lanePriority) {
2316 case NoLanePriority:
2317 break;
2318
2319 case SyncLanePriority:
2320 return SyncLane;
2321
2322 case SyncBatchedLanePriority:
2323 return SyncBatchedLane;
2324
2325 case InputDiscreteLanePriority:
2326 {
2327 var _lane = pickArbitraryLane(InputDiscreteLanes & ~wipLanes);
2328
2329 if (_lane === NoLane) {
2330 // Shift to the next priority level
2331 return findUpdateLane(InputContinuousLanePriority, wipLanes);
2332 }
2333
2334 return _lane;
2335 }
2336
2337 case InputContinuousLanePriority:
2338 {
2339 var _lane2 = pickArbitraryLane(InputContinuousLanes & ~wipLanes);
2340
2341 if (_lane2 === NoLane) {
2342 // Shift to the next priority level
2343 return findUpdateLane(DefaultLanePriority, wipLanes);
2344 }
2345
2346 return _lane2;
2347 }
2348
2349 case DefaultLanePriority:
2350 {
2351 var _lane3 = pickArbitraryLane(DefaultLanes & ~wipLanes);
2352
2353 if (_lane3 === NoLane) {
2354 // If all the default lanes are already being worked on, look for a
2355 // lane in the transition range.
2356 _lane3 = pickArbitraryLane(TransitionLanes & ~wipLanes);
2357
2358 if (_lane3 === NoLane) {
2359 // All the transition lanes are taken, too. This should be very
2360 // rare, but as a last resort, pick a default lane. This will have
2361 // the effect of interrupting the current work-in-progress render.
2362 _lane3 = pickArbitraryLane(DefaultLanes);
2363 }
2364 }
2365
2366 return _lane3;
2367 }
2368
2369 case TransitionPriority: // Should be handled by findTransitionLane instead
2370
2371 case RetryLanePriority:
2372 // Should be handled by findRetryLane instead
2373 break;
2374
2375 case IdleLanePriority:
2376 var lane = pickArbitraryLane(IdleLanes & ~wipLanes);
2377
2378 if (lane === NoLane) {
2379 lane = pickArbitraryLane(IdleLanes);
2380 }
2381
2382 return lane;
2383 }
2384
2385 {
2386 {
2387 throw Error( "Invalid update priority: " + lanePriority + ". This is a bug in React." );
2388 }
2389 }
2390} // To ensure consistency across multiple updates in the same event, this should
2391// be pure function, so that it always returns the same lane for given inputs.
2392
2393function findTransitionLane(wipLanes, pendingLanes) {
2394 // First look for lanes that are completely unclaimed, i.e. have no
2395 // pending work.
2396 var lane = pickArbitraryLane(TransitionLanes & ~pendingLanes);
2397
2398 if (lane === NoLane) {
2399 // If all lanes have pending work, look for a lane that isn't currently
2400 // being worked on.
2401 lane = pickArbitraryLane(TransitionLanes & ~wipLanes);
2402
2403 if (lane === NoLane) {
2404 // If everything is being worked on, pick any lane. This has the
2405 // effect of interrupting the current work-in-progress.
2406 lane = pickArbitraryLane(TransitionLanes);
2407 }
2408 }
2409
2410 return lane;
2411} // To ensure consistency across multiple updates in the same event, this should
2412// be pure function, so that it always returns the same lane for given inputs.
2413
2414function findRetryLane(wipLanes) {
2415 // This is a fork of `findUpdateLane` designed specifically for Suspense
2416 // "retries" — a special update that attempts to flip a Suspense boundary
2417 // from its placeholder state to its primary/resolved state.
2418 var lane = pickArbitraryLane(RetryLanes & ~wipLanes);
2419
2420 if (lane === NoLane) {
2421 lane = pickArbitraryLane(RetryLanes);
2422 }
2423
2424 return lane;
2425}
2426
2427function getHighestPriorityLane(lanes) {
2428 return lanes & -lanes;
2429}
2430
2431function getLowestPriorityLane(lanes) {
2432 // This finds the most significant non-zero bit.
2433 var index = 31 - clz32(lanes);
2434 return index < 0 ? NoLanes : 1 << index;
2435}
2436
2437function getEqualOrHigherPriorityLanes(lanes) {
2438 return (getLowestPriorityLane(lanes) << 1) - 1;
2439}
2440
2441function pickArbitraryLane(lanes) {
2442 // This wrapper function gets inlined. Only exists so to communicate that it
2443 // doesn't matter which bit is selected; you can pick any bit without
2444 // affecting the algorithms where its used. Here I'm using
2445 // getHighestPriorityLane because it requires the fewest operations.
2446 return getHighestPriorityLane(lanes);
2447}
2448
2449function pickArbitraryLaneIndex(lanes) {
2450 return 31 - clz32(lanes);
2451}
2452
2453function laneToIndex(lane) {
2454 return pickArbitraryLaneIndex(lane);
2455}
2456
2457function includesSomeLane(a, b) {
2458 return (a & b) !== NoLanes;
2459}
2460function isSubsetOfLanes(set, subset) {
2461 return (set & subset) === subset;
2462}
2463function mergeLanes(a, b) {
2464 return a | b;
2465}
2466function removeLanes(set, subset) {
2467 return set & ~subset;
2468} // Seems redundant, but it changes the type from a single lane (used for
2469// updates) to a group of lanes (used for flushing work).
2470
2471function laneToLanes(lane) {
2472 return lane;
2473}
2474function createLaneMap(initial) {
2475 // Intentionally pushing one by one.
2476 // https://v8.dev/blog/elements-kinds#avoid-creating-holes
2477 var laneMap = [];
2478
2479 for (var i = 0; i < TotalLanes; i++) {
2480 laneMap.push(initial);
2481 }
2482
2483 return laneMap;
2484}
2485function markRootUpdated(root, updateLane, eventTime) {
2486 root.pendingLanes |= updateLane; // TODO: Theoretically, any update to any lane can unblock any other lane. But
2487 // it's not practical to try every single possible combination. We need a
2488 // heuristic to decide which lanes to attempt to render, and in which batches.
2489 // For now, we use the same heuristic as in the old ExpirationTimes model:
2490 // retry any lane at equal or lower priority, but don't try updates at higher
2491 // priority without also including the lower priority updates. This works well
2492 // when considering updates across different priority levels, but isn't
2493 // sufficient for updates within the same priority, since we want to treat
2494 // those updates as parallel.
2495 // Unsuspend any update at equal or lower priority.
2496
2497 var higherPriorityLanes = updateLane - 1; // Turns 0b1000 into 0b0111
2498
2499 root.suspendedLanes &= higherPriorityLanes;
2500 root.pingedLanes &= higherPriorityLanes;
2501 var eventTimes = root.eventTimes;
2502 var index = laneToIndex(updateLane); // We can always overwrite an existing timestamp because we prefer the most
2503 // recent event, and we assume time is monotonically increasing.
2504
2505 eventTimes[index] = eventTime;
2506}
2507function markRootSuspended(root, suspendedLanes) {
2508 root.suspendedLanes |= suspendedLanes;
2509 root.pingedLanes &= ~suspendedLanes; // The suspended lanes are no longer CPU-bound. Clear their expiration times.
2510
2511 var expirationTimes = root.expirationTimes;
2512 var lanes = suspendedLanes;
2513
2514 while (lanes > 0) {
2515 var index = pickArbitraryLaneIndex(lanes);
2516 var lane = 1 << index;
2517 expirationTimes[index] = NoTimestamp;
2518 lanes &= ~lane;
2519 }
2520}
2521function markRootPinged(root, pingedLanes, eventTime) {
2522 root.pingedLanes |= root.suspendedLanes & pingedLanes;
2523}
2524function hasDiscreteLanes(lanes) {
2525 return (lanes & InputDiscreteLanes) !== NoLanes;
2526}
2527function markRootMutableRead(root, updateLane) {
2528 root.mutableReadLanes |= updateLane & root.pendingLanes;
2529}
2530function markRootFinished(root, remainingLanes) {
2531 var noLongerPendingLanes = root.pendingLanes & ~remainingLanes;
2532 root.pendingLanes = remainingLanes; // Let's try everything again
2533
2534 root.suspendedLanes = 0;
2535 root.pingedLanes = 0;
2536 root.expiredLanes &= remainingLanes;
2537 root.mutableReadLanes &= remainingLanes;
2538 root.entangledLanes &= remainingLanes;
2539 var entanglements = root.entanglements;
2540 var eventTimes = root.eventTimes;
2541 var expirationTimes = root.expirationTimes; // Clear the lanes that no longer have pending work
2542
2543 var lanes = noLongerPendingLanes;
2544
2545 while (lanes > 0) {
2546 var index = pickArbitraryLaneIndex(lanes);
2547 var lane = 1 << index;
2548 entanglements[index] = NoLanes;
2549 eventTimes[index] = NoTimestamp;
2550 expirationTimes[index] = NoTimestamp;
2551 lanes &= ~lane;
2552 }
2553}
2554function markRootEntangled(root, entangledLanes) {
2555 root.entangledLanes |= entangledLanes;
2556 var entanglements = root.entanglements;
2557 var lanes = entangledLanes;
2558
2559 while (lanes > 0) {
2560 var index = pickArbitraryLaneIndex(lanes);
2561 var lane = 1 << index;
2562 entanglements[index] |= entangledLanes;
2563 lanes &= ~lane;
2564 }
2565}
2566var clz32 = Math.clz32 ? Math.clz32 : clz32Fallback; // Count leading zeros. Only used on lanes, so assume input is an integer.
2567// Based on:
2568// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/clz32
2569
2570var log = Math.log;
2571var LN2 = Math.LN2;
2572
2573function clz32Fallback(lanes) {
2574 if (lanes === 0) {
2575 return 32;
2576 }
2577
2578 return 31 - (log(lanes) / LN2 | 0) | 0;
2579}
2580
2581var Scheduler_runWithPriority = Scheduler.unstable_runWithPriority,
2582 Scheduler_scheduleCallback = Scheduler.unstable_scheduleCallback,
2583 Scheduler_cancelCallback = Scheduler.unstable_cancelCallback,
2584 Scheduler_shouldYield = Scheduler.unstable_shouldYield,
2585 Scheduler_requestPaint = Scheduler.unstable_requestPaint,
2586 Scheduler_now$1 = Scheduler.unstable_now,
2587 Scheduler_getCurrentPriorityLevel = Scheduler.unstable_getCurrentPriorityLevel,
2588 Scheduler_ImmediatePriority = Scheduler.unstable_ImmediatePriority,
2589 Scheduler_UserBlockingPriority = Scheduler.unstable_UserBlockingPriority,
2590 Scheduler_NormalPriority = Scheduler.unstable_NormalPriority,
2591 Scheduler_LowPriority = Scheduler.unstable_LowPriority,
2592 Scheduler_IdlePriority = Scheduler.unstable_IdlePriority;
2593
2594{
2595 // Provide explicit error message when production+profiling bundle of e.g.
2596 // react-dom is used with production (non-profiling) bundle of
2597 // scheduler/tracing
2598 if (!(tracing.__interactionsRef != null && tracing.__interactionsRef.current != null)) {
2599 {
2600 throw Error( "It is not supported to run the profiling version of a renderer (for example, `react-dom/profiling`) without also replacing the `scheduler/tracing` module with `scheduler/tracing-profiling`. Your bundler might have a setting for aliasing both modules. Learn more at https://reactjs.org/link/profiling" );
2601 }
2602 }
2603}
2604
2605var fakeCallbackNode = {}; // Except for NoPriority, these correspond to Scheduler priorities. We use
2606// ascending numbers so we can compare them like numbers. They start at 90 to
2607// avoid clashing with Scheduler's priorities.
2608
2609var ImmediatePriority$1 = 99;
2610var UserBlockingPriority$1 = 98;
2611var NormalPriority$1 = 97;
2612var LowPriority$1 = 96;
2613var IdlePriority$1 = 95; // NoPriority is the absence of priority. Also React-only.
2614
2615var NoPriority$1 = 90;
2616var shouldYield = Scheduler_shouldYield;
2617var requestPaint = // Fall back gracefully if we're running an older version of Scheduler.
2618Scheduler_requestPaint !== undefined ? Scheduler_requestPaint : function () {};
2619var syncQueue = null;
2620var immediateQueueCallbackNode = null;
2621var isFlushingSyncQueue = false;
2622var initialTimeMs$1 = Scheduler_now$1(); // If the initial timestamp is reasonably small, use Scheduler's `now` directly.
2623// This will be the case for modern browsers that support `performance.now`. In
2624// older browsers, Scheduler falls back to `Date.now`, which returns a Unix
2625// timestamp. In that case, subtract the module initialization time to simulate
2626// the behavior of performance.now and keep our times small enough to fit
2627// within 32 bits.
2628// TODO: Consider lifting this into Scheduler.
2629
2630var now = initialTimeMs$1 < 10000 ? Scheduler_now$1 : function () {
2631 return Scheduler_now$1() - initialTimeMs$1;
2632};
2633function getCurrentPriorityLevel() {
2634 switch (Scheduler_getCurrentPriorityLevel()) {
2635 case Scheduler_ImmediatePriority:
2636 return ImmediatePriority$1;
2637
2638 case Scheduler_UserBlockingPriority:
2639 return UserBlockingPriority$1;
2640
2641 case Scheduler_NormalPriority:
2642 return NormalPriority$1;
2643
2644 case Scheduler_LowPriority:
2645 return LowPriority$1;
2646
2647 case Scheduler_IdlePriority:
2648 return IdlePriority$1;
2649
2650 default:
2651 {
2652 {
2653 throw Error( "Unknown priority level." );
2654 }
2655 }
2656
2657 }
2658}
2659
2660function reactPriorityToSchedulerPriority(reactPriorityLevel) {
2661 switch (reactPriorityLevel) {
2662 case ImmediatePriority$1:
2663 return Scheduler_ImmediatePriority;
2664
2665 case UserBlockingPriority$1:
2666 return Scheduler_UserBlockingPriority;
2667
2668 case NormalPriority$1:
2669 return Scheduler_NormalPriority;
2670
2671 case LowPriority$1:
2672 return Scheduler_LowPriority;
2673
2674 case IdlePriority$1:
2675 return Scheduler_IdlePriority;
2676
2677 default:
2678 {
2679 {
2680 throw Error( "Unknown priority level." );
2681 }
2682 }
2683
2684 }
2685}
2686
2687function runWithPriority(reactPriorityLevel, fn) {
2688 var priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel);
2689 return Scheduler_runWithPriority(priorityLevel, fn);
2690}
2691function scheduleCallback(reactPriorityLevel, callback, options) {
2692 var priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel);
2693 return Scheduler_scheduleCallback(priorityLevel, callback, options);
2694}
2695function scheduleSyncCallback(callback) {
2696 // Push this callback into an internal queue. We'll flush these either in
2697 // the next tick, or earlier if something calls `flushSyncCallbackQueue`.
2698 if (syncQueue === null) {
2699 syncQueue = [callback]; // Flush the queue in the next tick, at the earliest.
2700
2701 immediateQueueCallbackNode = Scheduler_scheduleCallback(Scheduler_ImmediatePriority, flushSyncCallbackQueueImpl);
2702 } else {
2703 // Push onto existing queue. Don't need to schedule a callback because
2704 // we already scheduled one when we created the queue.
2705 syncQueue.push(callback);
2706 }
2707
2708 return fakeCallbackNode;
2709}
2710function cancelCallback(callbackNode) {
2711 if (callbackNode !== fakeCallbackNode) {
2712 Scheduler_cancelCallback(callbackNode);
2713 }
2714}
2715function flushSyncCallbackQueue() {
2716 if (immediateQueueCallbackNode !== null) {
2717 var node = immediateQueueCallbackNode;
2718 immediateQueueCallbackNode = null;
2719 Scheduler_cancelCallback(node);
2720 }
2721
2722 flushSyncCallbackQueueImpl();
2723}
2724
2725function flushSyncCallbackQueueImpl() {
2726 if (!isFlushingSyncQueue && syncQueue !== null) {
2727 // Prevent re-entrancy.
2728 isFlushingSyncQueue = true;
2729 var i = 0;
2730
2731 {
2732 try {
2733 var _isSync2 = true;
2734 var _queue = syncQueue;
2735 runWithPriority(ImmediatePriority$1, function () {
2736 for (; i < _queue.length; i++) {
2737 var callback = _queue[i];
2738
2739 do {
2740 callback = callback(_isSync2);
2741 } while (callback !== null);
2742 }
2743 });
2744 syncQueue = null;
2745 } catch (error) {
2746 // If something throws, leave the remaining callbacks on the queue.
2747 if (syncQueue !== null) {
2748 syncQueue = syncQueue.slice(i + 1);
2749 } // Resume flushing in the next tick
2750
2751
2752 Scheduler_scheduleCallback(Scheduler_ImmediatePriority, flushSyncCallbackQueue);
2753 throw error;
2754 } finally {
2755 isFlushingSyncQueue = false;
2756 }
2757 }
2758 }
2759}
2760
2761var NoMode = 0;
2762var StrictMode = 1; // TODO: Remove BlockingMode and ConcurrentMode by reading from the root
2763// tag instead
2764
2765var BlockingMode = 2;
2766var ConcurrentMode = 4;
2767var ProfileMode = 8;
2768var DebugTracingMode = 16;
2769
2770var ReactCurrentBatchConfig = ReactSharedInternals.ReactCurrentBatchConfig;
2771var NoTransition = 0;
2772function requestCurrentTransition() {
2773 return ReactCurrentBatchConfig.transition;
2774}
2775
2776/**
2777 * inlined Object.is polyfill to avoid requiring consumers ship their own
2778 * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
2779 */
2780function is(x, y) {
2781 return x === y && (x !== 0 || 1 / x === 1 / y) || x !== x && y !== y // eslint-disable-line no-self-compare
2782 ;
2783}
2784
2785var objectIs = typeof Object.is === 'function' ? Object.is : is;
2786
2787var hasOwnProperty = Object.prototype.hasOwnProperty;
2788/**
2789 * Performs equality by iterating through keys on an object and returning false
2790 * when any key has values which are not strictly equal between the arguments.
2791 * Returns true when the values of all keys are strictly equal.
2792 */
2793
2794function shallowEqual(objA, objB) {
2795 if (objectIs(objA, objB)) {
2796 return true;
2797 }
2798
2799 if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) {
2800 return false;
2801 }
2802
2803 var keysA = Object.keys(objA);
2804 var keysB = Object.keys(objB);
2805
2806 if (keysA.length !== keysB.length) {
2807 return false;
2808 } // Test for A's keys different from B.
2809
2810
2811 for (var i = 0; i < keysA.length; i++) {
2812 if (!hasOwnProperty.call(objB, keysA[i]) || !objectIs(objA[keysA[i]], objB[keysA[i]])) {
2813 return false;
2814 }
2815 }
2816
2817 return true;
2818}
2819
2820function describeFiber(fiber) {
2821 var owner = fiber._debugOwner ? fiber._debugOwner.type : null ;
2822 var source = fiber._debugSource ;
2823
2824 switch (fiber.tag) {
2825 case HostComponent:
2826 return describeBuiltInComponentFrame(fiber.type);
2827
2828 case LazyComponent:
2829 return describeBuiltInComponentFrame('Lazy');
2830
2831 case SuspenseComponent:
2832 return describeBuiltInComponentFrame('Suspense');
2833
2834 case SuspenseListComponent:
2835 return describeBuiltInComponentFrame('SuspenseList');
2836
2837 case FunctionComponent:
2838 case IndeterminateComponent:
2839 case SimpleMemoComponent:
2840 return describeFunctionComponentFrame(fiber.type);
2841
2842 case ForwardRef:
2843 return describeFunctionComponentFrame(fiber.type.render);
2844
2845 case Block:
2846 return describeFunctionComponentFrame(fiber.type._render);
2847
2848 case ClassComponent:
2849 return describeClassComponentFrame(fiber.type);
2850
2851 default:
2852 return '';
2853 }
2854}
2855
2856function getStackByFiberInDevAndProd(workInProgress) {
2857 try {
2858 var info = '';
2859 var node = workInProgress;
2860
2861 do {
2862 info += describeFiber(node);
2863 node = node.return;
2864 } while (node);
2865
2866 return info;
2867 } catch (x) {
2868 return '\nError generating stack: ' + x.message + '\n' + x.stack;
2869 }
2870}
2871
2872var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame;
2873var current = null;
2874var isRendering = false;
2875function getCurrentFiberOwnerNameInDevOrNull() {
2876 {
2877 if (current === null) {
2878 return null;
2879 }
2880
2881 var owner = current._debugOwner;
2882
2883 if (owner !== null && typeof owner !== 'undefined') {
2884 return getComponentName(owner.type);
2885 }
2886 }
2887
2888 return null;
2889}
2890
2891function getCurrentFiberStackInDev() {
2892 {
2893 if (current === null) {
2894 return '';
2895 } // Safe because if current fiber exists, we are reconciling,
2896 // and it is guaranteed to be the work-in-progress version.
2897
2898
2899 return getStackByFiberInDevAndProd(current);
2900 }
2901}
2902
2903function resetCurrentFiber() {
2904 {
2905 ReactDebugCurrentFrame$1.getCurrentStack = null;
2906 current = null;
2907 isRendering = false;
2908 }
2909}
2910function setCurrentFiber(fiber) {
2911 {
2912 ReactDebugCurrentFrame$1.getCurrentStack = getCurrentFiberStackInDev;
2913 current = fiber;
2914 isRendering = false;
2915 }
2916}
2917function setIsRendering(rendering) {
2918 {
2919 isRendering = rendering;
2920 }
2921}
2922function getIsRendering() {
2923 {
2924 return isRendering;
2925 }
2926}
2927
2928var ReactStrictModeWarnings = {
2929 recordUnsafeLifecycleWarnings: function (fiber, instance) {},
2930 flushPendingUnsafeLifecycleWarnings: function () {},
2931 recordLegacyContextWarning: function (fiber, instance) {},
2932 flushLegacyContextWarning: function () {},
2933 discardPendingWarnings: function () {}
2934};
2935
2936{
2937 var findStrictRoot = function (fiber) {
2938 var maybeStrictRoot = null;
2939 var node = fiber;
2940
2941 while (node !== null) {
2942 if (node.mode & StrictMode) {
2943 maybeStrictRoot = node;
2944 }
2945
2946 node = node.return;
2947 }
2948
2949 return maybeStrictRoot;
2950 };
2951
2952 var setToSortedString = function (set) {
2953 var array = [];
2954 set.forEach(function (value) {
2955 array.push(value);
2956 });
2957 return array.sort().join(', ');
2958 };
2959
2960 var pendingComponentWillMountWarnings = [];
2961 var pendingUNSAFE_ComponentWillMountWarnings = [];
2962 var pendingComponentWillReceivePropsWarnings = [];
2963 var pendingUNSAFE_ComponentWillReceivePropsWarnings = [];
2964 var pendingComponentWillUpdateWarnings = [];
2965 var pendingUNSAFE_ComponentWillUpdateWarnings = []; // Tracks components we have already warned about.
2966
2967 var didWarnAboutUnsafeLifecycles = new Set();
2968
2969 ReactStrictModeWarnings.recordUnsafeLifecycleWarnings = function (fiber, instance) {
2970 // Dedup strategy: Warn once per component.
2971 if (didWarnAboutUnsafeLifecycles.has(fiber.type)) {
2972 return;
2973 }
2974
2975 if (typeof instance.componentWillMount === 'function' && // Don't warn about react-lifecycles-compat polyfilled components.
2976 instance.componentWillMount.__suppressDeprecationWarning !== true) {
2977 pendingComponentWillMountWarnings.push(fiber);
2978 }
2979
2980 if (fiber.mode & StrictMode && typeof instance.UNSAFE_componentWillMount === 'function') {
2981 pendingUNSAFE_ComponentWillMountWarnings.push(fiber);
2982 }
2983
2984 if (typeof instance.componentWillReceiveProps === 'function' && instance.componentWillReceiveProps.__suppressDeprecationWarning !== true) {
2985 pendingComponentWillReceivePropsWarnings.push(fiber);
2986 }
2987
2988 if (fiber.mode & StrictMode && typeof instance.UNSAFE_componentWillReceiveProps === 'function') {
2989 pendingUNSAFE_ComponentWillReceivePropsWarnings.push(fiber);
2990 }
2991
2992 if (typeof instance.componentWillUpdate === 'function' && instance.componentWillUpdate.__suppressDeprecationWarning !== true) {
2993 pendingComponentWillUpdateWarnings.push(fiber);
2994 }
2995
2996 if (fiber.mode & StrictMode && typeof instance.UNSAFE_componentWillUpdate === 'function') {
2997 pendingUNSAFE_ComponentWillUpdateWarnings.push(fiber);
2998 }
2999 };
3000
3001 ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings = function () {
3002 // We do an initial pass to gather component names
3003 var componentWillMountUniqueNames = new Set();
3004
3005 if (pendingComponentWillMountWarnings.length > 0) {
3006 pendingComponentWillMountWarnings.forEach(function (fiber) {
3007 componentWillMountUniqueNames.add(getComponentName(fiber.type) || 'Component');
3008 didWarnAboutUnsafeLifecycles.add(fiber.type);
3009 });
3010 pendingComponentWillMountWarnings = [];
3011 }
3012
3013 var UNSAFE_componentWillMountUniqueNames = new Set();
3014
3015 if (pendingUNSAFE_ComponentWillMountWarnings.length > 0) {
3016 pendingUNSAFE_ComponentWillMountWarnings.forEach(function (fiber) {
3017 UNSAFE_componentWillMountUniqueNames.add(getComponentName(fiber.type) || 'Component');
3018 didWarnAboutUnsafeLifecycles.add(fiber.type);
3019 });
3020 pendingUNSAFE_ComponentWillMountWarnings = [];
3021 }
3022
3023 var componentWillReceivePropsUniqueNames = new Set();
3024
3025 if (pendingComponentWillReceivePropsWarnings.length > 0) {
3026 pendingComponentWillReceivePropsWarnings.forEach(function (fiber) {
3027 componentWillReceivePropsUniqueNames.add(getComponentName(fiber.type) || 'Component');
3028 didWarnAboutUnsafeLifecycles.add(fiber.type);
3029 });
3030 pendingComponentWillReceivePropsWarnings = [];
3031 }
3032
3033 var UNSAFE_componentWillReceivePropsUniqueNames = new Set();
3034
3035 if (pendingUNSAFE_ComponentWillReceivePropsWarnings.length > 0) {
3036 pendingUNSAFE_ComponentWillReceivePropsWarnings.forEach(function (fiber) {
3037 UNSAFE_componentWillReceivePropsUniqueNames.add(getComponentName(fiber.type) || 'Component');
3038 didWarnAboutUnsafeLifecycles.add(fiber.type);
3039 });
3040 pendingUNSAFE_ComponentWillReceivePropsWarnings = [];
3041 }
3042
3043 var componentWillUpdateUniqueNames = new Set();
3044
3045 if (pendingComponentWillUpdateWarnings.length > 0) {
3046 pendingComponentWillUpdateWarnings.forEach(function (fiber) {
3047 componentWillUpdateUniqueNames.add(getComponentName(fiber.type) || 'Component');
3048 didWarnAboutUnsafeLifecycles.add(fiber.type);
3049 });
3050 pendingComponentWillUpdateWarnings = [];
3051 }
3052
3053 var UNSAFE_componentWillUpdateUniqueNames = new Set();
3054
3055 if (pendingUNSAFE_ComponentWillUpdateWarnings.length > 0) {
3056 pendingUNSAFE_ComponentWillUpdateWarnings.forEach(function (fiber) {
3057 UNSAFE_componentWillUpdateUniqueNames.add(getComponentName(fiber.type) || 'Component');
3058 didWarnAboutUnsafeLifecycles.add(fiber.type);
3059 });
3060 pendingUNSAFE_ComponentWillUpdateWarnings = [];
3061 } // Finally, we flush all the warnings
3062 // UNSAFE_ ones before the deprecated ones, since they'll be 'louder'
3063
3064
3065 if (UNSAFE_componentWillMountUniqueNames.size > 0) {
3066 var sortedNames = setToSortedString(UNSAFE_componentWillMountUniqueNames);
3067
3068 error('Using UNSAFE_componentWillMount in strict mode is not recommended and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move code with side effects to componentDidMount, and set initial state in the constructor.\n' + '\nPlease update the following components: %s', sortedNames);
3069 }
3070
3071 if (UNSAFE_componentWillReceivePropsUniqueNames.size > 0) {
3072 var _sortedNames = setToSortedString(UNSAFE_componentWillReceivePropsUniqueNames);
3073
3074 error('Using UNSAFE_componentWillReceiveProps in strict mode is not recommended ' + 'and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + "* If you're updating state whenever props change, " + 'refactor your code to use memoization techniques or move it to ' + 'static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state\n' + '\nPlease update the following components: %s', _sortedNames);
3075 }
3076
3077 if (UNSAFE_componentWillUpdateUniqueNames.size > 0) {
3078 var _sortedNames2 = setToSortedString(UNSAFE_componentWillUpdateUniqueNames);
3079
3080 error('Using UNSAFE_componentWillUpdate in strict mode is not recommended ' + 'and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + '\nPlease update the following components: %s', _sortedNames2);
3081 }
3082
3083 if (componentWillMountUniqueNames.size > 0) {
3084 var _sortedNames3 = setToSortedString(componentWillMountUniqueNames);
3085
3086 warn('componentWillMount has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move code with side effects to componentDidMount, and set initial state in the constructor.\n' + '* Rename componentWillMount to UNSAFE_componentWillMount to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames3);
3087 }
3088
3089 if (componentWillReceivePropsUniqueNames.size > 0) {
3090 var _sortedNames4 = setToSortedString(componentWillReceivePropsUniqueNames);
3091
3092 warn('componentWillReceiveProps has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + "* If you're updating state whenever props change, refactor your " + 'code to use memoization techniques or move it to ' + 'static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state\n' + '* Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames4);
3093 }
3094
3095 if (componentWillUpdateUniqueNames.size > 0) {
3096 var _sortedNames5 = setToSortedString(componentWillUpdateUniqueNames);
3097
3098 warn('componentWillUpdate has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + '* Rename componentWillUpdate to UNSAFE_componentWillUpdate to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames5);
3099 }
3100 };
3101
3102 var pendingLegacyContextWarning = new Map(); // Tracks components we have already warned about.
3103
3104 var didWarnAboutLegacyContext = new Set();
3105
3106 ReactStrictModeWarnings.recordLegacyContextWarning = function (fiber, instance) {
3107 var strictRoot = findStrictRoot(fiber);
3108
3109 if (strictRoot === null) {
3110 error('Expected to find a StrictMode component in a strict mode tree. ' + 'This error is likely caused by a bug in React. Please file an issue.');
3111
3112 return;
3113 } // Dedup strategy: Warn once per component.
3114
3115
3116 if (didWarnAboutLegacyContext.has(fiber.type)) {
3117 return;
3118 }
3119
3120 var warningsForRoot = pendingLegacyContextWarning.get(strictRoot);
3121
3122 if (fiber.type.contextTypes != null || fiber.type.childContextTypes != null || instance !== null && typeof instance.getChildContext === 'function') {
3123 if (warningsForRoot === undefined) {
3124 warningsForRoot = [];
3125 pendingLegacyContextWarning.set(strictRoot, warningsForRoot);
3126 }
3127
3128 warningsForRoot.push(fiber);
3129 }
3130 };
3131
3132 ReactStrictModeWarnings.flushLegacyContextWarning = function () {
3133 pendingLegacyContextWarning.forEach(function (fiberArray, strictRoot) {
3134 if (fiberArray.length === 0) {
3135 return;
3136 }
3137
3138 var firstFiber = fiberArray[0];
3139 var uniqueNames = new Set();
3140 fiberArray.forEach(function (fiber) {
3141 uniqueNames.add(getComponentName(fiber.type) || 'Component');
3142 didWarnAboutLegacyContext.add(fiber.type);
3143 });
3144 var sortedNames = setToSortedString(uniqueNames);
3145
3146 try {
3147 setCurrentFiber(firstFiber);
3148
3149 error('Legacy context API has been detected within a strict-mode tree.' + '\n\nThe old API will be supported in all 16.x releases, but applications ' + 'using it should migrate to the new version.' + '\n\nPlease update the following components: %s' + '\n\nLearn more about this warning here: https://reactjs.org/link/legacy-context', sortedNames);
3150 } finally {
3151 resetCurrentFiber();
3152 }
3153 });
3154 };
3155
3156 ReactStrictModeWarnings.discardPendingWarnings = function () {
3157 pendingComponentWillMountWarnings = [];
3158 pendingUNSAFE_ComponentWillMountWarnings = [];
3159 pendingComponentWillReceivePropsWarnings = [];
3160 pendingUNSAFE_ComponentWillReceivePropsWarnings = [];
3161 pendingComponentWillUpdateWarnings = [];
3162 pendingUNSAFE_ComponentWillUpdateWarnings = [];
3163 pendingLegacyContextWarning = new Map();
3164 };
3165}
3166
3167function resolveDefaultProps(Component, baseProps) {
3168 if (Component && Component.defaultProps) {
3169 // Resolve default props. Taken from ReactElement
3170 var props = _assign({}, baseProps);
3171
3172 var defaultProps = Component.defaultProps;
3173
3174 for (var propName in defaultProps) {
3175 if (props[propName] === undefined) {
3176 props[propName] = defaultProps[propName];
3177 }
3178 }
3179
3180 return props;
3181 }
3182
3183 return baseProps;
3184}
3185
3186// Max 31 bit integer. The max integer size in V8 for 32-bit systems.
3187// Math.pow(2, 30) - 1
3188// 0b111111111111111111111111111111
3189var MAX_SIGNED_31_BIT_INT = 1073741823;
3190
3191var valueCursor = createCursor(null);
3192var rendererSigil;
3193
3194{
3195 // Use this to detect multiple renderers using the same context
3196 rendererSigil = {};
3197}
3198
3199var currentlyRenderingFiber = null;
3200var lastContextDependency = null;
3201var lastContextWithAllBitsObserved = null;
3202var isDisallowedContextReadInDEV = false;
3203function resetContextDependencies() {
3204 // This is called right before React yields execution, to ensure `readContext`
3205 // cannot be called outside the render phase.
3206 currentlyRenderingFiber = null;
3207 lastContextDependency = null;
3208 lastContextWithAllBitsObserved = null;
3209
3210 {
3211 isDisallowedContextReadInDEV = false;
3212 }
3213}
3214function enterDisallowedContextReadInDEV() {
3215 {
3216 isDisallowedContextReadInDEV = true;
3217 }
3218}
3219function exitDisallowedContextReadInDEV() {
3220 {
3221 isDisallowedContextReadInDEV = false;
3222 }
3223}
3224function pushProvider(providerFiber, nextValue) {
3225 var context = providerFiber.type._context;
3226
3227 {
3228 push(valueCursor, context._currentValue2, providerFiber);
3229 context._currentValue2 = nextValue;
3230
3231 {
3232 if (context._currentRenderer2 !== undefined && context._currentRenderer2 !== null && context._currentRenderer2 !== rendererSigil) {
3233 error('Detected multiple renderers concurrently rendering the ' + 'same context provider. This is currently unsupported.');
3234 }
3235
3236 context._currentRenderer2 = rendererSigil;
3237 }
3238 }
3239}
3240function popProvider(providerFiber) {
3241 var currentValue = valueCursor.current;
3242 pop(valueCursor, providerFiber);
3243 var context = providerFiber.type._context;
3244
3245 {
3246 context._currentValue2 = currentValue;
3247 }
3248}
3249function calculateChangedBits(context, newValue, oldValue) {
3250 if (objectIs(oldValue, newValue)) {
3251 // No change
3252 return 0;
3253 } else {
3254 var changedBits = typeof context._calculateChangedBits === 'function' ? context._calculateChangedBits(oldValue, newValue) : MAX_SIGNED_31_BIT_INT;
3255
3256 {
3257 if ((changedBits & MAX_SIGNED_31_BIT_INT) !== changedBits) {
3258 error('calculateChangedBits: Expected the return value to be a ' + '31-bit integer. Instead received: %s', changedBits);
3259 }
3260 }
3261
3262 return changedBits | 0;
3263 }
3264}
3265function scheduleWorkOnParentPath(parent, renderLanes) {
3266 // Update the child lanes of all the ancestors, including the alternates.
3267 var node = parent;
3268
3269 while (node !== null) {
3270 var alternate = node.alternate;
3271
3272 if (!isSubsetOfLanes(node.childLanes, renderLanes)) {
3273 node.childLanes = mergeLanes(node.childLanes, renderLanes);
3274
3275 if (alternate !== null) {
3276 alternate.childLanes = mergeLanes(alternate.childLanes, renderLanes);
3277 }
3278 } else if (alternate !== null && !isSubsetOfLanes(alternate.childLanes, renderLanes)) {
3279 alternate.childLanes = mergeLanes(alternate.childLanes, renderLanes);
3280 } else {
3281 // Neither alternate was updated, which means the rest of the
3282 // ancestor path already has sufficient priority.
3283 break;
3284 }
3285
3286 node = node.return;
3287 }
3288}
3289function propagateContextChange(workInProgress, context, changedBits, renderLanes) {
3290 var fiber = workInProgress.child;
3291
3292 if (fiber !== null) {
3293 // Set the return pointer of the child to the work-in-progress fiber.
3294 fiber.return = workInProgress;
3295 }
3296
3297 while (fiber !== null) {
3298 var nextFiber = void 0; // Visit this fiber.
3299
3300 var list = fiber.dependencies;
3301
3302 if (list !== null) {
3303 nextFiber = fiber.child;
3304 var dependency = list.firstContext;
3305
3306 while (dependency !== null) {
3307 // Check if the context matches.
3308 if (dependency.context === context && (dependency.observedBits & changedBits) !== 0) {
3309 // Match! Schedule an update on this fiber.
3310 if (fiber.tag === ClassComponent) {
3311 // Schedule a force update on the work-in-progress.
3312 var update = createUpdate(NoTimestamp, pickArbitraryLane(renderLanes));
3313 update.tag = ForceUpdate; // TODO: Because we don't have a work-in-progress, this will add the
3314 // update to the current fiber, too, which means it will persist even if
3315 // this render is thrown away. Since it's a race condition, not sure it's
3316 // worth fixing.
3317
3318 enqueueUpdate(fiber, update);
3319 }
3320
3321 fiber.lanes = mergeLanes(fiber.lanes, renderLanes);
3322 var alternate = fiber.alternate;
3323
3324 if (alternate !== null) {
3325 alternate.lanes = mergeLanes(alternate.lanes, renderLanes);
3326 }
3327
3328 scheduleWorkOnParentPath(fiber.return, renderLanes); // Mark the updated lanes on the list, too.
3329
3330 list.lanes = mergeLanes(list.lanes, renderLanes); // Since we already found a match, we can stop traversing the
3331 // dependency list.
3332
3333 break;
3334 }
3335
3336 dependency = dependency.next;
3337 }
3338 } else if (fiber.tag === ContextProvider) {
3339 // Don't scan deeper if this is a matching provider
3340 nextFiber = fiber.type === workInProgress.type ? null : fiber.child;
3341 } else {
3342 // Traverse down.
3343 nextFiber = fiber.child;
3344 }
3345
3346 if (nextFiber !== null) {
3347 // Set the return pointer of the child to the work-in-progress fiber.
3348 nextFiber.return = fiber;
3349 } else {
3350 // No child. Traverse to next sibling.
3351 nextFiber = fiber;
3352
3353 while (nextFiber !== null) {
3354 if (nextFiber === workInProgress) {
3355 // We're back to the root of this subtree. Exit.
3356 nextFiber = null;
3357 break;
3358 }
3359
3360 var sibling = nextFiber.sibling;
3361
3362 if (sibling !== null) {
3363 // Set the return pointer of the sibling to the work-in-progress fiber.
3364 sibling.return = nextFiber.return;
3365 nextFiber = sibling;
3366 break;
3367 } // No more siblings. Traverse up.
3368
3369
3370 nextFiber = nextFiber.return;
3371 }
3372 }
3373
3374 fiber = nextFiber;
3375 }
3376}
3377function prepareToReadContext(workInProgress, renderLanes) {
3378 currentlyRenderingFiber = workInProgress;
3379 lastContextDependency = null;
3380 lastContextWithAllBitsObserved = null;
3381 var dependencies = workInProgress.dependencies;
3382
3383 if (dependencies !== null) {
3384 var firstContext = dependencies.firstContext;
3385
3386 if (firstContext !== null) {
3387 if (includesSomeLane(dependencies.lanes, renderLanes)) {
3388 // Context list has a pending update. Mark that this fiber performed work.
3389 markWorkInProgressReceivedUpdate();
3390 } // Reset the work-in-progress list
3391
3392
3393 dependencies.firstContext = null;
3394 }
3395 }
3396}
3397function readContext(context, observedBits) {
3398 {
3399 // This warning would fire if you read context inside a Hook like useMemo.
3400 // Unlike the class check below, it's not enforced in production for perf.
3401 if (isDisallowedContextReadInDEV) {
3402 error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().');
3403 }
3404 }
3405
3406 if (lastContextWithAllBitsObserved === context) ; else if (observedBits === false || observedBits === 0) ; else {
3407 var resolvedObservedBits; // Avoid deopting on observable arguments or heterogeneous types.
3408
3409 if (typeof observedBits !== 'number' || observedBits === MAX_SIGNED_31_BIT_INT) {
3410 // Observe all updates.
3411 lastContextWithAllBitsObserved = context;
3412 resolvedObservedBits = MAX_SIGNED_31_BIT_INT;
3413 } else {
3414 resolvedObservedBits = observedBits;
3415 }
3416
3417 var contextItem = {
3418 context: context,
3419 observedBits: resolvedObservedBits,
3420 next: null
3421 };
3422
3423 if (lastContextDependency === null) {
3424 if (!(currentlyRenderingFiber !== null)) {
3425 {
3426 throw Error( "Context can only be read while React is rendering. In classes, you can read it in the render method or getDerivedStateFromProps. In function components, you can read it directly in the function body, but not inside Hooks like useReducer() or useMemo()." );
3427 }
3428 } // This is the first dependency for this component. Create a new list.
3429
3430
3431 lastContextDependency = contextItem;
3432 currentlyRenderingFiber.dependencies = {
3433 lanes: NoLanes,
3434 firstContext: contextItem,
3435 responders: null
3436 };
3437 } else {
3438 // Append a new context item.
3439 lastContextDependency = lastContextDependency.next = contextItem;
3440 }
3441 }
3442
3443 return context._currentValue2;
3444}
3445
3446var UpdateState = 0;
3447var ReplaceState = 1;
3448var ForceUpdate = 2;
3449var CaptureUpdate = 3; // Global state that is reset at the beginning of calling `processUpdateQueue`.
3450// It should only be read right after calling `processUpdateQueue`, via
3451// `checkHasForceUpdateAfterProcessing`.
3452
3453var hasForceUpdate = false;
3454var didWarnUpdateInsideUpdate;
3455var currentlyProcessingQueue;
3456
3457{
3458 didWarnUpdateInsideUpdate = false;
3459 currentlyProcessingQueue = null;
3460}
3461
3462function initializeUpdateQueue(fiber) {
3463 var queue = {
3464 baseState: fiber.memoizedState,
3465 firstBaseUpdate: null,
3466 lastBaseUpdate: null,
3467 shared: {
3468 pending: null
3469 },
3470 effects: null
3471 };
3472 fiber.updateQueue = queue;
3473}
3474function cloneUpdateQueue(current, workInProgress) {
3475 // Clone the update queue from current. Unless it's already a clone.
3476 var queue = workInProgress.updateQueue;
3477 var currentQueue = current.updateQueue;
3478
3479 if (queue === currentQueue) {
3480 var clone = {
3481 baseState: currentQueue.baseState,
3482 firstBaseUpdate: currentQueue.firstBaseUpdate,
3483 lastBaseUpdate: currentQueue.lastBaseUpdate,
3484 shared: currentQueue.shared,
3485 effects: currentQueue.effects
3486 };
3487 workInProgress.updateQueue = clone;
3488 }
3489}
3490function createUpdate(eventTime, lane) {
3491 var update = {
3492 eventTime: eventTime,
3493 lane: lane,
3494 tag: UpdateState,
3495 payload: null,
3496 callback: null,
3497 next: null
3498 };
3499 return update;
3500}
3501function enqueueUpdate(fiber, update) {
3502 var updateQueue = fiber.updateQueue;
3503
3504 if (updateQueue === null) {
3505 // Only occurs if the fiber has been unmounted.
3506 return;
3507 }
3508
3509 var sharedQueue = updateQueue.shared;
3510 var pending = sharedQueue.pending;
3511
3512 if (pending === null) {
3513 // This is the first update. Create a circular list.
3514 update.next = update;
3515 } else {
3516 update.next = pending.next;
3517 pending.next = update;
3518 }
3519
3520 sharedQueue.pending = update;
3521
3522 {
3523 if (currentlyProcessingQueue === sharedQueue && !didWarnUpdateInsideUpdate) {
3524 error('An update (setState, replaceState, or forceUpdate) was scheduled ' + 'from inside an update function. Update functions should be pure, ' + 'with zero side-effects. Consider using componentDidUpdate or a ' + 'callback.');
3525
3526 didWarnUpdateInsideUpdate = true;
3527 }
3528 }
3529}
3530function enqueueCapturedUpdate(workInProgress, capturedUpdate) {
3531 // Captured updates are updates that are thrown by a child during the render
3532 // phase. They should be discarded if the render is aborted. Therefore,
3533 // we should only put them on the work-in-progress queue, not the current one.
3534 var queue = workInProgress.updateQueue; // Check if the work-in-progress queue is a clone.
3535
3536 var current = workInProgress.alternate;
3537
3538 if (current !== null) {
3539 var currentQueue = current.updateQueue;
3540
3541 if (queue === currentQueue) {
3542 // The work-in-progress queue is the same as current. This happens when
3543 // we bail out on a parent fiber that then captures an error thrown by
3544 // a child. Since we want to append the update only to the work-in
3545 // -progress queue, we need to clone the updates. We usually clone during
3546 // processUpdateQueue, but that didn't happen in this case because we
3547 // skipped over the parent when we bailed out.
3548 var newFirst = null;
3549 var newLast = null;
3550 var firstBaseUpdate = queue.firstBaseUpdate;
3551
3552 if (firstBaseUpdate !== null) {
3553 // Loop through the updates and clone them.
3554 var update = firstBaseUpdate;
3555
3556 do {
3557 var clone = {
3558 eventTime: update.eventTime,
3559 lane: update.lane,
3560 tag: update.tag,
3561 payload: update.payload,
3562 callback: update.callback,
3563 next: null
3564 };
3565
3566 if (newLast === null) {
3567 newFirst = newLast = clone;
3568 } else {
3569 newLast.next = clone;
3570 newLast = clone;
3571 }
3572
3573 update = update.next;
3574 } while (update !== null); // Append the captured update the end of the cloned list.
3575
3576
3577 if (newLast === null) {
3578 newFirst = newLast = capturedUpdate;
3579 } else {
3580 newLast.next = capturedUpdate;
3581 newLast = capturedUpdate;
3582 }
3583 } else {
3584 // There are no base updates.
3585 newFirst = newLast = capturedUpdate;
3586 }
3587
3588 queue = {
3589 baseState: currentQueue.baseState,
3590 firstBaseUpdate: newFirst,
3591 lastBaseUpdate: newLast,
3592 shared: currentQueue.shared,
3593 effects: currentQueue.effects
3594 };
3595 workInProgress.updateQueue = queue;
3596 return;
3597 }
3598 } // Append the update to the end of the list.
3599
3600
3601 var lastBaseUpdate = queue.lastBaseUpdate;
3602
3603 if (lastBaseUpdate === null) {
3604 queue.firstBaseUpdate = capturedUpdate;
3605 } else {
3606 lastBaseUpdate.next = capturedUpdate;
3607 }
3608
3609 queue.lastBaseUpdate = capturedUpdate;
3610}
3611
3612function getStateFromUpdate(workInProgress, queue, update, prevState, nextProps, instance) {
3613 switch (update.tag) {
3614 case ReplaceState:
3615 {
3616 var payload = update.payload;
3617
3618 if (typeof payload === 'function') {
3619 // Updater function
3620 {
3621 enterDisallowedContextReadInDEV();
3622 }
3623
3624 var nextState = payload.call(instance, prevState, nextProps);
3625
3626 {
3627 if ( workInProgress.mode & StrictMode) {
3628 disableLogs();
3629
3630 try {
3631 payload.call(instance, prevState, nextProps);
3632 } finally {
3633 reenableLogs();
3634 }
3635 }
3636
3637 exitDisallowedContextReadInDEV();
3638 }
3639
3640 return nextState;
3641 } // State object
3642
3643
3644 return payload;
3645 }
3646
3647 case CaptureUpdate:
3648 {
3649 workInProgress.flags = workInProgress.flags & ~ShouldCapture | DidCapture;
3650 }
3651 // Intentional fallthrough
3652
3653 case UpdateState:
3654 {
3655 var _payload = update.payload;
3656 var partialState;
3657
3658 if (typeof _payload === 'function') {
3659 // Updater function
3660 {
3661 enterDisallowedContextReadInDEV();
3662 }
3663
3664 partialState = _payload.call(instance, prevState, nextProps);
3665
3666 {
3667 if ( workInProgress.mode & StrictMode) {
3668 disableLogs();
3669
3670 try {
3671 _payload.call(instance, prevState, nextProps);
3672 } finally {
3673 reenableLogs();
3674 }
3675 }
3676
3677 exitDisallowedContextReadInDEV();
3678 }
3679 } else {
3680 // Partial state object
3681 partialState = _payload;
3682 }
3683
3684 if (partialState === null || partialState === undefined) {
3685 // Null and undefined are treated as no-ops.
3686 return prevState;
3687 } // Merge the partial state and the previous state.
3688
3689
3690 return _assign({}, prevState, partialState);
3691 }
3692
3693 case ForceUpdate:
3694 {
3695 hasForceUpdate = true;
3696 return prevState;
3697 }
3698 }
3699
3700 return prevState;
3701}
3702
3703function processUpdateQueue(workInProgress, props, instance, renderLanes) {
3704 // This is always non-null on a ClassComponent or HostRoot
3705 var queue = workInProgress.updateQueue;
3706 hasForceUpdate = false;
3707
3708 {
3709 currentlyProcessingQueue = queue.shared;
3710 }
3711
3712 var firstBaseUpdate = queue.firstBaseUpdate;
3713 var lastBaseUpdate = queue.lastBaseUpdate; // Check if there are pending updates. If so, transfer them to the base queue.
3714
3715 var pendingQueue = queue.shared.pending;
3716
3717 if (pendingQueue !== null) {
3718 queue.shared.pending = null; // The pending queue is circular. Disconnect the pointer between first
3719 // and last so that it's non-circular.
3720
3721 var lastPendingUpdate = pendingQueue;
3722 var firstPendingUpdate = lastPendingUpdate.next;
3723 lastPendingUpdate.next = null; // Append pending updates to base queue
3724
3725 if (lastBaseUpdate === null) {
3726 firstBaseUpdate = firstPendingUpdate;
3727 } else {
3728 lastBaseUpdate.next = firstPendingUpdate;
3729 }
3730
3731 lastBaseUpdate = lastPendingUpdate; // If there's a current queue, and it's different from the base queue, then
3732 // we need to transfer the updates to that queue, too. Because the base
3733 // queue is a singly-linked list with no cycles, we can append to both
3734 // lists and take advantage of structural sharing.
3735 // TODO: Pass `current` as argument
3736
3737 var current = workInProgress.alternate;
3738
3739 if (current !== null) {
3740 // This is always non-null on a ClassComponent or HostRoot
3741 var currentQueue = current.updateQueue;
3742 var currentLastBaseUpdate = currentQueue.lastBaseUpdate;
3743
3744 if (currentLastBaseUpdate !== lastBaseUpdate) {
3745 if (currentLastBaseUpdate === null) {
3746 currentQueue.firstBaseUpdate = firstPendingUpdate;
3747 } else {
3748 currentLastBaseUpdate.next = firstPendingUpdate;
3749 }
3750
3751 currentQueue.lastBaseUpdate = lastPendingUpdate;
3752 }
3753 }
3754 } // These values may change as we process the queue.
3755
3756
3757 if (firstBaseUpdate !== null) {
3758 // Iterate through the list of updates to compute the result.
3759 var newState = queue.baseState; // TODO: Don't need to accumulate this. Instead, we can remove renderLanes
3760 // from the original lanes.
3761
3762 var newLanes = NoLanes;
3763 var newBaseState = null;
3764 var newFirstBaseUpdate = null;
3765 var newLastBaseUpdate = null;
3766 var update = firstBaseUpdate;
3767
3768 do {
3769 var updateLane = update.lane;
3770 var updateEventTime = update.eventTime;
3771
3772 if (!isSubsetOfLanes(renderLanes, updateLane)) {
3773 // Priority is insufficient. Skip this update. If this is the first
3774 // skipped update, the previous update/state is the new base
3775 // update/state.
3776 var clone = {
3777 eventTime: updateEventTime,
3778 lane: updateLane,
3779 tag: update.tag,
3780 payload: update.payload,
3781 callback: update.callback,
3782 next: null
3783 };
3784
3785 if (newLastBaseUpdate === null) {
3786 newFirstBaseUpdate = newLastBaseUpdate = clone;
3787 newBaseState = newState;
3788 } else {
3789 newLastBaseUpdate = newLastBaseUpdate.next = clone;
3790 } // Update the remaining priority in the queue.
3791
3792
3793 newLanes = mergeLanes(newLanes, updateLane);
3794 } else {
3795 // This update does have sufficient priority.
3796 if (newLastBaseUpdate !== null) {
3797 var _clone = {
3798 eventTime: updateEventTime,
3799 // This update is going to be committed so we never want uncommit
3800 // it. Using NoLane works because 0 is a subset of all bitmasks, so
3801 // this will never be skipped by the check above.
3802 lane: NoLane,
3803 tag: update.tag,
3804 payload: update.payload,
3805 callback: update.callback,
3806 next: null
3807 };
3808 newLastBaseUpdate = newLastBaseUpdate.next = _clone;
3809 } // Process this update.
3810
3811
3812 newState = getStateFromUpdate(workInProgress, queue, update, newState, props, instance);
3813 var callback = update.callback;
3814
3815 if (callback !== null) {
3816 workInProgress.flags |= Callback;
3817 var effects = queue.effects;
3818
3819 if (effects === null) {
3820 queue.effects = [update];
3821 } else {
3822 effects.push(update);
3823 }
3824 }
3825 }
3826
3827 update = update.next;
3828
3829 if (update === null) {
3830 pendingQueue = queue.shared.pending;
3831
3832 if (pendingQueue === null) {
3833 break;
3834 } else {
3835 // An update was scheduled from inside a reducer. Add the new
3836 // pending updates to the end of the list and keep processing.
3837 var _lastPendingUpdate = pendingQueue; // Intentionally unsound. Pending updates form a circular list, but we
3838 // unravel them when transferring them to the base queue.
3839
3840 var _firstPendingUpdate = _lastPendingUpdate.next;
3841 _lastPendingUpdate.next = null;
3842 update = _firstPendingUpdate;
3843 queue.lastBaseUpdate = _lastPendingUpdate;
3844 queue.shared.pending = null;
3845 }
3846 }
3847 } while (true);
3848
3849 if (newLastBaseUpdate === null) {
3850 newBaseState = newState;
3851 }
3852
3853 queue.baseState = newBaseState;
3854 queue.firstBaseUpdate = newFirstBaseUpdate;
3855 queue.lastBaseUpdate = newLastBaseUpdate; // Set the remaining expiration time to be whatever is remaining in the queue.
3856 // This should be fine because the only two other things that contribute to
3857 // expiration time are props and context. We're already in the middle of the
3858 // begin phase by the time we start processing the queue, so we've already
3859 // dealt with the props. Context in components that specify
3860 // shouldComponentUpdate is tricky; but we'll have to account for
3861 // that regardless.
3862
3863 markSkippedUpdateLanes(newLanes);
3864 workInProgress.lanes = newLanes;
3865 workInProgress.memoizedState = newState;
3866 }
3867
3868 {
3869 currentlyProcessingQueue = null;
3870 }
3871}
3872
3873function callCallback(callback, context) {
3874 if (!(typeof callback === 'function')) {
3875 {
3876 throw Error( "Invalid argument passed as callback. Expected a function. Instead received: " + callback );
3877 }
3878 }
3879
3880 callback.call(context);
3881}
3882
3883function resetHasForceUpdateBeforeProcessing() {
3884 hasForceUpdate = false;
3885}
3886function checkHasForceUpdateAfterProcessing() {
3887 return hasForceUpdate;
3888}
3889function commitUpdateQueue(finishedWork, finishedQueue, instance) {
3890 // Commit the effects
3891 var effects = finishedQueue.effects;
3892 finishedQueue.effects = null;
3893
3894 if (effects !== null) {
3895 for (var i = 0; i < effects.length; i++) {
3896 var effect = effects[i];
3897 var callback = effect.callback;
3898
3899 if (callback !== null) {
3900 effect.callback = null;
3901 callCallback(callback, instance);
3902 }
3903 }
3904 }
3905}
3906
3907var fakeInternalInstance = {};
3908var isArray = Array.isArray; // React.Component uses a shared frozen object by default.
3909// We'll use it to determine whether we need to initialize legacy refs.
3910
3911var emptyRefsObject = new React.Component().refs;
3912var didWarnAboutStateAssignmentForComponent;
3913var didWarnAboutUninitializedState;
3914var didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate;
3915var didWarnAboutLegacyLifecyclesAndDerivedState;
3916var didWarnAboutUndefinedDerivedState;
3917var warnOnUndefinedDerivedState;
3918var warnOnInvalidCallback;
3919var didWarnAboutDirectlyAssigningPropsToState;
3920var didWarnAboutContextTypeAndContextTypes;
3921var didWarnAboutInvalidateContextType;
3922
3923{
3924 didWarnAboutStateAssignmentForComponent = new Set();
3925 didWarnAboutUninitializedState = new Set();
3926 didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate = new Set();
3927 didWarnAboutLegacyLifecyclesAndDerivedState = new Set();
3928 didWarnAboutDirectlyAssigningPropsToState = new Set();
3929 didWarnAboutUndefinedDerivedState = new Set();
3930 didWarnAboutContextTypeAndContextTypes = new Set();
3931 didWarnAboutInvalidateContextType = new Set();
3932 var didWarnOnInvalidCallback = new Set();
3933
3934 warnOnInvalidCallback = function (callback, callerName) {
3935 if (callback === null || typeof callback === 'function') {
3936 return;
3937 }
3938
3939 var key = callerName + '_' + callback;
3940
3941 if (!didWarnOnInvalidCallback.has(key)) {
3942 didWarnOnInvalidCallback.add(key);
3943
3944 error('%s(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callerName, callback);
3945 }
3946 };
3947
3948 warnOnUndefinedDerivedState = function (type, partialState) {
3949 if (partialState === undefined) {
3950 var componentName = getComponentName(type) || 'Component';
3951
3952 if (!didWarnAboutUndefinedDerivedState.has(componentName)) {
3953 didWarnAboutUndefinedDerivedState.add(componentName);
3954
3955 error('%s.getDerivedStateFromProps(): A valid state object (or null) must be returned. ' + 'You have returned undefined.', componentName);
3956 }
3957 }
3958 }; // This is so gross but it's at least non-critical and can be removed if
3959 // it causes problems. This is meant to give a nicer error message for
3960 // ReactDOM15.unstable_renderSubtreeIntoContainer(reactDOM16Component,
3961 // ...)) which otherwise throws a "_processChildContext is not a function"
3962 // exception.
3963
3964
3965 Object.defineProperty(fakeInternalInstance, '_processChildContext', {
3966 enumerable: false,
3967 value: function () {
3968 {
3969 {
3970 throw Error( "_processChildContext is not available in React 16+. This likely means you have multiple copies of React and are attempting to nest a React 15 tree inside a React 16 tree using unstable_renderSubtreeIntoContainer, which isn't supported. Try to make sure you have only one copy of React (and ideally, switch to ReactDOM.createPortal)." );
3971 }
3972 }
3973 }
3974 });
3975 Object.freeze(fakeInternalInstance);
3976}
3977
3978function applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, nextProps) {
3979 var prevState = workInProgress.memoizedState;
3980
3981 {
3982 if ( workInProgress.mode & StrictMode) {
3983 disableLogs();
3984
3985 try {
3986 // Invoke the function an extra time to help detect side-effects.
3987 getDerivedStateFromProps(nextProps, prevState);
3988 } finally {
3989 reenableLogs();
3990 }
3991 }
3992 }
3993
3994 var partialState = getDerivedStateFromProps(nextProps, prevState);
3995
3996 {
3997 warnOnUndefinedDerivedState(ctor, partialState);
3998 } // Merge the partial state and the previous state.
3999
4000
4001 var memoizedState = partialState === null || partialState === undefined ? prevState : _assign({}, prevState, partialState);
4002 workInProgress.memoizedState = memoizedState; // Once the update queue is empty, persist the derived state onto the
4003 // base state.
4004
4005 if (workInProgress.lanes === NoLanes) {
4006 // Queue is always non-null for classes
4007 var updateQueue = workInProgress.updateQueue;
4008 updateQueue.baseState = memoizedState;
4009 }
4010}
4011var classComponentUpdater = {
4012 isMounted: isMounted,
4013 enqueueSetState: function (inst, payload, callback) {
4014 var fiber = get(inst);
4015 var eventTime = requestEventTime();
4016 var lane = requestUpdateLane(fiber);
4017 var update = createUpdate(eventTime, lane);
4018 update.payload = payload;
4019
4020 if (callback !== undefined && callback !== null) {
4021 {
4022 warnOnInvalidCallback(callback, 'setState');
4023 }
4024
4025 update.callback = callback;
4026 }
4027
4028 enqueueUpdate(fiber, update);
4029 scheduleUpdateOnFiber(fiber, lane, eventTime);
4030 },
4031 enqueueReplaceState: function (inst, payload, callback) {
4032 var fiber = get(inst);
4033 var eventTime = requestEventTime();
4034 var lane = requestUpdateLane(fiber);
4035 var update = createUpdate(eventTime, lane);
4036 update.tag = ReplaceState;
4037 update.payload = payload;
4038
4039 if (callback !== undefined && callback !== null) {
4040 {
4041 warnOnInvalidCallback(callback, 'replaceState');
4042 }
4043
4044 update.callback = callback;
4045 }
4046
4047 enqueueUpdate(fiber, update);
4048 scheduleUpdateOnFiber(fiber, lane, eventTime);
4049 },
4050 enqueueForceUpdate: function (inst, callback) {
4051 var fiber = get(inst);
4052 var eventTime = requestEventTime();
4053 var lane = requestUpdateLane(fiber);
4054 var update = createUpdate(eventTime, lane);
4055 update.tag = ForceUpdate;
4056
4057 if (callback !== undefined && callback !== null) {
4058 {
4059 warnOnInvalidCallback(callback, 'forceUpdate');
4060 }
4061
4062 update.callback = callback;
4063 }
4064
4065 enqueueUpdate(fiber, update);
4066 scheduleUpdateOnFiber(fiber, lane, eventTime);
4067 }
4068};
4069
4070function checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext) {
4071 var instance = workInProgress.stateNode;
4072
4073 if (typeof instance.shouldComponentUpdate === 'function') {
4074 {
4075 if ( workInProgress.mode & StrictMode) {
4076 disableLogs();
4077
4078 try {
4079 // Invoke the function an extra time to help detect side-effects.
4080 instance.shouldComponentUpdate(newProps, newState, nextContext);
4081 } finally {
4082 reenableLogs();
4083 }
4084 }
4085 }
4086
4087 var shouldUpdate = instance.shouldComponentUpdate(newProps, newState, nextContext);
4088
4089 {
4090 if (shouldUpdate === undefined) {
4091 error('%s.shouldComponentUpdate(): Returned undefined instead of a ' + 'boolean value. Make sure to return true or false.', getComponentName(ctor) || 'Component');
4092 }
4093 }
4094
4095 return shouldUpdate;
4096 }
4097
4098 if (ctor.prototype && ctor.prototype.isPureReactComponent) {
4099 return !shallowEqual(oldProps, newProps) || !shallowEqual(oldState, newState);
4100 }
4101
4102 return true;
4103}
4104
4105function checkClassInstance(workInProgress, ctor, newProps) {
4106 var instance = workInProgress.stateNode;
4107
4108 {
4109 var name = getComponentName(ctor) || 'Component';
4110 var renderPresent = instance.render;
4111
4112 if (!renderPresent) {
4113 if (ctor.prototype && typeof ctor.prototype.render === 'function') {
4114 error('%s(...): No `render` method found on the returned component ' + 'instance: did you accidentally return an object from the constructor?', name);
4115 } else {
4116 error('%s(...): No `render` method found on the returned component ' + 'instance: you may have forgotten to define `render`.', name);
4117 }
4118 }
4119
4120 if (instance.getInitialState && !instance.getInitialState.isReactClassApproved && !instance.state) {
4121 error('getInitialState was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Did you mean to define a state property instead?', name);
4122 }
4123
4124 if (instance.getDefaultProps && !instance.getDefaultProps.isReactClassApproved) {
4125 error('getDefaultProps was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Use a static property to define defaultProps instead.', name);
4126 }
4127
4128 if (instance.propTypes) {
4129 error('propTypes was defined as an instance property on %s. Use a static ' + 'property to define propTypes instead.', name);
4130 }
4131
4132 if (instance.contextType) {
4133 error('contextType was defined as an instance property on %s. Use a static ' + 'property to define contextType instead.', name);
4134 }
4135
4136 {
4137 if (instance.contextTypes) {
4138 error('contextTypes was defined as an instance property on %s. Use a static ' + 'property to define contextTypes instead.', name);
4139 }
4140
4141 if (ctor.contextType && ctor.contextTypes && !didWarnAboutContextTypeAndContextTypes.has(ctor)) {
4142 didWarnAboutContextTypeAndContextTypes.add(ctor);
4143
4144 error('%s declares both contextTypes and contextType static properties. ' + 'The legacy contextTypes property will be ignored.', name);
4145 }
4146 }
4147
4148 if (typeof instance.componentShouldUpdate === 'function') {
4149 error('%s has a method called ' + 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' + 'The name is phrased as a question because the function is ' + 'expected to return a value.', name);
4150 }
4151
4152 if (ctor.prototype && ctor.prototype.isPureReactComponent && typeof instance.shouldComponentUpdate !== 'undefined') {
4153 error('%s has a method called shouldComponentUpdate(). ' + 'shouldComponentUpdate should not be used when extending React.PureComponent. ' + 'Please extend React.Component if shouldComponentUpdate is used.', getComponentName(ctor) || 'A pure component');
4154 }
4155
4156 if (typeof instance.componentDidUnmount === 'function') {
4157 error('%s has a method called ' + 'componentDidUnmount(). But there is no such lifecycle method. ' + 'Did you mean componentWillUnmount()?', name);
4158 }
4159
4160 if (typeof instance.componentDidReceiveProps === 'function') {
4161 error('%s has a method called ' + 'componentDidReceiveProps(). But there is no such lifecycle method. ' + 'If you meant to update the state in response to changing props, ' + 'use componentWillReceiveProps(). If you meant to fetch data or ' + 'run side-effects or mutations after React has updated the UI, use componentDidUpdate().', name);
4162 }
4163
4164 if (typeof instance.componentWillRecieveProps === 'function') {
4165 error('%s has a method called ' + 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?', name);
4166 }
4167
4168 if (typeof instance.UNSAFE_componentWillRecieveProps === 'function') {
4169 error('%s has a method called ' + 'UNSAFE_componentWillRecieveProps(). Did you mean UNSAFE_componentWillReceiveProps()?', name);
4170 }
4171
4172 var hasMutatedProps = instance.props !== newProps;
4173
4174 if (instance.props !== undefined && hasMutatedProps) {
4175 error('%s(...): When calling super() in `%s`, make sure to pass ' + "up the same props that your component's constructor was passed.", name, name);
4176 }
4177
4178 if (instance.defaultProps) {
4179 error('Setting defaultProps as an instance property on %s is not supported and will be ignored.' + ' Instead, define defaultProps as a static property on %s.', name, name);
4180 }
4181
4182 if (typeof instance.getSnapshotBeforeUpdate === 'function' && typeof instance.componentDidUpdate !== 'function' && !didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate.has(ctor)) {
4183 didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate.add(ctor);
4184
4185 error('%s: getSnapshotBeforeUpdate() should be used with componentDidUpdate(). ' + 'This component defines getSnapshotBeforeUpdate() only.', getComponentName(ctor));
4186 }
4187
4188 if (typeof instance.getDerivedStateFromProps === 'function') {
4189 error('%s: getDerivedStateFromProps() is defined as an instance method ' + 'and will be ignored. Instead, declare it as a static method.', name);
4190 }
4191
4192 if (typeof instance.getDerivedStateFromError === 'function') {
4193 error('%s: getDerivedStateFromError() is defined as an instance method ' + 'and will be ignored. Instead, declare it as a static method.', name);
4194 }
4195
4196 if (typeof ctor.getSnapshotBeforeUpdate === 'function') {
4197 error('%s: getSnapshotBeforeUpdate() is defined as a static method ' + 'and will be ignored. Instead, declare it as an instance method.', name);
4198 }
4199
4200 var _state = instance.state;
4201
4202 if (_state && (typeof _state !== 'object' || isArray(_state))) {
4203 error('%s.state: must be set to an object or null', name);
4204 }
4205
4206 if (typeof instance.getChildContext === 'function' && typeof ctor.childContextTypes !== 'object') {
4207 error('%s.getChildContext(): childContextTypes must be defined in order to ' + 'use getChildContext().', name);
4208 }
4209 }
4210}
4211
4212function adoptClassInstance(workInProgress, instance) {
4213 instance.updater = classComponentUpdater;
4214 workInProgress.stateNode = instance; // The instance needs access to the fiber so that it can schedule updates
4215
4216 set(instance, workInProgress);
4217
4218 {
4219 instance._reactInternalInstance = fakeInternalInstance;
4220 }
4221}
4222
4223function constructClassInstance(workInProgress, ctor, props) {
4224 var isLegacyContextConsumer = false;
4225 var unmaskedContext = emptyContextObject;
4226 var context = emptyContextObject;
4227 var contextType = ctor.contextType;
4228
4229 {
4230 if ('contextType' in ctor) {
4231 var isValid = // Allow null for conditional declaration
4232 contextType === null || contextType !== undefined && contextType.$$typeof === REACT_CONTEXT_TYPE && contextType._context === undefined; // Not a <Context.Consumer>
4233
4234 if (!isValid && !didWarnAboutInvalidateContextType.has(ctor)) {
4235 didWarnAboutInvalidateContextType.add(ctor);
4236 var addendum = '';
4237
4238 if (contextType === undefined) {
4239 addendum = ' However, it is set to undefined. ' + 'This can be caused by a typo or by mixing up named and default imports. ' + 'This can also happen due to a circular dependency, so ' + 'try moving the createContext() call to a separate file.';
4240 } else if (typeof contextType !== 'object') {
4241 addendum = ' However, it is set to a ' + typeof contextType + '.';
4242 } else if (contextType.$$typeof === REACT_PROVIDER_TYPE) {
4243 addendum = ' Did you accidentally pass the Context.Provider instead?';
4244 } else if (contextType._context !== undefined) {
4245 // <Context.Consumer>
4246 addendum = ' Did you accidentally pass the Context.Consumer instead?';
4247 } else {
4248 addendum = ' However, it is set to an object with keys {' + Object.keys(contextType).join(', ') + '}.';
4249 }
4250
4251 error('%s defines an invalid contextType. ' + 'contextType should point to the Context object returned by React.createContext().%s', getComponentName(ctor) || 'Component', addendum);
4252 }
4253 }
4254 }
4255
4256 if (typeof contextType === 'object' && contextType !== null) {
4257 context = readContext(contextType);
4258 } else {
4259 unmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
4260 var contextTypes = ctor.contextTypes;
4261 isLegacyContextConsumer = contextTypes !== null && contextTypes !== undefined;
4262 context = isLegacyContextConsumer ? getMaskedContext(workInProgress, unmaskedContext) : emptyContextObject;
4263 } // Instantiate twice to help detect side-effects.
4264
4265
4266 {
4267 if ( workInProgress.mode & StrictMode) {
4268 disableLogs();
4269
4270 try {
4271 new ctor(props, context); // eslint-disable-line no-new
4272 } finally {
4273 reenableLogs();
4274 }
4275 }
4276 }
4277
4278 var instance = new ctor(props, context);
4279 var state = workInProgress.memoizedState = instance.state !== null && instance.state !== undefined ? instance.state : null;
4280 adoptClassInstance(workInProgress, instance);
4281
4282 {
4283 if (typeof ctor.getDerivedStateFromProps === 'function' && state === null) {
4284 var componentName = getComponentName(ctor) || 'Component';
4285
4286 if (!didWarnAboutUninitializedState.has(componentName)) {
4287 didWarnAboutUninitializedState.add(componentName);
4288
4289 error('`%s` uses `getDerivedStateFromProps` but its initial state is ' + '%s. This is not recommended. Instead, define the initial state by ' + 'assigning an object to `this.state` in the constructor of `%s`. ' + 'This ensures that `getDerivedStateFromProps` arguments have a consistent shape.', componentName, instance.state === null ? 'null' : 'undefined', componentName);
4290 }
4291 } // If new component APIs are defined, "unsafe" lifecycles won't be called.
4292 // Warn about these lifecycles if they are present.
4293 // Don't warn about react-lifecycles-compat polyfilled methods though.
4294
4295
4296 if (typeof ctor.getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function') {
4297 var foundWillMountName = null;
4298 var foundWillReceivePropsName = null;
4299 var foundWillUpdateName = null;
4300
4301 if (typeof instance.componentWillMount === 'function' && instance.componentWillMount.__suppressDeprecationWarning !== true) {
4302 foundWillMountName = 'componentWillMount';
4303 } else if (typeof instance.UNSAFE_componentWillMount === 'function') {
4304 foundWillMountName = 'UNSAFE_componentWillMount';
4305 }
4306
4307 if (typeof instance.componentWillReceiveProps === 'function' && instance.componentWillReceiveProps.__suppressDeprecationWarning !== true) {
4308 foundWillReceivePropsName = 'componentWillReceiveProps';
4309 } else if (typeof instance.UNSAFE_componentWillReceiveProps === 'function') {
4310 foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';
4311 }
4312
4313 if (typeof instance.componentWillUpdate === 'function' && instance.componentWillUpdate.__suppressDeprecationWarning !== true) {
4314 foundWillUpdateName = 'componentWillUpdate';
4315 } else if (typeof instance.UNSAFE_componentWillUpdate === 'function') {
4316 foundWillUpdateName = 'UNSAFE_componentWillUpdate';
4317 }
4318
4319 if (foundWillMountName !== null || foundWillReceivePropsName !== null || foundWillUpdateName !== null) {
4320 var _componentName = getComponentName(ctor) || 'Component';
4321
4322 var newApiName = typeof ctor.getDerivedStateFromProps === 'function' ? 'getDerivedStateFromProps()' : 'getSnapshotBeforeUpdate()';
4323
4324 if (!didWarnAboutLegacyLifecyclesAndDerivedState.has(_componentName)) {
4325 didWarnAboutLegacyLifecyclesAndDerivedState.add(_componentName);
4326
4327 error('Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' + '%s uses %s but also contains the following legacy lifecycles:%s%s%s\n\n' + 'The above lifecycles should be removed. Learn more about this warning here:\n' + 'https://reactjs.org/link/unsafe-component-lifecycles', _componentName, newApiName, foundWillMountName !== null ? "\n " + foundWillMountName : '', foundWillReceivePropsName !== null ? "\n " + foundWillReceivePropsName : '', foundWillUpdateName !== null ? "\n " + foundWillUpdateName : '');
4328 }
4329 }
4330 }
4331 } // Cache unmasked context so we can avoid recreating masked context unless necessary.
4332 // ReactFiberContext usually updates this cache but can't for newly-created instances.
4333
4334
4335 if (isLegacyContextConsumer) {
4336 cacheContext(workInProgress, unmaskedContext, context);
4337 }
4338
4339 return instance;
4340}
4341
4342function callComponentWillMount(workInProgress, instance) {
4343 var oldState = instance.state;
4344
4345 if (typeof instance.componentWillMount === 'function') {
4346 instance.componentWillMount();
4347 }
4348
4349 if (typeof instance.UNSAFE_componentWillMount === 'function') {
4350 instance.UNSAFE_componentWillMount();
4351 }
4352
4353 if (oldState !== instance.state) {
4354 {
4355 error('%s.componentWillMount(): Assigning directly to this.state is ' + "deprecated (except inside a component's " + 'constructor). Use setState instead.', getComponentName(workInProgress.type) || 'Component');
4356 }
4357
4358 classComponentUpdater.enqueueReplaceState(instance, instance.state, null);
4359 }
4360}
4361
4362function callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext) {
4363 var oldState = instance.state;
4364
4365 if (typeof instance.componentWillReceiveProps === 'function') {
4366 instance.componentWillReceiveProps(newProps, nextContext);
4367 }
4368
4369 if (typeof instance.UNSAFE_componentWillReceiveProps === 'function') {
4370 instance.UNSAFE_componentWillReceiveProps(newProps, nextContext);
4371 }
4372
4373 if (instance.state !== oldState) {
4374 {
4375 var componentName = getComponentName(workInProgress.type) || 'Component';
4376
4377 if (!didWarnAboutStateAssignmentForComponent.has(componentName)) {
4378 didWarnAboutStateAssignmentForComponent.add(componentName);
4379
4380 error('%s.componentWillReceiveProps(): Assigning directly to ' + "this.state is deprecated (except inside a component's " + 'constructor). Use setState instead.', componentName);
4381 }
4382 }
4383
4384 classComponentUpdater.enqueueReplaceState(instance, instance.state, null);
4385 }
4386} // Invokes the mount life-cycles on a previously never rendered instance.
4387
4388
4389function mountClassInstance(workInProgress, ctor, newProps, renderLanes) {
4390 {
4391 checkClassInstance(workInProgress, ctor, newProps);
4392 }
4393
4394 var instance = workInProgress.stateNode;
4395 instance.props = newProps;
4396 instance.state = workInProgress.memoizedState;
4397 instance.refs = emptyRefsObject;
4398 initializeUpdateQueue(workInProgress);
4399 var contextType = ctor.contextType;
4400
4401 if (typeof contextType === 'object' && contextType !== null) {
4402 instance.context = readContext(contextType);
4403 } else {
4404 var unmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
4405 instance.context = getMaskedContext(workInProgress, unmaskedContext);
4406 }
4407
4408 {
4409 if (instance.state === newProps) {
4410 var componentName = getComponentName(ctor) || 'Component';
4411
4412 if (!didWarnAboutDirectlyAssigningPropsToState.has(componentName)) {
4413 didWarnAboutDirectlyAssigningPropsToState.add(componentName);
4414
4415 error('%s: It is not recommended to assign props directly to state ' + "because updates to props won't be reflected in state. " + 'In most cases, it is better to use props directly.', componentName);
4416 }
4417 }
4418
4419 if (workInProgress.mode & StrictMode) {
4420 ReactStrictModeWarnings.recordLegacyContextWarning(workInProgress, instance);
4421 }
4422
4423 {
4424 ReactStrictModeWarnings.recordUnsafeLifecycleWarnings(workInProgress, instance);
4425 }
4426 }
4427
4428 processUpdateQueue(workInProgress, newProps, instance, renderLanes);
4429 instance.state = workInProgress.memoizedState;
4430 var getDerivedStateFromProps = ctor.getDerivedStateFromProps;
4431
4432 if (typeof getDerivedStateFromProps === 'function') {
4433 applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps);
4434 instance.state = workInProgress.memoizedState;
4435 } // In order to support react-lifecycles-compat polyfilled components,
4436 // Unsafe lifecycles should not be invoked for components using the new APIs.
4437
4438
4439 if (typeof ctor.getDerivedStateFromProps !== 'function' && typeof instance.getSnapshotBeforeUpdate !== 'function' && (typeof instance.UNSAFE_componentWillMount === 'function' || typeof instance.componentWillMount === 'function')) {
4440 callComponentWillMount(workInProgress, instance); // If we had additional state updates during this life-cycle, let's
4441 // process them now.
4442
4443 processUpdateQueue(workInProgress, newProps, instance, renderLanes);
4444 instance.state = workInProgress.memoizedState;
4445 }
4446
4447 if (typeof instance.componentDidMount === 'function') {
4448 workInProgress.flags |= Update;
4449 }
4450}
4451
4452function resumeMountClassInstance(workInProgress, ctor, newProps, renderLanes) {
4453 var instance = workInProgress.stateNode;
4454 var oldProps = workInProgress.memoizedProps;
4455 instance.props = oldProps;
4456 var oldContext = instance.context;
4457 var contextType = ctor.contextType;
4458 var nextContext = emptyContextObject;
4459
4460 if (typeof contextType === 'object' && contextType !== null) {
4461 nextContext = readContext(contextType);
4462 } else {
4463 var nextLegacyUnmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
4464 nextContext = getMaskedContext(workInProgress, nextLegacyUnmaskedContext);
4465 }
4466
4467 var getDerivedStateFromProps = ctor.getDerivedStateFromProps;
4468 var hasNewLifecycles = typeof getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function'; // Note: During these life-cycles, instance.props/instance.state are what
4469 // ever the previously attempted to render - not the "current". However,
4470 // during componentDidUpdate we pass the "current" props.
4471 // In order to support react-lifecycles-compat polyfilled components,
4472 // Unsafe lifecycles should not be invoked for components using the new APIs.
4473
4474 if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillReceiveProps === 'function' || typeof instance.componentWillReceiveProps === 'function')) {
4475 if (oldProps !== newProps || oldContext !== nextContext) {
4476 callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext);
4477 }
4478 }
4479
4480 resetHasForceUpdateBeforeProcessing();
4481 var oldState = workInProgress.memoizedState;
4482 var newState = instance.state = oldState;
4483 processUpdateQueue(workInProgress, newProps, instance, renderLanes);
4484 newState = workInProgress.memoizedState;
4485
4486 if (oldProps === newProps && oldState === newState && !hasContextChanged() && !checkHasForceUpdateAfterProcessing()) {
4487 // If an update was already in progress, we should schedule an Update
4488 // effect even though we're bailing out, so that cWU/cDU are called.
4489 if (typeof instance.componentDidMount === 'function') {
4490 workInProgress.flags |= Update;
4491 }
4492
4493 return false;
4494 }
4495
4496 if (typeof getDerivedStateFromProps === 'function') {
4497 applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps);
4498 newState = workInProgress.memoizedState;
4499 }
4500
4501 var shouldUpdate = checkHasForceUpdateAfterProcessing() || checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext);
4502
4503 if (shouldUpdate) {
4504 // In order to support react-lifecycles-compat polyfilled components,
4505 // Unsafe lifecycles should not be invoked for components using the new APIs.
4506 if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillMount === 'function' || typeof instance.componentWillMount === 'function')) {
4507 if (typeof instance.componentWillMount === 'function') {
4508 instance.componentWillMount();
4509 }
4510
4511 if (typeof instance.UNSAFE_componentWillMount === 'function') {
4512 instance.UNSAFE_componentWillMount();
4513 }
4514 }
4515
4516 if (typeof instance.componentDidMount === 'function') {
4517 workInProgress.flags |= Update;
4518 }
4519 } else {
4520 // If an update was already in progress, we should schedule an Update
4521 // effect even though we're bailing out, so that cWU/cDU are called.
4522 if (typeof instance.componentDidMount === 'function') {
4523 workInProgress.flags |= Update;
4524 } // If shouldComponentUpdate returned false, we should still update the
4525 // memoized state to indicate that this work can be reused.
4526
4527
4528 workInProgress.memoizedProps = newProps;
4529 workInProgress.memoizedState = newState;
4530 } // Update the existing instance's state, props, and context pointers even
4531 // if shouldComponentUpdate returns false.
4532
4533
4534 instance.props = newProps;
4535 instance.state = newState;
4536 instance.context = nextContext;
4537 return shouldUpdate;
4538} // Invokes the update life-cycles and returns false if it shouldn't rerender.
4539
4540
4541function updateClassInstance(current, workInProgress, ctor, newProps, renderLanes) {
4542 var instance = workInProgress.stateNode;
4543 cloneUpdateQueue(current, workInProgress);
4544 var unresolvedOldProps = workInProgress.memoizedProps;
4545 var oldProps = workInProgress.type === workInProgress.elementType ? unresolvedOldProps : resolveDefaultProps(workInProgress.type, unresolvedOldProps);
4546 instance.props = oldProps;
4547 var unresolvedNewProps = workInProgress.pendingProps;
4548 var oldContext = instance.context;
4549 var contextType = ctor.contextType;
4550 var nextContext = emptyContextObject;
4551
4552 if (typeof contextType === 'object' && contextType !== null) {
4553 nextContext = readContext(contextType);
4554 } else {
4555 var nextUnmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
4556 nextContext = getMaskedContext(workInProgress, nextUnmaskedContext);
4557 }
4558
4559 var getDerivedStateFromProps = ctor.getDerivedStateFromProps;
4560 var hasNewLifecycles = typeof getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function'; // Note: During these life-cycles, instance.props/instance.state are what
4561 // ever the previously attempted to render - not the "current". However,
4562 // during componentDidUpdate we pass the "current" props.
4563 // In order to support react-lifecycles-compat polyfilled components,
4564 // Unsafe lifecycles should not be invoked for components using the new APIs.
4565
4566 if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillReceiveProps === 'function' || typeof instance.componentWillReceiveProps === 'function')) {
4567 if (unresolvedOldProps !== unresolvedNewProps || oldContext !== nextContext) {
4568 callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext);
4569 }
4570 }
4571
4572 resetHasForceUpdateBeforeProcessing();
4573 var oldState = workInProgress.memoizedState;
4574 var newState = instance.state = oldState;
4575 processUpdateQueue(workInProgress, newProps, instance, renderLanes);
4576 newState = workInProgress.memoizedState;
4577
4578 if (unresolvedOldProps === unresolvedNewProps && oldState === newState && !hasContextChanged() && !checkHasForceUpdateAfterProcessing()) {
4579 // If an update was already in progress, we should schedule an Update
4580 // effect even though we're bailing out, so that cWU/cDU are called.
4581 if (typeof instance.componentDidUpdate === 'function') {
4582 if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
4583 workInProgress.flags |= Update;
4584 }
4585 }
4586
4587 if (typeof instance.getSnapshotBeforeUpdate === 'function') {
4588 if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
4589 workInProgress.flags |= Snapshot;
4590 }
4591 }
4592
4593 return false;
4594 }
4595
4596 if (typeof getDerivedStateFromProps === 'function') {
4597 applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps);
4598 newState = workInProgress.memoizedState;
4599 }
4600
4601 var shouldUpdate = checkHasForceUpdateAfterProcessing() || checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext);
4602
4603 if (shouldUpdate) {
4604 // In order to support react-lifecycles-compat polyfilled components,
4605 // Unsafe lifecycles should not be invoked for components using the new APIs.
4606 if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillUpdate === 'function' || typeof instance.componentWillUpdate === 'function')) {
4607 if (typeof instance.componentWillUpdate === 'function') {
4608 instance.componentWillUpdate(newProps, newState, nextContext);
4609 }
4610
4611 if (typeof instance.UNSAFE_componentWillUpdate === 'function') {
4612 instance.UNSAFE_componentWillUpdate(newProps, newState, nextContext);
4613 }
4614 }
4615
4616 if (typeof instance.componentDidUpdate === 'function') {
4617 workInProgress.flags |= Update;
4618 }
4619
4620 if (typeof instance.getSnapshotBeforeUpdate === 'function') {
4621 workInProgress.flags |= Snapshot;
4622 }
4623 } else {
4624 // If an update was already in progress, we should schedule an Update
4625 // effect even though we're bailing out, so that cWU/cDU are called.
4626 if (typeof instance.componentDidUpdate === 'function') {
4627 if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
4628 workInProgress.flags |= Update;
4629 }
4630 }
4631
4632 if (typeof instance.getSnapshotBeforeUpdate === 'function') {
4633 if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
4634 workInProgress.flags |= Snapshot;
4635 }
4636 } // If shouldComponentUpdate returned false, we should still update the
4637 // memoized props/state to indicate that this work can be reused.
4638
4639
4640 workInProgress.memoizedProps = newProps;
4641 workInProgress.memoizedState = newState;
4642 } // Update the existing instance's state, props, and context pointers even
4643 // if shouldComponentUpdate returns false.
4644
4645
4646 instance.props = newProps;
4647 instance.state = newState;
4648 instance.context = nextContext;
4649 return shouldUpdate;
4650}
4651
4652var didWarnAboutMaps;
4653var didWarnAboutGenerators;
4654var didWarnAboutStringRefs;
4655var ownerHasKeyUseWarning;
4656var ownerHasFunctionTypeWarning;
4657
4658var warnForMissingKey = function (child, returnFiber) {};
4659
4660{
4661 didWarnAboutMaps = false;
4662 didWarnAboutGenerators = false;
4663 didWarnAboutStringRefs = {};
4664 /**
4665 * Warn if there's no key explicitly set on dynamic arrays of children or
4666 * object keys are not valid. This allows us to keep track of children between
4667 * updates.
4668 */
4669
4670 ownerHasKeyUseWarning = {};
4671 ownerHasFunctionTypeWarning = {};
4672
4673 warnForMissingKey = function (child, returnFiber) {
4674 if (child === null || typeof child !== 'object') {
4675 return;
4676 }
4677
4678 if (!child._store || child._store.validated || child.key != null) {
4679 return;
4680 }
4681
4682 if (!(typeof child._store === 'object')) {
4683 {
4684 throw Error( "React Component in warnForMissingKey should have a _store. This error is likely caused by a bug in React. Please file an issue." );
4685 }
4686 }
4687
4688 child._store.validated = true;
4689 var componentName = getComponentName(returnFiber.type) || 'Component';
4690
4691 if (ownerHasKeyUseWarning[componentName]) {
4692 return;
4693 }
4694
4695 ownerHasKeyUseWarning[componentName] = true;
4696
4697 error('Each child in a list should have a unique ' + '"key" prop. See https://reactjs.org/link/warning-keys for ' + 'more information.');
4698 };
4699}
4700
4701var isArray$1 = Array.isArray;
4702
4703function coerceRef(returnFiber, current, element) {
4704 var mixedRef = element.ref;
4705
4706 if (mixedRef !== null && typeof mixedRef !== 'function' && typeof mixedRef !== 'object') {
4707 {
4708 // TODO: Clean this up once we turn on the string ref warning for
4709 // everyone, because the strict mode case will no longer be relevant
4710 if ((returnFiber.mode & StrictMode || warnAboutStringRefs) && // We warn in ReactElement.js if owner and self are equal for string refs
4711 // because these cannot be automatically converted to an arrow function
4712 // using a codemod. Therefore, we don't have to warn about string refs again.
4713 !(element._owner && element._self && element._owner.stateNode !== element._self)) {
4714 var componentName = getComponentName(returnFiber.type) || 'Component';
4715
4716 if (!didWarnAboutStringRefs[componentName]) {
4717 {
4718 error('A string ref, "%s", has been found within a strict mode tree. ' + 'String refs are a source of potential bugs and should be avoided. ' + 'We recommend using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', mixedRef);
4719 }
4720
4721 didWarnAboutStringRefs[componentName] = true;
4722 }
4723 }
4724 }
4725
4726 if (element._owner) {
4727 var owner = element._owner;
4728 var inst;
4729
4730 if (owner) {
4731 var ownerFiber = owner;
4732
4733 if (!(ownerFiber.tag === ClassComponent)) {
4734 {
4735 throw Error( "Function components cannot have string refs. We recommend using useRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref" );
4736 }
4737 }
4738
4739 inst = ownerFiber.stateNode;
4740 }
4741
4742 if (!inst) {
4743 {
4744 throw Error( "Missing owner for string ref " + mixedRef + ". This error is likely caused by a bug in React. Please file an issue." );
4745 }
4746 }
4747
4748 var stringRef = '' + mixedRef; // Check if previous string ref matches new string ref
4749
4750 if (current !== null && current.ref !== null && typeof current.ref === 'function' && current.ref._stringRef === stringRef) {
4751 return current.ref;
4752 }
4753
4754 var ref = function (value) {
4755 var refs = inst.refs;
4756
4757 if (refs === emptyRefsObject) {
4758 // This is a lazy pooled frozen object, so we need to initialize.
4759 refs = inst.refs = {};
4760 }
4761
4762 if (value === null) {
4763 delete refs[stringRef];
4764 } else {
4765 refs[stringRef] = value;
4766 }
4767 };
4768
4769 ref._stringRef = stringRef;
4770 return ref;
4771 } else {
4772 if (!(typeof mixedRef === 'string')) {
4773 {
4774 throw Error( "Expected ref to be a function, a string, an object returned by React.createRef(), or null." );
4775 }
4776 }
4777
4778 if (!element._owner) {
4779 {
4780 throw Error( "Element ref was specified as a string (" + mixedRef + ") but no owner was set. This could happen for one of the following reasons:\n1. You may be adding a ref to a function component\n2. You may be adding a ref to a component that was not created inside a component's render method\n3. You have multiple copies of React loaded\nSee https://reactjs.org/link/refs-must-have-owner for more information." );
4781 }
4782 }
4783 }
4784 }
4785
4786 return mixedRef;
4787}
4788
4789function throwOnInvalidObjectType(returnFiber, newChild) {
4790 if (returnFiber.type !== 'textarea') {
4791 {
4792 {
4793 throw Error( "Objects are not valid as a React child (found: " + (Object.prototype.toString.call(newChild) === '[object Object]' ? 'object with keys {' + Object.keys(newChild).join(', ') + '}' : newChild) + "). If you meant to render a collection of children, use an array instead." );
4794 }
4795 }
4796 }
4797}
4798
4799function warnOnFunctionType(returnFiber) {
4800 {
4801 var componentName = getComponentName(returnFiber.type) || 'Component';
4802
4803 if (ownerHasFunctionTypeWarning[componentName]) {
4804 return;
4805 }
4806
4807 ownerHasFunctionTypeWarning[componentName] = true;
4808
4809 error('Functions are not valid as a React child. This may happen if ' + 'you return a Component instead of <Component /> from render. ' + 'Or maybe you meant to call this function rather than return it.');
4810 }
4811} // We avoid inlining this to avoid potential deopts from using try/catch.
4812// to be able to optimize each path individually by branching early. This needs
4813// a compiler or we can do it manually. Helpers that don't need this branching
4814// live outside of this function.
4815
4816
4817function ChildReconciler(shouldTrackSideEffects) {
4818 function deleteChild(returnFiber, childToDelete) {
4819 if (!shouldTrackSideEffects) {
4820 // Noop.
4821 return;
4822 } // Deletions are added in reversed order so we add it to the front.
4823 // At this point, the return fiber's effect list is empty except for
4824 // deletions, so we can just append the deletion to the list. The remaining
4825 // effects aren't added until the complete phase. Once we implement
4826 // resuming, this may not be true.
4827
4828
4829 var last = returnFiber.lastEffect;
4830
4831 if (last !== null) {
4832 last.nextEffect = childToDelete;
4833 returnFiber.lastEffect = childToDelete;
4834 } else {
4835 returnFiber.firstEffect = returnFiber.lastEffect = childToDelete;
4836 }
4837
4838 childToDelete.nextEffect = null;
4839 childToDelete.flags = Deletion;
4840 }
4841
4842 function deleteRemainingChildren(returnFiber, currentFirstChild) {
4843 if (!shouldTrackSideEffects) {
4844 // Noop.
4845 return null;
4846 } // TODO: For the shouldClone case, this could be micro-optimized a bit by
4847 // assuming that after the first child we've already added everything.
4848
4849
4850 var childToDelete = currentFirstChild;
4851
4852 while (childToDelete !== null) {
4853 deleteChild(returnFiber, childToDelete);
4854 childToDelete = childToDelete.sibling;
4855 }
4856
4857 return null;
4858 }
4859
4860 function mapRemainingChildren(returnFiber, currentFirstChild) {
4861 // Add the remaining children to a temporary map so that we can find them by
4862 // keys quickly. Implicit (null) keys get added to this set with their index
4863 // instead.
4864 var existingChildren = new Map();
4865 var existingChild = currentFirstChild;
4866
4867 while (existingChild !== null) {
4868 if (existingChild.key !== null) {
4869 existingChildren.set(existingChild.key, existingChild);
4870 } else {
4871 existingChildren.set(existingChild.index, existingChild);
4872 }
4873
4874 existingChild = existingChild.sibling;
4875 }
4876
4877 return existingChildren;
4878 }
4879
4880 function useFiber(fiber, pendingProps) {
4881 // We currently set sibling to null and index to 0 here because it is easy
4882 // to forget to do before returning it. E.g. for the single child case.
4883 var clone = createWorkInProgress(fiber, pendingProps);
4884 clone.index = 0;
4885 clone.sibling = null;
4886 return clone;
4887 }
4888
4889 function placeChild(newFiber, lastPlacedIndex, newIndex) {
4890 newFiber.index = newIndex;
4891
4892 if (!shouldTrackSideEffects) {
4893 // Noop.
4894 return lastPlacedIndex;
4895 }
4896
4897 var current = newFiber.alternate;
4898
4899 if (current !== null) {
4900 var oldIndex = current.index;
4901
4902 if (oldIndex < lastPlacedIndex) {
4903 // This is a move.
4904 newFiber.flags = Placement;
4905 return lastPlacedIndex;
4906 } else {
4907 // This item can stay in place.
4908 return oldIndex;
4909 }
4910 } else {
4911 // This is an insertion.
4912 newFiber.flags = Placement;
4913 return lastPlacedIndex;
4914 }
4915 }
4916
4917 function placeSingleChild(newFiber) {
4918 // This is simpler for the single child case. We only need to do a
4919 // placement for inserting new children.
4920 if (shouldTrackSideEffects && newFiber.alternate === null) {
4921 newFiber.flags = Placement;
4922 }
4923
4924 return newFiber;
4925 }
4926
4927 function updateTextNode(returnFiber, current, textContent, lanes) {
4928 if (current === null || current.tag !== HostText) {
4929 // Insert
4930 var created = createFiberFromText(textContent, returnFiber.mode, lanes);
4931 created.return = returnFiber;
4932 return created;
4933 } else {
4934 // Update
4935 var existing = useFiber(current, textContent);
4936 existing.return = returnFiber;
4937 return existing;
4938 }
4939 }
4940
4941 function updateElement(returnFiber, current, element, lanes) {
4942 if (current !== null) {
4943 if (current.elementType === element.type || ( // Keep this check inline so it only runs on the false path:
4944 isCompatibleFamilyForHotReloading(current, element) )) {
4945 // Move based on index
4946 var existing = useFiber(current, element.props);
4947 existing.ref = coerceRef(returnFiber, current, element);
4948 existing.return = returnFiber;
4949
4950 {
4951 existing._debugSource = element._source;
4952 existing._debugOwner = element._owner;
4953 }
4954
4955 return existing;
4956 }
4957 } // Insert
4958
4959
4960 var created = createFiberFromElement(element, returnFiber.mode, lanes);
4961 created.ref = coerceRef(returnFiber, current, element);
4962 created.return = returnFiber;
4963 return created;
4964 }
4965
4966 function updatePortal(returnFiber, current, portal, lanes) {
4967 if (current === null || current.tag !== HostPortal || current.stateNode.containerInfo !== portal.containerInfo || current.stateNode.implementation !== portal.implementation) {
4968 // Insert
4969 var created = createFiberFromPortal(portal, returnFiber.mode, lanes);
4970 created.return = returnFiber;
4971 return created;
4972 } else {
4973 // Update
4974 var existing = useFiber(current, portal.children || []);
4975 existing.return = returnFiber;
4976 return existing;
4977 }
4978 }
4979
4980 function updateFragment(returnFiber, current, fragment, lanes, key) {
4981 if (current === null || current.tag !== Fragment) {
4982 // Insert
4983 var created = createFiberFromFragment(fragment, returnFiber.mode, lanes, key);
4984 created.return = returnFiber;
4985 return created;
4986 } else {
4987 // Update
4988 var existing = useFiber(current, fragment);
4989 existing.return = returnFiber;
4990 return existing;
4991 }
4992 }
4993
4994 function createChild(returnFiber, newChild, lanes) {
4995 if (typeof newChild === 'string' || typeof newChild === 'number') {
4996 // Text nodes don't have keys. If the previous node is implicitly keyed
4997 // we can continue to replace it without aborting even if it is not a text
4998 // node.
4999 var created = createFiberFromText('' + newChild, returnFiber.mode, lanes);
5000 created.return = returnFiber;
5001 return created;
5002 }
5003
5004 if (typeof newChild === 'object' && newChild !== null) {
5005 switch (newChild.$$typeof) {
5006 case REACT_ELEMENT_TYPE:
5007 {
5008 var _created = createFiberFromElement(newChild, returnFiber.mode, lanes);
5009
5010 _created.ref = coerceRef(returnFiber, null, newChild);
5011 _created.return = returnFiber;
5012 return _created;
5013 }
5014
5015 case REACT_PORTAL_TYPE:
5016 {
5017 var _created2 = createFiberFromPortal(newChild, returnFiber.mode, lanes);
5018
5019 _created2.return = returnFiber;
5020 return _created2;
5021 }
5022 }
5023
5024 if (isArray$1(newChild) || getIteratorFn(newChild)) {
5025 var _created3 = createFiberFromFragment(newChild, returnFiber.mode, lanes, null);
5026
5027 _created3.return = returnFiber;
5028 return _created3;
5029 }
5030
5031 throwOnInvalidObjectType(returnFiber, newChild);
5032 }
5033
5034 {
5035 if (typeof newChild === 'function') {
5036 warnOnFunctionType(returnFiber);
5037 }
5038 }
5039
5040 return null;
5041 }
5042
5043 function updateSlot(returnFiber, oldFiber, newChild, lanes) {
5044 // Update the fiber if the keys match, otherwise return null.
5045 var key = oldFiber !== null ? oldFiber.key : null;
5046
5047 if (typeof newChild === 'string' || typeof newChild === 'number') {
5048 // Text nodes don't have keys. If the previous node is implicitly keyed
5049 // we can continue to replace it without aborting even if it is not a text
5050 // node.
5051 if (key !== null) {
5052 return null;
5053 }
5054
5055 return updateTextNode(returnFiber, oldFiber, '' + newChild, lanes);
5056 }
5057
5058 if (typeof newChild === 'object' && newChild !== null) {
5059 switch (newChild.$$typeof) {
5060 case REACT_ELEMENT_TYPE:
5061 {
5062 if (newChild.key === key) {
5063 if (newChild.type === REACT_FRAGMENT_TYPE) {
5064 return updateFragment(returnFiber, oldFiber, newChild.props.children, lanes, key);
5065 }
5066
5067 return updateElement(returnFiber, oldFiber, newChild, lanes);
5068 } else {
5069 return null;
5070 }
5071 }
5072
5073 case REACT_PORTAL_TYPE:
5074 {
5075 if (newChild.key === key) {
5076 return updatePortal(returnFiber, oldFiber, newChild, lanes);
5077 } else {
5078 return null;
5079 }
5080 }
5081 }
5082
5083 if (isArray$1(newChild) || getIteratorFn(newChild)) {
5084 if (key !== null) {
5085 return null;
5086 }
5087
5088 return updateFragment(returnFiber, oldFiber, newChild, lanes, null);
5089 }
5090
5091 throwOnInvalidObjectType(returnFiber, newChild);
5092 }
5093
5094 {
5095 if (typeof newChild === 'function') {
5096 warnOnFunctionType(returnFiber);
5097 }
5098 }
5099
5100 return null;
5101 }
5102
5103 function updateFromMap(existingChildren, returnFiber, newIdx, newChild, lanes) {
5104 if (typeof newChild === 'string' || typeof newChild === 'number') {
5105 // Text nodes don't have keys, so we neither have to check the old nor
5106 // new node for the key. If both are text nodes, they match.
5107 var matchedFiber = existingChildren.get(newIdx) || null;
5108 return updateTextNode(returnFiber, matchedFiber, '' + newChild, lanes);
5109 }
5110
5111 if (typeof newChild === 'object' && newChild !== null) {
5112 switch (newChild.$$typeof) {
5113 case REACT_ELEMENT_TYPE:
5114 {
5115 var _matchedFiber = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null;
5116
5117 if (newChild.type === REACT_FRAGMENT_TYPE) {
5118 return updateFragment(returnFiber, _matchedFiber, newChild.props.children, lanes, newChild.key);
5119 }
5120
5121 return updateElement(returnFiber, _matchedFiber, newChild, lanes);
5122 }
5123
5124 case REACT_PORTAL_TYPE:
5125 {
5126 var _matchedFiber2 = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null;
5127
5128 return updatePortal(returnFiber, _matchedFiber2, newChild, lanes);
5129 }
5130
5131 }
5132
5133 if (isArray$1(newChild) || getIteratorFn(newChild)) {
5134 var _matchedFiber3 = existingChildren.get(newIdx) || null;
5135
5136 return updateFragment(returnFiber, _matchedFiber3, newChild, lanes, null);
5137 }
5138
5139 throwOnInvalidObjectType(returnFiber, newChild);
5140 }
5141
5142 {
5143 if (typeof newChild === 'function') {
5144 warnOnFunctionType(returnFiber);
5145 }
5146 }
5147
5148 return null;
5149 }
5150 /**
5151 * Warns if there is a duplicate or missing key
5152 */
5153
5154
5155 function warnOnInvalidKey(child, knownKeys, returnFiber) {
5156 {
5157 if (typeof child !== 'object' || child === null) {
5158 return knownKeys;
5159 }
5160
5161 switch (child.$$typeof) {
5162 case REACT_ELEMENT_TYPE:
5163 case REACT_PORTAL_TYPE:
5164 warnForMissingKey(child, returnFiber);
5165 var key = child.key;
5166
5167 if (typeof key !== 'string') {
5168 break;
5169 }
5170
5171 if (knownKeys === null) {
5172 knownKeys = new Set();
5173 knownKeys.add(key);
5174 break;
5175 }
5176
5177 if (!knownKeys.has(key)) {
5178 knownKeys.add(key);
5179 break;
5180 }
5181
5182 error('Encountered two children with the same key, `%s`. ' + 'Keys should be unique so that components maintain their identity ' + 'across updates. Non-unique keys may cause children to be ' + 'duplicated and/or omitted — the behavior is unsupported and ' + 'could change in a future version.', key);
5183
5184 break;
5185 }
5186 }
5187
5188 return knownKeys;
5189 }
5190
5191 function reconcileChildrenArray(returnFiber, currentFirstChild, newChildren, lanes) {
5192 // This algorithm can't optimize by searching from both ends since we
5193 // don't have backpointers on fibers. I'm trying to see how far we can get
5194 // with that model. If it ends up not being worth the tradeoffs, we can
5195 // add it later.
5196 // Even with a two ended optimization, we'd want to optimize for the case
5197 // where there are few changes and brute force the comparison instead of
5198 // going for the Map. It'd like to explore hitting that path first in
5199 // forward-only mode and only go for the Map once we notice that we need
5200 // lots of look ahead. This doesn't handle reversal as well as two ended
5201 // search but that's unusual. Besides, for the two ended optimization to
5202 // work on Iterables, we'd need to copy the whole set.
5203 // In this first iteration, we'll just live with hitting the bad case
5204 // (adding everything to a Map) in for every insert/move.
5205 // If you change this code, also update reconcileChildrenIterator() which
5206 // uses the same algorithm.
5207 {
5208 // First, validate keys.
5209 var knownKeys = null;
5210
5211 for (var i = 0; i < newChildren.length; i++) {
5212 var child = newChildren[i];
5213 knownKeys = warnOnInvalidKey(child, knownKeys, returnFiber);
5214 }
5215 }
5216
5217 var resultingFirstChild = null;
5218 var previousNewFiber = null;
5219 var oldFiber = currentFirstChild;
5220 var lastPlacedIndex = 0;
5221 var newIdx = 0;
5222 var nextOldFiber = null;
5223
5224 for (; oldFiber !== null && newIdx < newChildren.length; newIdx++) {
5225 if (oldFiber.index > newIdx) {
5226 nextOldFiber = oldFiber;
5227 oldFiber = null;
5228 } else {
5229 nextOldFiber = oldFiber.sibling;
5230 }
5231
5232 var newFiber = updateSlot(returnFiber, oldFiber, newChildren[newIdx], lanes);
5233
5234 if (newFiber === null) {
5235 // TODO: This breaks on empty slots like null children. That's
5236 // unfortunate because it triggers the slow path all the time. We need
5237 // a better way to communicate whether this was a miss or null,
5238 // boolean, undefined, etc.
5239 if (oldFiber === null) {
5240 oldFiber = nextOldFiber;
5241 }
5242
5243 break;
5244 }
5245
5246 if (shouldTrackSideEffects) {
5247 if (oldFiber && newFiber.alternate === null) {
5248 // We matched the slot, but we didn't reuse the existing fiber, so we
5249 // need to delete the existing child.
5250 deleteChild(returnFiber, oldFiber);
5251 }
5252 }
5253
5254 lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx);
5255
5256 if (previousNewFiber === null) {
5257 // TODO: Move out of the loop. This only happens for the first run.
5258 resultingFirstChild = newFiber;
5259 } else {
5260 // TODO: Defer siblings if we're not at the right index for this slot.
5261 // I.e. if we had null values before, then we want to defer this
5262 // for each null value. However, we also don't want to call updateSlot
5263 // with the previous one.
5264 previousNewFiber.sibling = newFiber;
5265 }
5266
5267 previousNewFiber = newFiber;
5268 oldFiber = nextOldFiber;
5269 }
5270
5271 if (newIdx === newChildren.length) {
5272 // We've reached the end of the new children. We can delete the rest.
5273 deleteRemainingChildren(returnFiber, oldFiber);
5274 return resultingFirstChild;
5275 }
5276
5277 if (oldFiber === null) {
5278 // If we don't have any more existing children we can choose a fast path
5279 // since the rest will all be insertions.
5280 for (; newIdx < newChildren.length; newIdx++) {
5281 var _newFiber = createChild(returnFiber, newChildren[newIdx], lanes);
5282
5283 if (_newFiber === null) {
5284 continue;
5285 }
5286
5287 lastPlacedIndex = placeChild(_newFiber, lastPlacedIndex, newIdx);
5288
5289 if (previousNewFiber === null) {
5290 // TODO: Move out of the loop. This only happens for the first run.
5291 resultingFirstChild = _newFiber;
5292 } else {
5293 previousNewFiber.sibling = _newFiber;
5294 }
5295
5296 previousNewFiber = _newFiber;
5297 }
5298
5299 return resultingFirstChild;
5300 } // Add all children to a key map for quick lookups.
5301
5302
5303 var existingChildren = mapRemainingChildren(returnFiber, oldFiber); // Keep scanning and use the map to restore deleted items as moves.
5304
5305 for (; newIdx < newChildren.length; newIdx++) {
5306 var _newFiber2 = updateFromMap(existingChildren, returnFiber, newIdx, newChildren[newIdx], lanes);
5307
5308 if (_newFiber2 !== null) {
5309 if (shouldTrackSideEffects) {
5310 if (_newFiber2.alternate !== null) {
5311 // The new fiber is a work in progress, but if there exists a
5312 // current, that means that we reused the fiber. We need to delete
5313 // it from the child list so that we don't add it to the deletion
5314 // list.
5315 existingChildren.delete(_newFiber2.key === null ? newIdx : _newFiber2.key);
5316 }
5317 }
5318
5319 lastPlacedIndex = placeChild(_newFiber2, lastPlacedIndex, newIdx);
5320
5321 if (previousNewFiber === null) {
5322 resultingFirstChild = _newFiber2;
5323 } else {
5324 previousNewFiber.sibling = _newFiber2;
5325 }
5326
5327 previousNewFiber = _newFiber2;
5328 }
5329 }
5330
5331 if (shouldTrackSideEffects) {
5332 // Any existing children that weren't consumed above were deleted. We need
5333 // to add them to the deletion list.
5334 existingChildren.forEach(function (child) {
5335 return deleteChild(returnFiber, child);
5336 });
5337 }
5338
5339 return resultingFirstChild;
5340 }
5341
5342 function reconcileChildrenIterator(returnFiber, currentFirstChild, newChildrenIterable, lanes) {
5343 // This is the same implementation as reconcileChildrenArray(),
5344 // but using the iterator instead.
5345 var iteratorFn = getIteratorFn(newChildrenIterable);
5346
5347 if (!(typeof iteratorFn === 'function')) {
5348 {
5349 throw Error( "An object is not an iterable. This error is likely caused by a bug in React. Please file an issue." );
5350 }
5351 }
5352
5353 {
5354 // We don't support rendering Generators because it's a mutation.
5355 // See https://github.com/facebook/react/issues/12995
5356 if (typeof Symbol === 'function' && // $FlowFixMe Flow doesn't know about toStringTag
5357 newChildrenIterable[Symbol.toStringTag] === 'Generator') {
5358 if (!didWarnAboutGenerators) {
5359 error('Using Generators as children is unsupported and will likely yield ' + 'unexpected results because enumerating a generator mutates it. ' + 'You may convert it to an array with `Array.from()` or the ' + '`[...spread]` operator before rendering. Keep in mind ' + 'you might need to polyfill these features for older browsers.');
5360 }
5361
5362 didWarnAboutGenerators = true;
5363 } // Warn about using Maps as children
5364
5365
5366 if (newChildrenIterable.entries === iteratorFn) {
5367 if (!didWarnAboutMaps) {
5368 error('Using Maps as children is not supported. ' + 'Use an array of keyed ReactElements instead.');
5369 }
5370
5371 didWarnAboutMaps = true;
5372 } // First, validate keys.
5373 // We'll get a different iterator later for the main pass.
5374
5375
5376 var _newChildren = iteratorFn.call(newChildrenIterable);
5377
5378 if (_newChildren) {
5379 var knownKeys = null;
5380
5381 var _step = _newChildren.next();
5382
5383 for (; !_step.done; _step = _newChildren.next()) {
5384 var child = _step.value;
5385 knownKeys = warnOnInvalidKey(child, knownKeys, returnFiber);
5386 }
5387 }
5388 }
5389
5390 var newChildren = iteratorFn.call(newChildrenIterable);
5391
5392 if (!(newChildren != null)) {
5393 {
5394 throw Error( "An iterable object provided no iterator." );
5395 }
5396 }
5397
5398 var resultingFirstChild = null;
5399 var previousNewFiber = null;
5400 var oldFiber = currentFirstChild;
5401 var lastPlacedIndex = 0;
5402 var newIdx = 0;
5403 var nextOldFiber = null;
5404 var step = newChildren.next();
5405
5406 for (; oldFiber !== null && !step.done; newIdx++, step = newChildren.next()) {
5407 if (oldFiber.index > newIdx) {
5408 nextOldFiber = oldFiber;
5409 oldFiber = null;
5410 } else {
5411 nextOldFiber = oldFiber.sibling;
5412 }
5413
5414 var newFiber = updateSlot(returnFiber, oldFiber, step.value, lanes);
5415
5416 if (newFiber === null) {
5417 // TODO: This breaks on empty slots like null children. That's
5418 // unfortunate because it triggers the slow path all the time. We need
5419 // a better way to communicate whether this was a miss or null,
5420 // boolean, undefined, etc.
5421 if (oldFiber === null) {
5422 oldFiber = nextOldFiber;
5423 }
5424
5425 break;
5426 }
5427
5428 if (shouldTrackSideEffects) {
5429 if (oldFiber && newFiber.alternate === null) {
5430 // We matched the slot, but we didn't reuse the existing fiber, so we
5431 // need to delete the existing child.
5432 deleteChild(returnFiber, oldFiber);
5433 }
5434 }
5435
5436 lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx);
5437
5438 if (previousNewFiber === null) {
5439 // TODO: Move out of the loop. This only happens for the first run.
5440 resultingFirstChild = newFiber;
5441 } else {
5442 // TODO: Defer siblings if we're not at the right index for this slot.
5443 // I.e. if we had null values before, then we want to defer this
5444 // for each null value. However, we also don't want to call updateSlot
5445 // with the previous one.
5446 previousNewFiber.sibling = newFiber;
5447 }
5448
5449 previousNewFiber = newFiber;
5450 oldFiber = nextOldFiber;
5451 }
5452
5453 if (step.done) {
5454 // We've reached the end of the new children. We can delete the rest.
5455 deleteRemainingChildren(returnFiber, oldFiber);
5456 return resultingFirstChild;
5457 }
5458
5459 if (oldFiber === null) {
5460 // If we don't have any more existing children we can choose a fast path
5461 // since the rest will all be insertions.
5462 for (; !step.done; newIdx++, step = newChildren.next()) {
5463 var _newFiber3 = createChild(returnFiber, step.value, lanes);
5464
5465 if (_newFiber3 === null) {
5466 continue;
5467 }
5468
5469 lastPlacedIndex = placeChild(_newFiber3, lastPlacedIndex, newIdx);
5470
5471 if (previousNewFiber === null) {
5472 // TODO: Move out of the loop. This only happens for the first run.
5473 resultingFirstChild = _newFiber3;
5474 } else {
5475 previousNewFiber.sibling = _newFiber3;
5476 }
5477
5478 previousNewFiber = _newFiber3;
5479 }
5480
5481 return resultingFirstChild;
5482 } // Add all children to a key map for quick lookups.
5483
5484
5485 var existingChildren = mapRemainingChildren(returnFiber, oldFiber); // Keep scanning and use the map to restore deleted items as moves.
5486
5487 for (; !step.done; newIdx++, step = newChildren.next()) {
5488 var _newFiber4 = updateFromMap(existingChildren, returnFiber, newIdx, step.value, lanes);
5489
5490 if (_newFiber4 !== null) {
5491 if (shouldTrackSideEffects) {
5492 if (_newFiber4.alternate !== null) {
5493 // The new fiber is a work in progress, but if there exists a
5494 // current, that means that we reused the fiber. We need to delete
5495 // it from the child list so that we don't add it to the deletion
5496 // list.
5497 existingChildren.delete(_newFiber4.key === null ? newIdx : _newFiber4.key);
5498 }
5499 }
5500
5501 lastPlacedIndex = placeChild(_newFiber4, lastPlacedIndex, newIdx);
5502
5503 if (previousNewFiber === null) {
5504 resultingFirstChild = _newFiber4;
5505 } else {
5506 previousNewFiber.sibling = _newFiber4;
5507 }
5508
5509 previousNewFiber = _newFiber4;
5510 }
5511 }
5512
5513 if (shouldTrackSideEffects) {
5514 // Any existing children that weren't consumed above were deleted. We need
5515 // to add them to the deletion list.
5516 existingChildren.forEach(function (child) {
5517 return deleteChild(returnFiber, child);
5518 });
5519 }
5520
5521 return resultingFirstChild;
5522 }
5523
5524 function reconcileSingleTextNode(returnFiber, currentFirstChild, textContent, lanes) {
5525 // There's no need to check for keys on text nodes since we don't have a
5526 // way to define them.
5527 if (currentFirstChild !== null && currentFirstChild.tag === HostText) {
5528 // We already have an existing node so let's just update it and delete
5529 // the rest.
5530 deleteRemainingChildren(returnFiber, currentFirstChild.sibling);
5531 var existing = useFiber(currentFirstChild, textContent);
5532 existing.return = returnFiber;
5533 return existing;
5534 } // The existing first child is not a text node so we need to create one
5535 // and delete the existing ones.
5536
5537
5538 deleteRemainingChildren(returnFiber, currentFirstChild);
5539 var created = createFiberFromText(textContent, returnFiber.mode, lanes);
5540 created.return = returnFiber;
5541 return created;
5542 }
5543
5544 function reconcileSingleElement(returnFiber, currentFirstChild, element, lanes) {
5545 var key = element.key;
5546 var child = currentFirstChild;
5547
5548 while (child !== null) {
5549 // TODO: If key === null and child.key === null, then this only applies to
5550 // the first item in the list.
5551 if (child.key === key) {
5552 switch (child.tag) {
5553 case Fragment:
5554 {
5555 if (element.type === REACT_FRAGMENT_TYPE) {
5556 deleteRemainingChildren(returnFiber, child.sibling);
5557 var existing = useFiber(child, element.props.children);
5558 existing.return = returnFiber;
5559
5560 {
5561 existing._debugSource = element._source;
5562 existing._debugOwner = element._owner;
5563 }
5564
5565 return existing;
5566 }
5567
5568 break;
5569 }
5570
5571 case Block:
5572
5573 // We intentionally fallthrough here if enableBlocksAPI is not on.
5574 // eslint-disable-next-lined no-fallthrough
5575
5576 default:
5577 {
5578 if (child.elementType === element.type || ( // Keep this check inline so it only runs on the false path:
5579 isCompatibleFamilyForHotReloading(child, element) )) {
5580 deleteRemainingChildren(returnFiber, child.sibling);
5581
5582 var _existing3 = useFiber(child, element.props);
5583
5584 _existing3.ref = coerceRef(returnFiber, child, element);
5585 _existing3.return = returnFiber;
5586
5587 {
5588 _existing3._debugSource = element._source;
5589 _existing3._debugOwner = element._owner;
5590 }
5591
5592 return _existing3;
5593 }
5594
5595 break;
5596 }
5597 } // Didn't match.
5598
5599
5600 deleteRemainingChildren(returnFiber, child);
5601 break;
5602 } else {
5603 deleteChild(returnFiber, child);
5604 }
5605
5606 child = child.sibling;
5607 }
5608
5609 if (element.type === REACT_FRAGMENT_TYPE) {
5610 var created = createFiberFromFragment(element.props.children, returnFiber.mode, lanes, element.key);
5611 created.return = returnFiber;
5612 return created;
5613 } else {
5614 var _created4 = createFiberFromElement(element, returnFiber.mode, lanes);
5615
5616 _created4.ref = coerceRef(returnFiber, currentFirstChild, element);
5617 _created4.return = returnFiber;
5618 return _created4;
5619 }
5620 }
5621
5622 function reconcileSinglePortal(returnFiber, currentFirstChild, portal, lanes) {
5623 var key = portal.key;
5624 var child = currentFirstChild;
5625
5626 while (child !== null) {
5627 // TODO: If key === null and child.key === null, then this only applies to
5628 // the first item in the list.
5629 if (child.key === key) {
5630 if (child.tag === HostPortal && child.stateNode.containerInfo === portal.containerInfo && child.stateNode.implementation === portal.implementation) {
5631 deleteRemainingChildren(returnFiber, child.sibling);
5632 var existing = useFiber(child, portal.children || []);
5633 existing.return = returnFiber;
5634 return existing;
5635 } else {
5636 deleteRemainingChildren(returnFiber, child);
5637 break;
5638 }
5639 } else {
5640 deleteChild(returnFiber, child);
5641 }
5642
5643 child = child.sibling;
5644 }
5645
5646 var created = createFiberFromPortal(portal, returnFiber.mode, lanes);
5647 created.return = returnFiber;
5648 return created;
5649 } // This API will tag the children with the side-effect of the reconciliation
5650 // itself. They will be added to the side-effect list as we pass through the
5651 // children and the parent.
5652
5653
5654 function reconcileChildFibers(returnFiber, currentFirstChild, newChild, lanes) {
5655 // This function is not recursive.
5656 // If the top level item is an array, we treat it as a set of children,
5657 // not as a fragment. Nested arrays on the other hand will be treated as
5658 // fragment nodes. Recursion happens at the normal flow.
5659 // Handle top level unkeyed fragments as if they were arrays.
5660 // This leads to an ambiguity between <>{[...]}</> and <>...</>.
5661 // We treat the ambiguous cases above the same.
5662 var isUnkeyedTopLevelFragment = typeof newChild === 'object' && newChild !== null && newChild.type === REACT_FRAGMENT_TYPE && newChild.key === null;
5663
5664 if (isUnkeyedTopLevelFragment) {
5665 newChild = newChild.props.children;
5666 } // Handle object types
5667
5668
5669 var isObject = typeof newChild === 'object' && newChild !== null;
5670
5671 if (isObject) {
5672 switch (newChild.$$typeof) {
5673 case REACT_ELEMENT_TYPE:
5674 return placeSingleChild(reconcileSingleElement(returnFiber, currentFirstChild, newChild, lanes));
5675
5676 case REACT_PORTAL_TYPE:
5677 return placeSingleChild(reconcileSinglePortal(returnFiber, currentFirstChild, newChild, lanes));
5678
5679 }
5680 }
5681
5682 if (typeof newChild === 'string' || typeof newChild === 'number') {
5683 return placeSingleChild(reconcileSingleTextNode(returnFiber, currentFirstChild, '' + newChild, lanes));
5684 }
5685
5686 if (isArray$1(newChild)) {
5687 return reconcileChildrenArray(returnFiber, currentFirstChild, newChild, lanes);
5688 }
5689
5690 if (getIteratorFn(newChild)) {
5691 return reconcileChildrenIterator(returnFiber, currentFirstChild, newChild, lanes);
5692 }
5693
5694 if (isObject) {
5695 throwOnInvalidObjectType(returnFiber, newChild);
5696 }
5697
5698 {
5699 if (typeof newChild === 'function') {
5700 warnOnFunctionType(returnFiber);
5701 }
5702 }
5703
5704 if (typeof newChild === 'undefined' && !isUnkeyedTopLevelFragment) {
5705 // If the new child is undefined, and the return fiber is a composite
5706 // component, throw an error. If Fiber return types are disabled,
5707 // we already threw above.
5708 switch (returnFiber.tag) {
5709 case ClassComponent:
5710 {
5711 {
5712 var instance = returnFiber.stateNode;
5713
5714 if (instance.render._isMockFunction) {
5715 // We allow auto-mocks to proceed as if they're returning null.
5716 break;
5717 }
5718 }
5719 }
5720 // Intentionally fall through to the next case, which handles both
5721 // functions and classes
5722 // eslint-disable-next-lined no-fallthrough
5723
5724 case Block:
5725 case FunctionComponent:
5726 case ForwardRef:
5727 case SimpleMemoComponent:
5728 {
5729 {
5730 {
5731 throw Error( (getComponentName(returnFiber.type) || 'Component') + "(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null." );
5732 }
5733 }
5734 }
5735 }
5736 } // Remaining cases are all treated as empty.
5737
5738
5739 return deleteRemainingChildren(returnFiber, currentFirstChild);
5740 }
5741
5742 return reconcileChildFibers;
5743}
5744
5745var reconcileChildFibers = ChildReconciler(true);
5746var mountChildFibers = ChildReconciler(false);
5747function cloneChildFibers(current, workInProgress) {
5748 if (!(current === null || workInProgress.child === current.child)) {
5749 {
5750 throw Error( "Resuming work not yet implemented." );
5751 }
5752 }
5753
5754 if (workInProgress.child === null) {
5755 return;
5756 }
5757
5758 var currentChild = workInProgress.child;
5759 var newChild = createWorkInProgress(currentChild, currentChild.pendingProps);
5760 workInProgress.child = newChild;
5761 newChild.return = workInProgress;
5762
5763 while (currentChild.sibling !== null) {
5764 currentChild = currentChild.sibling;
5765 newChild = newChild.sibling = createWorkInProgress(currentChild, currentChild.pendingProps);
5766 newChild.return = workInProgress;
5767 }
5768
5769 newChild.sibling = null;
5770} // Reset a workInProgress child set to prepare it for a second pass.
5771
5772function resetChildFibers(workInProgress, lanes) {
5773 var child = workInProgress.child;
5774
5775 while (child !== null) {
5776 resetWorkInProgress(child, lanes);
5777 child = child.sibling;
5778 }
5779}
5780
5781var NO_CONTEXT$1 = {};
5782var contextStackCursor$1 = createCursor(NO_CONTEXT$1);
5783var contextFiberStackCursor = createCursor(NO_CONTEXT$1);
5784var rootInstanceStackCursor = createCursor(NO_CONTEXT$1);
5785
5786function requiredContext(c) {
5787 if (!(c !== NO_CONTEXT$1)) {
5788 {
5789 throw Error( "Expected host context to exist. This error is likely caused by a bug in React. Please file an issue." );
5790 }
5791 }
5792
5793 return c;
5794}
5795
5796function getRootHostContainer() {
5797 var rootInstance = requiredContext(rootInstanceStackCursor.current);
5798 return rootInstance;
5799}
5800
5801function pushHostContainer(fiber, nextRootInstance) {
5802 // Push current root instance onto the stack;
5803 // This allows us to reset root when portals are popped.
5804 push(rootInstanceStackCursor, nextRootInstance, fiber); // Track the context and the Fiber that provided it.
5805 // This enables us to pop only Fibers that provide unique contexts.
5806
5807 push(contextFiberStackCursor, fiber, fiber); // Finally, we need to push the host context to the stack.
5808 // However, we can't just call getRootHostContext() and push it because
5809 // we'd have a different number of entries on the stack depending on
5810 // whether getRootHostContext() throws somewhere in renderer code or not.
5811 // So we push an empty value first. This lets us safely unwind on errors.
5812
5813 push(contextStackCursor$1, NO_CONTEXT$1, fiber);
5814 var nextRootContext = getRootHostContext(); // Now that we know this function doesn't throw, replace it.
5815
5816 pop(contextStackCursor$1, fiber);
5817 push(contextStackCursor$1, nextRootContext, fiber);
5818}
5819
5820function popHostContainer(fiber) {
5821 pop(contextStackCursor$1, fiber);
5822 pop(contextFiberStackCursor, fiber);
5823 pop(rootInstanceStackCursor, fiber);
5824}
5825
5826function getHostContext() {
5827 var context = requiredContext(contextStackCursor$1.current);
5828 return context;
5829}
5830
5831function pushHostContext(fiber) {
5832 var rootInstance = requiredContext(rootInstanceStackCursor.current);
5833 var context = requiredContext(contextStackCursor$1.current);
5834 var nextContext = getChildHostContext(context, fiber.type); // Don't push this Fiber's context unless it's unique.
5835
5836 if (context === nextContext) {
5837 return;
5838 } // Track the context and the Fiber that provided it.
5839 // This enables us to pop only Fibers that provide unique contexts.
5840
5841
5842 push(contextFiberStackCursor, fiber, fiber);
5843 push(contextStackCursor$1, nextContext, fiber);
5844}
5845
5846function popHostContext(fiber) {
5847 // Do not pop unless this Fiber provided the current context.
5848 // pushHostContext() only pushes Fibers that provide unique contexts.
5849 if (contextFiberStackCursor.current !== fiber) {
5850 return;
5851 }
5852
5853 pop(contextStackCursor$1, fiber);
5854 pop(contextFiberStackCursor, fiber);
5855}
5856
5857var DefaultSuspenseContext = 0; // The Suspense Context is split into two parts. The lower bits is
5858// inherited deeply down the subtree. The upper bits only affect
5859// this immediate suspense boundary and gets reset each new
5860// boundary or suspense list.
5861
5862var SubtreeSuspenseContextMask = 1; // Subtree Flags:
5863// InvisibleParentSuspenseContext indicates that one of our parent Suspense
5864// boundaries is not currently showing visible main content.
5865// Either because it is already showing a fallback or is not mounted at all.
5866// We can use this to determine if it is desirable to trigger a fallback at
5867// the parent. If not, then we might need to trigger undesirable boundaries
5868// and/or suspend the commit to avoid hiding the parent content.
5869
5870var InvisibleParentSuspenseContext = 1; // Shallow Flags:
5871// ForceSuspenseFallback can be used by SuspenseList to force newly added
5872// items into their fallback state during one of the render passes.
5873
5874var ForceSuspenseFallback = 2;
5875var suspenseStackCursor = createCursor(DefaultSuspenseContext);
5876function hasSuspenseContext(parentContext, flag) {
5877 return (parentContext & flag) !== 0;
5878}
5879function setDefaultShallowSuspenseContext(parentContext) {
5880 return parentContext & SubtreeSuspenseContextMask;
5881}
5882function setShallowSuspenseContext(parentContext, shallowContext) {
5883 return parentContext & SubtreeSuspenseContextMask | shallowContext;
5884}
5885function addSubtreeSuspenseContext(parentContext, subtreeContext) {
5886 return parentContext | subtreeContext;
5887}
5888function pushSuspenseContext(fiber, newContext) {
5889 push(suspenseStackCursor, newContext, fiber);
5890}
5891function popSuspenseContext(fiber) {
5892 pop(suspenseStackCursor, fiber);
5893}
5894
5895function shouldCaptureSuspense(workInProgress, hasInvisibleParent) {
5896 // If it was the primary children that just suspended, capture and render the
5897 // fallback. Otherwise, don't capture and bubble to the next boundary.
5898 var nextState = workInProgress.memoizedState;
5899
5900 if (nextState !== null) {
5901 if (nextState.dehydrated !== null) {
5902 // A dehydrated boundary always captures.
5903 return true;
5904 }
5905
5906 return false;
5907 }
5908
5909 var props = workInProgress.memoizedProps; // In order to capture, the Suspense component must have a fallback prop.
5910
5911 if (props.fallback === undefined) {
5912 return false;
5913 } // Regular boundaries always capture.
5914
5915
5916 if (props.unstable_avoidThisFallback !== true) {
5917 return true;
5918 } // If it's a boundary we should avoid, then we prefer to bubble up to the
5919 // parent boundary if it is currently invisible.
5920
5921
5922 if (hasInvisibleParent) {
5923 return false;
5924 } // If the parent is not able to handle it, we must handle it.
5925
5926
5927 return true;
5928}
5929function findFirstSuspended(row) {
5930 var node = row;
5931
5932 while (node !== null) {
5933 if (node.tag === SuspenseComponent) {
5934 var state = node.memoizedState;
5935
5936 if (state !== null) {
5937 var dehydrated = state.dehydrated;
5938
5939 if (dehydrated === null || isSuspenseInstancePending() || isSuspenseInstanceFallback()) {
5940 return node;
5941 }
5942 }
5943 } else if (node.tag === SuspenseListComponent && // revealOrder undefined can't be trusted because it don't
5944 // keep track of whether it suspended or not.
5945 node.memoizedProps.revealOrder !== undefined) {
5946 var didSuspend = (node.flags & DidCapture) !== NoFlags;
5947
5948 if (didSuspend) {
5949 return node;
5950 }
5951 } else if (node.child !== null) {
5952 node.child.return = node;
5953 node = node.child;
5954 continue;
5955 }
5956
5957 if (node === row) {
5958 return null;
5959 }
5960
5961 while (node.sibling === null) {
5962 if (node.return === null || node.return === row) {
5963 return null;
5964 }
5965
5966 node = node.return;
5967 }
5968
5969 node.sibling.return = node.return;
5970 node = node.sibling;
5971 }
5972
5973 return null;
5974}
5975
5976var NoFlags$1 =
5977/* */
59780; // Represents whether effect should fire.
5979
5980var HasEffect =
5981/* */
59821; // Represents the phase in which the effect (not the clean-up) fires.
5983
5984var Layout =
5985/* */
59862;
5987var Passive$1 =
5988/* */
59894;
5990
5991var isHydrating = false;
5992
5993function enterHydrationState(fiber) {
5994 {
5995 return false;
5996 }
5997}
5998
5999function prepareToHydrateHostInstance(fiber, rootContainerInstance, hostContext) {
6000 {
6001 {
6002 {
6003 throw Error( "Expected prepareToHydrateHostInstance() to never be called. This error is likely caused by a bug in React. Please file an issue." );
6004 }
6005 }
6006 }
6007}
6008
6009function prepareToHydrateHostTextInstance(fiber) {
6010 {
6011 {
6012 {
6013 throw Error( "Expected prepareToHydrateHostTextInstance() to never be called. This error is likely caused by a bug in React. Please file an issue." );
6014 }
6015 }
6016 }
6017 var shouldUpdate = hydrateTextInstance();
6018}
6019
6020function popHydrationState(fiber) {
6021 {
6022 return false;
6023 }
6024}
6025
6026function getIsHydrating() {
6027 return isHydrating;
6028}
6029
6030// and should be reset before starting a new render.
6031// This tracks which mutable sources need to be reset after a render.
6032
6033var workInProgressSources = [];
6034var rendererSigil$1;
6035
6036{
6037 // Used to detect multiple renderers using the same mutable source.
6038 rendererSigil$1 = {};
6039}
6040
6041function markSourceAsDirty(mutableSource) {
6042 workInProgressSources.push(mutableSource);
6043}
6044function resetWorkInProgressVersions() {
6045 for (var i = 0; i < workInProgressSources.length; i++) {
6046 var mutableSource = workInProgressSources[i];
6047
6048 {
6049 mutableSource._workInProgressVersionSecondary = null;
6050 }
6051 }
6052
6053 workInProgressSources.length = 0;
6054}
6055function getWorkInProgressVersion(mutableSource) {
6056 {
6057 return mutableSource._workInProgressVersionSecondary;
6058 }
6059}
6060function setWorkInProgressVersion(mutableSource, version) {
6061 {
6062 mutableSource._workInProgressVersionSecondary = version;
6063 }
6064
6065 workInProgressSources.push(mutableSource);
6066}
6067function warnAboutMultipleRenderersDEV(mutableSource) {
6068 {
6069 {
6070 if (mutableSource._currentSecondaryRenderer == null) {
6071 mutableSource._currentSecondaryRenderer = rendererSigil$1;
6072 } else if (mutableSource._currentSecondaryRenderer !== rendererSigil$1) {
6073 error('Detected multiple renderers concurrently rendering the ' + 'same mutable source. This is currently unsupported.');
6074 }
6075 }
6076 }
6077} // Eager reads the version of a mutable source and stores it on the root.
6078
6079var ReactCurrentDispatcher$1 = ReactSharedInternals.ReactCurrentDispatcher,
6080 ReactCurrentBatchConfig$1 = ReactSharedInternals.ReactCurrentBatchConfig;
6081var didWarnAboutMismatchedHooksForComponent;
6082var didWarnAboutUseOpaqueIdentifier;
6083
6084{
6085 didWarnAboutUseOpaqueIdentifier = {};
6086 didWarnAboutMismatchedHooksForComponent = new Set();
6087}
6088
6089// These are set right before calling the component.
6090var renderLanes = NoLanes; // The work-in-progress fiber. I've named it differently to distinguish it from
6091// the work-in-progress hook.
6092
6093var currentlyRenderingFiber$1 = null; // Hooks are stored as a linked list on the fiber's memoizedState field. The
6094// current hook list is the list that belongs to the current fiber. The
6095// work-in-progress hook list is a new list that will be added to the
6096// work-in-progress fiber.
6097
6098var currentHook = null;
6099var workInProgressHook = null; // Whether an update was scheduled at any point during the render phase. This
6100// does not get reset if we do another render pass; only when we're completely
6101// finished evaluating this component. This is an optimization so we know
6102// whether we need to clear render phase updates after a throw.
6103
6104var didScheduleRenderPhaseUpdate = false; // Where an update was scheduled only during the current render pass. This
6105// gets reset after each attempt.
6106// TODO: Maybe there's some way to consolidate this with
6107// `didScheduleRenderPhaseUpdate`. Or with `numberOfReRenders`.
6108
6109var didScheduleRenderPhaseUpdateDuringThisPass = false;
6110var RE_RENDER_LIMIT = 25; // In DEV, this is the name of the currently executing primitive hook
6111
6112var currentHookNameInDev = null; // In DEV, this list ensures that hooks are called in the same order between renders.
6113// The list stores the order of hooks used during the initial render (mount).
6114// Subsequent renders (updates) reference this list.
6115
6116var hookTypesDev = null;
6117var hookTypesUpdateIndexDev = -1; // In DEV, this tracks whether currently rendering component needs to ignore
6118// the dependencies for Hooks that need them (e.g. useEffect or useMemo).
6119// When true, such Hooks will always be "remounted". Only used during hot reload.
6120
6121var ignorePreviousDependencies = false;
6122
6123function mountHookTypesDev() {
6124 {
6125 var hookName = currentHookNameInDev;
6126
6127 if (hookTypesDev === null) {
6128 hookTypesDev = [hookName];
6129 } else {
6130 hookTypesDev.push(hookName);
6131 }
6132 }
6133}
6134
6135function updateHookTypesDev() {
6136 {
6137 var hookName = currentHookNameInDev;
6138
6139 if (hookTypesDev !== null) {
6140 hookTypesUpdateIndexDev++;
6141
6142 if (hookTypesDev[hookTypesUpdateIndexDev] !== hookName) {
6143 warnOnHookMismatchInDev(hookName);
6144 }
6145 }
6146 }
6147}
6148
6149function checkDepsAreArrayDev(deps) {
6150 {
6151 if (deps !== undefined && deps !== null && !Array.isArray(deps)) {
6152 // Verify deps, but only on mount to avoid extra checks.
6153 // It's unlikely their type would change as usually you define them inline.
6154 error('%s received a final argument that is not an array (instead, received `%s`). When ' + 'specified, the final argument must be an array.', currentHookNameInDev, typeof deps);
6155 }
6156 }
6157}
6158
6159function warnOnHookMismatchInDev(currentHookName) {
6160 {
6161 var componentName = getComponentName(currentlyRenderingFiber$1.type);
6162
6163 if (!didWarnAboutMismatchedHooksForComponent.has(componentName)) {
6164 didWarnAboutMismatchedHooksForComponent.add(componentName);
6165
6166 if (hookTypesDev !== null) {
6167 var table = '';
6168 var secondColumnStart = 30;
6169
6170 for (var i = 0; i <= hookTypesUpdateIndexDev; i++) {
6171 var oldHookName = hookTypesDev[i];
6172 var newHookName = i === hookTypesUpdateIndexDev ? currentHookName : oldHookName;
6173 var row = i + 1 + ". " + oldHookName; // Extra space so second column lines up
6174 // lol @ IE not supporting String#repeat
6175
6176 while (row.length < secondColumnStart) {
6177 row += ' ';
6178 }
6179
6180 row += newHookName + '\n';
6181 table += row;
6182 }
6183
6184 error('React has detected a change in the order of Hooks called by %s. ' + 'This will lead to bugs and errors if not fixed. ' + 'For more information, read the Rules of Hooks: https://reactjs.org/link/rules-of-hooks\n\n' + ' Previous render Next render\n' + ' ------------------------------------------------------\n' + '%s' + ' ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^\n', componentName, table);
6185 }
6186 }
6187 }
6188}
6189
6190function throwInvalidHookError() {
6191 {
6192 {
6193 throw Error( "Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:\n1. You might have mismatching versions of React and the renderer (such as React DOM)\n2. You might be breaking the Rules of Hooks\n3. You might have more than one copy of React in the same app\nSee https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem." );
6194 }
6195 }
6196}
6197
6198function areHookInputsEqual(nextDeps, prevDeps) {
6199 {
6200 if (ignorePreviousDependencies) {
6201 // Only true when this component is being hot reloaded.
6202 return false;
6203 }
6204 }
6205
6206 if (prevDeps === null) {
6207 {
6208 error('%s received a final argument during this render, but not during ' + 'the previous render. Even though the final argument is optional, ' + 'its type cannot change between renders.', currentHookNameInDev);
6209 }
6210
6211 return false;
6212 }
6213
6214 {
6215 // Don't bother comparing lengths in prod because these arrays should be
6216 // passed inline.
6217 if (nextDeps.length !== prevDeps.length) {
6218 error('The final argument passed to %s changed size between renders. The ' + 'order and size of this array must remain constant.\n\n' + 'Previous: %s\n' + 'Incoming: %s', currentHookNameInDev, "[" + prevDeps.join(', ') + "]", "[" + nextDeps.join(', ') + "]");
6219 }
6220 }
6221
6222 for (var i = 0; i < prevDeps.length && i < nextDeps.length; i++) {
6223 if (objectIs(nextDeps[i], prevDeps[i])) {
6224 continue;
6225 }
6226
6227 return false;
6228 }
6229
6230 return true;
6231}
6232
6233function renderWithHooks(current, workInProgress, Component, props, secondArg, nextRenderLanes) {
6234 renderLanes = nextRenderLanes;
6235 currentlyRenderingFiber$1 = workInProgress;
6236
6237 {
6238 hookTypesDev = current !== null ? current._debugHookTypes : null;
6239 hookTypesUpdateIndexDev = -1; // Used for hot reloading:
6240
6241 ignorePreviousDependencies = current !== null && current.type !== workInProgress.type;
6242 }
6243
6244 workInProgress.memoizedState = null;
6245 workInProgress.updateQueue = null;
6246 workInProgress.lanes = NoLanes; // The following should have already been reset
6247 // currentHook = null;
6248 // workInProgressHook = null;
6249 // didScheduleRenderPhaseUpdate = false;
6250 // TODO Warn if no hooks are used at all during mount, then some are used during update.
6251 // Currently we will identify the update render as a mount because memoizedState === null.
6252 // This is tricky because it's valid for certain types of components (e.g. React.lazy)
6253 // Using memoizedState to differentiate between mount/update only works if at least one stateful hook is used.
6254 // Non-stateful hooks (e.g. context) don't get added to memoizedState,
6255 // so memoizedState would be null during updates and mounts.
6256
6257 {
6258 if (current !== null && current.memoizedState !== null) {
6259 ReactCurrentDispatcher$1.current = HooksDispatcherOnUpdateInDEV;
6260 } else if (hookTypesDev !== null) {
6261 // This dispatcher handles an edge case where a component is updating,
6262 // but no stateful hooks have been used.
6263 // We want to match the production code behavior (which will use HooksDispatcherOnMount),
6264 // but with the extra DEV validation to ensure hooks ordering hasn't changed.
6265 // This dispatcher does that.
6266 ReactCurrentDispatcher$1.current = HooksDispatcherOnMountWithHookTypesInDEV;
6267 } else {
6268 ReactCurrentDispatcher$1.current = HooksDispatcherOnMountInDEV;
6269 }
6270 }
6271
6272 var children = Component(props, secondArg); // Check if there was a render phase update
6273
6274 if (didScheduleRenderPhaseUpdateDuringThisPass) {
6275 // Keep rendering in a loop for as long as render phase updates continue to
6276 // be scheduled. Use a counter to prevent infinite loops.
6277 var numberOfReRenders = 0;
6278
6279 do {
6280 didScheduleRenderPhaseUpdateDuringThisPass = false;
6281
6282 if (!(numberOfReRenders < RE_RENDER_LIMIT)) {
6283 {
6284 throw Error( "Too many re-renders. React limits the number of renders to prevent an infinite loop." );
6285 }
6286 }
6287
6288 numberOfReRenders += 1;
6289
6290 {
6291 // Even when hot reloading, allow dependencies to stabilize
6292 // after first render to prevent infinite render phase updates.
6293 ignorePreviousDependencies = false;
6294 } // Start over from the beginning of the list
6295
6296
6297 currentHook = null;
6298 workInProgressHook = null;
6299 workInProgress.updateQueue = null;
6300
6301 {
6302 // Also validate hook order for cascading updates.
6303 hookTypesUpdateIndexDev = -1;
6304 }
6305
6306 ReactCurrentDispatcher$1.current = HooksDispatcherOnRerenderInDEV ;
6307 children = Component(props, secondArg);
6308 } while (didScheduleRenderPhaseUpdateDuringThisPass);
6309 } // We can assume the previous dispatcher is always this one, since we set it
6310 // at the beginning of the render phase and there's no re-entrancy.
6311
6312
6313 ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
6314
6315 {
6316 workInProgress._debugHookTypes = hookTypesDev;
6317 } // This check uses currentHook so that it works the same in DEV and prod bundles.
6318 // hookTypesDev could catch more cases (e.g. context) but only in DEV bundles.
6319
6320
6321 var didRenderTooFewHooks = currentHook !== null && currentHook.next !== null;
6322 renderLanes = NoLanes;
6323 currentlyRenderingFiber$1 = null;
6324 currentHook = null;
6325 workInProgressHook = null;
6326
6327 {
6328 currentHookNameInDev = null;
6329 hookTypesDev = null;
6330 hookTypesUpdateIndexDev = -1;
6331 }
6332
6333 didScheduleRenderPhaseUpdate = false;
6334
6335 if (!!didRenderTooFewHooks) {
6336 {
6337 throw Error( "Rendered fewer hooks than expected. This may be caused by an accidental early return statement." );
6338 }
6339 }
6340
6341 return children;
6342}
6343function bailoutHooks(current, workInProgress, lanes) {
6344 workInProgress.updateQueue = current.updateQueue;
6345 workInProgress.flags &= ~(Passive | Update);
6346 current.lanes = removeLanes(current.lanes, lanes);
6347}
6348function resetHooksAfterThrow() {
6349 // We can assume the previous dispatcher is always this one, since we set it
6350 // at the beginning of the render phase and there's no re-entrancy.
6351 ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
6352
6353 if (didScheduleRenderPhaseUpdate) {
6354 // There were render phase updates. These are only valid for this render
6355 // phase, which we are now aborting. Remove the updates from the queues so
6356 // they do not persist to the next render. Do not remove updates from hooks
6357 // that weren't processed.
6358 //
6359 // Only reset the updates from the queue if it has a clone. If it does
6360 // not have a clone, that means it wasn't processed, and the updates were
6361 // scheduled before we entered the render phase.
6362 var hook = currentlyRenderingFiber$1.memoizedState;
6363
6364 while (hook !== null) {
6365 var queue = hook.queue;
6366
6367 if (queue !== null) {
6368 queue.pending = null;
6369 }
6370
6371 hook = hook.next;
6372 }
6373
6374 didScheduleRenderPhaseUpdate = false;
6375 }
6376
6377 renderLanes = NoLanes;
6378 currentlyRenderingFiber$1 = null;
6379 currentHook = null;
6380 workInProgressHook = null;
6381
6382 {
6383 hookTypesDev = null;
6384 hookTypesUpdateIndexDev = -1;
6385 currentHookNameInDev = null;
6386 isUpdatingOpaqueValueInRenderPhase = false;
6387 }
6388
6389 didScheduleRenderPhaseUpdateDuringThisPass = false;
6390}
6391
6392function mountWorkInProgressHook() {
6393 var hook = {
6394 memoizedState: null,
6395 baseState: null,
6396 baseQueue: null,
6397 queue: null,
6398 next: null
6399 };
6400
6401 if (workInProgressHook === null) {
6402 // This is the first hook in the list
6403 currentlyRenderingFiber$1.memoizedState = workInProgressHook = hook;
6404 } else {
6405 // Append to the end of the list
6406 workInProgressHook = workInProgressHook.next = hook;
6407 }
6408
6409 return workInProgressHook;
6410}
6411
6412function updateWorkInProgressHook() {
6413 // This function is used both for updates and for re-renders triggered by a
6414 // render phase update. It assumes there is either a current hook we can
6415 // clone, or a work-in-progress hook from a previous render pass that we can
6416 // use as a base. When we reach the end of the base list, we must switch to
6417 // the dispatcher used for mounts.
6418 var nextCurrentHook;
6419
6420 if (currentHook === null) {
6421 var current = currentlyRenderingFiber$1.alternate;
6422
6423 if (current !== null) {
6424 nextCurrentHook = current.memoizedState;
6425 } else {
6426 nextCurrentHook = null;
6427 }
6428 } else {
6429 nextCurrentHook = currentHook.next;
6430 }
6431
6432 var nextWorkInProgressHook;
6433
6434 if (workInProgressHook === null) {
6435 nextWorkInProgressHook = currentlyRenderingFiber$1.memoizedState;
6436 } else {
6437 nextWorkInProgressHook = workInProgressHook.next;
6438 }
6439
6440 if (nextWorkInProgressHook !== null) {
6441 // There's already a work-in-progress. Reuse it.
6442 workInProgressHook = nextWorkInProgressHook;
6443 nextWorkInProgressHook = workInProgressHook.next;
6444 currentHook = nextCurrentHook;
6445 } else {
6446 // Clone from the current hook.
6447 if (!(nextCurrentHook !== null)) {
6448 {
6449 throw Error( "Rendered more hooks than during the previous render." );
6450 }
6451 }
6452
6453 currentHook = nextCurrentHook;
6454 var newHook = {
6455 memoizedState: currentHook.memoizedState,
6456 baseState: currentHook.baseState,
6457 baseQueue: currentHook.baseQueue,
6458 queue: currentHook.queue,
6459 next: null
6460 };
6461
6462 if (workInProgressHook === null) {
6463 // This is the first hook in the list.
6464 currentlyRenderingFiber$1.memoizedState = workInProgressHook = newHook;
6465 } else {
6466 // Append to the end of the list.
6467 workInProgressHook = workInProgressHook.next = newHook;
6468 }
6469 }
6470
6471 return workInProgressHook;
6472}
6473
6474function createFunctionComponentUpdateQueue() {
6475 return {
6476 lastEffect: null
6477 };
6478}
6479
6480function basicStateReducer(state, action) {
6481 // $FlowFixMe: Flow doesn't like mixed types
6482 return typeof action === 'function' ? action(state) : action;
6483}
6484
6485function mountReducer(reducer, initialArg, init) {
6486 var hook = mountWorkInProgressHook();
6487 var initialState;
6488
6489 if (init !== undefined) {
6490 initialState = init(initialArg);
6491 } else {
6492 initialState = initialArg;
6493 }
6494
6495 hook.memoizedState = hook.baseState = initialState;
6496 var queue = hook.queue = {
6497 pending: null,
6498 dispatch: null,
6499 lastRenderedReducer: reducer,
6500 lastRenderedState: initialState
6501 };
6502 var dispatch = queue.dispatch = dispatchAction.bind(null, currentlyRenderingFiber$1, queue);
6503 return [hook.memoizedState, dispatch];
6504}
6505
6506function updateReducer(reducer, initialArg, init) {
6507 var hook = updateWorkInProgressHook();
6508 var queue = hook.queue;
6509
6510 if (!(queue !== null)) {
6511 {
6512 throw Error( "Should have a queue. This is likely a bug in React. Please file an issue." );
6513 }
6514 }
6515
6516 queue.lastRenderedReducer = reducer;
6517 var current = currentHook; // The last rebase update that is NOT part of the base state.
6518
6519 var baseQueue = current.baseQueue; // The last pending update that hasn't been processed yet.
6520
6521 var pendingQueue = queue.pending;
6522
6523 if (pendingQueue !== null) {
6524 // We have new updates that haven't been processed yet.
6525 // We'll add them to the base queue.
6526 if (baseQueue !== null) {
6527 // Merge the pending queue and the base queue.
6528 var baseFirst = baseQueue.next;
6529 var pendingFirst = pendingQueue.next;
6530 baseQueue.next = pendingFirst;
6531 pendingQueue.next = baseFirst;
6532 }
6533
6534 {
6535 if (current.baseQueue !== baseQueue) {
6536 // Internal invariant that should never happen, but feasibly could in
6537 // the future if we implement resuming, or some form of that.
6538 error('Internal error: Expected work-in-progress queue to be a clone. ' + 'This is a bug in React.');
6539 }
6540 }
6541
6542 current.baseQueue = baseQueue = pendingQueue;
6543 queue.pending = null;
6544 }
6545
6546 if (baseQueue !== null) {
6547 // We have a queue to process.
6548 var first = baseQueue.next;
6549 var newState = current.baseState;
6550 var newBaseState = null;
6551 var newBaseQueueFirst = null;
6552 var newBaseQueueLast = null;
6553 var update = first;
6554
6555 do {
6556 var updateLane = update.lane;
6557
6558 if (!isSubsetOfLanes(renderLanes, updateLane)) {
6559 // Priority is insufficient. Skip this update. If this is the first
6560 // skipped update, the previous update/state is the new base
6561 // update/state.
6562 var clone = {
6563 lane: updateLane,
6564 action: update.action,
6565 eagerReducer: update.eagerReducer,
6566 eagerState: update.eagerState,
6567 next: null
6568 };
6569
6570 if (newBaseQueueLast === null) {
6571 newBaseQueueFirst = newBaseQueueLast = clone;
6572 newBaseState = newState;
6573 } else {
6574 newBaseQueueLast = newBaseQueueLast.next = clone;
6575 } // Update the remaining priority in the queue.
6576 // TODO: Don't need to accumulate this. Instead, we can remove
6577 // renderLanes from the original lanes.
6578
6579
6580 currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, updateLane);
6581 markSkippedUpdateLanes(updateLane);
6582 } else {
6583 // This update does have sufficient priority.
6584 if (newBaseQueueLast !== null) {
6585 var _clone = {
6586 // This update is going to be committed so we never want uncommit
6587 // it. Using NoLane works because 0 is a subset of all bitmasks, so
6588 // this will never be skipped by the check above.
6589 lane: NoLane,
6590 action: update.action,
6591 eagerReducer: update.eagerReducer,
6592 eagerState: update.eagerState,
6593 next: null
6594 };
6595 newBaseQueueLast = newBaseQueueLast.next = _clone;
6596 } // Process this update.
6597
6598
6599 if (update.eagerReducer === reducer) {
6600 // If this update was processed eagerly, and its reducer matches the
6601 // current reducer, we can use the eagerly computed state.
6602 newState = update.eagerState;
6603 } else {
6604 var action = update.action;
6605 newState = reducer(newState, action);
6606 }
6607 }
6608
6609 update = update.next;
6610 } while (update !== null && update !== first);
6611
6612 if (newBaseQueueLast === null) {
6613 newBaseState = newState;
6614 } else {
6615 newBaseQueueLast.next = newBaseQueueFirst;
6616 } // Mark that the fiber performed work, but only if the new state is
6617 // different from the current state.
6618
6619
6620 if (!objectIs(newState, hook.memoizedState)) {
6621 markWorkInProgressReceivedUpdate();
6622 }
6623
6624 hook.memoizedState = newState;
6625 hook.baseState = newBaseState;
6626 hook.baseQueue = newBaseQueueLast;
6627 queue.lastRenderedState = newState;
6628 }
6629
6630 var dispatch = queue.dispatch;
6631 return [hook.memoizedState, dispatch];
6632}
6633
6634function rerenderReducer(reducer, initialArg, init) {
6635 var hook = updateWorkInProgressHook();
6636 var queue = hook.queue;
6637
6638 if (!(queue !== null)) {
6639 {
6640 throw Error( "Should have a queue. This is likely a bug in React. Please file an issue." );
6641 }
6642 }
6643
6644 queue.lastRenderedReducer = reducer; // This is a re-render. Apply the new render phase updates to the previous
6645 // work-in-progress hook.
6646
6647 var dispatch = queue.dispatch;
6648 var lastRenderPhaseUpdate = queue.pending;
6649 var newState = hook.memoizedState;
6650
6651 if (lastRenderPhaseUpdate !== null) {
6652 // The queue doesn't persist past this render pass.
6653 queue.pending = null;
6654 var firstRenderPhaseUpdate = lastRenderPhaseUpdate.next;
6655 var update = firstRenderPhaseUpdate;
6656
6657 do {
6658 // Process this render phase update. We don't have to check the
6659 // priority because it will always be the same as the current
6660 // render's.
6661 var action = update.action;
6662 newState = reducer(newState, action);
6663 update = update.next;
6664 } while (update !== firstRenderPhaseUpdate); // Mark that the fiber performed work, but only if the new state is
6665 // different from the current state.
6666
6667
6668 if (!objectIs(newState, hook.memoizedState)) {
6669 markWorkInProgressReceivedUpdate();
6670 }
6671
6672 hook.memoizedState = newState; // Don't persist the state accumulated from the render phase updates to
6673 // the base state unless the queue is empty.
6674 // TODO: Not sure if this is the desired semantics, but it's what we
6675 // do for gDSFP. I can't remember why.
6676
6677 if (hook.baseQueue === null) {
6678 hook.baseState = newState;
6679 }
6680
6681 queue.lastRenderedState = newState;
6682 }
6683
6684 return [newState, dispatch];
6685}
6686
6687function readFromUnsubcribedMutableSource(root, source, getSnapshot) {
6688 {
6689 warnAboutMultipleRenderersDEV(source);
6690 }
6691
6692 var getVersion = source._getVersion;
6693 var version = getVersion(source._source); // Is it safe for this component to read from this source during the current render?
6694
6695 var isSafeToReadFromSource = false; // Check the version first.
6696 // If this render has already been started with a specific version,
6697 // we can use it alone to determine if we can safely read from the source.
6698
6699 var currentRenderVersion = getWorkInProgressVersion(source);
6700
6701 if (currentRenderVersion !== null) {
6702 // It's safe to read if the store hasn't been mutated since the last time
6703 // we read something.
6704 isSafeToReadFromSource = currentRenderVersion === version;
6705 } else {
6706 // If there's no version, then this is the first time we've read from the
6707 // source during the current render pass, so we need to do a bit more work.
6708 // What we need to determine is if there are any hooks that already
6709 // subscribed to the source, and if so, whether there are any pending
6710 // mutations that haven't been synchronized yet.
6711 //
6712 // If there are no pending mutations, then `root.mutableReadLanes` will be
6713 // empty, and we know we can safely read.
6714 //
6715 // If there *are* pending mutations, we may still be able to safely read
6716 // if the currently rendering lanes are inclusive of the pending mutation
6717 // lanes, since that guarantees that the value we're about to read from
6718 // the source is consistent with the values that we read during the most
6719 // recent mutation.
6720 isSafeToReadFromSource = isSubsetOfLanes(renderLanes, root.mutableReadLanes);
6721
6722 if (isSafeToReadFromSource) {
6723 // If it's safe to read from this source during the current render,
6724 // store the version in case other components read from it.
6725 // A changed version number will let those components know to throw and restart the render.
6726 setWorkInProgressVersion(source, version);
6727 }
6728 }
6729
6730 if (isSafeToReadFromSource) {
6731 var snapshot = getSnapshot(source._source);
6732
6733 {
6734 if (typeof snapshot === 'function') {
6735 error('Mutable source should not return a function as the snapshot value. ' + 'Functions may close over mutable values and cause tearing.');
6736 }
6737 }
6738
6739 return snapshot;
6740 } else {
6741 // This handles the special case of a mutable source being shared between renderers.
6742 // In that case, if the source is mutated between the first and second renderer,
6743 // The second renderer don't know that it needs to reset the WIP version during unwind,
6744 // (because the hook only marks sources as dirty if it's written to their WIP version).
6745 // That would cause this tear check to throw again and eventually be visible to the user.
6746 // We can avoid this infinite loop by explicitly marking the source as dirty.
6747 //
6748 // This can lead to tearing in the first renderer when it resumes,
6749 // but there's nothing we can do about that (short of throwing here and refusing to continue the render).
6750 markSourceAsDirty(source);
6751
6752 {
6753 {
6754 throw Error( "Cannot read from mutable source during the current render without tearing. This is a bug in React. Please file an issue." );
6755 }
6756 }
6757 }
6758}
6759
6760function useMutableSource(hook, source, getSnapshot, subscribe) {
6761 var root = getWorkInProgressRoot();
6762
6763 if (!(root !== null)) {
6764 {
6765 throw Error( "Expected a work-in-progress root. This is a bug in React. Please file an issue." );
6766 }
6767 }
6768
6769 var getVersion = source._getVersion;
6770 var version = getVersion(source._source);
6771 var dispatcher = ReactCurrentDispatcher$1.current; // eslint-disable-next-line prefer-const
6772
6773 var _dispatcher$useState = dispatcher.useState(function () {
6774 return readFromUnsubcribedMutableSource(root, source, getSnapshot);
6775 }),
6776 currentSnapshot = _dispatcher$useState[0],
6777 setSnapshot = _dispatcher$useState[1];
6778
6779 var snapshot = currentSnapshot; // Grab a handle to the state hook as well.
6780 // We use it to clear the pending update queue if we have a new source.
6781
6782 var stateHook = workInProgressHook;
6783 var memoizedState = hook.memoizedState;
6784 var refs = memoizedState.refs;
6785 var prevGetSnapshot = refs.getSnapshot;
6786 var prevSource = memoizedState.source;
6787 var prevSubscribe = memoizedState.subscribe;
6788 var fiber = currentlyRenderingFiber$1;
6789 hook.memoizedState = {
6790 refs: refs,
6791 source: source,
6792 subscribe: subscribe
6793 }; // Sync the values needed by our subscription handler after each commit.
6794
6795 dispatcher.useEffect(function () {
6796 refs.getSnapshot = getSnapshot; // Normally the dispatch function for a state hook never changes,
6797 // but this hook recreates the queue in certain cases to avoid updates from stale sources.
6798 // handleChange() below needs to reference the dispatch function without re-subscribing,
6799 // so we use a ref to ensure that it always has the latest version.
6800
6801 refs.setSnapshot = setSnapshot; // Check for a possible change between when we last rendered now.
6802
6803 var maybeNewVersion = getVersion(source._source);
6804
6805 if (!objectIs(version, maybeNewVersion)) {
6806 var maybeNewSnapshot = getSnapshot(source._source);
6807
6808 {
6809 if (typeof maybeNewSnapshot === 'function') {
6810 error('Mutable source should not return a function as the snapshot value. ' + 'Functions may close over mutable values and cause tearing.');
6811 }
6812 }
6813
6814 if (!objectIs(snapshot, maybeNewSnapshot)) {
6815 setSnapshot(maybeNewSnapshot);
6816 var lane = requestUpdateLane(fiber);
6817 markRootMutableRead(root, lane);
6818 } // If the source mutated between render and now,
6819 // there may be state updates already scheduled from the old source.
6820 // Entangle the updates so that they render in the same batch.
6821
6822
6823 markRootEntangled(root, root.mutableReadLanes);
6824 }
6825 }, [getSnapshot, source, subscribe]); // If we got a new source or subscribe function, re-subscribe in a passive effect.
6826
6827 dispatcher.useEffect(function () {
6828 var handleChange = function () {
6829 var latestGetSnapshot = refs.getSnapshot;
6830 var latestSetSnapshot = refs.setSnapshot;
6831
6832 try {
6833 latestSetSnapshot(latestGetSnapshot(source._source)); // Record a pending mutable source update with the same expiration time.
6834
6835 var lane = requestUpdateLane(fiber);
6836 markRootMutableRead(root, lane);
6837 } catch (error) {
6838 // A selector might throw after a source mutation.
6839 // e.g. it might try to read from a part of the store that no longer exists.
6840 // In this case we should still schedule an update with React.
6841 // Worst case the selector will throw again and then an error boundary will handle it.
6842 latestSetSnapshot(function () {
6843 throw error;
6844 });
6845 }
6846 };
6847
6848 var unsubscribe = subscribe(source._source, handleChange);
6849
6850 {
6851 if (typeof unsubscribe !== 'function') {
6852 error('Mutable source subscribe function must return an unsubscribe function.');
6853 }
6854 }
6855
6856 return unsubscribe;
6857 }, [source, subscribe]); // If any of the inputs to useMutableSource change, reading is potentially unsafe.
6858 //
6859 // If either the source or the subscription have changed we can't can't trust the update queue.
6860 // Maybe the source changed in a way that the old subscription ignored but the new one depends on.
6861 //
6862 // If the getSnapshot function changed, we also shouldn't rely on the update queue.
6863 // It's possible that the underlying source was mutated between the when the last "change" event fired,
6864 // and when the current render (with the new getSnapshot function) is processed.
6865 //
6866 // In both cases, we need to throw away pending updates (since they are no longer relevant)
6867 // and treat reading from the source as we do in the mount case.
6868
6869 if (!objectIs(prevGetSnapshot, getSnapshot) || !objectIs(prevSource, source) || !objectIs(prevSubscribe, subscribe)) {
6870 // Create a new queue and setState method,
6871 // So if there are interleaved updates, they get pushed to the older queue.
6872 // When this becomes current, the previous queue and dispatch method will be discarded,
6873 // including any interleaving updates that occur.
6874 var newQueue = {
6875 pending: null,
6876 dispatch: null,
6877 lastRenderedReducer: basicStateReducer,
6878 lastRenderedState: snapshot
6879 };
6880 newQueue.dispatch = setSnapshot = dispatchAction.bind(null, currentlyRenderingFiber$1, newQueue);
6881 stateHook.queue = newQueue;
6882 stateHook.baseQueue = null;
6883 snapshot = readFromUnsubcribedMutableSource(root, source, getSnapshot);
6884 stateHook.memoizedState = stateHook.baseState = snapshot;
6885 }
6886
6887 return snapshot;
6888}
6889
6890function mountMutableSource(source, getSnapshot, subscribe) {
6891 var hook = mountWorkInProgressHook();
6892 hook.memoizedState = {
6893 refs: {
6894 getSnapshot: getSnapshot,
6895 setSnapshot: null
6896 },
6897 source: source,
6898 subscribe: subscribe
6899 };
6900 return useMutableSource(hook, source, getSnapshot, subscribe);
6901}
6902
6903function updateMutableSource(source, getSnapshot, subscribe) {
6904 var hook = updateWorkInProgressHook();
6905 return useMutableSource(hook, source, getSnapshot, subscribe);
6906}
6907
6908function mountState(initialState) {
6909 var hook = mountWorkInProgressHook();
6910
6911 if (typeof initialState === 'function') {
6912 // $FlowFixMe: Flow doesn't like mixed types
6913 initialState = initialState();
6914 }
6915
6916 hook.memoizedState = hook.baseState = initialState;
6917 var queue = hook.queue = {
6918 pending: null,
6919 dispatch: null,
6920 lastRenderedReducer: basicStateReducer,
6921 lastRenderedState: initialState
6922 };
6923 var dispatch = queue.dispatch = dispatchAction.bind(null, currentlyRenderingFiber$1, queue);
6924 return [hook.memoizedState, dispatch];
6925}
6926
6927function updateState(initialState) {
6928 return updateReducer(basicStateReducer);
6929}
6930
6931function rerenderState(initialState) {
6932 return rerenderReducer(basicStateReducer);
6933}
6934
6935function pushEffect(tag, create, destroy, deps) {
6936 var effect = {
6937 tag: tag,
6938 create: create,
6939 destroy: destroy,
6940 deps: deps,
6941 // Circular
6942 next: null
6943 };
6944 var componentUpdateQueue = currentlyRenderingFiber$1.updateQueue;
6945
6946 if (componentUpdateQueue === null) {
6947 componentUpdateQueue = createFunctionComponentUpdateQueue();
6948 currentlyRenderingFiber$1.updateQueue = componentUpdateQueue;
6949 componentUpdateQueue.lastEffect = effect.next = effect;
6950 } else {
6951 var lastEffect = componentUpdateQueue.lastEffect;
6952
6953 if (lastEffect === null) {
6954 componentUpdateQueue.lastEffect = effect.next = effect;
6955 } else {
6956 var firstEffect = lastEffect.next;
6957 lastEffect.next = effect;
6958 effect.next = firstEffect;
6959 componentUpdateQueue.lastEffect = effect;
6960 }
6961 }
6962
6963 return effect;
6964}
6965
6966function mountRef(initialValue) {
6967 var hook = mountWorkInProgressHook();
6968 var ref = {
6969 current: initialValue
6970 };
6971
6972 {
6973 Object.seal(ref);
6974 }
6975
6976 hook.memoizedState = ref;
6977 return ref;
6978}
6979
6980function updateRef(initialValue) {
6981 var hook = updateWorkInProgressHook();
6982 return hook.memoizedState;
6983}
6984
6985function mountEffectImpl(fiberFlags, hookFlags, create, deps) {
6986 var hook = mountWorkInProgressHook();
6987 var nextDeps = deps === undefined ? null : deps;
6988 currentlyRenderingFiber$1.flags |= fiberFlags;
6989 hook.memoizedState = pushEffect(HasEffect | hookFlags, create, undefined, nextDeps);
6990}
6991
6992function updateEffectImpl(fiberFlags, hookFlags, create, deps) {
6993 var hook = updateWorkInProgressHook();
6994 var nextDeps = deps === undefined ? null : deps;
6995 var destroy = undefined;
6996
6997 if (currentHook !== null) {
6998 var prevEffect = currentHook.memoizedState;
6999 destroy = prevEffect.destroy;
7000
7001 if (nextDeps !== null) {
7002 var prevDeps = prevEffect.deps;
7003
7004 if (areHookInputsEqual(nextDeps, prevDeps)) {
7005 pushEffect(hookFlags, create, destroy, nextDeps);
7006 return;
7007 }
7008 }
7009 }
7010
7011 currentlyRenderingFiber$1.flags |= fiberFlags;
7012 hook.memoizedState = pushEffect(HasEffect | hookFlags, create, destroy, nextDeps);
7013}
7014
7015function mountEffect(create, deps) {
7016
7017 return mountEffectImpl(Update | Passive, Passive$1, create, deps);
7018}
7019
7020function updateEffect(create, deps) {
7021
7022 return updateEffectImpl(Update | Passive, Passive$1, create, deps);
7023}
7024
7025function mountLayoutEffect(create, deps) {
7026 return mountEffectImpl(Update, Layout, create, deps);
7027}
7028
7029function updateLayoutEffect(create, deps) {
7030 return updateEffectImpl(Update, Layout, create, deps);
7031}
7032
7033function imperativeHandleEffect(create, ref) {
7034 if (typeof ref === 'function') {
7035 var refCallback = ref;
7036
7037 var _inst = create();
7038
7039 refCallback(_inst);
7040 return function () {
7041 refCallback(null);
7042 };
7043 } else if (ref !== null && ref !== undefined) {
7044 var refObject = ref;
7045
7046 {
7047 if (!refObject.hasOwnProperty('current')) {
7048 error('Expected useImperativeHandle() first argument to either be a ' + 'ref callback or React.createRef() object. Instead received: %s.', 'an object with keys {' + Object.keys(refObject).join(', ') + '}');
7049 }
7050 }
7051
7052 var _inst2 = create();
7053
7054 refObject.current = _inst2;
7055 return function () {
7056 refObject.current = null;
7057 };
7058 }
7059}
7060
7061function mountImperativeHandle(ref, create, deps) {
7062 {
7063 if (typeof create !== 'function') {
7064 error('Expected useImperativeHandle() second argument to be a function ' + 'that creates a handle. Instead received: %s.', create !== null ? typeof create : 'null');
7065 }
7066 } // TODO: If deps are provided, should we skip comparing the ref itself?
7067
7068
7069 var effectDeps = deps !== null && deps !== undefined ? deps.concat([ref]) : null;
7070 return mountEffectImpl(Update, Layout, imperativeHandleEffect.bind(null, create, ref), effectDeps);
7071}
7072
7073function updateImperativeHandle(ref, create, deps) {
7074 {
7075 if (typeof create !== 'function') {
7076 error('Expected useImperativeHandle() second argument to be a function ' + 'that creates a handle. Instead received: %s.', create !== null ? typeof create : 'null');
7077 }
7078 } // TODO: If deps are provided, should we skip comparing the ref itself?
7079
7080
7081 var effectDeps = deps !== null && deps !== undefined ? deps.concat([ref]) : null;
7082 return updateEffectImpl(Update, Layout, imperativeHandleEffect.bind(null, create, ref), effectDeps);
7083}
7084
7085function mountDebugValue(value, formatterFn) {// This hook is normally a no-op.
7086 // The react-debug-hooks package injects its own implementation
7087 // so that e.g. DevTools can display custom hook values.
7088}
7089
7090var updateDebugValue = mountDebugValue;
7091
7092function mountCallback(callback, deps) {
7093 var hook = mountWorkInProgressHook();
7094 var nextDeps = deps === undefined ? null : deps;
7095 hook.memoizedState = [callback, nextDeps];
7096 return callback;
7097}
7098
7099function updateCallback(callback, deps) {
7100 var hook = updateWorkInProgressHook();
7101 var nextDeps = deps === undefined ? null : deps;
7102 var prevState = hook.memoizedState;
7103
7104 if (prevState !== null) {
7105 if (nextDeps !== null) {
7106 var prevDeps = prevState[1];
7107
7108 if (areHookInputsEqual(nextDeps, prevDeps)) {
7109 return prevState[0];
7110 }
7111 }
7112 }
7113
7114 hook.memoizedState = [callback, nextDeps];
7115 return callback;
7116}
7117
7118function mountMemo(nextCreate, deps) {
7119 var hook = mountWorkInProgressHook();
7120 var nextDeps = deps === undefined ? null : deps;
7121 var nextValue = nextCreate();
7122 hook.memoizedState = [nextValue, nextDeps];
7123 return nextValue;
7124}
7125
7126function updateMemo(nextCreate, deps) {
7127 var hook = updateWorkInProgressHook();
7128 var nextDeps = deps === undefined ? null : deps;
7129 var prevState = hook.memoizedState;
7130
7131 if (prevState !== null) {
7132 // Assume these are defined. If they're not, areHookInputsEqual will warn.
7133 if (nextDeps !== null) {
7134 var prevDeps = prevState[1];
7135
7136 if (areHookInputsEqual(nextDeps, prevDeps)) {
7137 return prevState[0];
7138 }
7139 }
7140 }
7141
7142 var nextValue = nextCreate();
7143 hook.memoizedState = [nextValue, nextDeps];
7144 return nextValue;
7145}
7146
7147function mountDeferredValue(value) {
7148 var _mountState = mountState(value),
7149 prevValue = _mountState[0],
7150 setValue = _mountState[1];
7151
7152 mountEffect(function () {
7153 var prevTransition = ReactCurrentBatchConfig$1.transition;
7154 ReactCurrentBatchConfig$1.transition = 1;
7155
7156 try {
7157 setValue(value);
7158 } finally {
7159 ReactCurrentBatchConfig$1.transition = prevTransition;
7160 }
7161 }, [value]);
7162 return prevValue;
7163}
7164
7165function updateDeferredValue(value) {
7166 var _updateState = updateState(),
7167 prevValue = _updateState[0],
7168 setValue = _updateState[1];
7169
7170 updateEffect(function () {
7171 var prevTransition = ReactCurrentBatchConfig$1.transition;
7172 ReactCurrentBatchConfig$1.transition = 1;
7173
7174 try {
7175 setValue(value);
7176 } finally {
7177 ReactCurrentBatchConfig$1.transition = prevTransition;
7178 }
7179 }, [value]);
7180 return prevValue;
7181}
7182
7183function rerenderDeferredValue(value) {
7184 var _rerenderState = rerenderState(),
7185 prevValue = _rerenderState[0],
7186 setValue = _rerenderState[1];
7187
7188 updateEffect(function () {
7189 var prevTransition = ReactCurrentBatchConfig$1.transition;
7190 ReactCurrentBatchConfig$1.transition = 1;
7191
7192 try {
7193 setValue(value);
7194 } finally {
7195 ReactCurrentBatchConfig$1.transition = prevTransition;
7196 }
7197 }, [value]);
7198 return prevValue;
7199}
7200
7201function startTransition(setPending, callback) {
7202 var priorityLevel = getCurrentPriorityLevel();
7203
7204 {
7205 runWithPriority(priorityLevel < UserBlockingPriority$1 ? UserBlockingPriority$1 : priorityLevel, function () {
7206 setPending(true);
7207 });
7208 runWithPriority(priorityLevel > NormalPriority$1 ? NormalPriority$1 : priorityLevel, function () {
7209 var prevTransition = ReactCurrentBatchConfig$1.transition;
7210 ReactCurrentBatchConfig$1.transition = 1;
7211
7212 try {
7213 setPending(false);
7214 callback();
7215 } finally {
7216 ReactCurrentBatchConfig$1.transition = prevTransition;
7217 }
7218 });
7219 }
7220}
7221
7222function mountTransition() {
7223 var _mountState2 = mountState(false),
7224 isPending = _mountState2[0],
7225 setPending = _mountState2[1]; // The `start` method can be stored on a ref, since `setPending`
7226 // never changes.
7227
7228
7229 var start = startTransition.bind(null, setPending);
7230 mountRef(start);
7231 return [start, isPending];
7232}
7233
7234function updateTransition() {
7235 var _updateState2 = updateState(),
7236 isPending = _updateState2[0];
7237
7238 var startRef = updateRef();
7239 var start = startRef.current;
7240 return [start, isPending];
7241}
7242
7243function rerenderTransition() {
7244 var _rerenderState2 = rerenderState(),
7245 isPending = _rerenderState2[0];
7246
7247 var startRef = updateRef();
7248 var start = startRef.current;
7249 return [start, isPending];
7250}
7251
7252var isUpdatingOpaqueValueInRenderPhase = false;
7253function getIsUpdatingOpaqueValueInRenderPhaseInDEV() {
7254 {
7255 return isUpdatingOpaqueValueInRenderPhase;
7256 }
7257}
7258
7259function warnOnOpaqueIdentifierAccessInDEV(fiber) {
7260 {
7261 // TODO: Should warn in effects and callbacks, too
7262 var name = getComponentName(fiber.type) || 'Unknown';
7263
7264 if (getIsRendering() && !didWarnAboutUseOpaqueIdentifier[name]) {
7265 error('The object passed back from useOpaqueIdentifier is meant to be ' + 'passed through to attributes only. Do not read the ' + 'value directly.');
7266
7267 didWarnAboutUseOpaqueIdentifier[name] = true;
7268 }
7269 }
7270}
7271
7272function mountOpaqueIdentifier() {
7273 var makeId = makeClientIdInDEV.bind(null, warnOnOpaqueIdentifierAccessInDEV.bind(null, currentlyRenderingFiber$1)) ;
7274
7275 {
7276 var _id = makeId();
7277
7278 mountState(_id);
7279 return _id;
7280 }
7281}
7282
7283function updateOpaqueIdentifier() {
7284 var id = updateState()[0];
7285 return id;
7286}
7287
7288function rerenderOpaqueIdentifier() {
7289 var id = rerenderState()[0];
7290 return id;
7291}
7292
7293function dispatchAction(fiber, queue, action) {
7294 {
7295 if (typeof arguments[3] === 'function') {
7296 error("State updates from the useState() and useReducer() Hooks don't support the " + 'second callback argument. To execute a side effect after ' + 'rendering, declare it in the component body with useEffect().');
7297 }
7298 }
7299
7300 var eventTime = requestEventTime();
7301 var lane = requestUpdateLane(fiber);
7302 var update = {
7303 lane: lane,
7304 action: action,
7305 eagerReducer: null,
7306 eagerState: null,
7307 next: null
7308 }; // Append the update to the end of the list.
7309
7310 var pending = queue.pending;
7311
7312 if (pending === null) {
7313 // This is the first update. Create a circular list.
7314 update.next = update;
7315 } else {
7316 update.next = pending.next;
7317 pending.next = update;
7318 }
7319
7320 queue.pending = update;
7321 var alternate = fiber.alternate;
7322
7323 if (fiber === currentlyRenderingFiber$1 || alternate !== null && alternate === currentlyRenderingFiber$1) {
7324 // This is a render phase update. Stash it in a lazily-created map of
7325 // queue -> linked list of updates. After this render pass, we'll restart
7326 // and apply the stashed updates on top of the work-in-progress hook.
7327 didScheduleRenderPhaseUpdateDuringThisPass = didScheduleRenderPhaseUpdate = true;
7328 } else {
7329 if (fiber.lanes === NoLanes && (alternate === null || alternate.lanes === NoLanes)) {
7330 // The queue is currently empty, which means we can eagerly compute the
7331 // next state before entering the render phase. If the new state is the
7332 // same as the current state, we may be able to bail out entirely.
7333 var lastRenderedReducer = queue.lastRenderedReducer;
7334
7335 if (lastRenderedReducer !== null) {
7336 var prevDispatcher;
7337
7338 {
7339 prevDispatcher = ReactCurrentDispatcher$1.current;
7340 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
7341 }
7342
7343 try {
7344 var currentState = queue.lastRenderedState;
7345 var eagerState = lastRenderedReducer(currentState, action); // Stash the eagerly computed state, and the reducer used to compute
7346 // it, on the update object. If the reducer hasn't changed by the
7347 // time we enter the render phase, then the eager state can be used
7348 // without calling the reducer again.
7349
7350 update.eagerReducer = lastRenderedReducer;
7351 update.eagerState = eagerState;
7352
7353 if (objectIs(eagerState, currentState)) {
7354 // Fast path. We can bail out without scheduling React to re-render.
7355 // It's still possible that we'll need to rebase this update later,
7356 // if the component re-renders for a different reason and by that
7357 // time the reducer has changed.
7358 return;
7359 }
7360 } catch (error) {// Suppress the error. It will throw again in the render phase.
7361 } finally {
7362 {
7363 ReactCurrentDispatcher$1.current = prevDispatcher;
7364 }
7365 }
7366 }
7367 }
7368
7369 scheduleUpdateOnFiber(fiber, lane, eventTime);
7370 }
7371}
7372
7373var ContextOnlyDispatcher = {
7374 readContext: readContext,
7375 useCallback: throwInvalidHookError,
7376 useContext: throwInvalidHookError,
7377 useEffect: throwInvalidHookError,
7378 useImperativeHandle: throwInvalidHookError,
7379 useLayoutEffect: throwInvalidHookError,
7380 useMemo: throwInvalidHookError,
7381 useReducer: throwInvalidHookError,
7382 useRef: throwInvalidHookError,
7383 useState: throwInvalidHookError,
7384 useDebugValue: throwInvalidHookError,
7385 useDeferredValue: throwInvalidHookError,
7386 useTransition: throwInvalidHookError,
7387 useMutableSource: throwInvalidHookError,
7388 useOpaqueIdentifier: throwInvalidHookError,
7389 unstable_isNewReconciler: enableNewReconciler
7390};
7391var HooksDispatcherOnMountInDEV = null;
7392var HooksDispatcherOnMountWithHookTypesInDEV = null;
7393var HooksDispatcherOnUpdateInDEV = null;
7394var HooksDispatcherOnRerenderInDEV = null;
7395var InvalidNestedHooksDispatcherOnMountInDEV = null;
7396var InvalidNestedHooksDispatcherOnUpdateInDEV = null;
7397var InvalidNestedHooksDispatcherOnRerenderInDEV = null;
7398
7399{
7400 var warnInvalidContextAccess = function () {
7401 error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().');
7402 };
7403
7404 var warnInvalidHookAccess = function () {
7405 error('Do not call Hooks inside useEffect(...), useMemo(...), or other built-in Hooks. ' + 'You can only call Hooks at the top level of your React function. ' + 'For more information, see ' + 'https://reactjs.org/link/rules-of-hooks');
7406 };
7407
7408 HooksDispatcherOnMountInDEV = {
7409 readContext: function (context, observedBits) {
7410 return readContext(context, observedBits);
7411 },
7412 useCallback: function (callback, deps) {
7413 currentHookNameInDev = 'useCallback';
7414 mountHookTypesDev();
7415 checkDepsAreArrayDev(deps);
7416 return mountCallback(callback, deps);
7417 },
7418 useContext: function (context, observedBits) {
7419 currentHookNameInDev = 'useContext';
7420 mountHookTypesDev();
7421 return readContext(context, observedBits);
7422 },
7423 useEffect: function (create, deps) {
7424 currentHookNameInDev = 'useEffect';
7425 mountHookTypesDev();
7426 checkDepsAreArrayDev(deps);
7427 return mountEffect(create, deps);
7428 },
7429 useImperativeHandle: function (ref, create, deps) {
7430 currentHookNameInDev = 'useImperativeHandle';
7431 mountHookTypesDev();
7432 checkDepsAreArrayDev(deps);
7433 return mountImperativeHandle(ref, create, deps);
7434 },
7435 useLayoutEffect: function (create, deps) {
7436 currentHookNameInDev = 'useLayoutEffect';
7437 mountHookTypesDev();
7438 checkDepsAreArrayDev(deps);
7439 return mountLayoutEffect(create, deps);
7440 },
7441 useMemo: function (create, deps) {
7442 currentHookNameInDev = 'useMemo';
7443 mountHookTypesDev();
7444 checkDepsAreArrayDev(deps);
7445 var prevDispatcher = ReactCurrentDispatcher$1.current;
7446 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
7447
7448 try {
7449 return mountMemo(create, deps);
7450 } finally {
7451 ReactCurrentDispatcher$1.current = prevDispatcher;
7452 }
7453 },
7454 useReducer: function (reducer, initialArg, init) {
7455 currentHookNameInDev = 'useReducer';
7456 mountHookTypesDev();
7457 var prevDispatcher = ReactCurrentDispatcher$1.current;
7458 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
7459
7460 try {
7461 return mountReducer(reducer, initialArg, init);
7462 } finally {
7463 ReactCurrentDispatcher$1.current = prevDispatcher;
7464 }
7465 },
7466 useRef: function (initialValue) {
7467 currentHookNameInDev = 'useRef';
7468 mountHookTypesDev();
7469 return mountRef(initialValue);
7470 },
7471 useState: function (initialState) {
7472 currentHookNameInDev = 'useState';
7473 mountHookTypesDev();
7474 var prevDispatcher = ReactCurrentDispatcher$1.current;
7475 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
7476
7477 try {
7478 return mountState(initialState);
7479 } finally {
7480 ReactCurrentDispatcher$1.current = prevDispatcher;
7481 }
7482 },
7483 useDebugValue: function (value, formatterFn) {
7484 currentHookNameInDev = 'useDebugValue';
7485 mountHookTypesDev();
7486 return mountDebugValue();
7487 },
7488 useDeferredValue: function (value) {
7489 currentHookNameInDev = 'useDeferredValue';
7490 mountHookTypesDev();
7491 return mountDeferredValue(value);
7492 },
7493 useTransition: function () {
7494 currentHookNameInDev = 'useTransition';
7495 mountHookTypesDev();
7496 return mountTransition();
7497 },
7498 useMutableSource: function (source, getSnapshot, subscribe) {
7499 currentHookNameInDev = 'useMutableSource';
7500 mountHookTypesDev();
7501 return mountMutableSource(source, getSnapshot, subscribe);
7502 },
7503 useOpaqueIdentifier: function () {
7504 currentHookNameInDev = 'useOpaqueIdentifier';
7505 mountHookTypesDev();
7506 return mountOpaqueIdentifier();
7507 },
7508 unstable_isNewReconciler: enableNewReconciler
7509 };
7510 HooksDispatcherOnMountWithHookTypesInDEV = {
7511 readContext: function (context, observedBits) {
7512 return readContext(context, observedBits);
7513 },
7514 useCallback: function (callback, deps) {
7515 currentHookNameInDev = 'useCallback';
7516 updateHookTypesDev();
7517 return mountCallback(callback, deps);
7518 },
7519 useContext: function (context, observedBits) {
7520 currentHookNameInDev = 'useContext';
7521 updateHookTypesDev();
7522 return readContext(context, observedBits);
7523 },
7524 useEffect: function (create, deps) {
7525 currentHookNameInDev = 'useEffect';
7526 updateHookTypesDev();
7527 return mountEffect(create, deps);
7528 },
7529 useImperativeHandle: function (ref, create, deps) {
7530 currentHookNameInDev = 'useImperativeHandle';
7531 updateHookTypesDev();
7532 return mountImperativeHandle(ref, create, deps);
7533 },
7534 useLayoutEffect: function (create, deps) {
7535 currentHookNameInDev = 'useLayoutEffect';
7536 updateHookTypesDev();
7537 return mountLayoutEffect(create, deps);
7538 },
7539 useMemo: function (create, deps) {
7540 currentHookNameInDev = 'useMemo';
7541 updateHookTypesDev();
7542 var prevDispatcher = ReactCurrentDispatcher$1.current;
7543 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
7544
7545 try {
7546 return mountMemo(create, deps);
7547 } finally {
7548 ReactCurrentDispatcher$1.current = prevDispatcher;
7549 }
7550 },
7551 useReducer: function (reducer, initialArg, init) {
7552 currentHookNameInDev = 'useReducer';
7553 updateHookTypesDev();
7554 var prevDispatcher = ReactCurrentDispatcher$1.current;
7555 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
7556
7557 try {
7558 return mountReducer(reducer, initialArg, init);
7559 } finally {
7560 ReactCurrentDispatcher$1.current = prevDispatcher;
7561 }
7562 },
7563 useRef: function (initialValue) {
7564 currentHookNameInDev = 'useRef';
7565 updateHookTypesDev();
7566 return mountRef(initialValue);
7567 },
7568 useState: function (initialState) {
7569 currentHookNameInDev = 'useState';
7570 updateHookTypesDev();
7571 var prevDispatcher = ReactCurrentDispatcher$1.current;
7572 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
7573
7574 try {
7575 return mountState(initialState);
7576 } finally {
7577 ReactCurrentDispatcher$1.current = prevDispatcher;
7578 }
7579 },
7580 useDebugValue: function (value, formatterFn) {
7581 currentHookNameInDev = 'useDebugValue';
7582 updateHookTypesDev();
7583 return mountDebugValue();
7584 },
7585 useDeferredValue: function (value) {
7586 currentHookNameInDev = 'useDeferredValue';
7587 updateHookTypesDev();
7588 return mountDeferredValue(value);
7589 },
7590 useTransition: function () {
7591 currentHookNameInDev = 'useTransition';
7592 updateHookTypesDev();
7593 return mountTransition();
7594 },
7595 useMutableSource: function (source, getSnapshot, subscribe) {
7596 currentHookNameInDev = 'useMutableSource';
7597 updateHookTypesDev();
7598 return mountMutableSource(source, getSnapshot, subscribe);
7599 },
7600 useOpaqueIdentifier: function () {
7601 currentHookNameInDev = 'useOpaqueIdentifier';
7602 updateHookTypesDev();
7603 return mountOpaqueIdentifier();
7604 },
7605 unstable_isNewReconciler: enableNewReconciler
7606 };
7607 HooksDispatcherOnUpdateInDEV = {
7608 readContext: function (context, observedBits) {
7609 return readContext(context, observedBits);
7610 },
7611 useCallback: function (callback, deps) {
7612 currentHookNameInDev = 'useCallback';
7613 updateHookTypesDev();
7614 return updateCallback(callback, deps);
7615 },
7616 useContext: function (context, observedBits) {
7617 currentHookNameInDev = 'useContext';
7618 updateHookTypesDev();
7619 return readContext(context, observedBits);
7620 },
7621 useEffect: function (create, deps) {
7622 currentHookNameInDev = 'useEffect';
7623 updateHookTypesDev();
7624 return updateEffect(create, deps);
7625 },
7626 useImperativeHandle: function (ref, create, deps) {
7627 currentHookNameInDev = 'useImperativeHandle';
7628 updateHookTypesDev();
7629 return updateImperativeHandle(ref, create, deps);
7630 },
7631 useLayoutEffect: function (create, deps) {
7632 currentHookNameInDev = 'useLayoutEffect';
7633 updateHookTypesDev();
7634 return updateLayoutEffect(create, deps);
7635 },
7636 useMemo: function (create, deps) {
7637 currentHookNameInDev = 'useMemo';
7638 updateHookTypesDev();
7639 var prevDispatcher = ReactCurrentDispatcher$1.current;
7640 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
7641
7642 try {
7643 return updateMemo(create, deps);
7644 } finally {
7645 ReactCurrentDispatcher$1.current = prevDispatcher;
7646 }
7647 },
7648 useReducer: function (reducer, initialArg, init) {
7649 currentHookNameInDev = 'useReducer';
7650 updateHookTypesDev();
7651 var prevDispatcher = ReactCurrentDispatcher$1.current;
7652 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
7653
7654 try {
7655 return updateReducer(reducer, initialArg, init);
7656 } finally {
7657 ReactCurrentDispatcher$1.current = prevDispatcher;
7658 }
7659 },
7660 useRef: function (initialValue) {
7661 currentHookNameInDev = 'useRef';
7662 updateHookTypesDev();
7663 return updateRef();
7664 },
7665 useState: function (initialState) {
7666 currentHookNameInDev = 'useState';
7667 updateHookTypesDev();
7668 var prevDispatcher = ReactCurrentDispatcher$1.current;
7669 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
7670
7671 try {
7672 return updateState(initialState);
7673 } finally {
7674 ReactCurrentDispatcher$1.current = prevDispatcher;
7675 }
7676 },
7677 useDebugValue: function (value, formatterFn) {
7678 currentHookNameInDev = 'useDebugValue';
7679 updateHookTypesDev();
7680 return updateDebugValue();
7681 },
7682 useDeferredValue: function (value) {
7683 currentHookNameInDev = 'useDeferredValue';
7684 updateHookTypesDev();
7685 return updateDeferredValue(value);
7686 },
7687 useTransition: function () {
7688 currentHookNameInDev = 'useTransition';
7689 updateHookTypesDev();
7690 return updateTransition();
7691 },
7692 useMutableSource: function (source, getSnapshot, subscribe) {
7693 currentHookNameInDev = 'useMutableSource';
7694 updateHookTypesDev();
7695 return updateMutableSource(source, getSnapshot, subscribe);
7696 },
7697 useOpaqueIdentifier: function () {
7698 currentHookNameInDev = 'useOpaqueIdentifier';
7699 updateHookTypesDev();
7700 return updateOpaqueIdentifier();
7701 },
7702 unstable_isNewReconciler: enableNewReconciler
7703 };
7704 HooksDispatcherOnRerenderInDEV = {
7705 readContext: function (context, observedBits) {
7706 return readContext(context, observedBits);
7707 },
7708 useCallback: function (callback, deps) {
7709 currentHookNameInDev = 'useCallback';
7710 updateHookTypesDev();
7711 return updateCallback(callback, deps);
7712 },
7713 useContext: function (context, observedBits) {
7714 currentHookNameInDev = 'useContext';
7715 updateHookTypesDev();
7716 return readContext(context, observedBits);
7717 },
7718 useEffect: function (create, deps) {
7719 currentHookNameInDev = 'useEffect';
7720 updateHookTypesDev();
7721 return updateEffect(create, deps);
7722 },
7723 useImperativeHandle: function (ref, create, deps) {
7724 currentHookNameInDev = 'useImperativeHandle';
7725 updateHookTypesDev();
7726 return updateImperativeHandle(ref, create, deps);
7727 },
7728 useLayoutEffect: function (create, deps) {
7729 currentHookNameInDev = 'useLayoutEffect';
7730 updateHookTypesDev();
7731 return updateLayoutEffect(create, deps);
7732 },
7733 useMemo: function (create, deps) {
7734 currentHookNameInDev = 'useMemo';
7735 updateHookTypesDev();
7736 var prevDispatcher = ReactCurrentDispatcher$1.current;
7737 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV;
7738
7739 try {
7740 return updateMemo(create, deps);
7741 } finally {
7742 ReactCurrentDispatcher$1.current = prevDispatcher;
7743 }
7744 },
7745 useReducer: function (reducer, initialArg, init) {
7746 currentHookNameInDev = 'useReducer';
7747 updateHookTypesDev();
7748 var prevDispatcher = ReactCurrentDispatcher$1.current;
7749 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV;
7750
7751 try {
7752 return rerenderReducer(reducer, initialArg, init);
7753 } finally {
7754 ReactCurrentDispatcher$1.current = prevDispatcher;
7755 }
7756 },
7757 useRef: function (initialValue) {
7758 currentHookNameInDev = 'useRef';
7759 updateHookTypesDev();
7760 return updateRef();
7761 },
7762 useState: function (initialState) {
7763 currentHookNameInDev = 'useState';
7764 updateHookTypesDev();
7765 var prevDispatcher = ReactCurrentDispatcher$1.current;
7766 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV;
7767
7768 try {
7769 return rerenderState(initialState);
7770 } finally {
7771 ReactCurrentDispatcher$1.current = prevDispatcher;
7772 }
7773 },
7774 useDebugValue: function (value, formatterFn) {
7775 currentHookNameInDev = 'useDebugValue';
7776 updateHookTypesDev();
7777 return updateDebugValue();
7778 },
7779 useDeferredValue: function (value) {
7780 currentHookNameInDev = 'useDeferredValue';
7781 updateHookTypesDev();
7782 return rerenderDeferredValue(value);
7783 },
7784 useTransition: function () {
7785 currentHookNameInDev = 'useTransition';
7786 updateHookTypesDev();
7787 return rerenderTransition();
7788 },
7789 useMutableSource: function (source, getSnapshot, subscribe) {
7790 currentHookNameInDev = 'useMutableSource';
7791 updateHookTypesDev();
7792 return updateMutableSource(source, getSnapshot, subscribe);
7793 },
7794 useOpaqueIdentifier: function () {
7795 currentHookNameInDev = 'useOpaqueIdentifier';
7796 updateHookTypesDev();
7797 return rerenderOpaqueIdentifier();
7798 },
7799 unstable_isNewReconciler: enableNewReconciler
7800 };
7801 InvalidNestedHooksDispatcherOnMountInDEV = {
7802 readContext: function (context, observedBits) {
7803 warnInvalidContextAccess();
7804 return readContext(context, observedBits);
7805 },
7806 useCallback: function (callback, deps) {
7807 currentHookNameInDev = 'useCallback';
7808 warnInvalidHookAccess();
7809 mountHookTypesDev();
7810 return mountCallback(callback, deps);
7811 },
7812 useContext: function (context, observedBits) {
7813 currentHookNameInDev = 'useContext';
7814 warnInvalidHookAccess();
7815 mountHookTypesDev();
7816 return readContext(context, observedBits);
7817 },
7818 useEffect: function (create, deps) {
7819 currentHookNameInDev = 'useEffect';
7820 warnInvalidHookAccess();
7821 mountHookTypesDev();
7822 return mountEffect(create, deps);
7823 },
7824 useImperativeHandle: function (ref, create, deps) {
7825 currentHookNameInDev = 'useImperativeHandle';
7826 warnInvalidHookAccess();
7827 mountHookTypesDev();
7828 return mountImperativeHandle(ref, create, deps);
7829 },
7830 useLayoutEffect: function (create, deps) {
7831 currentHookNameInDev = 'useLayoutEffect';
7832 warnInvalidHookAccess();
7833 mountHookTypesDev();
7834 return mountLayoutEffect(create, deps);
7835 },
7836 useMemo: function (create, deps) {
7837 currentHookNameInDev = 'useMemo';
7838 warnInvalidHookAccess();
7839 mountHookTypesDev();
7840 var prevDispatcher = ReactCurrentDispatcher$1.current;
7841 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
7842
7843 try {
7844 return mountMemo(create, deps);
7845 } finally {
7846 ReactCurrentDispatcher$1.current = prevDispatcher;
7847 }
7848 },
7849 useReducer: function (reducer, initialArg, init) {
7850 currentHookNameInDev = 'useReducer';
7851 warnInvalidHookAccess();
7852 mountHookTypesDev();
7853 var prevDispatcher = ReactCurrentDispatcher$1.current;
7854 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
7855
7856 try {
7857 return mountReducer(reducer, initialArg, init);
7858 } finally {
7859 ReactCurrentDispatcher$1.current = prevDispatcher;
7860 }
7861 },
7862 useRef: function (initialValue) {
7863 currentHookNameInDev = 'useRef';
7864 warnInvalidHookAccess();
7865 mountHookTypesDev();
7866 return mountRef(initialValue);
7867 },
7868 useState: function (initialState) {
7869 currentHookNameInDev = 'useState';
7870 warnInvalidHookAccess();
7871 mountHookTypesDev();
7872 var prevDispatcher = ReactCurrentDispatcher$1.current;
7873 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
7874
7875 try {
7876 return mountState(initialState);
7877 } finally {
7878 ReactCurrentDispatcher$1.current = prevDispatcher;
7879 }
7880 },
7881 useDebugValue: function (value, formatterFn) {
7882 currentHookNameInDev = 'useDebugValue';
7883 warnInvalidHookAccess();
7884 mountHookTypesDev();
7885 return mountDebugValue();
7886 },
7887 useDeferredValue: function (value) {
7888 currentHookNameInDev = 'useDeferredValue';
7889 warnInvalidHookAccess();
7890 mountHookTypesDev();
7891 return mountDeferredValue(value);
7892 },
7893 useTransition: function () {
7894 currentHookNameInDev = 'useTransition';
7895 warnInvalidHookAccess();
7896 mountHookTypesDev();
7897 return mountTransition();
7898 },
7899 useMutableSource: function (source, getSnapshot, subscribe) {
7900 currentHookNameInDev = 'useMutableSource';
7901 warnInvalidHookAccess();
7902 mountHookTypesDev();
7903 return mountMutableSource(source, getSnapshot, subscribe);
7904 },
7905 useOpaqueIdentifier: function () {
7906 currentHookNameInDev = 'useOpaqueIdentifier';
7907 warnInvalidHookAccess();
7908 mountHookTypesDev();
7909 return mountOpaqueIdentifier();
7910 },
7911 unstable_isNewReconciler: enableNewReconciler
7912 };
7913 InvalidNestedHooksDispatcherOnUpdateInDEV = {
7914 readContext: function (context, observedBits) {
7915 warnInvalidContextAccess();
7916 return readContext(context, observedBits);
7917 },
7918 useCallback: function (callback, deps) {
7919 currentHookNameInDev = 'useCallback';
7920 warnInvalidHookAccess();
7921 updateHookTypesDev();
7922 return updateCallback(callback, deps);
7923 },
7924 useContext: function (context, observedBits) {
7925 currentHookNameInDev = 'useContext';
7926 warnInvalidHookAccess();
7927 updateHookTypesDev();
7928 return readContext(context, observedBits);
7929 },
7930 useEffect: function (create, deps) {
7931 currentHookNameInDev = 'useEffect';
7932 warnInvalidHookAccess();
7933 updateHookTypesDev();
7934 return updateEffect(create, deps);
7935 },
7936 useImperativeHandle: function (ref, create, deps) {
7937 currentHookNameInDev = 'useImperativeHandle';
7938 warnInvalidHookAccess();
7939 updateHookTypesDev();
7940 return updateImperativeHandle(ref, create, deps);
7941 },
7942 useLayoutEffect: function (create, deps) {
7943 currentHookNameInDev = 'useLayoutEffect';
7944 warnInvalidHookAccess();
7945 updateHookTypesDev();
7946 return updateLayoutEffect(create, deps);
7947 },
7948 useMemo: function (create, deps) {
7949 currentHookNameInDev = 'useMemo';
7950 warnInvalidHookAccess();
7951 updateHookTypesDev();
7952 var prevDispatcher = ReactCurrentDispatcher$1.current;
7953 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
7954
7955 try {
7956 return updateMemo(create, deps);
7957 } finally {
7958 ReactCurrentDispatcher$1.current = prevDispatcher;
7959 }
7960 },
7961 useReducer: function (reducer, initialArg, init) {
7962 currentHookNameInDev = 'useReducer';
7963 warnInvalidHookAccess();
7964 updateHookTypesDev();
7965 var prevDispatcher = ReactCurrentDispatcher$1.current;
7966 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
7967
7968 try {
7969 return updateReducer(reducer, initialArg, init);
7970 } finally {
7971 ReactCurrentDispatcher$1.current = prevDispatcher;
7972 }
7973 },
7974 useRef: function (initialValue) {
7975 currentHookNameInDev = 'useRef';
7976 warnInvalidHookAccess();
7977 updateHookTypesDev();
7978 return updateRef();
7979 },
7980 useState: function (initialState) {
7981 currentHookNameInDev = 'useState';
7982 warnInvalidHookAccess();
7983 updateHookTypesDev();
7984 var prevDispatcher = ReactCurrentDispatcher$1.current;
7985 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
7986
7987 try {
7988 return updateState(initialState);
7989 } finally {
7990 ReactCurrentDispatcher$1.current = prevDispatcher;
7991 }
7992 },
7993 useDebugValue: function (value, formatterFn) {
7994 currentHookNameInDev = 'useDebugValue';
7995 warnInvalidHookAccess();
7996 updateHookTypesDev();
7997 return updateDebugValue();
7998 },
7999 useDeferredValue: function (value) {
8000 currentHookNameInDev = 'useDeferredValue';
8001 warnInvalidHookAccess();
8002 updateHookTypesDev();
8003 return updateDeferredValue(value);
8004 },
8005 useTransition: function () {
8006 currentHookNameInDev = 'useTransition';
8007 warnInvalidHookAccess();
8008 updateHookTypesDev();
8009 return updateTransition();
8010 },
8011 useMutableSource: function (source, getSnapshot, subscribe) {
8012 currentHookNameInDev = 'useMutableSource';
8013 warnInvalidHookAccess();
8014 updateHookTypesDev();
8015 return updateMutableSource(source, getSnapshot, subscribe);
8016 },
8017 useOpaqueIdentifier: function () {
8018 currentHookNameInDev = 'useOpaqueIdentifier';
8019 warnInvalidHookAccess();
8020 updateHookTypesDev();
8021 return updateOpaqueIdentifier();
8022 },
8023 unstable_isNewReconciler: enableNewReconciler
8024 };
8025 InvalidNestedHooksDispatcherOnRerenderInDEV = {
8026 readContext: function (context, observedBits) {
8027 warnInvalidContextAccess();
8028 return readContext(context, observedBits);
8029 },
8030 useCallback: function (callback, deps) {
8031 currentHookNameInDev = 'useCallback';
8032 warnInvalidHookAccess();
8033 updateHookTypesDev();
8034 return updateCallback(callback, deps);
8035 },
8036 useContext: function (context, observedBits) {
8037 currentHookNameInDev = 'useContext';
8038 warnInvalidHookAccess();
8039 updateHookTypesDev();
8040 return readContext(context, observedBits);
8041 },
8042 useEffect: function (create, deps) {
8043 currentHookNameInDev = 'useEffect';
8044 warnInvalidHookAccess();
8045 updateHookTypesDev();
8046 return updateEffect(create, deps);
8047 },
8048 useImperativeHandle: function (ref, create, deps) {
8049 currentHookNameInDev = 'useImperativeHandle';
8050 warnInvalidHookAccess();
8051 updateHookTypesDev();
8052 return updateImperativeHandle(ref, create, deps);
8053 },
8054 useLayoutEffect: function (create, deps) {
8055 currentHookNameInDev = 'useLayoutEffect';
8056 warnInvalidHookAccess();
8057 updateHookTypesDev();
8058 return updateLayoutEffect(create, deps);
8059 },
8060 useMemo: function (create, deps) {
8061 currentHookNameInDev = 'useMemo';
8062 warnInvalidHookAccess();
8063 updateHookTypesDev();
8064 var prevDispatcher = ReactCurrentDispatcher$1.current;
8065 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
8066
8067 try {
8068 return updateMemo(create, deps);
8069 } finally {
8070 ReactCurrentDispatcher$1.current = prevDispatcher;
8071 }
8072 },
8073 useReducer: function (reducer, initialArg, init) {
8074 currentHookNameInDev = 'useReducer';
8075 warnInvalidHookAccess();
8076 updateHookTypesDev();
8077 var prevDispatcher = ReactCurrentDispatcher$1.current;
8078 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
8079
8080 try {
8081 return rerenderReducer(reducer, initialArg, init);
8082 } finally {
8083 ReactCurrentDispatcher$1.current = prevDispatcher;
8084 }
8085 },
8086 useRef: function (initialValue) {
8087 currentHookNameInDev = 'useRef';
8088 warnInvalidHookAccess();
8089 updateHookTypesDev();
8090 return updateRef();
8091 },
8092 useState: function (initialState) {
8093 currentHookNameInDev = 'useState';
8094 warnInvalidHookAccess();
8095 updateHookTypesDev();
8096 var prevDispatcher = ReactCurrentDispatcher$1.current;
8097 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
8098
8099 try {
8100 return rerenderState(initialState);
8101 } finally {
8102 ReactCurrentDispatcher$1.current = prevDispatcher;
8103 }
8104 },
8105 useDebugValue: function (value, formatterFn) {
8106 currentHookNameInDev = 'useDebugValue';
8107 warnInvalidHookAccess();
8108 updateHookTypesDev();
8109 return updateDebugValue();
8110 },
8111 useDeferredValue: function (value) {
8112 currentHookNameInDev = 'useDeferredValue';
8113 warnInvalidHookAccess();
8114 updateHookTypesDev();
8115 return rerenderDeferredValue(value);
8116 },
8117 useTransition: function () {
8118 currentHookNameInDev = 'useTransition';
8119 warnInvalidHookAccess();
8120 updateHookTypesDev();
8121 return rerenderTransition();
8122 },
8123 useMutableSource: function (source, getSnapshot, subscribe) {
8124 currentHookNameInDev = 'useMutableSource';
8125 warnInvalidHookAccess();
8126 updateHookTypesDev();
8127 return updateMutableSource(source, getSnapshot, subscribe);
8128 },
8129 useOpaqueIdentifier: function () {
8130 currentHookNameInDev = 'useOpaqueIdentifier';
8131 warnInvalidHookAccess();
8132 updateHookTypesDev();
8133 return rerenderOpaqueIdentifier();
8134 },
8135 unstable_isNewReconciler: enableNewReconciler
8136 };
8137}
8138
8139var now$1 = Scheduler.unstable_now;
8140var commitTime = 0;
8141var profilerStartTime = -1;
8142
8143function getCommitTime() {
8144 return commitTime;
8145}
8146
8147function recordCommitTime() {
8148
8149 commitTime = now$1();
8150}
8151
8152function startProfilerTimer(fiber) {
8153
8154 profilerStartTime = now$1();
8155
8156 if (fiber.actualStartTime < 0) {
8157 fiber.actualStartTime = now$1();
8158 }
8159}
8160
8161function stopProfilerTimerIfRunning(fiber) {
8162
8163 profilerStartTime = -1;
8164}
8165
8166function stopProfilerTimerIfRunningAndRecordDelta(fiber, overrideBaseTime) {
8167
8168 if (profilerStartTime >= 0) {
8169 var elapsedTime = now$1() - profilerStartTime;
8170 fiber.actualDuration += elapsedTime;
8171
8172 if (overrideBaseTime) {
8173 fiber.selfBaseDuration = elapsedTime;
8174 }
8175
8176 profilerStartTime = -1;
8177 }
8178}
8179
8180function transferActualDuration(fiber) {
8181 // Transfer time spent rendering these children so we don't lose it
8182 // after we rerender. This is used as a helper in special cases
8183 // where we should count the work of multiple passes.
8184 var child = fiber.child;
8185
8186 while (child) {
8187 fiber.actualDuration += child.actualDuration;
8188 child = child.sibling;
8189 }
8190}
8191
8192var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
8193var didReceiveUpdate = false;
8194var didWarnAboutBadClass;
8195var didWarnAboutModulePatternComponent;
8196var didWarnAboutContextTypeOnFunctionComponent;
8197var didWarnAboutGetDerivedStateOnFunctionComponent;
8198var didWarnAboutFunctionRefs;
8199var didWarnAboutReassigningProps;
8200var didWarnAboutRevealOrder;
8201var didWarnAboutTailOptions;
8202
8203{
8204 didWarnAboutBadClass = {};
8205 didWarnAboutModulePatternComponent = {};
8206 didWarnAboutContextTypeOnFunctionComponent = {};
8207 didWarnAboutGetDerivedStateOnFunctionComponent = {};
8208 didWarnAboutFunctionRefs = {};
8209 didWarnAboutReassigningProps = false;
8210 didWarnAboutRevealOrder = {};
8211 didWarnAboutTailOptions = {};
8212}
8213
8214function reconcileChildren(current, workInProgress, nextChildren, renderLanes) {
8215 if (current === null) {
8216 // If this is a fresh new component that hasn't been rendered yet, we
8217 // won't update its child set by applying minimal side-effects. Instead,
8218 // we will add them all to the child before it gets rendered. That means
8219 // we can optimize this reconciliation pass by not tracking side-effects.
8220 workInProgress.child = mountChildFibers(workInProgress, null, nextChildren, renderLanes);
8221 } else {
8222 // If the current child is the same as the work in progress, it means that
8223 // we haven't yet started any work on these children. Therefore, we use
8224 // the clone algorithm to create a copy of all the current children.
8225 // If we had any progressed work already, that is invalid at this point so
8226 // let's throw it out.
8227 workInProgress.child = reconcileChildFibers(workInProgress, current.child, nextChildren, renderLanes);
8228 }
8229}
8230
8231function forceUnmountCurrentAndReconcile(current, workInProgress, nextChildren, renderLanes) {
8232 // This function is fork of reconcileChildren. It's used in cases where we
8233 // want to reconcile without matching against the existing set. This has the
8234 // effect of all current children being unmounted; even if the type and key
8235 // are the same, the old child is unmounted and a new child is created.
8236 //
8237 // To do this, we're going to go through the reconcile algorithm twice. In
8238 // the first pass, we schedule a deletion for all the current children by
8239 // passing null.
8240 workInProgress.child = reconcileChildFibers(workInProgress, current.child, null, renderLanes); // In the second pass, we mount the new children. The trick here is that we
8241 // pass null in place of where we usually pass the current child set. This has
8242 // the effect of remounting all children regardless of whether their
8243 // identities match.
8244
8245 workInProgress.child = reconcileChildFibers(workInProgress, null, nextChildren, renderLanes);
8246}
8247
8248function updateForwardRef(current, workInProgress, Component, nextProps, renderLanes) {
8249 // TODO: current can be non-null here even if the component
8250 // hasn't yet mounted. This happens after the first render suspends.
8251 // We'll need to figure out if this is fine or can cause issues.
8252 {
8253 if (workInProgress.type !== workInProgress.elementType) {
8254 // Lazy component props can't be validated in createElement
8255 // because they're only guaranteed to be resolved here.
8256 var innerPropTypes = Component.propTypes;
8257
8258 if (innerPropTypes) {
8259 checkPropTypes(innerPropTypes, nextProps, // Resolved props
8260 'prop', getComponentName(Component));
8261 }
8262 }
8263 }
8264
8265 var render = Component.render;
8266 var ref = workInProgress.ref; // The rest is a fork of updateFunctionComponent
8267
8268 var nextChildren;
8269 prepareToReadContext(workInProgress, renderLanes);
8270
8271 {
8272 ReactCurrentOwner$1.current = workInProgress;
8273 setIsRendering(true);
8274 nextChildren = renderWithHooks(current, workInProgress, render, nextProps, ref, renderLanes);
8275
8276 if ( workInProgress.mode & StrictMode) {
8277 disableLogs();
8278
8279 try {
8280 nextChildren = renderWithHooks(current, workInProgress, render, nextProps, ref, renderLanes);
8281 } finally {
8282 reenableLogs();
8283 }
8284 }
8285
8286 setIsRendering(false);
8287 }
8288
8289 if (current !== null && !didReceiveUpdate) {
8290 bailoutHooks(current, workInProgress, renderLanes);
8291 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
8292 } // React DevTools reads this flag.
8293
8294
8295 workInProgress.flags |= PerformedWork;
8296 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
8297 return workInProgress.child;
8298}
8299
8300function updateMemoComponent(current, workInProgress, Component, nextProps, updateLanes, renderLanes) {
8301 if (current === null) {
8302 var type = Component.type;
8303
8304 if (isSimpleFunctionComponent(type) && Component.compare === null && // SimpleMemoComponent codepath doesn't resolve outer props either.
8305 Component.defaultProps === undefined) {
8306 var resolvedType = type;
8307
8308 {
8309 resolvedType = resolveFunctionForHotReloading(type);
8310 } // If this is a plain function component without default props,
8311 // and with only the default shallow comparison, we upgrade it
8312 // to a SimpleMemoComponent to allow fast path updates.
8313
8314
8315 workInProgress.tag = SimpleMemoComponent;
8316 workInProgress.type = resolvedType;
8317
8318 {
8319 validateFunctionComponentInDev(workInProgress, type);
8320 }
8321
8322 return updateSimpleMemoComponent(current, workInProgress, resolvedType, nextProps, updateLanes, renderLanes);
8323 }
8324
8325 {
8326 var innerPropTypes = type.propTypes;
8327
8328 if (innerPropTypes) {
8329 // Inner memo component props aren't currently validated in createElement.
8330 // We could move it there, but we'd still need this for lazy code path.
8331 checkPropTypes(innerPropTypes, nextProps, // Resolved props
8332 'prop', getComponentName(type));
8333 }
8334 }
8335
8336 var child = createFiberFromTypeAndProps(Component.type, null, nextProps, workInProgress, workInProgress.mode, renderLanes);
8337 child.ref = workInProgress.ref;
8338 child.return = workInProgress;
8339 workInProgress.child = child;
8340 return child;
8341 }
8342
8343 {
8344 var _type = Component.type;
8345 var _innerPropTypes = _type.propTypes;
8346
8347 if (_innerPropTypes) {
8348 // Inner memo component props aren't currently validated in createElement.
8349 // We could move it there, but we'd still need this for lazy code path.
8350 checkPropTypes(_innerPropTypes, nextProps, // Resolved props
8351 'prop', getComponentName(_type));
8352 }
8353 }
8354
8355 var currentChild = current.child; // This is always exactly one child
8356
8357 if (!includesSomeLane(updateLanes, renderLanes)) {
8358 // This will be the props with resolved defaultProps,
8359 // unlike current.memoizedProps which will be the unresolved ones.
8360 var prevProps = currentChild.memoizedProps; // Default to shallow comparison
8361
8362 var compare = Component.compare;
8363 compare = compare !== null ? compare : shallowEqual;
8364
8365 if (compare(prevProps, nextProps) && current.ref === workInProgress.ref) {
8366 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
8367 }
8368 } // React DevTools reads this flag.
8369
8370
8371 workInProgress.flags |= PerformedWork;
8372 var newChild = createWorkInProgress(currentChild, nextProps);
8373 newChild.ref = workInProgress.ref;
8374 newChild.return = workInProgress;
8375 workInProgress.child = newChild;
8376 return newChild;
8377}
8378
8379function updateSimpleMemoComponent(current, workInProgress, Component, nextProps, updateLanes, renderLanes) {
8380 // TODO: current can be non-null here even if the component
8381 // hasn't yet mounted. This happens when the inner render suspends.
8382 // We'll need to figure out if this is fine or can cause issues.
8383 {
8384 if (workInProgress.type !== workInProgress.elementType) {
8385 // Lazy component props can't be validated in createElement
8386 // because they're only guaranteed to be resolved here.
8387 var outerMemoType = workInProgress.elementType;
8388
8389 if (outerMemoType.$$typeof === REACT_LAZY_TYPE) {
8390 // We warn when you define propTypes on lazy()
8391 // so let's just skip over it to find memo() outer wrapper.
8392 // Inner props for memo are validated later.
8393 var lazyComponent = outerMemoType;
8394 var payload = lazyComponent._payload;
8395 var init = lazyComponent._init;
8396
8397 try {
8398 outerMemoType = init(payload);
8399 } catch (x) {
8400 outerMemoType = null;
8401 } // Inner propTypes will be validated in the function component path.
8402
8403
8404 var outerPropTypes = outerMemoType && outerMemoType.propTypes;
8405
8406 if (outerPropTypes) {
8407 checkPropTypes(outerPropTypes, nextProps, // Resolved (SimpleMemoComponent has no defaultProps)
8408 'prop', getComponentName(outerMemoType));
8409 }
8410 }
8411 }
8412 }
8413
8414 if (current !== null) {
8415 var prevProps = current.memoizedProps;
8416
8417 if (shallowEqual(prevProps, nextProps) && current.ref === workInProgress.ref && ( // Prevent bailout if the implementation changed due to hot reload.
8418 workInProgress.type === current.type )) {
8419 didReceiveUpdate = false;
8420
8421 if (!includesSomeLane(renderLanes, updateLanes)) {
8422 // The pending lanes were cleared at the beginning of beginWork. We're
8423 // about to bail out, but there might be other lanes that weren't
8424 // included in the current render. Usually, the priority level of the
8425 // remaining updates is accumlated during the evaluation of the
8426 // component (i.e. when processing the update queue). But since since
8427 // we're bailing out early *without* evaluating the component, we need
8428 // to account for it here, too. Reset to the value of the current fiber.
8429 // NOTE: This only applies to SimpleMemoComponent, not MemoComponent,
8430 // because a MemoComponent fiber does not have hooks or an update queue;
8431 // rather, it wraps around an inner component, which may or may not
8432 // contains hooks.
8433 // TODO: Move the reset at in beginWork out of the common path so that
8434 // this is no longer necessary.
8435 workInProgress.lanes = current.lanes;
8436 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
8437 } else if ((current.flags & ForceUpdateForLegacySuspense) !== NoFlags) {
8438 // This is a special case that only exists for legacy mode.
8439 // See https://github.com/facebook/react/pull/19216.
8440 didReceiveUpdate = true;
8441 }
8442 }
8443 }
8444
8445 return updateFunctionComponent(current, workInProgress, Component, nextProps, renderLanes);
8446}
8447
8448function updateOffscreenComponent(current, workInProgress, renderLanes) {
8449 var nextProps = workInProgress.pendingProps;
8450 var nextChildren = nextProps.children;
8451 var prevState = current !== null ? current.memoizedState : null;
8452
8453 if (nextProps.mode === 'hidden' || nextProps.mode === 'unstable-defer-without-hiding') {
8454 if ((workInProgress.mode & ConcurrentMode) === NoMode) {
8455 // In legacy sync mode, don't defer the subtree. Render it now.
8456 // TODO: Figure out what we should do in Blocking mode.
8457 var nextState = {
8458 baseLanes: NoLanes
8459 };
8460 workInProgress.memoizedState = nextState;
8461 pushRenderLanes(workInProgress, renderLanes);
8462 } else if (!includesSomeLane(renderLanes, OffscreenLane)) {
8463 var nextBaseLanes;
8464
8465 if (prevState !== null) {
8466 var prevBaseLanes = prevState.baseLanes;
8467 nextBaseLanes = mergeLanes(prevBaseLanes, renderLanes);
8468 } else {
8469 nextBaseLanes = renderLanes;
8470 } // Schedule this fiber to re-render at offscreen priority. Then bailout.
8471
8472
8473 {
8474 markSpawnedWork(OffscreenLane);
8475 }
8476
8477 workInProgress.lanes = workInProgress.childLanes = laneToLanes(OffscreenLane);
8478 var _nextState = {
8479 baseLanes: nextBaseLanes
8480 };
8481 workInProgress.memoizedState = _nextState; // We're about to bail out, but we need to push this to the stack anyway
8482 // to avoid a push/pop misalignment.
8483
8484 pushRenderLanes(workInProgress, nextBaseLanes);
8485 return null;
8486 } else {
8487 // Rendering at offscreen, so we can clear the base lanes.
8488 var _nextState2 = {
8489 baseLanes: NoLanes
8490 };
8491 workInProgress.memoizedState = _nextState2; // Push the lanes that were skipped when we bailed out.
8492
8493 var subtreeRenderLanes = prevState !== null ? prevState.baseLanes : renderLanes;
8494 pushRenderLanes(workInProgress, subtreeRenderLanes);
8495 }
8496 } else {
8497 var _subtreeRenderLanes;
8498
8499 if (prevState !== null) {
8500 _subtreeRenderLanes = mergeLanes(prevState.baseLanes, renderLanes); // Since we're not hidden anymore, reset the state
8501
8502 workInProgress.memoizedState = null;
8503 } else {
8504 // We weren't previously hidden, and we still aren't, so there's nothing
8505 // special to do. Need to push to the stack regardless, though, to avoid
8506 // a push/pop misalignment.
8507 _subtreeRenderLanes = renderLanes;
8508 }
8509
8510 pushRenderLanes(workInProgress, _subtreeRenderLanes);
8511 }
8512
8513 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
8514 return workInProgress.child;
8515} // Note: These happen to have identical begin phases, for now. We shouldn't hold
8516// ourselves to this constraint, though. If the behavior diverges, we should
8517// fork the function.
8518
8519
8520var updateLegacyHiddenComponent = updateOffscreenComponent;
8521
8522function updateFragment(current, workInProgress, renderLanes) {
8523 var nextChildren = workInProgress.pendingProps;
8524 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
8525 return workInProgress.child;
8526}
8527
8528function updateMode(current, workInProgress, renderLanes) {
8529 var nextChildren = workInProgress.pendingProps.children;
8530 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
8531 return workInProgress.child;
8532}
8533
8534function updateProfiler(current, workInProgress, renderLanes) {
8535 {
8536 workInProgress.flags |= Update; // Reset effect durations for the next eventual effect phase.
8537 // These are reset during render to allow the DevTools commit hook a chance to read them,
8538
8539 var stateNode = workInProgress.stateNode;
8540 stateNode.effectDuration = 0;
8541 stateNode.passiveEffectDuration = 0;
8542 }
8543
8544 var nextProps = workInProgress.pendingProps;
8545 var nextChildren = nextProps.children;
8546 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
8547 return workInProgress.child;
8548}
8549
8550function markRef(current, workInProgress) {
8551 var ref = workInProgress.ref;
8552
8553 if (current === null && ref !== null || current !== null && current.ref !== ref) {
8554 // Schedule a Ref effect
8555 workInProgress.flags |= Ref;
8556 }
8557}
8558
8559function updateFunctionComponent(current, workInProgress, Component, nextProps, renderLanes) {
8560 {
8561 if (workInProgress.type !== workInProgress.elementType) {
8562 // Lazy component props can't be validated in createElement
8563 // because they're only guaranteed to be resolved here.
8564 var innerPropTypes = Component.propTypes;
8565
8566 if (innerPropTypes) {
8567 checkPropTypes(innerPropTypes, nextProps, // Resolved props
8568 'prop', getComponentName(Component));
8569 }
8570 }
8571 }
8572
8573 var context;
8574
8575 {
8576 var unmaskedContext = getUnmaskedContext(workInProgress, Component, true);
8577 context = getMaskedContext(workInProgress, unmaskedContext);
8578 }
8579
8580 var nextChildren;
8581 prepareToReadContext(workInProgress, renderLanes);
8582
8583 {
8584 ReactCurrentOwner$1.current = workInProgress;
8585 setIsRendering(true);
8586 nextChildren = renderWithHooks(current, workInProgress, Component, nextProps, context, renderLanes);
8587
8588 if ( workInProgress.mode & StrictMode) {
8589 disableLogs();
8590
8591 try {
8592 nextChildren = renderWithHooks(current, workInProgress, Component, nextProps, context, renderLanes);
8593 } finally {
8594 reenableLogs();
8595 }
8596 }
8597
8598 setIsRendering(false);
8599 }
8600
8601 if (current !== null && !didReceiveUpdate) {
8602 bailoutHooks(current, workInProgress, renderLanes);
8603 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
8604 } // React DevTools reads this flag.
8605
8606
8607 workInProgress.flags |= PerformedWork;
8608 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
8609 return workInProgress.child;
8610}
8611
8612function updateClassComponent(current, workInProgress, Component, nextProps, renderLanes) {
8613 {
8614 if (workInProgress.type !== workInProgress.elementType) {
8615 // Lazy component props can't be validated in createElement
8616 // because they're only guaranteed to be resolved here.
8617 var innerPropTypes = Component.propTypes;
8618
8619 if (innerPropTypes) {
8620 checkPropTypes(innerPropTypes, nextProps, // Resolved props
8621 'prop', getComponentName(Component));
8622 }
8623 }
8624 } // Push context providers early to prevent context stack mismatches.
8625 // During mounting we don't know the child context yet as the instance doesn't exist.
8626 // We will invalidate the child context in finishClassComponent() right after rendering.
8627
8628
8629 var hasContext;
8630
8631 if (isContextProvider(Component)) {
8632 hasContext = true;
8633 pushContextProvider(workInProgress);
8634 } else {
8635 hasContext = false;
8636 }
8637
8638 prepareToReadContext(workInProgress, renderLanes);
8639 var instance = workInProgress.stateNode;
8640 var shouldUpdate;
8641
8642 if (instance === null) {
8643 if (current !== null) {
8644 // A class component without an instance only mounts if it suspended
8645 // inside a non-concurrent tree, in an inconsistent state. We want to
8646 // treat it like a new mount, even though an empty version of it already
8647 // committed. Disconnect the alternate pointers.
8648 current.alternate = null;
8649 workInProgress.alternate = null; // Since this is conceptually a new fiber, schedule a Placement effect
8650
8651 workInProgress.flags |= Placement;
8652 } // In the initial pass we might need to construct the instance.
8653
8654
8655 constructClassInstance(workInProgress, Component, nextProps);
8656 mountClassInstance(workInProgress, Component, nextProps, renderLanes);
8657 shouldUpdate = true;
8658 } else if (current === null) {
8659 // In a resume, we'll already have an instance we can reuse.
8660 shouldUpdate = resumeMountClassInstance(workInProgress, Component, nextProps, renderLanes);
8661 } else {
8662 shouldUpdate = updateClassInstance(current, workInProgress, Component, nextProps, renderLanes);
8663 }
8664
8665 var nextUnitOfWork = finishClassComponent(current, workInProgress, Component, shouldUpdate, hasContext, renderLanes);
8666
8667 {
8668 var inst = workInProgress.stateNode;
8669
8670 if (shouldUpdate && inst.props !== nextProps) {
8671 if (!didWarnAboutReassigningProps) {
8672 error('It looks like %s is reassigning its own `this.props` while rendering. ' + 'This is not supported and can lead to confusing bugs.', getComponentName(workInProgress.type) || 'a component');
8673 }
8674
8675 didWarnAboutReassigningProps = true;
8676 }
8677 }
8678
8679 return nextUnitOfWork;
8680}
8681
8682function finishClassComponent(current, workInProgress, Component, shouldUpdate, hasContext, renderLanes) {
8683 // Refs should update even if shouldComponentUpdate returns false
8684 markRef(current, workInProgress);
8685 var didCaptureError = (workInProgress.flags & DidCapture) !== NoFlags;
8686
8687 if (!shouldUpdate && !didCaptureError) {
8688 // Context providers should defer to sCU for rendering
8689 if (hasContext) {
8690 invalidateContextProvider(workInProgress, Component, false);
8691 }
8692
8693 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
8694 }
8695
8696 var instance = workInProgress.stateNode; // Rerender
8697
8698 ReactCurrentOwner$1.current = workInProgress;
8699 var nextChildren;
8700
8701 if (didCaptureError && typeof Component.getDerivedStateFromError !== 'function') {
8702 // If we captured an error, but getDerivedStateFromError is not defined,
8703 // unmount all the children. componentDidCatch will schedule an update to
8704 // re-render a fallback. This is temporary until we migrate everyone to
8705 // the new API.
8706 // TODO: Warn in a future release.
8707 nextChildren = null;
8708
8709 {
8710 stopProfilerTimerIfRunning();
8711 }
8712 } else {
8713 {
8714 setIsRendering(true);
8715 nextChildren = instance.render();
8716
8717 if ( workInProgress.mode & StrictMode) {
8718 disableLogs();
8719
8720 try {
8721 instance.render();
8722 } finally {
8723 reenableLogs();
8724 }
8725 }
8726
8727 setIsRendering(false);
8728 }
8729 } // React DevTools reads this flag.
8730
8731
8732 workInProgress.flags |= PerformedWork;
8733
8734 if (current !== null && didCaptureError) {
8735 // If we're recovering from an error, reconcile without reusing any of
8736 // the existing children. Conceptually, the normal children and the children
8737 // that are shown on error are two different sets, so we shouldn't reuse
8738 // normal children even if their identities match.
8739 forceUnmountCurrentAndReconcile(current, workInProgress, nextChildren, renderLanes);
8740 } else {
8741 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
8742 } // Memoize state using the values we just used to render.
8743 // TODO: Restructure so we never read values from the instance.
8744
8745
8746 workInProgress.memoizedState = instance.state; // The context might have changed so we need to recalculate it.
8747
8748 if (hasContext) {
8749 invalidateContextProvider(workInProgress, Component, true);
8750 }
8751
8752 return workInProgress.child;
8753}
8754
8755function pushHostRootContext(workInProgress) {
8756 var root = workInProgress.stateNode;
8757
8758 if (root.pendingContext) {
8759 pushTopLevelContextObject(workInProgress, root.pendingContext, root.pendingContext !== root.context);
8760 } else if (root.context) {
8761 // Should always be set
8762 pushTopLevelContextObject(workInProgress, root.context, false);
8763 }
8764
8765 pushHostContainer(workInProgress, root.containerInfo);
8766}
8767
8768function updateHostRoot(current, workInProgress, renderLanes) {
8769 pushHostRootContext(workInProgress);
8770 var updateQueue = workInProgress.updateQueue;
8771
8772 if (!(current !== null && updateQueue !== null)) {
8773 {
8774 throw Error( "If the root does not have an updateQueue, we should have already bailed out. This error is likely caused by a bug in React. Please file an issue." );
8775 }
8776 }
8777
8778 var nextProps = workInProgress.pendingProps;
8779 var prevState = workInProgress.memoizedState;
8780 var prevChildren = prevState !== null ? prevState.element : null;
8781 cloneUpdateQueue(current, workInProgress);
8782 processUpdateQueue(workInProgress, nextProps, null, renderLanes);
8783 var nextState = workInProgress.memoizedState; // Caution: React DevTools currently depends on this property
8784 // being called "element".
8785
8786 var nextChildren = nextState.element;
8787
8788 if (nextChildren === prevChildren) {
8789 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
8790 }
8791
8792 var root = workInProgress.stateNode;
8793
8794 if (root.hydrate && enterHydrationState()) {
8795
8796 var child = mountChildFibers(workInProgress, null, nextChildren, renderLanes);
8797 workInProgress.child = child;
8798 var node = child;
8799
8800 while (node) {
8801 // Mark each child as hydrating. This is a fast path to know whether this
8802 // tree is part of a hydrating tree. This is used to determine if a child
8803 // node has fully mounted yet, and for scheduling event replaying.
8804 // Conceptually this is similar to Placement in that a new subtree is
8805 // inserted into the React tree here. It just happens to not need DOM
8806 // mutations because it already exists.
8807 node.flags = node.flags & ~Placement | Hydrating;
8808 node = node.sibling;
8809 }
8810 } else {
8811 // Otherwise reset hydration state in case we aborted and resumed another
8812 // root.
8813 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
8814 }
8815
8816 return workInProgress.child;
8817}
8818
8819function updateHostComponent(current, workInProgress, renderLanes) {
8820 pushHostContext(workInProgress);
8821
8822 var type = workInProgress.type;
8823 var nextProps = workInProgress.pendingProps;
8824 var prevProps = current !== null ? current.memoizedProps : null;
8825 var nextChildren = nextProps.children;
8826 var isDirectTextChild = shouldSetTextContent(type, nextProps);
8827
8828 if (isDirectTextChild) {
8829 // We special case a direct text child of a host node. This is a common
8830 // case. We won't handle it as a reified child. We will instead handle
8831 // this in the host environment that also has access to this prop. That
8832 // avoids allocating another HostText fiber and traversing it.
8833 nextChildren = null;
8834 } else if (prevProps !== null && shouldSetTextContent(type, prevProps)) {
8835 // If we're switching from a direct text child to a normal child, or to
8836 // empty, we need to schedule the text content to be reset.
8837 workInProgress.flags |= ContentReset;
8838 }
8839
8840 markRef(current, workInProgress);
8841 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
8842 return workInProgress.child;
8843}
8844
8845function updateHostText(current, workInProgress) {
8846 // immediately after.
8847
8848
8849 return null;
8850}
8851
8852function mountLazyComponent(_current, workInProgress, elementType, updateLanes, renderLanes) {
8853 if (_current !== null) {
8854 // A lazy component only mounts if it suspended inside a non-
8855 // concurrent tree, in an inconsistent state. We want to treat it like
8856 // a new mount, even though an empty version of it already committed.
8857 // Disconnect the alternate pointers.
8858 _current.alternate = null;
8859 workInProgress.alternate = null; // Since this is conceptually a new fiber, schedule a Placement effect
8860
8861 workInProgress.flags |= Placement;
8862 }
8863
8864 var props = workInProgress.pendingProps;
8865 var lazyComponent = elementType;
8866 var payload = lazyComponent._payload;
8867 var init = lazyComponent._init;
8868 var Component = init(payload); // Store the unwrapped component in the type.
8869
8870 workInProgress.type = Component;
8871 var resolvedTag = workInProgress.tag = resolveLazyComponentTag(Component);
8872 var resolvedProps = resolveDefaultProps(Component, props);
8873 var child;
8874
8875 switch (resolvedTag) {
8876 case FunctionComponent:
8877 {
8878 {
8879 validateFunctionComponentInDev(workInProgress, Component);
8880 workInProgress.type = Component = resolveFunctionForHotReloading(Component);
8881 }
8882
8883 child = updateFunctionComponent(null, workInProgress, Component, resolvedProps, renderLanes);
8884 return child;
8885 }
8886
8887 case ClassComponent:
8888 {
8889 {
8890 workInProgress.type = Component = resolveClassForHotReloading(Component);
8891 }
8892
8893 child = updateClassComponent(null, workInProgress, Component, resolvedProps, renderLanes);
8894 return child;
8895 }
8896
8897 case ForwardRef:
8898 {
8899 {
8900 workInProgress.type = Component = resolveForwardRefForHotReloading(Component);
8901 }
8902
8903 child = updateForwardRef(null, workInProgress, Component, resolvedProps, renderLanes);
8904 return child;
8905 }
8906
8907 case MemoComponent:
8908 {
8909 {
8910 if (workInProgress.type !== workInProgress.elementType) {
8911 var outerPropTypes = Component.propTypes;
8912
8913 if (outerPropTypes) {
8914 checkPropTypes(outerPropTypes, resolvedProps, // Resolved for outer only
8915 'prop', getComponentName(Component));
8916 }
8917 }
8918 }
8919
8920 child = updateMemoComponent(null, workInProgress, Component, resolveDefaultProps(Component.type, resolvedProps), // The inner type can have defaults too
8921 updateLanes, renderLanes);
8922 return child;
8923 }
8924 }
8925
8926 var hint = '';
8927
8928 {
8929 if (Component !== null && typeof Component === 'object' && Component.$$typeof === REACT_LAZY_TYPE) {
8930 hint = ' Did you wrap a component in React.lazy() more than once?';
8931 }
8932 } // This message intentionally doesn't mention ForwardRef or MemoComponent
8933 // because the fact that it's a separate type of work is an
8934 // implementation detail.
8935
8936
8937 {
8938 {
8939 throw Error( "Element type is invalid. Received a promise that resolves to: " + Component + ". Lazy element type must resolve to a class or function." + hint );
8940 }
8941 }
8942}
8943
8944function mountIncompleteClassComponent(_current, workInProgress, Component, nextProps, renderLanes) {
8945 if (_current !== null) {
8946 // An incomplete component only mounts if it suspended inside a non-
8947 // concurrent tree, in an inconsistent state. We want to treat it like
8948 // a new mount, even though an empty version of it already committed.
8949 // Disconnect the alternate pointers.
8950 _current.alternate = null;
8951 workInProgress.alternate = null; // Since this is conceptually a new fiber, schedule a Placement effect
8952
8953 workInProgress.flags |= Placement;
8954 } // Promote the fiber to a class and try rendering again.
8955
8956
8957 workInProgress.tag = ClassComponent; // The rest of this function is a fork of `updateClassComponent`
8958 // Push context providers early to prevent context stack mismatches.
8959 // During mounting we don't know the child context yet as the instance doesn't exist.
8960 // We will invalidate the child context in finishClassComponent() right after rendering.
8961
8962 var hasContext;
8963
8964 if (isContextProvider(Component)) {
8965 hasContext = true;
8966 pushContextProvider(workInProgress);
8967 } else {
8968 hasContext = false;
8969 }
8970
8971 prepareToReadContext(workInProgress, renderLanes);
8972 constructClassInstance(workInProgress, Component, nextProps);
8973 mountClassInstance(workInProgress, Component, nextProps, renderLanes);
8974 return finishClassComponent(null, workInProgress, Component, true, hasContext, renderLanes);
8975}
8976
8977function mountIndeterminateComponent(_current, workInProgress, Component, renderLanes) {
8978 if (_current !== null) {
8979 // An indeterminate component only mounts if it suspended inside a non-
8980 // concurrent tree, in an inconsistent state. We want to treat it like
8981 // a new mount, even though an empty version of it already committed.
8982 // Disconnect the alternate pointers.
8983 _current.alternate = null;
8984 workInProgress.alternate = null; // Since this is conceptually a new fiber, schedule a Placement effect
8985
8986 workInProgress.flags |= Placement;
8987 }
8988
8989 var props = workInProgress.pendingProps;
8990 var context;
8991
8992 {
8993 var unmaskedContext = getUnmaskedContext(workInProgress, Component, false);
8994 context = getMaskedContext(workInProgress, unmaskedContext);
8995 }
8996
8997 prepareToReadContext(workInProgress, renderLanes);
8998 var value;
8999
9000 {
9001 if (Component.prototype && typeof Component.prototype.render === 'function') {
9002 var componentName = getComponentName(Component) || 'Unknown';
9003
9004 if (!didWarnAboutBadClass[componentName]) {
9005 error("The <%s /> component appears to have a render method, but doesn't extend React.Component. " + 'This is likely to cause errors. Change %s to extend React.Component instead.', componentName, componentName);
9006
9007 didWarnAboutBadClass[componentName] = true;
9008 }
9009 }
9010
9011 if (workInProgress.mode & StrictMode) {
9012 ReactStrictModeWarnings.recordLegacyContextWarning(workInProgress, null);
9013 }
9014
9015 setIsRendering(true);
9016 ReactCurrentOwner$1.current = workInProgress;
9017 value = renderWithHooks(null, workInProgress, Component, props, context, renderLanes);
9018 setIsRendering(false);
9019 } // React DevTools reads this flag.
9020
9021
9022 workInProgress.flags |= PerformedWork;
9023
9024 {
9025 // Support for module components is deprecated and is removed behind a flag.
9026 // Whether or not it would crash later, we want to show a good message in DEV first.
9027 if (typeof value === 'object' && value !== null && typeof value.render === 'function' && value.$$typeof === undefined) {
9028 var _componentName = getComponentName(Component) || 'Unknown';
9029
9030 if (!didWarnAboutModulePatternComponent[_componentName]) {
9031 error('The <%s /> component appears to be a function component that returns a class instance. ' + 'Change %s to a class that extends React.Component instead. ' + "If you can't use a class try assigning the prototype on the function as a workaround. " + "`%s.prototype = React.Component.prototype`. Don't use an arrow function since it " + 'cannot be called with `new` by React.', _componentName, _componentName, _componentName);
9032
9033 didWarnAboutModulePatternComponent[_componentName] = true;
9034 }
9035 }
9036 }
9037
9038 if ( // Run these checks in production only if the flag is off.
9039 // Eventually we'll delete this branch altogether.
9040 typeof value === 'object' && value !== null && typeof value.render === 'function' && value.$$typeof === undefined) {
9041 {
9042 var _componentName2 = getComponentName(Component) || 'Unknown';
9043
9044 if (!didWarnAboutModulePatternComponent[_componentName2]) {
9045 error('The <%s /> component appears to be a function component that returns a class instance. ' + 'Change %s to a class that extends React.Component instead. ' + "If you can't use a class try assigning the prototype on the function as a workaround. " + "`%s.prototype = React.Component.prototype`. Don't use an arrow function since it " + 'cannot be called with `new` by React.', _componentName2, _componentName2, _componentName2);
9046
9047 didWarnAboutModulePatternComponent[_componentName2] = true;
9048 }
9049 } // Proceed under the assumption that this is a class instance
9050
9051
9052 workInProgress.tag = ClassComponent; // Throw out any hooks that were used.
9053
9054 workInProgress.memoizedState = null;
9055 workInProgress.updateQueue = null; // Push context providers early to prevent context stack mismatches.
9056 // During mounting we don't know the child context yet as the instance doesn't exist.
9057 // We will invalidate the child context in finishClassComponent() right after rendering.
9058
9059 var hasContext = false;
9060
9061 if (isContextProvider(Component)) {
9062 hasContext = true;
9063 pushContextProvider(workInProgress);
9064 } else {
9065 hasContext = false;
9066 }
9067
9068 workInProgress.memoizedState = value.state !== null && value.state !== undefined ? value.state : null;
9069 initializeUpdateQueue(workInProgress);
9070 var getDerivedStateFromProps = Component.getDerivedStateFromProps;
9071
9072 if (typeof getDerivedStateFromProps === 'function') {
9073 applyDerivedStateFromProps(workInProgress, Component, getDerivedStateFromProps, props);
9074 }
9075
9076 adoptClassInstance(workInProgress, value);
9077 mountClassInstance(workInProgress, Component, props, renderLanes);
9078 return finishClassComponent(null, workInProgress, Component, true, hasContext, renderLanes);
9079 } else {
9080 // Proceed under the assumption that this is a function component
9081 workInProgress.tag = FunctionComponent;
9082
9083 {
9084
9085 if ( workInProgress.mode & StrictMode) {
9086 disableLogs();
9087
9088 try {
9089 value = renderWithHooks(null, workInProgress, Component, props, context, renderLanes);
9090 } finally {
9091 reenableLogs();
9092 }
9093 }
9094 }
9095
9096 reconcileChildren(null, workInProgress, value, renderLanes);
9097
9098 {
9099 validateFunctionComponentInDev(workInProgress, Component);
9100 }
9101
9102 return workInProgress.child;
9103 }
9104}
9105
9106function validateFunctionComponentInDev(workInProgress, Component) {
9107 {
9108 if (Component) {
9109 if (Component.childContextTypes) {
9110 error('%s(...): childContextTypes cannot be defined on a function component.', Component.displayName || Component.name || 'Component');
9111 }
9112 }
9113
9114 if (workInProgress.ref !== null) {
9115 var info = '';
9116 var ownerName = getCurrentFiberOwnerNameInDevOrNull();
9117
9118 if (ownerName) {
9119 info += '\n\nCheck the render method of `' + ownerName + '`.';
9120 }
9121
9122 var warningKey = ownerName || workInProgress._debugID || '';
9123 var debugSource = workInProgress._debugSource;
9124
9125 if (debugSource) {
9126 warningKey = debugSource.fileName + ':' + debugSource.lineNumber;
9127 }
9128
9129 if (!didWarnAboutFunctionRefs[warningKey]) {
9130 didWarnAboutFunctionRefs[warningKey] = true;
9131
9132 error('Function components cannot be given refs. ' + 'Attempts to access this ref will fail. ' + 'Did you mean to use React.forwardRef()?%s', info);
9133 }
9134 }
9135
9136 if (typeof Component.getDerivedStateFromProps === 'function') {
9137 var _componentName3 = getComponentName(Component) || 'Unknown';
9138
9139 if (!didWarnAboutGetDerivedStateOnFunctionComponent[_componentName3]) {
9140 error('%s: Function components do not support getDerivedStateFromProps.', _componentName3);
9141
9142 didWarnAboutGetDerivedStateOnFunctionComponent[_componentName3] = true;
9143 }
9144 }
9145
9146 if (typeof Component.contextType === 'object' && Component.contextType !== null) {
9147 var _componentName4 = getComponentName(Component) || 'Unknown';
9148
9149 if (!didWarnAboutContextTypeOnFunctionComponent[_componentName4]) {
9150 error('%s: Function components do not support contextType.', _componentName4);
9151
9152 didWarnAboutContextTypeOnFunctionComponent[_componentName4] = true;
9153 }
9154 }
9155 }
9156}
9157
9158var SUSPENDED_MARKER = {
9159 dehydrated: null,
9160 retryLane: NoLane
9161};
9162
9163function mountSuspenseOffscreenState(renderLanes) {
9164 return {
9165 baseLanes: renderLanes
9166 };
9167}
9168
9169function updateSuspenseOffscreenState(prevOffscreenState, renderLanes) {
9170 return {
9171 baseLanes: mergeLanes(prevOffscreenState.baseLanes, renderLanes)
9172 };
9173} // TODO: Probably should inline this back
9174
9175
9176function shouldRemainOnFallback(suspenseContext, current, workInProgress, renderLanes) {
9177 // If we're already showing a fallback, there are cases where we need to
9178 // remain on that fallback regardless of whether the content has resolved.
9179 // For example, SuspenseList coordinates when nested content appears.
9180 if (current !== null) {
9181 var suspenseState = current.memoizedState;
9182
9183 if (suspenseState === null) {
9184 // Currently showing content. Don't hide it, even if ForceSuspenseFallack
9185 // is true. More precise name might be "ForceRemainSuspenseFallback".
9186 // Note: This is a factoring smell. Can't remain on a fallback if there's
9187 // no fallback to remain on.
9188 return false;
9189 }
9190 } // Not currently showing content. Consult the Suspense context.
9191
9192
9193 return hasSuspenseContext(suspenseContext, ForceSuspenseFallback);
9194}
9195
9196function getRemainingWorkInPrimaryTree(current, renderLanes) {
9197 // TODO: Should not remove render lanes that were pinged during this render
9198 return removeLanes(current.childLanes, renderLanes);
9199}
9200
9201function updateSuspenseComponent(current, workInProgress, renderLanes) {
9202 var nextProps = workInProgress.pendingProps; // This is used by DevTools to force a boundary to suspend.
9203
9204 {
9205 if (shouldSuspend(workInProgress)) {
9206 workInProgress.flags |= DidCapture;
9207 }
9208 }
9209
9210 var suspenseContext = suspenseStackCursor.current;
9211 var showFallback = false;
9212 var didSuspend = (workInProgress.flags & DidCapture) !== NoFlags;
9213
9214 if (didSuspend || shouldRemainOnFallback(suspenseContext, current)) {
9215 // Something in this boundary's subtree already suspended. Switch to
9216 // rendering the fallback children.
9217 showFallback = true;
9218 workInProgress.flags &= ~DidCapture;
9219 } else {
9220 // Attempting the main content
9221 if (current === null || current.memoizedState !== null) {
9222 // This is a new mount or this boundary is already showing a fallback state.
9223 // Mark this subtree context as having at least one invisible parent that could
9224 // handle the fallback state.
9225 // Boundaries without fallbacks or should be avoided are not considered since
9226 // they cannot handle preferred fallback states.
9227 if (nextProps.fallback !== undefined && nextProps.unstable_avoidThisFallback !== true) {
9228 suspenseContext = addSubtreeSuspenseContext(suspenseContext, InvisibleParentSuspenseContext);
9229 }
9230 }
9231 }
9232
9233 suspenseContext = setDefaultShallowSuspenseContext(suspenseContext);
9234 pushSuspenseContext(workInProgress, suspenseContext); // OK, the next part is confusing. We're about to reconcile the Suspense
9235 // boundary's children. This involves some custom reconcilation logic. Two
9236 // main reasons this is so complicated.
9237 //
9238 // First, Legacy Mode has different semantics for backwards compatibility. The
9239 // primary tree will commit in an inconsistent state, so when we do the
9240 // second pass to render the fallback, we do some exceedingly, uh, clever
9241 // hacks to make that not totally break. Like transferring effects and
9242 // deletions from hidden tree. In Concurrent Mode, it's much simpler,
9243 // because we bailout on the primary tree completely and leave it in its old
9244 // state, no effects. Same as what we do for Offscreen (except that
9245 // Offscreen doesn't have the first render pass).
9246 //
9247 // Second is hydration. During hydration, the Suspense fiber has a slightly
9248 // different layout, where the child points to a dehydrated fragment, which
9249 // contains the DOM rendered by the server.
9250 //
9251 // Third, even if you set all that aside, Suspense is like error boundaries in
9252 // that we first we try to render one tree, and if that fails, we render again
9253 // and switch to a different tree. Like a try/catch block. So we have to track
9254 // which branch we're currently rendering. Ideally we would model this using
9255 // a stack.
9256
9257 if (current === null) {
9258 // Initial mount
9259 // If we're currently hydrating, try to hydrate this boundary.
9260 // But only if this has a fallback.
9261 if (nextProps.fallback !== undefined) ;
9262
9263 var nextPrimaryChildren = nextProps.children;
9264 var nextFallbackChildren = nextProps.fallback;
9265
9266 if (showFallback) {
9267 var fallbackFragment = mountSuspenseFallbackChildren(workInProgress, nextPrimaryChildren, nextFallbackChildren, renderLanes);
9268 var primaryChildFragment = workInProgress.child;
9269 primaryChildFragment.memoizedState = mountSuspenseOffscreenState(renderLanes);
9270 workInProgress.memoizedState = SUSPENDED_MARKER;
9271 return fallbackFragment;
9272 } else if (typeof nextProps.unstable_expectedLoadTime === 'number') {
9273 // This is a CPU-bound tree. Skip this tree and show a placeholder to
9274 // unblock the surrounding content. Then immediately retry after the
9275 // initial commit.
9276 var _fallbackFragment = mountSuspenseFallbackChildren(workInProgress, nextPrimaryChildren, nextFallbackChildren, renderLanes);
9277
9278 var _primaryChildFragment = workInProgress.child;
9279 _primaryChildFragment.memoizedState = mountSuspenseOffscreenState(renderLanes);
9280 workInProgress.memoizedState = SUSPENDED_MARKER; // Since nothing actually suspended, there will nothing to ping this to
9281 // get it started back up to attempt the next item. While in terms of
9282 // priority this work has the same priority as this current render, it's
9283 // not part of the same transition once the transition has committed. If
9284 // it's sync, we still want to yield so that it can be painted.
9285 // Conceptually, this is really the same as pinging. We can use any
9286 // RetryLane even if it's the one currently rendering since we're leaving
9287 // it behind on this node.
9288
9289 workInProgress.lanes = SomeRetryLane;
9290
9291 {
9292 markSpawnedWork(SomeRetryLane);
9293 }
9294
9295 return _fallbackFragment;
9296 } else {
9297 return mountSuspensePrimaryChildren(workInProgress, nextPrimaryChildren, renderLanes);
9298 }
9299 } else {
9300 // This is an update.
9301 // If the current fiber has a SuspenseState, that means it's already showing
9302 // a fallback.
9303 var prevState = current.memoizedState;
9304
9305 if (prevState !== null) {
9306
9307 if (showFallback) {
9308 var _nextFallbackChildren2 = nextProps.fallback;
9309 var _nextPrimaryChildren2 = nextProps.children;
9310
9311 var _fallbackChildFragment = updateSuspenseFallbackChildren(current, workInProgress, _nextPrimaryChildren2, _nextFallbackChildren2, renderLanes);
9312
9313 var _primaryChildFragment3 = workInProgress.child;
9314 var prevOffscreenState = current.child.memoizedState;
9315 _primaryChildFragment3.memoizedState = prevOffscreenState === null ? mountSuspenseOffscreenState(renderLanes) : updateSuspenseOffscreenState(prevOffscreenState, renderLanes);
9316 _primaryChildFragment3.childLanes = getRemainingWorkInPrimaryTree(current, renderLanes);
9317 workInProgress.memoizedState = SUSPENDED_MARKER;
9318 return _fallbackChildFragment;
9319 } else {
9320 var _nextPrimaryChildren3 = nextProps.children;
9321
9322 var _primaryChildFragment4 = updateSuspensePrimaryChildren(current, workInProgress, _nextPrimaryChildren3, renderLanes);
9323
9324 workInProgress.memoizedState = null;
9325 return _primaryChildFragment4;
9326 }
9327 } else {
9328 // The current tree is not already showing a fallback.
9329 if (showFallback) {
9330 // Timed out.
9331 var _nextFallbackChildren3 = nextProps.fallback;
9332 var _nextPrimaryChildren4 = nextProps.children;
9333
9334 var _fallbackChildFragment2 = updateSuspenseFallbackChildren(current, workInProgress, _nextPrimaryChildren4, _nextFallbackChildren3, renderLanes);
9335
9336 var _primaryChildFragment5 = workInProgress.child;
9337 var _prevOffscreenState = current.child.memoizedState;
9338 _primaryChildFragment5.memoizedState = _prevOffscreenState === null ? mountSuspenseOffscreenState(renderLanes) : updateSuspenseOffscreenState(_prevOffscreenState, renderLanes);
9339 _primaryChildFragment5.childLanes = getRemainingWorkInPrimaryTree(current, renderLanes); // Skip the primary children, and continue working on the
9340 // fallback children.
9341
9342 workInProgress.memoizedState = SUSPENDED_MARKER;
9343 return _fallbackChildFragment2;
9344 } else {
9345 // Still haven't timed out. Continue rendering the children, like we
9346 // normally do.
9347 var _nextPrimaryChildren5 = nextProps.children;
9348
9349 var _primaryChildFragment6 = updateSuspensePrimaryChildren(current, workInProgress, _nextPrimaryChildren5, renderLanes);
9350
9351 workInProgress.memoizedState = null;
9352 return _primaryChildFragment6;
9353 }
9354 }
9355 }
9356}
9357
9358function mountSuspensePrimaryChildren(workInProgress, primaryChildren, renderLanes) {
9359 var mode = workInProgress.mode;
9360 var primaryChildProps = {
9361 mode: 'visible',
9362 children: primaryChildren
9363 };
9364 var primaryChildFragment = createFiberFromOffscreen(primaryChildProps, mode, renderLanes, null);
9365 primaryChildFragment.return = workInProgress;
9366 workInProgress.child = primaryChildFragment;
9367 return primaryChildFragment;
9368}
9369
9370function mountSuspenseFallbackChildren(workInProgress, primaryChildren, fallbackChildren, renderLanes) {
9371 var mode = workInProgress.mode;
9372 var progressedPrimaryFragment = workInProgress.child;
9373 var primaryChildProps = {
9374 mode: 'hidden',
9375 children: primaryChildren
9376 };
9377 var primaryChildFragment;
9378 var fallbackChildFragment;
9379
9380 if ((mode & BlockingMode) === NoMode && progressedPrimaryFragment !== null) {
9381 // In legacy mode, we commit the primary tree as if it successfully
9382 // completed, even though it's in an inconsistent state.
9383 primaryChildFragment = progressedPrimaryFragment;
9384 primaryChildFragment.childLanes = NoLanes;
9385 primaryChildFragment.pendingProps = primaryChildProps;
9386
9387 if ( workInProgress.mode & ProfileMode) {
9388 // Reset the durations from the first pass so they aren't included in the
9389 // final amounts. This seems counterintuitive, since we're intentionally
9390 // not measuring part of the render phase, but this makes it match what we
9391 // do in Concurrent Mode.
9392 primaryChildFragment.actualDuration = 0;
9393 primaryChildFragment.actualStartTime = -1;
9394 primaryChildFragment.selfBaseDuration = 0;
9395 primaryChildFragment.treeBaseDuration = 0;
9396 }
9397
9398 fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null);
9399 } else {
9400 primaryChildFragment = createFiberFromOffscreen(primaryChildProps, mode, NoLanes, null);
9401 fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null);
9402 }
9403
9404 primaryChildFragment.return = workInProgress;
9405 fallbackChildFragment.return = workInProgress;
9406 primaryChildFragment.sibling = fallbackChildFragment;
9407 workInProgress.child = primaryChildFragment;
9408 return fallbackChildFragment;
9409}
9410
9411function createWorkInProgressOffscreenFiber(current, offscreenProps) {
9412 // The props argument to `createWorkInProgress` is `any` typed, so we use this
9413 // wrapper function to constrain it.
9414 return createWorkInProgress(current, offscreenProps);
9415}
9416
9417function updateSuspensePrimaryChildren(current, workInProgress, primaryChildren, renderLanes) {
9418 var currentPrimaryChildFragment = current.child;
9419 var currentFallbackChildFragment = currentPrimaryChildFragment.sibling;
9420 var primaryChildFragment = createWorkInProgressOffscreenFiber(currentPrimaryChildFragment, {
9421 mode: 'visible',
9422 children: primaryChildren
9423 });
9424
9425 if ((workInProgress.mode & BlockingMode) === NoMode) {
9426 primaryChildFragment.lanes = renderLanes;
9427 }
9428
9429 primaryChildFragment.return = workInProgress;
9430 primaryChildFragment.sibling = null;
9431
9432 if (currentFallbackChildFragment !== null) {
9433 // Delete the fallback child fragment
9434 currentFallbackChildFragment.nextEffect = null;
9435 currentFallbackChildFragment.flags = Deletion;
9436 workInProgress.firstEffect = workInProgress.lastEffect = currentFallbackChildFragment;
9437 }
9438
9439 workInProgress.child = primaryChildFragment;
9440 return primaryChildFragment;
9441}
9442
9443function updateSuspenseFallbackChildren(current, workInProgress, primaryChildren, fallbackChildren, renderLanes) {
9444 var mode = workInProgress.mode;
9445 var currentPrimaryChildFragment = current.child;
9446 var currentFallbackChildFragment = currentPrimaryChildFragment.sibling;
9447 var primaryChildProps = {
9448 mode: 'hidden',
9449 children: primaryChildren
9450 };
9451 var primaryChildFragment;
9452
9453 if ( // In legacy mode, we commit the primary tree as if it successfully
9454 // completed, even though it's in an inconsistent state.
9455 (mode & BlockingMode) === NoMode && // Make sure we're on the second pass, i.e. the primary child fragment was
9456 // already cloned. In legacy mode, the only case where this isn't true is
9457 // when DevTools forces us to display a fallback; we skip the first render
9458 // pass entirely and go straight to rendering the fallback. (In Concurrent
9459 // Mode, SuspenseList can also trigger this scenario, but this is a legacy-
9460 // only codepath.)
9461 workInProgress.child !== currentPrimaryChildFragment) {
9462 var progressedPrimaryFragment = workInProgress.child;
9463 primaryChildFragment = progressedPrimaryFragment;
9464 primaryChildFragment.childLanes = NoLanes;
9465 primaryChildFragment.pendingProps = primaryChildProps;
9466
9467 if ( workInProgress.mode & ProfileMode) {
9468 // Reset the durations from the first pass so they aren't included in the
9469 // final amounts. This seems counterintuitive, since we're intentionally
9470 // not measuring part of the render phase, but this makes it match what we
9471 // do in Concurrent Mode.
9472 primaryChildFragment.actualDuration = 0;
9473 primaryChildFragment.actualStartTime = -1;
9474 primaryChildFragment.selfBaseDuration = currentPrimaryChildFragment.selfBaseDuration;
9475 primaryChildFragment.treeBaseDuration = currentPrimaryChildFragment.treeBaseDuration;
9476 } // The fallback fiber was added as a deletion effect during the first pass.
9477 // However, since we're going to remain on the fallback, we no longer want
9478 // to delete it. So we need to remove it from the list. Deletions are stored
9479 // on the same list as effects. We want to keep the effects from the primary
9480 // tree. So we copy the primary child fragment's effect list, which does not
9481 // include the fallback deletion effect.
9482
9483
9484 var progressedLastEffect = primaryChildFragment.lastEffect;
9485
9486 if (progressedLastEffect !== null) {
9487 workInProgress.firstEffect = primaryChildFragment.firstEffect;
9488 workInProgress.lastEffect = progressedLastEffect;
9489 progressedLastEffect.nextEffect = null;
9490 } else {
9491 // TODO: Reset this somewhere else? Lol legacy mode is so weird.
9492 workInProgress.firstEffect = workInProgress.lastEffect = null;
9493 }
9494 } else {
9495 primaryChildFragment = createWorkInProgressOffscreenFiber(currentPrimaryChildFragment, primaryChildProps);
9496 }
9497
9498 var fallbackChildFragment;
9499
9500 if (currentFallbackChildFragment !== null) {
9501 fallbackChildFragment = createWorkInProgress(currentFallbackChildFragment, fallbackChildren);
9502 } else {
9503 fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null); // Needs a placement effect because the parent (the Suspense boundary) already
9504 // mounted but this is a new fiber.
9505
9506 fallbackChildFragment.flags |= Placement;
9507 }
9508
9509 fallbackChildFragment.return = workInProgress;
9510 primaryChildFragment.return = workInProgress;
9511 primaryChildFragment.sibling = fallbackChildFragment;
9512 workInProgress.child = primaryChildFragment;
9513 return fallbackChildFragment;
9514}
9515
9516function scheduleWorkOnFiber(fiber, renderLanes) {
9517 fiber.lanes = mergeLanes(fiber.lanes, renderLanes);
9518 var alternate = fiber.alternate;
9519
9520 if (alternate !== null) {
9521 alternate.lanes = mergeLanes(alternate.lanes, renderLanes);
9522 }
9523
9524 scheduleWorkOnParentPath(fiber.return, renderLanes);
9525}
9526
9527function propagateSuspenseContextChange(workInProgress, firstChild, renderLanes) {
9528 // Mark any Suspense boundaries with fallbacks as having work to do.
9529 // If they were previously forced into fallbacks, they may now be able
9530 // to unblock.
9531 var node = firstChild;
9532
9533 while (node !== null) {
9534 if (node.tag === SuspenseComponent) {
9535 var state = node.memoizedState;
9536
9537 if (state !== null) {
9538 scheduleWorkOnFiber(node, renderLanes);
9539 }
9540 } else if (node.tag === SuspenseListComponent) {
9541 // If the tail is hidden there might not be an Suspense boundaries
9542 // to schedule work on. In this case we have to schedule it on the
9543 // list itself.
9544 // We don't have to traverse to the children of the list since
9545 // the list will propagate the change when it rerenders.
9546 scheduleWorkOnFiber(node, renderLanes);
9547 } else if (node.child !== null) {
9548 node.child.return = node;
9549 node = node.child;
9550 continue;
9551 }
9552
9553 if (node === workInProgress) {
9554 return;
9555 }
9556
9557 while (node.sibling === null) {
9558 if (node.return === null || node.return === workInProgress) {
9559 return;
9560 }
9561
9562 node = node.return;
9563 }
9564
9565 node.sibling.return = node.return;
9566 node = node.sibling;
9567 }
9568}
9569
9570function findLastContentRow(firstChild) {
9571 // This is going to find the last row among these children that is already
9572 // showing content on the screen, as opposed to being in fallback state or
9573 // new. If a row has multiple Suspense boundaries, any of them being in the
9574 // fallback state, counts as the whole row being in a fallback state.
9575 // Note that the "rows" will be workInProgress, but any nested children
9576 // will still be current since we haven't rendered them yet. The mounted
9577 // order may not be the same as the new order. We use the new order.
9578 var row = firstChild;
9579 var lastContentRow = null;
9580
9581 while (row !== null) {
9582 var currentRow = row.alternate; // New rows can't be content rows.
9583
9584 if (currentRow !== null && findFirstSuspended(currentRow) === null) {
9585 lastContentRow = row;
9586 }
9587
9588 row = row.sibling;
9589 }
9590
9591 return lastContentRow;
9592}
9593
9594function validateRevealOrder(revealOrder) {
9595 {
9596 if (revealOrder !== undefined && revealOrder !== 'forwards' && revealOrder !== 'backwards' && revealOrder !== 'together' && !didWarnAboutRevealOrder[revealOrder]) {
9597 didWarnAboutRevealOrder[revealOrder] = true;
9598
9599 if (typeof revealOrder === 'string') {
9600 switch (revealOrder.toLowerCase()) {
9601 case 'together':
9602 case 'forwards':
9603 case 'backwards':
9604 {
9605 error('"%s" is not a valid value for revealOrder on <SuspenseList />. ' + 'Use lowercase "%s" instead.', revealOrder, revealOrder.toLowerCase());
9606
9607 break;
9608 }
9609
9610 case 'forward':
9611 case 'backward':
9612 {
9613 error('"%s" is not a valid value for revealOrder on <SuspenseList />. ' + 'React uses the -s suffix in the spelling. Use "%ss" instead.', revealOrder, revealOrder.toLowerCase());
9614
9615 break;
9616 }
9617
9618 default:
9619 error('"%s" is not a supported revealOrder on <SuspenseList />. ' + 'Did you mean "together", "forwards" or "backwards"?', revealOrder);
9620
9621 break;
9622 }
9623 } else {
9624 error('%s is not a supported value for revealOrder on <SuspenseList />. ' + 'Did you mean "together", "forwards" or "backwards"?', revealOrder);
9625 }
9626 }
9627 }
9628}
9629
9630function validateTailOptions(tailMode, revealOrder) {
9631 {
9632 if (tailMode !== undefined && !didWarnAboutTailOptions[tailMode]) {
9633 if (tailMode !== 'collapsed' && tailMode !== 'hidden') {
9634 didWarnAboutTailOptions[tailMode] = true;
9635
9636 error('"%s" is not a supported value for tail on <SuspenseList />. ' + 'Did you mean "collapsed" or "hidden"?', tailMode);
9637 } else if (revealOrder !== 'forwards' && revealOrder !== 'backwards') {
9638 didWarnAboutTailOptions[tailMode] = true;
9639
9640 error('<SuspenseList tail="%s" /> is only valid if revealOrder is ' + '"forwards" or "backwards". ' + 'Did you mean to specify revealOrder="forwards"?', tailMode);
9641 }
9642 }
9643 }
9644}
9645
9646function validateSuspenseListNestedChild(childSlot, index) {
9647 {
9648 var isArray = Array.isArray(childSlot);
9649 var isIterable = !isArray && typeof getIteratorFn(childSlot) === 'function';
9650
9651 if (isArray || isIterable) {
9652 var type = isArray ? 'array' : 'iterable';
9653
9654 error('A nested %s was passed to row #%s in <SuspenseList />. Wrap it in ' + 'an additional SuspenseList to configure its revealOrder: ' + '<SuspenseList revealOrder=...> ... ' + '<SuspenseList revealOrder=...>{%s}</SuspenseList> ... ' + '</SuspenseList>', type, index, type);
9655
9656 return false;
9657 }
9658 }
9659
9660 return true;
9661}
9662
9663function validateSuspenseListChildren(children, revealOrder) {
9664 {
9665 if ((revealOrder === 'forwards' || revealOrder === 'backwards') && children !== undefined && children !== null && children !== false) {
9666 if (Array.isArray(children)) {
9667 for (var i = 0; i < children.length; i++) {
9668 if (!validateSuspenseListNestedChild(children[i], i)) {
9669 return;
9670 }
9671 }
9672 } else {
9673 var iteratorFn = getIteratorFn(children);
9674
9675 if (typeof iteratorFn === 'function') {
9676 var childrenIterator = iteratorFn.call(children);
9677
9678 if (childrenIterator) {
9679 var step = childrenIterator.next();
9680 var _i = 0;
9681
9682 for (; !step.done; step = childrenIterator.next()) {
9683 if (!validateSuspenseListNestedChild(step.value, _i)) {
9684 return;
9685 }
9686
9687 _i++;
9688 }
9689 }
9690 } else {
9691 error('A single row was passed to a <SuspenseList revealOrder="%s" />. ' + 'This is not useful since it needs multiple rows. ' + 'Did you mean to pass multiple children or an array?', revealOrder);
9692 }
9693 }
9694 }
9695 }
9696}
9697
9698function initSuspenseListRenderState(workInProgress, isBackwards, tail, lastContentRow, tailMode, lastEffectBeforeRendering) {
9699 var renderState = workInProgress.memoizedState;
9700
9701 if (renderState === null) {
9702 workInProgress.memoizedState = {
9703 isBackwards: isBackwards,
9704 rendering: null,
9705 renderingStartTime: 0,
9706 last: lastContentRow,
9707 tail: tail,
9708 tailMode: tailMode,
9709 lastEffect: lastEffectBeforeRendering
9710 };
9711 } else {
9712 // We can reuse the existing object from previous renders.
9713 renderState.isBackwards = isBackwards;
9714 renderState.rendering = null;
9715 renderState.renderingStartTime = 0;
9716 renderState.last = lastContentRow;
9717 renderState.tail = tail;
9718 renderState.tailMode = tailMode;
9719 renderState.lastEffect = lastEffectBeforeRendering;
9720 }
9721} // This can end up rendering this component multiple passes.
9722// The first pass splits the children fibers into two sets. A head and tail.
9723// We first render the head. If anything is in fallback state, we do another
9724// pass through beginWork to rerender all children (including the tail) with
9725// the force suspend context. If the first render didn't have anything in
9726// in fallback state. Then we render each row in the tail one-by-one.
9727// That happens in the completeWork phase without going back to beginWork.
9728
9729
9730function updateSuspenseListComponent(current, workInProgress, renderLanes) {
9731 var nextProps = workInProgress.pendingProps;
9732 var revealOrder = nextProps.revealOrder;
9733 var tailMode = nextProps.tail;
9734 var newChildren = nextProps.children;
9735 validateRevealOrder(revealOrder);
9736 validateTailOptions(tailMode, revealOrder);
9737 validateSuspenseListChildren(newChildren, revealOrder);
9738 reconcileChildren(current, workInProgress, newChildren, renderLanes);
9739 var suspenseContext = suspenseStackCursor.current;
9740 var shouldForceFallback = hasSuspenseContext(suspenseContext, ForceSuspenseFallback);
9741
9742 if (shouldForceFallback) {
9743 suspenseContext = setShallowSuspenseContext(suspenseContext, ForceSuspenseFallback);
9744 workInProgress.flags |= DidCapture;
9745 } else {
9746 var didSuspendBefore = current !== null && (current.flags & DidCapture) !== NoFlags;
9747
9748 if (didSuspendBefore) {
9749 // If we previously forced a fallback, we need to schedule work
9750 // on any nested boundaries to let them know to try to render
9751 // again. This is the same as context updating.
9752 propagateSuspenseContextChange(workInProgress, workInProgress.child, renderLanes);
9753 }
9754
9755 suspenseContext = setDefaultShallowSuspenseContext(suspenseContext);
9756 }
9757
9758 pushSuspenseContext(workInProgress, suspenseContext);
9759
9760 if ((workInProgress.mode & BlockingMode) === NoMode) {
9761 // In legacy mode, SuspenseList doesn't work so we just
9762 // use make it a noop by treating it as the default revealOrder.
9763 workInProgress.memoizedState = null;
9764 } else {
9765 switch (revealOrder) {
9766 case 'forwards':
9767 {
9768 var lastContentRow = findLastContentRow(workInProgress.child);
9769 var tail;
9770
9771 if (lastContentRow === null) {
9772 // The whole list is part of the tail.
9773 // TODO: We could fast path by just rendering the tail now.
9774 tail = workInProgress.child;
9775 workInProgress.child = null;
9776 } else {
9777 // Disconnect the tail rows after the content row.
9778 // We're going to render them separately later.
9779 tail = lastContentRow.sibling;
9780 lastContentRow.sibling = null;
9781 }
9782
9783 initSuspenseListRenderState(workInProgress, false, // isBackwards
9784 tail, lastContentRow, tailMode, workInProgress.lastEffect);
9785 break;
9786 }
9787
9788 case 'backwards':
9789 {
9790 // We're going to find the first row that has existing content.
9791 // At the same time we're going to reverse the list of everything
9792 // we pass in the meantime. That's going to be our tail in reverse
9793 // order.
9794 var _tail = null;
9795 var row = workInProgress.child;
9796 workInProgress.child = null;
9797
9798 while (row !== null) {
9799 var currentRow = row.alternate; // New rows can't be content rows.
9800
9801 if (currentRow !== null && findFirstSuspended(currentRow) === null) {
9802 // This is the beginning of the main content.
9803 workInProgress.child = row;
9804 break;
9805 }
9806
9807 var nextRow = row.sibling;
9808 row.sibling = _tail;
9809 _tail = row;
9810 row = nextRow;
9811 } // TODO: If workInProgress.child is null, we can continue on the tail immediately.
9812
9813
9814 initSuspenseListRenderState(workInProgress, true, // isBackwards
9815 _tail, null, // last
9816 tailMode, workInProgress.lastEffect);
9817 break;
9818 }
9819
9820 case 'together':
9821 {
9822 initSuspenseListRenderState(workInProgress, false, // isBackwards
9823 null, // tail
9824 null, // last
9825 undefined, workInProgress.lastEffect);
9826 break;
9827 }
9828
9829 default:
9830 {
9831 // The default reveal order is the same as not having
9832 // a boundary.
9833 workInProgress.memoizedState = null;
9834 }
9835 }
9836 }
9837
9838 return workInProgress.child;
9839}
9840
9841function updatePortalComponent(current, workInProgress, renderLanes) {
9842 pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo);
9843 var nextChildren = workInProgress.pendingProps;
9844
9845 if (current === null) {
9846 // Portals are special because we don't append the children during mount
9847 // but at commit. Therefore we need to track insertions which the normal
9848 // flow doesn't do during mount. This doesn't happen at the root because
9849 // the root always starts with a "current" with a null child.
9850 // TODO: Consider unifying this with how the root works.
9851 workInProgress.child = reconcileChildFibers(workInProgress, null, nextChildren, renderLanes);
9852 } else {
9853 reconcileChildren(current, workInProgress, nextChildren, renderLanes);
9854 }
9855
9856 return workInProgress.child;
9857}
9858
9859var hasWarnedAboutUsingNoValuePropOnContextProvider = false;
9860
9861function updateContextProvider(current, workInProgress, renderLanes) {
9862 var providerType = workInProgress.type;
9863 var context = providerType._context;
9864 var newProps = workInProgress.pendingProps;
9865 var oldProps = workInProgress.memoizedProps;
9866 var newValue = newProps.value;
9867
9868 {
9869 if (!('value' in newProps)) {
9870 if (!hasWarnedAboutUsingNoValuePropOnContextProvider) {
9871 hasWarnedAboutUsingNoValuePropOnContextProvider = true;
9872
9873 error('The `value` prop is required for the `<Context.Provider>`. Did you misspell it or forget to pass it?');
9874 }
9875 }
9876
9877 var providerPropTypes = workInProgress.type.propTypes;
9878
9879 if (providerPropTypes) {
9880 checkPropTypes(providerPropTypes, newProps, 'prop', 'Context.Provider');
9881 }
9882 }
9883
9884 pushProvider(workInProgress, newValue);
9885
9886 if (oldProps !== null) {
9887 var oldValue = oldProps.value;
9888 var changedBits = calculateChangedBits(context, newValue, oldValue);
9889
9890 if (changedBits === 0) {
9891 // No change. Bailout early if children are the same.
9892 if (oldProps.children === newProps.children && !hasContextChanged()) {
9893 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
9894 }
9895 } else {
9896 // The context value changed. Search for matching consumers and schedule
9897 // them to update.
9898 propagateContextChange(workInProgress, context, changedBits, renderLanes);
9899 }
9900 }
9901
9902 var newChildren = newProps.children;
9903 reconcileChildren(current, workInProgress, newChildren, renderLanes);
9904 return workInProgress.child;
9905}
9906
9907var hasWarnedAboutUsingContextAsConsumer = false;
9908
9909function updateContextConsumer(current, workInProgress, renderLanes) {
9910 var context = workInProgress.type; // The logic below for Context differs depending on PROD or DEV mode. In
9911 // DEV mode, we create a separate object for Context.Consumer that acts
9912 // like a proxy to Context. This proxy object adds unnecessary code in PROD
9913 // so we use the old behaviour (Context.Consumer references Context) to
9914 // reduce size and overhead. The separate object references context via
9915 // a property called "_context", which also gives us the ability to check
9916 // in DEV mode if this property exists or not and warn if it does not.
9917
9918 {
9919 if (context._context === undefined) {
9920 // This may be because it's a Context (rather than a Consumer).
9921 // Or it may be because it's older React where they're the same thing.
9922 // We only want to warn if we're sure it's a new React.
9923 if (context !== context.Consumer) {
9924 if (!hasWarnedAboutUsingContextAsConsumer) {
9925 hasWarnedAboutUsingContextAsConsumer = true;
9926
9927 error('Rendering <Context> directly is not supported and will be removed in ' + 'a future major release. Did you mean to render <Context.Consumer> instead?');
9928 }
9929 }
9930 } else {
9931 context = context._context;
9932 }
9933 }
9934
9935 var newProps = workInProgress.pendingProps;
9936 var render = newProps.children;
9937
9938 {
9939 if (typeof render !== 'function') {
9940 error('A context consumer was rendered with multiple children, or a child ' + "that isn't a function. A context consumer expects a single child " + 'that is a function. If you did pass a function, make sure there ' + 'is no trailing or leading whitespace around it.');
9941 }
9942 }
9943
9944 prepareToReadContext(workInProgress, renderLanes);
9945 var newValue = readContext(context, newProps.unstable_observedBits);
9946 var newChildren;
9947
9948 {
9949 ReactCurrentOwner$1.current = workInProgress;
9950 setIsRendering(true);
9951 newChildren = render(newValue);
9952 setIsRendering(false);
9953 } // React DevTools reads this flag.
9954
9955
9956 workInProgress.flags |= PerformedWork;
9957 reconcileChildren(current, workInProgress, newChildren, renderLanes);
9958 return workInProgress.child;
9959}
9960
9961function markWorkInProgressReceivedUpdate() {
9962 didReceiveUpdate = true;
9963}
9964
9965function bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes) {
9966 if (current !== null) {
9967 // Reuse previous dependencies
9968 workInProgress.dependencies = current.dependencies;
9969 }
9970
9971 {
9972 // Don't update "base" render times for bailouts.
9973 stopProfilerTimerIfRunning();
9974 }
9975
9976 markSkippedUpdateLanes(workInProgress.lanes); // Check if the children have any pending work.
9977
9978 if (!includesSomeLane(renderLanes, workInProgress.childLanes)) {
9979 // The children don't have any work either. We can skip them.
9980 // TODO: Once we add back resuming, we should check if the children are
9981 // a work-in-progress set. If so, we need to transfer their effects.
9982 return null;
9983 } else {
9984 // This fiber doesn't have work, but its subtree does. Clone the child
9985 // fibers and continue.
9986 cloneChildFibers(current, workInProgress);
9987 return workInProgress.child;
9988 }
9989}
9990
9991function remountFiber(current, oldWorkInProgress, newWorkInProgress) {
9992 {
9993 var returnFiber = oldWorkInProgress.return;
9994
9995 if (returnFiber === null) {
9996 throw new Error('Cannot swap the root fiber.');
9997 } // Disconnect from the old current.
9998 // It will get deleted.
9999
10000
10001 current.alternate = null;
10002 oldWorkInProgress.alternate = null; // Connect to the new tree.
10003
10004 newWorkInProgress.index = oldWorkInProgress.index;
10005 newWorkInProgress.sibling = oldWorkInProgress.sibling;
10006 newWorkInProgress.return = oldWorkInProgress.return;
10007 newWorkInProgress.ref = oldWorkInProgress.ref; // Replace the child/sibling pointers above it.
10008
10009 if (oldWorkInProgress === returnFiber.child) {
10010 returnFiber.child = newWorkInProgress;
10011 } else {
10012 var prevSibling = returnFiber.child;
10013
10014 if (prevSibling === null) {
10015 throw new Error('Expected parent to have a child.');
10016 }
10017
10018 while (prevSibling.sibling !== oldWorkInProgress) {
10019 prevSibling = prevSibling.sibling;
10020
10021 if (prevSibling === null) {
10022 throw new Error('Expected to find the previous sibling.');
10023 }
10024 }
10025
10026 prevSibling.sibling = newWorkInProgress;
10027 } // Delete the old fiber and place the new one.
10028 // Since the old fiber is disconnected, we have to schedule it manually.
10029
10030
10031 var last = returnFiber.lastEffect;
10032
10033 if (last !== null) {
10034 last.nextEffect = current;
10035 returnFiber.lastEffect = current;
10036 } else {
10037 returnFiber.firstEffect = returnFiber.lastEffect = current;
10038 }
10039
10040 current.nextEffect = null;
10041 current.flags = Deletion;
10042 newWorkInProgress.flags |= Placement; // Restart work from the new fiber.
10043
10044 return newWorkInProgress;
10045 }
10046}
10047
10048function beginWork(current, workInProgress, renderLanes) {
10049 var updateLanes = workInProgress.lanes;
10050
10051 {
10052 if (workInProgress._debugNeedsRemount && current !== null) {
10053 // This will restart the begin phase with a new fiber.
10054 return remountFiber(current, workInProgress, createFiberFromTypeAndProps(workInProgress.type, workInProgress.key, workInProgress.pendingProps, workInProgress._debugOwner || null, workInProgress.mode, workInProgress.lanes));
10055 }
10056 }
10057
10058 if (current !== null) {
10059 var oldProps = current.memoizedProps;
10060 var newProps = workInProgress.pendingProps;
10061
10062 if (oldProps !== newProps || hasContextChanged() || ( // Force a re-render if the implementation changed due to hot reload:
10063 workInProgress.type !== current.type )) {
10064 // If props or context changed, mark the fiber as having performed work.
10065 // This may be unset if the props are determined to be equal later (memo).
10066 didReceiveUpdate = true;
10067 } else if (!includesSomeLane(renderLanes, updateLanes)) {
10068 didReceiveUpdate = false; // This fiber does not have any pending work. Bailout without entering
10069 // the begin phase. There's still some bookkeeping we that needs to be done
10070 // in this optimized path, mostly pushing stuff onto the stack.
10071
10072 switch (workInProgress.tag) {
10073 case HostRoot:
10074 pushHostRootContext(workInProgress);
10075 break;
10076
10077 case HostComponent:
10078 pushHostContext(workInProgress);
10079 break;
10080
10081 case ClassComponent:
10082 {
10083 var Component = workInProgress.type;
10084
10085 if (isContextProvider(Component)) {
10086 pushContextProvider(workInProgress);
10087 }
10088
10089 break;
10090 }
10091
10092 case HostPortal:
10093 pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo);
10094 break;
10095
10096 case ContextProvider:
10097 {
10098 var newValue = workInProgress.memoizedProps.value;
10099 pushProvider(workInProgress, newValue);
10100 break;
10101 }
10102
10103 case Profiler:
10104 {
10105 // Profiler should only call onRender when one of its descendants actually rendered.
10106 var hasChildWork = includesSomeLane(renderLanes, workInProgress.childLanes);
10107
10108 if (hasChildWork) {
10109 workInProgress.flags |= Update;
10110 } // Reset effect durations for the next eventual effect phase.
10111 // These are reset during render to allow the DevTools commit hook a chance to read them,
10112
10113
10114 var stateNode = workInProgress.stateNode;
10115 stateNode.effectDuration = 0;
10116 stateNode.passiveEffectDuration = 0;
10117 }
10118
10119 break;
10120
10121 case SuspenseComponent:
10122 {
10123 var state = workInProgress.memoizedState;
10124
10125 if (state !== null) {
10126 // whether to retry the primary children, or to skip over it and
10127 // go straight to the fallback. Check the priority of the primary
10128 // child fragment.
10129
10130
10131 var primaryChildFragment = workInProgress.child;
10132 var primaryChildLanes = primaryChildFragment.childLanes;
10133
10134 if (includesSomeLane(renderLanes, primaryChildLanes)) {
10135 // The primary children have pending work. Use the normal path
10136 // to attempt to render the primary children again.
10137 return updateSuspenseComponent(current, workInProgress, renderLanes);
10138 } else {
10139 // The primary child fragment does not have pending work marked
10140 // on it
10141 pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current)); // The primary children do not have pending work with sufficient
10142 // priority. Bailout.
10143
10144 var child = bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
10145
10146 if (child !== null) {
10147 // The fallback children have pending work. Skip over the
10148 // primary children and work on the fallback.
10149 return child.sibling;
10150 } else {
10151 return null;
10152 }
10153 }
10154 } else {
10155 pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current));
10156 }
10157
10158 break;
10159 }
10160
10161 case SuspenseListComponent:
10162 {
10163 var didSuspendBefore = (current.flags & DidCapture) !== NoFlags;
10164
10165 var _hasChildWork = includesSomeLane(renderLanes, workInProgress.childLanes);
10166
10167 if (didSuspendBefore) {
10168 if (_hasChildWork) {
10169 // If something was in fallback state last time, and we have all the
10170 // same children then we're still in progressive loading state.
10171 // Something might get unblocked by state updates or retries in the
10172 // tree which will affect the tail. So we need to use the normal
10173 // path to compute the correct tail.
10174 return updateSuspenseListComponent(current, workInProgress, renderLanes);
10175 } // If none of the children had any work, that means that none of
10176 // them got retried so they'll still be blocked in the same way
10177 // as before. We can fast bail out.
10178
10179
10180 workInProgress.flags |= DidCapture;
10181 } // If nothing suspended before and we're rendering the same children,
10182 // then the tail doesn't matter. Anything new that suspends will work
10183 // in the "together" mode, so we can continue from the state we had.
10184
10185
10186 var renderState = workInProgress.memoizedState;
10187
10188 if (renderState !== null) {
10189 // Reset to the "together" mode in case we've started a different
10190 // update in the past but didn't complete it.
10191 renderState.rendering = null;
10192 renderState.tail = null;
10193 renderState.lastEffect = null;
10194 }
10195
10196 pushSuspenseContext(workInProgress, suspenseStackCursor.current);
10197
10198 if (_hasChildWork) {
10199 break;
10200 } else {
10201 // If none of the children had any work, that means that none of
10202 // them got retried so they'll still be blocked in the same way
10203 // as before. We can fast bail out.
10204 return null;
10205 }
10206 }
10207
10208 case OffscreenComponent:
10209 case LegacyHiddenComponent:
10210 {
10211 // Need to check if the tree still needs to be deferred. This is
10212 // almost identical to the logic used in the normal update path,
10213 // so we'll just enter that. The only difference is we'll bail out
10214 // at the next level instead of this one, because the child props
10215 // have not changed. Which is fine.
10216 // TODO: Probably should refactor `beginWork` to split the bailout
10217 // path from the normal path. I'm tempted to do a labeled break here
10218 // but I won't :)
10219 workInProgress.lanes = NoLanes;
10220 return updateOffscreenComponent(current, workInProgress, renderLanes);
10221 }
10222 }
10223
10224 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
10225 } else {
10226 if ((current.flags & ForceUpdateForLegacySuspense) !== NoFlags) {
10227 // This is a special case that only exists for legacy mode.
10228 // See https://github.com/facebook/react/pull/19216.
10229 didReceiveUpdate = true;
10230 } else {
10231 // An update was scheduled on this fiber, but there are no new props
10232 // nor legacy context. Set this to false. If an update queue or context
10233 // consumer produces a changed value, it will set this to true. Otherwise,
10234 // the component will assume the children have not changed and bail out.
10235 didReceiveUpdate = false;
10236 }
10237 }
10238 } else {
10239 didReceiveUpdate = false;
10240 } // Before entering the begin phase, clear pending update priority.
10241 // TODO: This assumes that we're about to evaluate the component and process
10242 // the update queue. However, there's an exception: SimpleMemoComponent
10243 // sometimes bails out later in the begin phase. This indicates that we should
10244 // move this assignment out of the common path and into each branch.
10245
10246
10247 workInProgress.lanes = NoLanes;
10248
10249 switch (workInProgress.tag) {
10250 case IndeterminateComponent:
10251 {
10252 return mountIndeterminateComponent(current, workInProgress, workInProgress.type, renderLanes);
10253 }
10254
10255 case LazyComponent:
10256 {
10257 var elementType = workInProgress.elementType;
10258 return mountLazyComponent(current, workInProgress, elementType, updateLanes, renderLanes);
10259 }
10260
10261 case FunctionComponent:
10262 {
10263 var _Component = workInProgress.type;
10264 var unresolvedProps = workInProgress.pendingProps;
10265 var resolvedProps = workInProgress.elementType === _Component ? unresolvedProps : resolveDefaultProps(_Component, unresolvedProps);
10266 return updateFunctionComponent(current, workInProgress, _Component, resolvedProps, renderLanes);
10267 }
10268
10269 case ClassComponent:
10270 {
10271 var _Component2 = workInProgress.type;
10272 var _unresolvedProps = workInProgress.pendingProps;
10273
10274 var _resolvedProps = workInProgress.elementType === _Component2 ? _unresolvedProps : resolveDefaultProps(_Component2, _unresolvedProps);
10275
10276 return updateClassComponent(current, workInProgress, _Component2, _resolvedProps, renderLanes);
10277 }
10278
10279 case HostRoot:
10280 return updateHostRoot(current, workInProgress, renderLanes);
10281
10282 case HostComponent:
10283 return updateHostComponent(current, workInProgress, renderLanes);
10284
10285 case HostText:
10286 return updateHostText();
10287
10288 case SuspenseComponent:
10289 return updateSuspenseComponent(current, workInProgress, renderLanes);
10290
10291 case HostPortal:
10292 return updatePortalComponent(current, workInProgress, renderLanes);
10293
10294 case ForwardRef:
10295 {
10296 var type = workInProgress.type;
10297 var _unresolvedProps2 = workInProgress.pendingProps;
10298
10299 var _resolvedProps2 = workInProgress.elementType === type ? _unresolvedProps2 : resolveDefaultProps(type, _unresolvedProps2);
10300
10301 return updateForwardRef(current, workInProgress, type, _resolvedProps2, renderLanes);
10302 }
10303
10304 case Fragment:
10305 return updateFragment(current, workInProgress, renderLanes);
10306
10307 case Mode:
10308 return updateMode(current, workInProgress, renderLanes);
10309
10310 case Profiler:
10311 return updateProfiler(current, workInProgress, renderLanes);
10312
10313 case ContextProvider:
10314 return updateContextProvider(current, workInProgress, renderLanes);
10315
10316 case ContextConsumer:
10317 return updateContextConsumer(current, workInProgress, renderLanes);
10318
10319 case MemoComponent:
10320 {
10321 var _type2 = workInProgress.type;
10322 var _unresolvedProps3 = workInProgress.pendingProps; // Resolve outer props first, then resolve inner props.
10323
10324 var _resolvedProps3 = resolveDefaultProps(_type2, _unresolvedProps3);
10325
10326 {
10327 if (workInProgress.type !== workInProgress.elementType) {
10328 var outerPropTypes = _type2.propTypes;
10329
10330 if (outerPropTypes) {
10331 checkPropTypes(outerPropTypes, _resolvedProps3, // Resolved for outer only
10332 'prop', getComponentName(_type2));
10333 }
10334 }
10335 }
10336
10337 _resolvedProps3 = resolveDefaultProps(_type2.type, _resolvedProps3);
10338 return updateMemoComponent(current, workInProgress, _type2, _resolvedProps3, updateLanes, renderLanes);
10339 }
10340
10341 case SimpleMemoComponent:
10342 {
10343 return updateSimpleMemoComponent(current, workInProgress, workInProgress.type, workInProgress.pendingProps, updateLanes, renderLanes);
10344 }
10345
10346 case IncompleteClassComponent:
10347 {
10348 var _Component3 = workInProgress.type;
10349 var _unresolvedProps4 = workInProgress.pendingProps;
10350
10351 var _resolvedProps4 = workInProgress.elementType === _Component3 ? _unresolvedProps4 : resolveDefaultProps(_Component3, _unresolvedProps4);
10352
10353 return mountIncompleteClassComponent(current, workInProgress, _Component3, _resolvedProps4, renderLanes);
10354 }
10355
10356 case SuspenseListComponent:
10357 {
10358 return updateSuspenseListComponent(current, workInProgress, renderLanes);
10359 }
10360
10361 case FundamentalComponent:
10362 {
10363
10364 break;
10365 }
10366
10367 case ScopeComponent:
10368 {
10369
10370 break;
10371 }
10372
10373 case Block:
10374 {
10375
10376 break;
10377 }
10378
10379 case OffscreenComponent:
10380 {
10381 return updateOffscreenComponent(current, workInProgress, renderLanes);
10382 }
10383
10384 case LegacyHiddenComponent:
10385 {
10386 return updateLegacyHiddenComponent(current, workInProgress, renderLanes);
10387 }
10388 }
10389
10390 {
10391 {
10392 throw Error( "Unknown unit of work tag (" + workInProgress.tag + "). This error is likely caused by a bug in React. Please file an issue." );
10393 }
10394 }
10395}
10396
10397function markUpdate(workInProgress) {
10398 // Tag the fiber with an update effect. This turns a Placement into
10399 // a PlacementAndUpdate.
10400 workInProgress.flags |= Update;
10401}
10402
10403function markRef$1(workInProgress) {
10404 workInProgress.flags |= Ref;
10405}
10406
10407var appendAllChildren;
10408var updateHostContainer;
10409var updateHostComponent$1;
10410var updateHostText$1;
10411
10412{
10413 // Mutation mode
10414 appendAllChildren = function (parent, workInProgress, needsVisibilityToggle, isHidden) {
10415 // We only have the top Fiber that was created but we need recurse down its
10416 // children to find all the terminal nodes.
10417 var node = workInProgress.child;
10418
10419 while (node !== null) {
10420 if (node.tag === HostComponent || node.tag === HostText) {
10421 appendInitialChild(parent, node.stateNode);
10422 } else if (node.tag === HostPortal) ; else if (node.child !== null) {
10423 node.child.return = node;
10424 node = node.child;
10425 continue;
10426 }
10427
10428 if (node === workInProgress) {
10429 return;
10430 }
10431
10432 while (node.sibling === null) {
10433 if (node.return === null || node.return === workInProgress) {
10434 return;
10435 }
10436
10437 node = node.return;
10438 }
10439
10440 node.sibling.return = node.return;
10441 node = node.sibling;
10442 }
10443 };
10444
10445 updateHostContainer = function (workInProgress) {// Noop
10446 };
10447
10448 updateHostComponent$1 = function (current, workInProgress, type, newProps, rootContainerInstance) {
10449 // If we have an alternate, that means this is an update and we need to
10450 // schedule a side-effect to do the updates.
10451 var oldProps = current.memoizedProps;
10452
10453 if (oldProps === newProps) {
10454 // In mutation mode, this is sufficient for a bailout because
10455 // we won't touch this node even if children changed.
10456 return;
10457 } // If we get updated because one of our children updated, we don't
10458 // have newProps so we'll have to reuse them.
10459 // TODO: Split the update API as separate for the props vs. children.
10460 // Even better would be if children weren't special cased at all tho.
10461
10462
10463 var instance = workInProgress.stateNode;
10464 var currentHostContext = getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
10465 // component is hitting the resume path. Figure out why. Possibly
10466 // related to `hidden`.
10467
10468 var updatePayload = prepareUpdate(); // TODO: Type this specific to this type of component.
10469
10470 workInProgress.updateQueue = updatePayload; // If the update payload indicates that there is a change or if there
10471 // is a new ref we mark this as an update. All the work is done in commitWork.
10472
10473 if (updatePayload) {
10474 markUpdate(workInProgress);
10475 }
10476 };
10477
10478 updateHostText$1 = function (current, workInProgress, oldText, newText) {
10479 // If the text differs, mark it as an update. All the work in done in commitWork.
10480 if (oldText !== newText) {
10481 markUpdate(workInProgress);
10482 }
10483 };
10484}
10485
10486function cutOffTailIfNeeded(renderState, hasRenderedATailFallback) {
10487
10488 switch (renderState.tailMode) {
10489 case 'hidden':
10490 {
10491 // Any insertions at the end of the tail list after this point
10492 // should be invisible. If there are already mounted boundaries
10493 // anything before them are not considered for collapsing.
10494 // Therefore we need to go through the whole tail to find if
10495 // there are any.
10496 var tailNode = renderState.tail;
10497 var lastTailNode = null;
10498
10499 while (tailNode !== null) {
10500 if (tailNode.alternate !== null) {
10501 lastTailNode = tailNode;
10502 }
10503
10504 tailNode = tailNode.sibling;
10505 } // Next we're simply going to delete all insertions after the
10506 // last rendered item.
10507
10508
10509 if (lastTailNode === null) {
10510 // All remaining items in the tail are insertions.
10511 renderState.tail = null;
10512 } else {
10513 // Detach the insertion after the last node that was already
10514 // inserted.
10515 lastTailNode.sibling = null;
10516 }
10517
10518 break;
10519 }
10520
10521 case 'collapsed':
10522 {
10523 // Any insertions at the end of the tail list after this point
10524 // should be invisible. If there are already mounted boundaries
10525 // anything before them are not considered for collapsing.
10526 // Therefore we need to go through the whole tail to find if
10527 // there are any.
10528 var _tailNode = renderState.tail;
10529 var _lastTailNode = null;
10530
10531 while (_tailNode !== null) {
10532 if (_tailNode.alternate !== null) {
10533 _lastTailNode = _tailNode;
10534 }
10535
10536 _tailNode = _tailNode.sibling;
10537 } // Next we're simply going to delete all insertions after the
10538 // last rendered item.
10539
10540
10541 if (_lastTailNode === null) {
10542 // All remaining items in the tail are insertions.
10543 if (!hasRenderedATailFallback && renderState.tail !== null) {
10544 // We suspended during the head. We want to show at least one
10545 // row at the tail. So we'll keep on and cut off the rest.
10546 renderState.tail.sibling = null;
10547 } else {
10548 renderState.tail = null;
10549 }
10550 } else {
10551 // Detach the insertion after the last node that was already
10552 // inserted.
10553 _lastTailNode.sibling = null;
10554 }
10555
10556 break;
10557 }
10558 }
10559}
10560
10561function completeWork(current, workInProgress, renderLanes) {
10562 var newProps = workInProgress.pendingProps;
10563
10564 switch (workInProgress.tag) {
10565 case IndeterminateComponent:
10566 case LazyComponent:
10567 case SimpleMemoComponent:
10568 case FunctionComponent:
10569 case ForwardRef:
10570 case Fragment:
10571 case Mode:
10572 case Profiler:
10573 case ContextConsumer:
10574 case MemoComponent:
10575 return null;
10576
10577 case ClassComponent:
10578 {
10579 var Component = workInProgress.type;
10580
10581 if (isContextProvider(Component)) {
10582 popContext(workInProgress);
10583 }
10584
10585 return null;
10586 }
10587
10588 case HostRoot:
10589 {
10590 popHostContainer(workInProgress);
10591 popTopLevelContextObject(workInProgress);
10592 resetWorkInProgressVersions();
10593 var fiberRoot = workInProgress.stateNode;
10594
10595 if (fiberRoot.pendingContext) {
10596 fiberRoot.context = fiberRoot.pendingContext;
10597 fiberRoot.pendingContext = null;
10598 }
10599
10600 if (current === null || current.child === null) {
10601 // If we hydrated, pop so that we can delete any remaining children
10602 // that weren't hydrated.
10603 var wasHydrated = popHydrationState();
10604
10605 if (wasHydrated) {
10606 // If we hydrated, then we'll need to schedule an update for
10607 // the commit side-effects on the root.
10608 markUpdate(workInProgress);
10609 } else if (!fiberRoot.hydrate) {
10610 // Schedule an effect to clear this container at the start of the next commit.
10611 // This handles the case of React rendering into a container with previous children.
10612 // It's also safe to do for updates too, because current.child would only be null
10613 // if the previous render was null (so the the container would already be empty).
10614 workInProgress.flags |= Snapshot;
10615 }
10616 }
10617
10618 updateHostContainer(workInProgress);
10619 return null;
10620 }
10621
10622 case HostComponent:
10623 {
10624 popHostContext(workInProgress);
10625 var rootContainerInstance = getRootHostContainer();
10626 var type = workInProgress.type;
10627
10628 if (current !== null && workInProgress.stateNode != null) {
10629 updateHostComponent$1(current, workInProgress, type, newProps, rootContainerInstance);
10630
10631 if (current.ref !== workInProgress.ref) {
10632 markRef$1(workInProgress);
10633 }
10634 } else {
10635 if (!newProps) {
10636 if (!(workInProgress.stateNode !== null)) {
10637 {
10638 throw Error( "We must have new props for new mounts. This error is likely caused by a bug in React. Please file an issue." );
10639 }
10640 } // This can happen when we abort work.
10641
10642
10643 return null;
10644 }
10645
10646 var currentHostContext = getHostContext(); // TODO: Move createInstance to beginWork and keep it on a context
10647 // "stack" as the parent. Then append children as we go in beginWork
10648 // or completeWork depending on whether we want to add them top->down or
10649 // bottom->up. Top->down is faster in IE11.
10650
10651 var _wasHydrated = popHydrationState();
10652
10653 if (_wasHydrated) {
10654 // TODO: Move this and createInstance step into the beginPhase
10655 // to consolidate.
10656 if (prepareToHydrateHostInstance()) {
10657 // If changes to the hydrated node need to be applied at the
10658 // commit-phase we mark this as such.
10659 markUpdate(workInProgress);
10660 }
10661 } else {
10662 var instance = createInstance(type, newProps);
10663 appendAllChildren(instance, workInProgress, false, false);
10664 workInProgress.stateNode = instance; // Certain renderers require commit-time effects for initial mount.
10665 }
10666
10667 if (workInProgress.ref !== null) {
10668 // If there is a ref on a host node we need to schedule a callback
10669 markRef$1(workInProgress);
10670 }
10671 }
10672
10673 return null;
10674 }
10675
10676 case HostText:
10677 {
10678 var newText = newProps;
10679
10680 if (current && workInProgress.stateNode != null) {
10681 var oldText = current.memoizedProps; // If we have an alternate, that means this is an update and we need
10682 // to schedule a side-effect to do the updates.
10683
10684 updateHostText$1(current, workInProgress, oldText, newText);
10685 } else {
10686 if (typeof newText !== 'string') {
10687 if (!(workInProgress.stateNode !== null)) {
10688 {
10689 throw Error( "We must have new props for new mounts. This error is likely caused by a bug in React. Please file an issue." );
10690 }
10691 } // This can happen when we abort work.
10692
10693 }
10694
10695 var _rootContainerInstance = getRootHostContainer();
10696
10697 var _currentHostContext = getHostContext();
10698
10699 var _wasHydrated2 = popHydrationState();
10700
10701 if (_wasHydrated2) {
10702 if (prepareToHydrateHostTextInstance()) {
10703 markUpdate(workInProgress);
10704 }
10705 } else {
10706 workInProgress.stateNode = createTextInstance(newText);
10707 }
10708 }
10709
10710 return null;
10711 }
10712
10713 case SuspenseComponent:
10714 {
10715 popSuspenseContext(workInProgress);
10716 var nextState = workInProgress.memoizedState;
10717
10718 if ((workInProgress.flags & DidCapture) !== NoFlags) {
10719 // Something suspended. Re-render with the fallback children.
10720 workInProgress.lanes = renderLanes; // Do not reset the effect list.
10721
10722 if ( (workInProgress.mode & ProfileMode) !== NoMode) {
10723 transferActualDuration(workInProgress);
10724 }
10725
10726 return workInProgress;
10727 }
10728
10729 var nextDidTimeout = nextState !== null;
10730 var prevDidTimeout = false;
10731
10732 if (current === null) {
10733 if (workInProgress.memoizedProps.fallback !== undefined) ;
10734 } else {
10735 var prevState = current.memoizedState;
10736 prevDidTimeout = prevState !== null;
10737 }
10738
10739 if (nextDidTimeout && !prevDidTimeout) {
10740 // If this subtreee is running in blocking mode we can suspend,
10741 // otherwise we won't suspend.
10742 // TODO: This will still suspend a synchronous tree if anything
10743 // in the concurrent tree already suspended during this render.
10744 // This is a known bug.
10745 if ((workInProgress.mode & BlockingMode) !== NoMode) {
10746 // TODO: Move this back to throwException because this is too late
10747 // if this is a large tree which is common for initial loads. We
10748 // don't know if we should restart a render or not until we get
10749 // this marker, and this is too late.
10750 // If this render already had a ping or lower pri updates,
10751 // and this is the first time we know we're going to suspend we
10752 // should be able to immediately restart from within throwException.
10753 var hasInvisibleChildContext = current === null && workInProgress.memoizedProps.unstable_avoidThisFallback !== true;
10754
10755 if (hasInvisibleChildContext || hasSuspenseContext(suspenseStackCursor.current, InvisibleParentSuspenseContext)) {
10756 // If this was in an invisible tree or a new render, then showing
10757 // this boundary is ok.
10758 renderDidSuspend();
10759 } else {
10760 // Otherwise, we're going to have to hide content so we should
10761 // suspend for longer if possible.
10762 renderDidSuspendDelayIfPossible();
10763 }
10764 }
10765 }
10766
10767 {
10768 // TODO: Only schedule updates if these values are non equal, i.e. it changed.
10769 if (nextDidTimeout || prevDidTimeout) {
10770 // If this boundary just timed out, schedule an effect to attach a
10771 // retry listener to the promise. This flag is also used to hide the
10772 // primary children. In mutation mode, we also need the flag to
10773 // *unhide* children that were previously hidden, so check if this
10774 // is currently timed out, too.
10775 workInProgress.flags |= Update;
10776 }
10777 }
10778
10779 return null;
10780 }
10781
10782 case HostPortal:
10783 popHostContainer(workInProgress);
10784 updateHostContainer(workInProgress);
10785
10786 if (current === null) {
10787 preparePortalMount(workInProgress.stateNode.containerInfo);
10788 }
10789
10790 return null;
10791
10792 case ContextProvider:
10793 // Pop provider fiber
10794 popProvider(workInProgress);
10795 return null;
10796
10797 case IncompleteClassComponent:
10798 {
10799 // Same as class component case. I put it down here so that the tags are
10800 // sequential to ensure this switch is compiled to a jump table.
10801 var _Component = workInProgress.type;
10802
10803 if (isContextProvider(_Component)) {
10804 popContext(workInProgress);
10805 }
10806
10807 return null;
10808 }
10809
10810 case SuspenseListComponent:
10811 {
10812 popSuspenseContext(workInProgress);
10813 var renderState = workInProgress.memoizedState;
10814
10815 if (renderState === null) {
10816 // We're running in the default, "independent" mode.
10817 // We don't do anything in this mode.
10818 return null;
10819 }
10820
10821 var didSuspendAlready = (workInProgress.flags & DidCapture) !== NoFlags;
10822 var renderedTail = renderState.rendering;
10823
10824 if (renderedTail === null) {
10825 // We just rendered the head.
10826 if (!didSuspendAlready) {
10827 // This is the first pass. We need to figure out if anything is still
10828 // suspended in the rendered set.
10829 // If new content unsuspended, but there's still some content that
10830 // didn't. Then we need to do a second pass that forces everything
10831 // to keep showing their fallbacks.
10832 // We might be suspended if something in this render pass suspended, or
10833 // something in the previous committed pass suspended. Otherwise,
10834 // there's no chance so we can skip the expensive call to
10835 // findFirstSuspended.
10836 var cannotBeSuspended = renderHasNotSuspendedYet() && (current === null || (current.flags & DidCapture) === NoFlags);
10837
10838 if (!cannotBeSuspended) {
10839 var row = workInProgress.child;
10840
10841 while (row !== null) {
10842 var suspended = findFirstSuspended(row);
10843
10844 if (suspended !== null) {
10845 didSuspendAlready = true;
10846 workInProgress.flags |= DidCapture;
10847 cutOffTailIfNeeded(renderState, false); // If this is a newly suspended tree, it might not get committed as
10848 // part of the second pass. In that case nothing will subscribe to
10849 // its thennables. Instead, we'll transfer its thennables to the
10850 // SuspenseList so that it can retry if they resolve.
10851 // There might be multiple of these in the list but since we're
10852 // going to wait for all of them anyway, it doesn't really matter
10853 // which ones gets to ping. In theory we could get clever and keep
10854 // track of how many dependencies remain but it gets tricky because
10855 // in the meantime, we can add/remove/change items and dependencies.
10856 // We might bail out of the loop before finding any but that
10857 // doesn't matter since that means that the other boundaries that
10858 // we did find already has their listeners attached.
10859
10860 var newThennables = suspended.updateQueue;
10861
10862 if (newThennables !== null) {
10863 workInProgress.updateQueue = newThennables;
10864 workInProgress.flags |= Update;
10865 } // Rerender the whole list, but this time, we'll force fallbacks
10866 // to stay in place.
10867 // Reset the effect list before doing the second pass since that's now invalid.
10868
10869
10870 if (renderState.lastEffect === null) {
10871 workInProgress.firstEffect = null;
10872 }
10873
10874 workInProgress.lastEffect = renderState.lastEffect; // Reset the child fibers to their original state.
10875
10876 resetChildFibers(workInProgress, renderLanes); // Set up the Suspense Context to force suspense and immediately
10877 // rerender the children.
10878
10879 pushSuspenseContext(workInProgress, setShallowSuspenseContext(suspenseStackCursor.current, ForceSuspenseFallback));
10880 return workInProgress.child;
10881 }
10882
10883 row = row.sibling;
10884 }
10885 }
10886
10887 if (renderState.tail !== null && now() > getRenderTargetTime()) {
10888 // We have already passed our CPU deadline but we still have rows
10889 // left in the tail. We'll just give up further attempts to render
10890 // the main content and only render fallbacks.
10891 workInProgress.flags |= DidCapture;
10892 didSuspendAlready = true;
10893 cutOffTailIfNeeded(renderState, false); // Since nothing actually suspended, there will nothing to ping this
10894 // to get it started back up to attempt the next item. While in terms
10895 // of priority this work has the same priority as this current render,
10896 // it's not part of the same transition once the transition has
10897 // committed. If it's sync, we still want to yield so that it can be
10898 // painted. Conceptually, this is really the same as pinging.
10899 // We can use any RetryLane even if it's the one currently rendering
10900 // since we're leaving it behind on this node.
10901
10902 workInProgress.lanes = SomeRetryLane;
10903
10904 {
10905 markSpawnedWork(SomeRetryLane);
10906 }
10907 }
10908 } else {
10909 cutOffTailIfNeeded(renderState, false);
10910 } // Next we're going to render the tail.
10911
10912 } else {
10913 // Append the rendered row to the child list.
10914 if (!didSuspendAlready) {
10915 var _suspended = findFirstSuspended(renderedTail);
10916
10917 if (_suspended !== null) {
10918 workInProgress.flags |= DidCapture;
10919 didSuspendAlready = true; // Ensure we transfer the update queue to the parent so that it doesn't
10920 // get lost if this row ends up dropped during a second pass.
10921
10922 var _newThennables = _suspended.updateQueue;
10923
10924 if (_newThennables !== null) {
10925 workInProgress.updateQueue = _newThennables;
10926 workInProgress.flags |= Update;
10927 }
10928
10929 cutOffTailIfNeeded(renderState, true); // This might have been modified.
10930
10931 if (renderState.tail === null && renderState.tailMode === 'hidden' && !renderedTail.alternate && !getIsHydrating() // We don't cut it if we're hydrating.
10932 ) {
10933 // We need to delete the row we just rendered.
10934 // Reset the effect list to what it was before we rendered this
10935 // child. The nested children have already appended themselves.
10936 var lastEffect = workInProgress.lastEffect = renderState.lastEffect; // Remove any effects that were appended after this point.
10937
10938 if (lastEffect !== null) {
10939 lastEffect.nextEffect = null;
10940 } // We're done.
10941
10942
10943 return null;
10944 }
10945 } else if ( // The time it took to render last row is greater than the remaining
10946 // time we have to render. So rendering one more row would likely
10947 // exceed it.
10948 now() * 2 - renderState.renderingStartTime > getRenderTargetTime() && renderLanes !== OffscreenLane) {
10949 // We have now passed our CPU deadline and we'll just give up further
10950 // attempts to render the main content and only render fallbacks.
10951 // The assumption is that this is usually faster.
10952 workInProgress.flags |= DidCapture;
10953 didSuspendAlready = true;
10954 cutOffTailIfNeeded(renderState, false); // Since nothing actually suspended, there will nothing to ping this
10955 // to get it started back up to attempt the next item. While in terms
10956 // of priority this work has the same priority as this current render,
10957 // it's not part of the same transition once the transition has
10958 // committed. If it's sync, we still want to yield so that it can be
10959 // painted. Conceptually, this is really the same as pinging.
10960 // We can use any RetryLane even if it's the one currently rendering
10961 // since we're leaving it behind on this node.
10962
10963 workInProgress.lanes = SomeRetryLane;
10964
10965 {
10966 markSpawnedWork(SomeRetryLane);
10967 }
10968 }
10969 }
10970
10971 if (renderState.isBackwards) {
10972 // The effect list of the backwards tail will have been added
10973 // to the end. This breaks the guarantee that life-cycles fire in
10974 // sibling order but that isn't a strong guarantee promised by React.
10975 // Especially since these might also just pop in during future commits.
10976 // Append to the beginning of the list.
10977 renderedTail.sibling = workInProgress.child;
10978 workInProgress.child = renderedTail;
10979 } else {
10980 var previousSibling = renderState.last;
10981
10982 if (previousSibling !== null) {
10983 previousSibling.sibling = renderedTail;
10984 } else {
10985 workInProgress.child = renderedTail;
10986 }
10987
10988 renderState.last = renderedTail;
10989 }
10990 }
10991
10992 if (renderState.tail !== null) {
10993 // We still have tail rows to render.
10994 // Pop a row.
10995 var next = renderState.tail;
10996 renderState.rendering = next;
10997 renderState.tail = next.sibling;
10998 renderState.lastEffect = workInProgress.lastEffect;
10999 renderState.renderingStartTime = now();
11000 next.sibling = null; // Restore the context.
11001 // TODO: We can probably just avoid popping it instead and only
11002 // setting it the first time we go from not suspended to suspended.
11003
11004 var suspenseContext = suspenseStackCursor.current;
11005
11006 if (didSuspendAlready) {
11007 suspenseContext = setShallowSuspenseContext(suspenseContext, ForceSuspenseFallback);
11008 } else {
11009 suspenseContext = setDefaultShallowSuspenseContext(suspenseContext);
11010 }
11011
11012 pushSuspenseContext(workInProgress, suspenseContext); // Do a pass over the next row.
11013
11014 return next;
11015 }
11016
11017 return null;
11018 }
11019
11020 case FundamentalComponent:
11021 {
11022
11023 break;
11024 }
11025
11026 case ScopeComponent:
11027 {
11028
11029 break;
11030 }
11031
11032 case Block:
11033
11034 break;
11035
11036 case OffscreenComponent:
11037 case LegacyHiddenComponent:
11038 {
11039 popRenderLanes(workInProgress);
11040
11041 if (current !== null) {
11042 var _nextState = workInProgress.memoizedState;
11043 var _prevState = current.memoizedState;
11044 var prevIsHidden = _prevState !== null;
11045 var nextIsHidden = _nextState !== null;
11046
11047 if (prevIsHidden !== nextIsHidden && newProps.mode !== 'unstable-defer-without-hiding') {
11048 workInProgress.flags |= Update;
11049 }
11050 }
11051
11052 return null;
11053 }
11054 }
11055
11056 {
11057 {
11058 throw Error( "Unknown unit of work tag (" + workInProgress.tag + "). This error is likely caused by a bug in React. Please file an issue." );
11059 }
11060 }
11061}
11062
11063function unwindWork(workInProgress, renderLanes) {
11064 switch (workInProgress.tag) {
11065 case ClassComponent:
11066 {
11067 var Component = workInProgress.type;
11068
11069 if (isContextProvider(Component)) {
11070 popContext(workInProgress);
11071 }
11072
11073 var flags = workInProgress.flags;
11074
11075 if (flags & ShouldCapture) {
11076 workInProgress.flags = flags & ~ShouldCapture | DidCapture;
11077
11078 if ( (workInProgress.mode & ProfileMode) !== NoMode) {
11079 transferActualDuration(workInProgress);
11080 }
11081
11082 return workInProgress;
11083 }
11084
11085 return null;
11086 }
11087
11088 case HostRoot:
11089 {
11090 popHostContainer(workInProgress);
11091 popTopLevelContextObject(workInProgress);
11092 resetWorkInProgressVersions();
11093 var _flags = workInProgress.flags;
11094
11095 if (!((_flags & DidCapture) === NoFlags)) {
11096 {
11097 throw Error( "The root failed to unmount after an error. This is likely a bug in React. Please file an issue." );
11098 }
11099 }
11100
11101 workInProgress.flags = _flags & ~ShouldCapture | DidCapture;
11102 return workInProgress;
11103 }
11104
11105 case HostComponent:
11106 {
11107 // TODO: popHydrationState
11108 popHostContext(workInProgress);
11109 return null;
11110 }
11111
11112 case SuspenseComponent:
11113 {
11114 popSuspenseContext(workInProgress);
11115
11116 var _flags2 = workInProgress.flags;
11117
11118 if (_flags2 & ShouldCapture) {
11119 workInProgress.flags = _flags2 & ~ShouldCapture | DidCapture; // Captured a suspense effect. Re-render the boundary.
11120
11121 if ( (workInProgress.mode & ProfileMode) !== NoMode) {
11122 transferActualDuration(workInProgress);
11123 }
11124
11125 return workInProgress;
11126 }
11127
11128 return null;
11129 }
11130
11131 case SuspenseListComponent:
11132 {
11133 popSuspenseContext(workInProgress); // SuspenseList doesn't actually catch anything. It should've been
11134 // caught by a nested boundary. If not, it should bubble through.
11135
11136 return null;
11137 }
11138
11139 case HostPortal:
11140 popHostContainer(workInProgress);
11141 return null;
11142
11143 case ContextProvider:
11144 popProvider(workInProgress);
11145 return null;
11146
11147 case OffscreenComponent:
11148 case LegacyHiddenComponent:
11149 popRenderLanes(workInProgress);
11150 return null;
11151
11152 default:
11153 return null;
11154 }
11155}
11156
11157function unwindInterruptedWork(interruptedWork) {
11158 switch (interruptedWork.tag) {
11159 case ClassComponent:
11160 {
11161 var childContextTypes = interruptedWork.type.childContextTypes;
11162
11163 if (childContextTypes !== null && childContextTypes !== undefined) {
11164 popContext(interruptedWork);
11165 }
11166
11167 break;
11168 }
11169
11170 case HostRoot:
11171 {
11172 popHostContainer(interruptedWork);
11173 popTopLevelContextObject(interruptedWork);
11174 resetWorkInProgressVersions();
11175 break;
11176 }
11177
11178 case HostComponent:
11179 {
11180 popHostContext(interruptedWork);
11181 break;
11182 }
11183
11184 case HostPortal:
11185 popHostContainer(interruptedWork);
11186 break;
11187
11188 case SuspenseComponent:
11189 popSuspenseContext(interruptedWork);
11190 break;
11191
11192 case SuspenseListComponent:
11193 popSuspenseContext(interruptedWork);
11194 break;
11195
11196 case ContextProvider:
11197 popProvider(interruptedWork);
11198 break;
11199
11200 case OffscreenComponent:
11201 case LegacyHiddenComponent:
11202 popRenderLanes(interruptedWork);
11203 break;
11204 }
11205}
11206
11207function createCapturedValue(value, source) {
11208 // If the value is an error, call this function immediately after it is thrown
11209 // so the stack is accurate.
11210 return {
11211 value: value,
11212 source: source,
11213 stack: getStackByFiberInDevAndProd(source)
11214 };
11215}
11216
11217// This module is forked in different environments.
11218// By default, return `true` to log errors to the console.
11219// Forks can return `false` if this isn't desirable.
11220function showErrorDialog(boundary, errorInfo) {
11221 return true;
11222}
11223
11224function logCapturedError(boundary, errorInfo) {
11225 try {
11226 var logError = showErrorDialog(boundary, errorInfo); // Allow injected showErrorDialog() to prevent default console.error logging.
11227 // This enables renderers like ReactNative to better manage redbox behavior.
11228
11229 if (logError === false) {
11230 return;
11231 }
11232
11233 var error = errorInfo.value;
11234
11235 if (true) {
11236 var source = errorInfo.source;
11237 var stack = errorInfo.stack;
11238 var componentStack = stack !== null ? stack : ''; // Browsers support silencing uncaught errors by calling
11239 // `preventDefault()` in window `error` handler.
11240 // We record this information as an expando on the error.
11241
11242 if (error != null && error._suppressLogging) {
11243 if (boundary.tag === ClassComponent) {
11244 // The error is recoverable and was silenced.
11245 // Ignore it and don't print the stack addendum.
11246 // This is handy for testing error boundaries without noise.
11247 return;
11248 } // The error is fatal. Since the silencing might have
11249 // been accidental, we'll surface it anyway.
11250 // However, the browser would have silenced the original error
11251 // so we'll print it first, and then print the stack addendum.
11252
11253
11254 console['error'](error); // Don't transform to our wrapper
11255 // For a more detailed description of this block, see:
11256 // https://github.com/facebook/react/pull/13384
11257 }
11258
11259 var componentName = source ? getComponentName(source.type) : null;
11260 var componentNameMessage = componentName ? "The above error occurred in the <" + componentName + "> component:" : 'The above error occurred in one of your React components:';
11261 var errorBoundaryMessage;
11262 var errorBoundaryName = getComponentName(boundary.type);
11263
11264 if (errorBoundaryName) {
11265 errorBoundaryMessage = "React will try to recreate this component tree from scratch " + ("using the error boundary you provided, " + errorBoundaryName + ".");
11266 } else {
11267 errorBoundaryMessage = 'Consider adding an error boundary to your tree to customize error handling behavior.\n' + 'Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.';
11268 }
11269
11270 var combinedMessage = componentNameMessage + "\n" + componentStack + "\n\n" + ("" + errorBoundaryMessage); // In development, we provide our own message with just the component stack.
11271 // We don't include the original error message and JS stack because the browser
11272 // has already printed it. Even if the application swallows the error, it is still
11273 // displayed by the browser thanks to the DEV-only fake event trick in ReactErrorUtils.
11274
11275 console['error'](combinedMessage); // Don't transform to our wrapper
11276 } else {
11277 // In production, we print the error directly.
11278 // This will include the message, the JS stack, and anything the browser wants to show.
11279 // We pass the error object instead of custom message so that the browser displays the error natively.
11280 console['error'](error); // Don't transform to our wrapper
11281 }
11282 } catch (e) {
11283 // This method must not throw, or React internal state will get messed up.
11284 // If console.error is overridden, or logCapturedError() shows a dialog that throws,
11285 // we want to report this error outside of the normal stack as a last resort.
11286 // https://github.com/facebook/react/issues/13188
11287 setTimeout(function () {
11288 throw e;
11289 });
11290 }
11291}
11292
11293var PossiblyWeakMap$1 = typeof WeakMap === 'function' ? WeakMap : Map;
11294
11295function createRootErrorUpdate(fiber, errorInfo, lane) {
11296 var update = createUpdate(NoTimestamp, lane); // Unmount the root by rendering null.
11297
11298 update.tag = CaptureUpdate; // Caution: React DevTools currently depends on this property
11299 // being called "element".
11300
11301 update.payload = {
11302 element: null
11303 };
11304 var error = errorInfo.value;
11305
11306 update.callback = function () {
11307 onUncaughtError(error);
11308 logCapturedError(fiber, errorInfo);
11309 };
11310
11311 return update;
11312}
11313
11314function createClassErrorUpdate(fiber, errorInfo, lane) {
11315 var update = createUpdate(NoTimestamp, lane);
11316 update.tag = CaptureUpdate;
11317 var getDerivedStateFromError = fiber.type.getDerivedStateFromError;
11318
11319 if (typeof getDerivedStateFromError === 'function') {
11320 var error$1 = errorInfo.value;
11321
11322 update.payload = function () {
11323 logCapturedError(fiber, errorInfo);
11324 return getDerivedStateFromError(error$1);
11325 };
11326 }
11327
11328 var inst = fiber.stateNode;
11329
11330 if (inst !== null && typeof inst.componentDidCatch === 'function') {
11331 update.callback = function callback() {
11332 {
11333 markFailedErrorBoundaryForHotReloading(fiber);
11334 }
11335
11336 if (typeof getDerivedStateFromError !== 'function') {
11337 // To preserve the preexisting retry behavior of error boundaries,
11338 // we keep track of which ones already failed during this batch.
11339 // This gets reset before we yield back to the browser.
11340 // TODO: Warn in strict mode if getDerivedStateFromError is
11341 // not defined.
11342 markLegacyErrorBoundaryAsFailed(this); // Only log here if componentDidCatch is the only error boundary method defined
11343
11344 logCapturedError(fiber, errorInfo);
11345 }
11346
11347 var error$1 = errorInfo.value;
11348 var stack = errorInfo.stack;
11349 this.componentDidCatch(error$1, {
11350 componentStack: stack !== null ? stack : ''
11351 });
11352
11353 {
11354 if (typeof getDerivedStateFromError !== 'function') {
11355 // If componentDidCatch is the only error boundary method defined,
11356 // then it needs to call setState to recover from errors.
11357 // If no state update is scheduled then the boundary will swallow the error.
11358 if (!includesSomeLane(fiber.lanes, SyncLane)) {
11359 error('%s: Error boundaries should implement getDerivedStateFromError(). ' + 'In that method, return a state update to display an error message or fallback UI.', getComponentName(fiber.type) || 'Unknown');
11360 }
11361 }
11362 }
11363 };
11364 } else {
11365 update.callback = function () {
11366 markFailedErrorBoundaryForHotReloading(fiber);
11367 };
11368 }
11369
11370 return update;
11371}
11372
11373function attachPingListener(root, wakeable, lanes) {
11374 // Attach a listener to the promise to "ping" the root and retry. But only if
11375 // one does not already exist for the lanes we're currently rendering (which
11376 // acts like a "thread ID" here).
11377 var pingCache = root.pingCache;
11378 var threadIDs;
11379
11380 if (pingCache === null) {
11381 pingCache = root.pingCache = new PossiblyWeakMap$1();
11382 threadIDs = new Set();
11383 pingCache.set(wakeable, threadIDs);
11384 } else {
11385 threadIDs = pingCache.get(wakeable);
11386
11387 if (threadIDs === undefined) {
11388 threadIDs = new Set();
11389 pingCache.set(wakeable, threadIDs);
11390 }
11391 }
11392
11393 if (!threadIDs.has(lanes)) {
11394 // Memoize using the thread ID to prevent redundant listeners.
11395 threadIDs.add(lanes);
11396 var ping = pingSuspendedRoot.bind(null, root, wakeable, lanes);
11397 wakeable.then(ping, ping);
11398 }
11399}
11400
11401function throwException(root, returnFiber, sourceFiber, value, rootRenderLanes) {
11402 // The source fiber did not complete.
11403 sourceFiber.flags |= Incomplete; // Its effect list is no longer valid.
11404
11405 sourceFiber.firstEffect = sourceFiber.lastEffect = null;
11406
11407 if (value !== null && typeof value === 'object' && typeof value.then === 'function') {
11408 // This is a wakeable.
11409 var wakeable = value;
11410
11411 if ((sourceFiber.mode & BlockingMode) === NoMode) {
11412 // Reset the memoizedState to what it was before we attempted
11413 // to render it.
11414 var currentSource = sourceFiber.alternate;
11415
11416 if (currentSource) {
11417 sourceFiber.updateQueue = currentSource.updateQueue;
11418 sourceFiber.memoizedState = currentSource.memoizedState;
11419 sourceFiber.lanes = currentSource.lanes;
11420 } else {
11421 sourceFiber.updateQueue = null;
11422 sourceFiber.memoizedState = null;
11423 }
11424 }
11425
11426 var hasInvisibleParentBoundary = hasSuspenseContext(suspenseStackCursor.current, InvisibleParentSuspenseContext); // Schedule the nearest Suspense to re-render the timed out view.
11427
11428 var _workInProgress = returnFiber;
11429
11430 do {
11431 if (_workInProgress.tag === SuspenseComponent && shouldCaptureSuspense(_workInProgress, hasInvisibleParentBoundary)) {
11432 // Found the nearest boundary.
11433 // Stash the promise on the boundary fiber. If the boundary times out, we'll
11434 // attach another listener to flip the boundary back to its normal state.
11435 var wakeables = _workInProgress.updateQueue;
11436
11437 if (wakeables === null) {
11438 var updateQueue = new Set();
11439 updateQueue.add(wakeable);
11440 _workInProgress.updateQueue = updateQueue;
11441 } else {
11442 wakeables.add(wakeable);
11443 } // If the boundary is outside of blocking mode, we should *not*
11444 // suspend the commit. Pretend as if the suspended component rendered
11445 // null and keep rendering. In the commit phase, we'll schedule a
11446 // subsequent synchronous update to re-render the Suspense.
11447 //
11448 // Note: It doesn't matter whether the component that suspended was
11449 // inside a blocking mode tree. If the Suspense is outside of it, we
11450 // should *not* suspend the commit.
11451
11452
11453 if ((_workInProgress.mode & BlockingMode) === NoMode) {
11454 _workInProgress.flags |= DidCapture;
11455 sourceFiber.flags |= ForceUpdateForLegacySuspense; // We're going to commit this fiber even though it didn't complete.
11456 // But we shouldn't call any lifecycle methods or callbacks. Remove
11457 // all lifecycle effect tags.
11458
11459 sourceFiber.flags &= ~(LifecycleEffectMask | Incomplete);
11460
11461 if (sourceFiber.tag === ClassComponent) {
11462 var currentSourceFiber = sourceFiber.alternate;
11463
11464 if (currentSourceFiber === null) {
11465 // This is a new mount. Change the tag so it's not mistaken for a
11466 // completed class component. For example, we should not call
11467 // componentWillUnmount if it is deleted.
11468 sourceFiber.tag = IncompleteClassComponent;
11469 } else {
11470 // When we try rendering again, we should not reuse the current fiber,
11471 // since it's known to be in an inconsistent state. Use a force update to
11472 // prevent a bail out.
11473 var update = createUpdate(NoTimestamp, SyncLane);
11474 update.tag = ForceUpdate;
11475 enqueueUpdate(sourceFiber, update);
11476 }
11477 } // The source fiber did not complete. Mark it with Sync priority to
11478 // indicate that it still has pending work.
11479
11480
11481 sourceFiber.lanes = mergeLanes(sourceFiber.lanes, SyncLane); // Exit without suspending.
11482
11483 return;
11484 } // Confirmed that the boundary is in a concurrent mode tree. Continue
11485 // with the normal suspend path.
11486 //
11487 // After this we'll use a set of heuristics to determine whether this
11488 // render pass will run to completion or restart or "suspend" the commit.
11489 // The actual logic for this is spread out in different places.
11490 //
11491 // This first principle is that if we're going to suspend when we complete
11492 // a root, then we should also restart if we get an update or ping that
11493 // might unsuspend it, and vice versa. The only reason to suspend is
11494 // because you think you might want to restart before committing. However,
11495 // it doesn't make sense to restart only while in the period we're suspended.
11496 //
11497 // Restarting too aggressively is also not good because it starves out any
11498 // intermediate loading state. So we use heuristics to determine when.
11499 // Suspense Heuristics
11500 //
11501 // If nothing threw a Promise or all the same fallbacks are already showing,
11502 // then don't suspend/restart.
11503 //
11504 // If this is an initial render of a new tree of Suspense boundaries and
11505 // those trigger a fallback, then don't suspend/restart. We want to ensure
11506 // that we can show the initial loading state as quickly as possible.
11507 //
11508 // If we hit a "Delayed" case, such as when we'd switch from content back into
11509 // a fallback, then we should always suspend/restart. Transitions apply
11510 // to this case. If none is defined, JND is used instead.
11511 //
11512 // If we're already showing a fallback and it gets "retried", allowing us to show
11513 // another level, but there's still an inner boundary that would show a fallback,
11514 // then we suspend/restart for 500ms since the last time we showed a fallback
11515 // anywhere in the tree. This effectively throttles progressive loading into a
11516 // consistent train of commits. This also gives us an opportunity to restart to
11517 // get to the completed state slightly earlier.
11518 //
11519 // If there's ambiguity due to batching it's resolved in preference of:
11520 // 1) "delayed", 2) "initial render", 3) "retry".
11521 //
11522 // We want to ensure that a "busy" state doesn't get force committed. We want to
11523 // ensure that new initial loading states can commit as soon as possible.
11524
11525
11526 attachPingListener(root, wakeable, rootRenderLanes);
11527 _workInProgress.flags |= ShouldCapture;
11528 _workInProgress.lanes = rootRenderLanes;
11529 return;
11530 } // This boundary already captured during this render. Continue to the next
11531 // boundary.
11532
11533
11534 _workInProgress = _workInProgress.return;
11535 } while (_workInProgress !== null); // No boundary was found. Fallthrough to error mode.
11536 // TODO: Use invariant so the message is stripped in prod?
11537
11538
11539 value = new Error((getComponentName(sourceFiber.type) || 'A React component') + ' suspended while rendering, but no fallback UI was specified.\n' + '\n' + 'Add a <Suspense fallback=...> component higher in the tree to ' + 'provide a loading indicator or placeholder to display.');
11540 } // We didn't find a boundary that could handle this type of exception. Start
11541 // over and traverse parent path again, this time treating the exception
11542 // as an error.
11543
11544
11545 renderDidError();
11546 value = createCapturedValue(value, sourceFiber);
11547 var workInProgress = returnFiber;
11548
11549 do {
11550 switch (workInProgress.tag) {
11551 case HostRoot:
11552 {
11553 var _errorInfo = value;
11554 workInProgress.flags |= ShouldCapture;
11555 var lane = pickArbitraryLane(rootRenderLanes);
11556 workInProgress.lanes = mergeLanes(workInProgress.lanes, lane);
11557
11558 var _update = createRootErrorUpdate(workInProgress, _errorInfo, lane);
11559
11560 enqueueCapturedUpdate(workInProgress, _update);
11561 return;
11562 }
11563
11564 case ClassComponent:
11565 // Capture and retry
11566 var errorInfo = value;
11567 var ctor = workInProgress.type;
11568 var instance = workInProgress.stateNode;
11569
11570 if ((workInProgress.flags & DidCapture) === NoFlags && (typeof ctor.getDerivedStateFromError === 'function' || instance !== null && typeof instance.componentDidCatch === 'function' && !isAlreadyFailedLegacyErrorBoundary(instance))) {
11571 workInProgress.flags |= ShouldCapture;
11572
11573 var _lane = pickArbitraryLane(rootRenderLanes);
11574
11575 workInProgress.lanes = mergeLanes(workInProgress.lanes, _lane); // Schedule the error boundary to re-render using updated state
11576
11577 var _update2 = createClassErrorUpdate(workInProgress, errorInfo, _lane);
11578
11579 enqueueCapturedUpdate(workInProgress, _update2);
11580 return;
11581 }
11582
11583 break;
11584 }
11585
11586 workInProgress = workInProgress.return;
11587 } while (workInProgress !== null);
11588}
11589
11590function invokeGuardedCallbackProd(name, func, context, a, b, c, d, e, f) {
11591 var funcArgs = Array.prototype.slice.call(arguments, 3);
11592
11593 try {
11594 func.apply(context, funcArgs);
11595 } catch (error) {
11596 this.onError(error);
11597 }
11598}
11599
11600var invokeGuardedCallbackImpl = invokeGuardedCallbackProd;
11601
11602{
11603 // In DEV mode, we swap out invokeGuardedCallback for a special version
11604 // that plays more nicely with the browser's DevTools. The idea is to preserve
11605 // "Pause on exceptions" behavior. Because React wraps all user-provided
11606 // functions in invokeGuardedCallback, and the production version of
11607 // invokeGuardedCallback uses a try-catch, all user exceptions are treated
11608 // like caught exceptions, and the DevTools won't pause unless the developer
11609 // takes the extra step of enabling pause on caught exceptions. This is
11610 // unintuitive, though, because even though React has caught the error, from
11611 // the developer's perspective, the error is uncaught.
11612 //
11613 // To preserve the expected "Pause on exceptions" behavior, we don't use a
11614 // try-catch in DEV. Instead, we synchronously dispatch a fake event to a fake
11615 // DOM node, and call the user-provided callback from inside an event handler
11616 // for that fake event. If the callback throws, the error is "captured" using
11617 // a global event handler. But because the error happens in a different
11618 // event loop context, it does not interrupt the normal program flow.
11619 // Effectively, this gives us try-catch behavior without actually using
11620 // try-catch. Neat!
11621 // Check that the browser supports the APIs we need to implement our special
11622 // DEV version of invokeGuardedCallback
11623 if (typeof window !== 'undefined' && typeof window.dispatchEvent === 'function' && typeof document !== 'undefined' && typeof document.createEvent === 'function') {
11624 var fakeNode = document.createElement('react');
11625
11626 invokeGuardedCallbackImpl = function invokeGuardedCallbackDev(name, func, context, a, b, c, d, e, f) {
11627 // If document doesn't exist we know for sure we will crash in this method
11628 // when we call document.createEvent(). However this can cause confusing
11629 // errors: https://github.com/facebookincubator/create-react-app/issues/3482
11630 // So we preemptively throw with a better message instead.
11631 if (!(typeof document !== 'undefined')) {
11632 {
11633 throw Error( "The `document` global was defined when React was initialized, but is not defined anymore. This can happen in a test environment if a component schedules an update from an asynchronous callback, but the test has already finished running. To solve this, you can either unmount the component at the end of your test (and ensure that any asynchronous operations get canceled in `componentWillUnmount`), or you can change the test itself to be asynchronous." );
11634 }
11635 }
11636
11637 var evt = document.createEvent('Event');
11638 var didCall = false; // Keeps track of whether the user-provided callback threw an error. We
11639 // set this to true at the beginning, then set it to false right after
11640 // calling the function. If the function errors, `didError` will never be
11641 // set to false. This strategy works even if the browser is flaky and
11642 // fails to call our global error handler, because it doesn't rely on
11643 // the error event at all.
11644
11645 var didError = true; // Keeps track of the value of window.event so that we can reset it
11646 // during the callback to let user code access window.event in the
11647 // browsers that support it.
11648
11649 var windowEvent = window.event; // Keeps track of the descriptor of window.event to restore it after event
11650 // dispatching: https://github.com/facebook/react/issues/13688
11651
11652 var windowEventDescriptor = Object.getOwnPropertyDescriptor(window, 'event');
11653
11654 function restoreAfterDispatch() {
11655 // We immediately remove the callback from event listeners so that
11656 // nested `invokeGuardedCallback` calls do not clash. Otherwise, a
11657 // nested call would trigger the fake event handlers of any call higher
11658 // in the stack.
11659 fakeNode.removeEventListener(evtType, callCallback, false); // We check for window.hasOwnProperty('event') to prevent the
11660 // window.event assignment in both IE <= 10 as they throw an error
11661 // "Member not found" in strict mode, and in Firefox which does not
11662 // support window.event.
11663
11664 if (typeof window.event !== 'undefined' && window.hasOwnProperty('event')) {
11665 window.event = windowEvent;
11666 }
11667 } // Create an event handler for our fake event. We will synchronously
11668 // dispatch our fake event using `dispatchEvent`. Inside the handler, we
11669 // call the user-provided callback.
11670
11671
11672 var funcArgs = Array.prototype.slice.call(arguments, 3);
11673
11674 function callCallback() {
11675 didCall = true;
11676 restoreAfterDispatch();
11677 func.apply(context, funcArgs);
11678 didError = false;
11679 } // Create a global error event handler. We use this to capture the value
11680 // that was thrown. It's possible that this error handler will fire more
11681 // than once; for example, if non-React code also calls `dispatchEvent`
11682 // and a handler for that event throws. We should be resilient to most of
11683 // those cases. Even if our error event handler fires more than once, the
11684 // last error event is always used. If the callback actually does error,
11685 // we know that the last error event is the correct one, because it's not
11686 // possible for anything else to have happened in between our callback
11687 // erroring and the code that follows the `dispatchEvent` call below. If
11688 // the callback doesn't error, but the error event was fired, we know to
11689 // ignore it because `didError` will be false, as described above.
11690
11691
11692 var error; // Use this to track whether the error event is ever called.
11693
11694 var didSetError = false;
11695 var isCrossOriginError = false;
11696
11697 function handleWindowError(event) {
11698 error = event.error;
11699 didSetError = true;
11700
11701 if (error === null && event.colno === 0 && event.lineno === 0) {
11702 isCrossOriginError = true;
11703 }
11704
11705 if (event.defaultPrevented) {
11706 // Some other error handler has prevented default.
11707 // Browsers silence the error report if this happens.
11708 // We'll remember this to later decide whether to log it or not.
11709 if (error != null && typeof error === 'object') {
11710 try {
11711 error._suppressLogging = true;
11712 } catch (inner) {// Ignore.
11713 }
11714 }
11715 }
11716 } // Create a fake event type.
11717
11718
11719 var evtType = "react-" + (name ? name : 'invokeguardedcallback'); // Attach our event handlers
11720
11721 window.addEventListener('error', handleWindowError);
11722 fakeNode.addEventListener(evtType, callCallback, false); // Synchronously dispatch our fake event. If the user-provided function
11723 // errors, it will trigger our global error handler.
11724
11725 evt.initEvent(evtType, false, false);
11726 fakeNode.dispatchEvent(evt);
11727
11728 if (windowEventDescriptor) {
11729 Object.defineProperty(window, 'event', windowEventDescriptor);
11730 }
11731
11732 if (didCall && didError) {
11733 if (!didSetError) {
11734 // The callback errored, but the error event never fired.
11735 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.');
11736 } else if (isCrossOriginError) {
11737 error = new Error("A cross-origin error was thrown. React doesn't have access to " + 'the actual error object in development. ' + 'See https://reactjs.org/link/crossorigin-error for more information.');
11738 }
11739
11740 this.onError(error);
11741 } // Remove our event listeners
11742
11743
11744 window.removeEventListener('error', handleWindowError);
11745
11746 if (!didCall) {
11747 // Something went really wrong, and our event was not dispatched.
11748 // https://github.com/facebook/react/issues/16734
11749 // https://github.com/facebook/react/issues/16585
11750 // Fall back to the production implementation.
11751 restoreAfterDispatch();
11752 return invokeGuardedCallbackProd.apply(this, arguments);
11753 }
11754 };
11755 }
11756}
11757
11758var invokeGuardedCallbackImpl$1 = invokeGuardedCallbackImpl;
11759
11760var hasError = false;
11761var caughtError = null; // Used by event system to capture/rethrow the first error.
11762var reporter = {
11763 onError: function (error) {
11764 hasError = true;
11765 caughtError = error;
11766 }
11767};
11768/**
11769 * Call a function while guarding against errors that happens within it.
11770 * Returns an error if it throws, otherwise null.
11771 *
11772 * In production, this is implemented using a try-catch. The reason we don't
11773 * use a try-catch directly is so that we can swap out a different
11774 * implementation in DEV mode.
11775 *
11776 * @param {String} name of the guard to use for logging or debugging
11777 * @param {Function} func The function to invoke
11778 * @param {*} context The context to use when calling the function
11779 * @param {...*} args Arguments for function
11780 */
11781
11782function invokeGuardedCallback(name, func, context, a, b, c, d, e, f) {
11783 hasError = false;
11784 caughtError = null;
11785 invokeGuardedCallbackImpl$1.apply(reporter, arguments);
11786}
11787function hasCaughtError() {
11788 return hasError;
11789}
11790function clearCaughtError() {
11791 if (hasError) {
11792 var error = caughtError;
11793 hasError = false;
11794 caughtError = null;
11795 return error;
11796 } else {
11797 {
11798 {
11799 throw Error( "clearCaughtError was called but no error was captured. This error is likely caused by a bug in React. Please file an issue." );
11800 }
11801 }
11802 }
11803}
11804
11805var didWarnAboutUndefinedSnapshotBeforeUpdate = null;
11806
11807{
11808 didWarnAboutUndefinedSnapshotBeforeUpdate = new Set();
11809}
11810
11811var PossiblyWeakSet = typeof WeakSet === 'function' ? WeakSet : Set;
11812
11813var callComponentWillUnmountWithTimer = function (current, instance) {
11814 instance.props = current.memoizedProps;
11815 instance.state = current.memoizedState;
11816
11817 {
11818 instance.componentWillUnmount();
11819 }
11820}; // Capture errors so they don't interrupt unmounting.
11821
11822
11823function safelyCallComponentWillUnmount(current, instance) {
11824 {
11825 invokeGuardedCallback(null, callComponentWillUnmountWithTimer, null, current, instance);
11826
11827 if (hasCaughtError()) {
11828 var unmountError = clearCaughtError();
11829 captureCommitPhaseError(current, unmountError);
11830 }
11831 }
11832}
11833
11834function safelyDetachRef(current) {
11835 var ref = current.ref;
11836
11837 if (ref !== null) {
11838 if (typeof ref === 'function') {
11839 {
11840 invokeGuardedCallback(null, ref, null, null);
11841
11842 if (hasCaughtError()) {
11843 var refError = clearCaughtError();
11844 captureCommitPhaseError(current, refError);
11845 }
11846 }
11847 } else {
11848 ref.current = null;
11849 }
11850 }
11851}
11852
11853function safelyCallDestroy(current, destroy) {
11854 {
11855 invokeGuardedCallback(null, destroy, null);
11856
11857 if (hasCaughtError()) {
11858 var error = clearCaughtError();
11859 captureCommitPhaseError(current, error);
11860 }
11861 }
11862}
11863
11864function commitBeforeMutationLifeCycles(current, finishedWork) {
11865 switch (finishedWork.tag) {
11866 case FunctionComponent:
11867 case ForwardRef:
11868 case SimpleMemoComponent:
11869 case Block:
11870 {
11871 return;
11872 }
11873
11874 case ClassComponent:
11875 {
11876 if (finishedWork.flags & Snapshot) {
11877 if (current !== null) {
11878 var prevProps = current.memoizedProps;
11879 var prevState = current.memoizedState;
11880 var instance = finishedWork.stateNode; // We could update instance props and state here,
11881 // but instead we rely on them being set during last render.
11882 // TODO: revisit this when we implement resuming.
11883
11884 {
11885 if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
11886 if (instance.props !== finishedWork.memoizedProps) {
11887 error('Expected %s props to match memoized props before ' + 'getSnapshotBeforeUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentName(finishedWork.type) || 'instance');
11888 }
11889
11890 if (instance.state !== finishedWork.memoizedState) {
11891 error('Expected %s state to match memoized state before ' + 'getSnapshotBeforeUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentName(finishedWork.type) || 'instance');
11892 }
11893 }
11894 }
11895
11896 var snapshot = instance.getSnapshotBeforeUpdate(finishedWork.elementType === finishedWork.type ? prevProps : resolveDefaultProps(finishedWork.type, prevProps), prevState);
11897
11898 {
11899 var didWarnSet = didWarnAboutUndefinedSnapshotBeforeUpdate;
11900
11901 if (snapshot === undefined && !didWarnSet.has(finishedWork.type)) {
11902 didWarnSet.add(finishedWork.type);
11903
11904 error('%s.getSnapshotBeforeUpdate(): A snapshot value (or null) ' + 'must be returned. You have returned undefined.', getComponentName(finishedWork.type));
11905 }
11906 }
11907
11908 instance.__reactInternalSnapshotBeforeUpdate = snapshot;
11909 }
11910 }
11911
11912 return;
11913 }
11914
11915 case HostRoot:
11916 {
11917 {
11918 if (finishedWork.flags & Snapshot) {
11919 var root = finishedWork.stateNode;
11920 clearContainer(root.containerInfo);
11921 }
11922 }
11923
11924 return;
11925 }
11926
11927 case HostComponent:
11928 case HostText:
11929 case HostPortal:
11930 case IncompleteClassComponent:
11931 // Nothing to do for these component types
11932 return;
11933 }
11934
11935 {
11936 {
11937 throw Error( "This unit of work tag should not have side-effects. This error is likely caused by a bug in React. Please file an issue." );
11938 }
11939 }
11940}
11941
11942function commitHookEffectListUnmount(tag, finishedWork) {
11943 var updateQueue = finishedWork.updateQueue;
11944 var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null;
11945
11946 if (lastEffect !== null) {
11947 var firstEffect = lastEffect.next;
11948 var effect = firstEffect;
11949
11950 do {
11951 if ((effect.tag & tag) === tag) {
11952 // Unmount
11953 var destroy = effect.destroy;
11954 effect.destroy = undefined;
11955
11956 if (destroy !== undefined) {
11957 destroy();
11958 }
11959 }
11960
11961 effect = effect.next;
11962 } while (effect !== firstEffect);
11963 }
11964}
11965
11966function commitHookEffectListMount(tag, finishedWork) {
11967 var updateQueue = finishedWork.updateQueue;
11968 var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null;
11969
11970 if (lastEffect !== null) {
11971 var firstEffect = lastEffect.next;
11972 var effect = firstEffect;
11973
11974 do {
11975 if ((effect.tag & tag) === tag) {
11976 // Mount
11977 var create = effect.create;
11978 effect.destroy = create();
11979
11980 {
11981 var destroy = effect.destroy;
11982
11983 if (destroy !== undefined && typeof destroy !== 'function') {
11984 var addendum = void 0;
11985
11986 if (destroy === null) {
11987 addendum = ' You returned null. If your effect does not require clean ' + 'up, return undefined (or nothing).';
11988 } else if (typeof destroy.then === 'function') {
11989 addendum = '\n\nIt looks like you wrote useEffect(async () => ...) or returned a Promise. ' + 'Instead, write the async function inside your effect ' + 'and call it immediately:\n\n' + 'useEffect(() => {\n' + ' async function fetchData() {\n' + ' // You can await here\n' + ' const response = await MyAPI.getData(someId);\n' + ' // ...\n' + ' }\n' + ' fetchData();\n' + "}, [someId]); // Or [] if effect doesn't need props or state\n\n" + 'Learn more about data fetching with Hooks: https://reactjs.org/link/hooks-data-fetching';
11990 } else {
11991 addendum = ' You returned: ' + destroy;
11992 }
11993
11994 error('An effect function must not return anything besides a function, ' + 'which is used for clean-up.%s', addendum);
11995 }
11996 }
11997 }
11998
11999 effect = effect.next;
12000 } while (effect !== firstEffect);
12001 }
12002}
12003
12004function schedulePassiveEffects(finishedWork) {
12005 var updateQueue = finishedWork.updateQueue;
12006 var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null;
12007
12008 if (lastEffect !== null) {
12009 var firstEffect = lastEffect.next;
12010 var effect = firstEffect;
12011
12012 do {
12013 var _effect = effect,
12014 next = _effect.next,
12015 tag = _effect.tag;
12016
12017 if ((tag & Passive$1) !== NoFlags$1 && (tag & HasEffect) !== NoFlags$1) {
12018 enqueuePendingPassiveHookEffectUnmount(finishedWork, effect);
12019 enqueuePendingPassiveHookEffectMount(finishedWork, effect);
12020 }
12021
12022 effect = next;
12023 } while (effect !== firstEffect);
12024 }
12025}
12026
12027function commitLifeCycles(finishedRoot, current, finishedWork, committedLanes) {
12028 switch (finishedWork.tag) {
12029 case FunctionComponent:
12030 case ForwardRef:
12031 case SimpleMemoComponent:
12032 case Block:
12033 {
12034 // At this point layout effects have already been destroyed (during mutation phase).
12035 // This is done to prevent sibling component effects from interfering with each other,
12036 // e.g. a destroy function in one component should never override a ref set
12037 // by a create function in another component during the same commit.
12038 {
12039 commitHookEffectListMount(Layout | HasEffect, finishedWork);
12040 }
12041
12042 schedulePassiveEffects(finishedWork);
12043 return;
12044 }
12045
12046 case ClassComponent:
12047 {
12048 var instance = finishedWork.stateNode;
12049
12050 if (finishedWork.flags & Update) {
12051 if (current === null) {
12052 // We could update instance props and state here,
12053 // but instead we rely on them being set during last render.
12054 // TODO: revisit this when we implement resuming.
12055 {
12056 if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
12057 if (instance.props !== finishedWork.memoizedProps) {
12058 error('Expected %s props to match memoized props before ' + 'componentDidMount. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentName(finishedWork.type) || 'instance');
12059 }
12060
12061 if (instance.state !== finishedWork.memoizedState) {
12062 error('Expected %s state to match memoized state before ' + 'componentDidMount. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentName(finishedWork.type) || 'instance');
12063 }
12064 }
12065 }
12066
12067 {
12068 instance.componentDidMount();
12069 }
12070 } else {
12071 var prevProps = finishedWork.elementType === finishedWork.type ? current.memoizedProps : resolveDefaultProps(finishedWork.type, current.memoizedProps);
12072 var prevState = current.memoizedState; // We could update instance props and state here,
12073 // but instead we rely on them being set during last render.
12074 // TODO: revisit this when we implement resuming.
12075
12076 {
12077 if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
12078 if (instance.props !== finishedWork.memoizedProps) {
12079 error('Expected %s props to match memoized props before ' + 'componentDidUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentName(finishedWork.type) || 'instance');
12080 }
12081
12082 if (instance.state !== finishedWork.memoizedState) {
12083 error('Expected %s state to match memoized state before ' + 'componentDidUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentName(finishedWork.type) || 'instance');
12084 }
12085 }
12086 }
12087
12088 {
12089 instance.componentDidUpdate(prevProps, prevState, instance.__reactInternalSnapshotBeforeUpdate);
12090 }
12091 }
12092 } // TODO: I think this is now always non-null by the time it reaches the
12093 // commit phase. Consider removing the type check.
12094
12095
12096 var updateQueue = finishedWork.updateQueue;
12097
12098 if (updateQueue !== null) {
12099 {
12100 if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
12101 if (instance.props !== finishedWork.memoizedProps) {
12102 error('Expected %s props to match memoized props before ' + 'processing the update queue. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentName(finishedWork.type) || 'instance');
12103 }
12104
12105 if (instance.state !== finishedWork.memoizedState) {
12106 error('Expected %s state to match memoized state before ' + 'processing the update queue. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentName(finishedWork.type) || 'instance');
12107 }
12108 }
12109 } // We could update instance props and state here,
12110 // but instead we rely on them being set during last render.
12111 // TODO: revisit this when we implement resuming.
12112
12113
12114 commitUpdateQueue(finishedWork, updateQueue, instance);
12115 }
12116
12117 return;
12118 }
12119
12120 case HostRoot:
12121 {
12122 // TODO: I think this is now always non-null by the time it reaches the
12123 // commit phase. Consider removing the type check.
12124 var _updateQueue = finishedWork.updateQueue;
12125
12126 if (_updateQueue !== null) {
12127 var _instance = null;
12128
12129 if (finishedWork.child !== null) {
12130 switch (finishedWork.child.tag) {
12131 case HostComponent:
12132 _instance = getPublicInstance(finishedWork.child.stateNode);
12133 break;
12134
12135 case ClassComponent:
12136 _instance = finishedWork.child.stateNode;
12137 break;
12138 }
12139 }
12140
12141 commitUpdateQueue(finishedWork, _updateQueue, _instance);
12142 }
12143
12144 return;
12145 }
12146
12147 case HostComponent:
12148 {
12149 var _instance2 = finishedWork.stateNode; // Renderers may schedule work to be done after host components are mounted
12150 // (eg DOM renderer may schedule auto-focus for inputs and form controls).
12151 // These effects should only be committed when components are first mounted,
12152 // aka when there is no current/alternate.
12153
12154 if (current === null && finishedWork.flags & Update) {
12155 var type = finishedWork.type;
12156 var props = finishedWork.memoizedProps;
12157 }
12158
12159 return;
12160 }
12161
12162 case HostText:
12163 {
12164 // We have no life-cycles associated with text.
12165 return;
12166 }
12167
12168 case HostPortal:
12169 {
12170 // We have no life-cycles associated with portals.
12171 return;
12172 }
12173
12174 case Profiler:
12175 {
12176 {
12177 var _finishedWork$memoize2 = finishedWork.memoizedProps,
12178 onCommit = _finishedWork$memoize2.onCommit,
12179 onRender = _finishedWork$memoize2.onRender;
12180 var effectDuration = finishedWork.stateNode.effectDuration;
12181 var commitTime = getCommitTime();
12182
12183 if (typeof onRender === 'function') {
12184 {
12185 onRender(finishedWork.memoizedProps.id, current === null ? 'mount' : 'update', finishedWork.actualDuration, finishedWork.treeBaseDuration, finishedWork.actualStartTime, commitTime, finishedRoot.memoizedInteractions);
12186 }
12187 }
12188 }
12189
12190 return;
12191 }
12192
12193 case SuspenseComponent:
12194 {
12195 return;
12196 }
12197
12198 case SuspenseListComponent:
12199 case IncompleteClassComponent:
12200 case FundamentalComponent:
12201 case ScopeComponent:
12202 case OffscreenComponent:
12203 case LegacyHiddenComponent:
12204 return;
12205 }
12206
12207 {
12208 {
12209 throw Error( "This unit of work tag should not have side-effects. This error is likely caused by a bug in React. Please file an issue." );
12210 }
12211 }
12212}
12213
12214function hideOrUnhideAllChildren(finishedWork, isHidden) {
12215 {
12216 // We only have the top Fiber that was inserted but we need to recurse down its
12217 // children to find all the terminal nodes.
12218 var node = finishedWork;
12219
12220 while (true) {
12221 if (node.tag === HostComponent) {
12222 var instance = node.stateNode;
12223
12224 if (isHidden) {
12225 hideInstance(instance);
12226 } else {
12227 unhideInstance(node.stateNode, node.memoizedProps);
12228 }
12229 } else if (node.tag === HostText) {
12230 var _instance3 = node.stateNode;
12231
12232 if (isHidden) ; else {
12233 unhideTextInstance(_instance3, node.memoizedProps);
12234 }
12235 } else if ((node.tag === OffscreenComponent || node.tag === LegacyHiddenComponent) && node.memoizedState !== null && node !== finishedWork) ; else if (node.child !== null) {
12236 node.child.return = node;
12237 node = node.child;
12238 continue;
12239 }
12240
12241 if (node === finishedWork) {
12242 return;
12243 }
12244
12245 while (node.sibling === null) {
12246 if (node.return === null || node.return === finishedWork) {
12247 return;
12248 }
12249
12250 node = node.return;
12251 }
12252
12253 node.sibling.return = node.return;
12254 node = node.sibling;
12255 }
12256 }
12257}
12258
12259function commitAttachRef(finishedWork) {
12260 var ref = finishedWork.ref;
12261
12262 if (ref !== null) {
12263 var instance = finishedWork.stateNode;
12264 var instanceToUse;
12265
12266 switch (finishedWork.tag) {
12267 case HostComponent:
12268 instanceToUse = getPublicInstance(instance);
12269 break;
12270
12271 default:
12272 instanceToUse = instance;
12273 } // Moved outside to ensure DCE works with this flag
12274
12275 if (typeof ref === 'function') {
12276 ref(instanceToUse);
12277 } else {
12278 {
12279 if (!ref.hasOwnProperty('current')) {
12280 error('Unexpected ref object provided for %s. ' + 'Use either a ref-setter function or React.createRef().', getComponentName(finishedWork.type));
12281 }
12282 }
12283
12284 ref.current = instanceToUse;
12285 }
12286 }
12287}
12288
12289function commitDetachRef(current) {
12290 var currentRef = current.ref;
12291
12292 if (currentRef !== null) {
12293 if (typeof currentRef === 'function') {
12294 currentRef(null);
12295 } else {
12296 currentRef.current = null;
12297 }
12298 }
12299} // User-originating errors (lifecycles and refs) should not interrupt
12300// deletion, so don't let them throw. Host-originating errors should
12301// interrupt deletion, so it's okay
12302
12303
12304function commitUnmount(finishedRoot, current, renderPriorityLevel) {
12305 onCommitUnmount(current);
12306
12307 switch (current.tag) {
12308 case FunctionComponent:
12309 case ForwardRef:
12310 case MemoComponent:
12311 case SimpleMemoComponent:
12312 case Block:
12313 {
12314 var updateQueue = current.updateQueue;
12315
12316 if (updateQueue !== null) {
12317 var lastEffect = updateQueue.lastEffect;
12318
12319 if (lastEffect !== null) {
12320 var firstEffect = lastEffect.next;
12321 var effect = firstEffect;
12322
12323 do {
12324 var _effect2 = effect,
12325 destroy = _effect2.destroy,
12326 tag = _effect2.tag;
12327
12328 if (destroy !== undefined) {
12329 if ((tag & Passive$1) !== NoFlags$1) {
12330 enqueuePendingPassiveHookEffectUnmount(current, effect);
12331 } else {
12332 {
12333 safelyCallDestroy(current, destroy);
12334 }
12335 }
12336 }
12337
12338 effect = effect.next;
12339 } while (effect !== firstEffect);
12340 }
12341 }
12342
12343 return;
12344 }
12345
12346 case ClassComponent:
12347 {
12348 safelyDetachRef(current);
12349 var instance = current.stateNode;
12350
12351 if (typeof instance.componentWillUnmount === 'function') {
12352 safelyCallComponentWillUnmount(current, instance);
12353 }
12354
12355 return;
12356 }
12357
12358 case HostComponent:
12359 {
12360 safelyDetachRef(current);
12361 return;
12362 }
12363
12364 case HostPortal:
12365 {
12366 // TODO: this is recursive.
12367 // We are also not using this parent because
12368 // the portal will get pushed immediately.
12369 {
12370 unmountHostComponents(finishedRoot, current);
12371 }
12372
12373 return;
12374 }
12375
12376 case FundamentalComponent:
12377 {
12378
12379 return;
12380 }
12381
12382 case DehydratedFragment:
12383 {
12384
12385 return;
12386 }
12387
12388 case ScopeComponent:
12389 {
12390
12391 return;
12392 }
12393 }
12394}
12395
12396function commitNestedUnmounts(finishedRoot, root, renderPriorityLevel) {
12397 // While we're inside a removed host node we don't want to call
12398 // removeChild on the inner nodes because they're removed by the top
12399 // call anyway. We also want to call componentWillUnmount on all
12400 // composites before this host node is removed from the tree. Therefore
12401 // we do an inner loop while we're still inside the host node.
12402 var node = root;
12403
12404 while (true) {
12405 commitUnmount(finishedRoot, node); // Visit children because they may contain more composite or host nodes.
12406 // Skip portals because commitUnmount() currently visits them recursively.
12407
12408 if (node.child !== null && ( // If we use mutation we drill down into portals using commitUnmount above.
12409 // If we don't use mutation we drill down into portals here instead.
12410 node.tag !== HostPortal)) {
12411 node.child.return = node;
12412 node = node.child;
12413 continue;
12414 }
12415
12416 if (node === root) {
12417 return;
12418 }
12419
12420 while (node.sibling === null) {
12421 if (node.return === null || node.return === root) {
12422 return;
12423 }
12424
12425 node = node.return;
12426 }
12427
12428 node.sibling.return = node.return;
12429 node = node.sibling;
12430 }
12431}
12432
12433function detachFiberMutation(fiber) {
12434 // Cut off the return pointers to disconnect it from the tree. Ideally, we
12435 // should clear the child pointer of the parent alternate to let this
12436 // get GC:ed but we don't know which for sure which parent is the current
12437 // one so we'll settle for GC:ing the subtree of this child. This child
12438 // itself will be GC:ed when the parent updates the next time.
12439 // Note: we cannot null out sibling here, otherwise it can cause issues
12440 // with findDOMNode and how it requires the sibling field to carry out
12441 // traversal in a later effect. See PR #16820. We now clear the sibling
12442 // field after effects, see: detachFiberAfterEffects.
12443 //
12444 // Don't disconnect stateNode now; it will be detached in detachFiberAfterEffects.
12445 // It may be required if the current component is an error boundary,
12446 // and one of its descendants throws while unmounting a passive effect.
12447 fiber.alternate = null;
12448 fiber.child = null;
12449 fiber.dependencies = null;
12450 fiber.firstEffect = null;
12451 fiber.lastEffect = null;
12452 fiber.memoizedProps = null;
12453 fiber.memoizedState = null;
12454 fiber.pendingProps = null;
12455 fiber.return = null;
12456 fiber.updateQueue = null;
12457
12458 {
12459 fiber._debugOwner = null;
12460 }
12461}
12462
12463function getHostParentFiber(fiber) {
12464 var parent = fiber.return;
12465
12466 while (parent !== null) {
12467 if (isHostParent(parent)) {
12468 return parent;
12469 }
12470
12471 parent = parent.return;
12472 }
12473
12474 {
12475 {
12476 throw Error( "Expected to find a host parent. This error is likely caused by a bug in React. Please file an issue." );
12477 }
12478 }
12479}
12480
12481function isHostParent(fiber) {
12482 return fiber.tag === HostComponent || fiber.tag === HostRoot || fiber.tag === HostPortal;
12483}
12484
12485function getHostSibling(fiber) {
12486 // We're going to search forward into the tree until we find a sibling host
12487 // node. Unfortunately, if multiple insertions are done in a row we have to
12488 // search past them. This leads to exponential search for the next sibling.
12489 // TODO: Find a more efficient way to do this.
12490 var node = fiber;
12491
12492 siblings: while (true) {
12493 // If we didn't find anything, let's try the next sibling.
12494 while (node.sibling === null) {
12495 if (node.return === null || isHostParent(node.return)) {
12496 // If we pop out of the root or hit the parent the fiber we are the
12497 // last sibling.
12498 return null;
12499 }
12500
12501 node = node.return;
12502 }
12503
12504 node.sibling.return = node.return;
12505 node = node.sibling;
12506
12507 while (node.tag !== HostComponent && node.tag !== HostText && node.tag !== DehydratedFragment) {
12508 // If it is not host node and, we might have a host node inside it.
12509 // Try to search down until we find one.
12510 if (node.flags & Placement) {
12511 // If we don't have a child, try the siblings instead.
12512 continue siblings;
12513 } // If we don't have a child, try the siblings instead.
12514 // We also skip portals because they are not part of this host tree.
12515
12516
12517 if (node.child === null || node.tag === HostPortal) {
12518 continue siblings;
12519 } else {
12520 node.child.return = node;
12521 node = node.child;
12522 }
12523 } // Check if this host node is stable or about to be placed.
12524
12525
12526 if (!(node.flags & Placement)) {
12527 // Found it!
12528 return node.stateNode;
12529 }
12530 }
12531}
12532
12533function commitPlacement(finishedWork) {
12534
12535
12536 var parentFiber = getHostParentFiber(finishedWork); // Note: these two variables *must* always be updated together.
12537
12538 var parent;
12539 var isContainer;
12540 var parentStateNode = parentFiber.stateNode;
12541
12542 switch (parentFiber.tag) {
12543 case HostComponent:
12544 parent = parentStateNode;
12545 isContainer = false;
12546 break;
12547
12548 case HostRoot:
12549 parent = parentStateNode.containerInfo;
12550 isContainer = true;
12551 break;
12552
12553 case HostPortal:
12554 parent = parentStateNode.containerInfo;
12555 isContainer = true;
12556 break;
12557
12558 case FundamentalComponent:
12559
12560 // eslint-disable-next-line-no-fallthrough
12561
12562 default:
12563 {
12564 {
12565 throw Error( "Invalid host parent fiber. This error is likely caused by a bug in React. Please file an issue." );
12566 }
12567 }
12568
12569 }
12570
12571 if (parentFiber.flags & ContentReset) {
12572
12573 parentFiber.flags &= ~ContentReset;
12574 }
12575
12576 var before = getHostSibling(finishedWork); // We only have the top Fiber that was inserted but we need to recurse down its
12577 // children to find all the terminal nodes.
12578
12579 if (isContainer) {
12580 insertOrAppendPlacementNodeIntoContainer(finishedWork, before, parent);
12581 } else {
12582 insertOrAppendPlacementNode(finishedWork, before, parent);
12583 }
12584}
12585
12586function insertOrAppendPlacementNodeIntoContainer(node, before, parent) {
12587 var tag = node.tag;
12588 var isHost = tag === HostComponent || tag === HostText;
12589
12590 if (isHost || enableFundamentalAPI ) {
12591 var stateNode = isHost ? node.stateNode : node.stateNode.instance;
12592
12593 if (before) {
12594 insertInContainerBefore(parent, stateNode, before);
12595 } else {
12596 appendChildToContainer(parent, stateNode);
12597 }
12598 } else if (tag === HostPortal) ; else {
12599 var child = node.child;
12600
12601 if (child !== null) {
12602 insertOrAppendPlacementNodeIntoContainer(child, before, parent);
12603 var sibling = child.sibling;
12604
12605 while (sibling !== null) {
12606 insertOrAppendPlacementNodeIntoContainer(sibling, before, parent);
12607 sibling = sibling.sibling;
12608 }
12609 }
12610 }
12611}
12612
12613function insertOrAppendPlacementNode(node, before, parent) {
12614 var tag = node.tag;
12615 var isHost = tag === HostComponent || tag === HostText;
12616
12617 if (isHost || enableFundamentalAPI ) {
12618 var stateNode = isHost ? node.stateNode : node.stateNode.instance;
12619
12620 if (before) {
12621 insertBefore(parent, stateNode, before);
12622 } else {
12623 appendChild(parent, stateNode);
12624 }
12625 } else if (tag === HostPortal) ; else {
12626 var child = node.child;
12627
12628 if (child !== null) {
12629 insertOrAppendPlacementNode(child, before, parent);
12630 var sibling = child.sibling;
12631
12632 while (sibling !== null) {
12633 insertOrAppendPlacementNode(sibling, before, parent);
12634 sibling = sibling.sibling;
12635 }
12636 }
12637 }
12638}
12639
12640function unmountHostComponents(finishedRoot, current, renderPriorityLevel) {
12641 // We only have the top Fiber that was deleted but we need to recurse down its
12642 // children to find all the terminal nodes.
12643 var node = current; // Each iteration, currentParent is populated with node's host parent if not
12644 // currentParentIsValid.
12645
12646 var currentParentIsValid = false; // Note: these two variables *must* always be updated together.
12647
12648 var currentParent;
12649 var currentParentIsContainer;
12650
12651 while (true) {
12652 if (!currentParentIsValid) {
12653 var parent = node.return;
12654
12655 findParent: while (true) {
12656 if (!(parent !== null)) {
12657 {
12658 throw Error( "Expected to find a host parent. This error is likely caused by a bug in React. Please file an issue." );
12659 }
12660 }
12661
12662 var parentStateNode = parent.stateNode;
12663
12664 switch (parent.tag) {
12665 case HostComponent:
12666 currentParent = parentStateNode;
12667 currentParentIsContainer = false;
12668 break findParent;
12669
12670 case HostRoot:
12671 currentParent = parentStateNode.containerInfo;
12672 currentParentIsContainer = true;
12673 break findParent;
12674
12675 case HostPortal:
12676 currentParent = parentStateNode.containerInfo;
12677 currentParentIsContainer = true;
12678 break findParent;
12679
12680 }
12681
12682 parent = parent.return;
12683 }
12684
12685 currentParentIsValid = true;
12686 }
12687
12688 if (node.tag === HostComponent || node.tag === HostText) {
12689 commitNestedUnmounts(finishedRoot, node); // After all the children have unmounted, it is now safe to remove the
12690 // node from the tree.
12691
12692 if (currentParentIsContainer) {
12693 removeChildFromContainer(currentParent, node.stateNode);
12694 } else {
12695 removeChild(currentParent, node.stateNode);
12696 } // Don't visit children because we already visited them.
12697
12698 } else if (node.tag === HostPortal) {
12699 if (node.child !== null) {
12700 // When we go into a portal, it becomes the parent to remove from.
12701 // We will reassign it back when we pop the portal on the way up.
12702 currentParent = node.stateNode.containerInfo;
12703 currentParentIsContainer = true; // Visit children because portals might contain host components.
12704
12705 node.child.return = node;
12706 node = node.child;
12707 continue;
12708 }
12709 } else {
12710 commitUnmount(finishedRoot, node); // Visit children because we may find more host components below.
12711
12712 if (node.child !== null) {
12713 node.child.return = node;
12714 node = node.child;
12715 continue;
12716 }
12717 }
12718
12719 if (node === current) {
12720 return;
12721 }
12722
12723 while (node.sibling === null) {
12724 if (node.return === null || node.return === current) {
12725 return;
12726 }
12727
12728 node = node.return;
12729
12730 if (node.tag === HostPortal) {
12731 // When we go out of the portal, we need to restore the parent.
12732 // Since we don't keep a stack of them, we will search for it.
12733 currentParentIsValid = false;
12734 }
12735 }
12736
12737 node.sibling.return = node.return;
12738 node = node.sibling;
12739 }
12740}
12741
12742function commitDeletion(finishedRoot, current, renderPriorityLevel) {
12743 {
12744 // Recursively delete all host nodes from the parent.
12745 // Detach refs and call componentWillUnmount() on the whole subtree.
12746 unmountHostComponents(finishedRoot, current);
12747 }
12748
12749 var alternate = current.alternate;
12750 detachFiberMutation(current);
12751
12752 if (alternate !== null) {
12753 detachFiberMutation(alternate);
12754 }
12755}
12756
12757function commitWork(current, finishedWork) {
12758
12759 switch (finishedWork.tag) {
12760 case FunctionComponent:
12761 case ForwardRef:
12762 case MemoComponent:
12763 case SimpleMemoComponent:
12764 case Block:
12765 {
12766 // Layout effects are destroyed during the mutation phase so that all
12767 // destroy functions for all fibers are called before any create functions.
12768 // This prevents sibling component effects from interfering with each other,
12769 // e.g. a destroy function in one component should never override a ref set
12770 // by a create function in another component during the same commit.
12771 {
12772 commitHookEffectListUnmount(Layout | HasEffect, finishedWork);
12773 }
12774
12775 return;
12776 }
12777
12778 case ClassComponent:
12779 {
12780 return;
12781 }
12782
12783 case HostComponent:
12784 {
12785 var instance = finishedWork.stateNode;
12786
12787 if (instance != null) {
12788 // Commit the work prepared earlier.
12789 var newProps = finishedWork.memoizedProps; // For hydration we reuse the update path but we treat the oldProps
12790 // as the newProps. The updatePayload will contain the real change in
12791 // this case.
12792
12793 var oldProps = current !== null ? current.memoizedProps : newProps;
12794 var type = finishedWork.type; // TODO: Type the updateQueue to be specific to host components.
12795
12796 var updatePayload = finishedWork.updateQueue;
12797 finishedWork.updateQueue = null;
12798
12799 if (updatePayload !== null) {
12800 commitUpdate(instance, updatePayload, type, oldProps, newProps);
12801 }
12802 }
12803
12804 return;
12805 }
12806
12807 case HostText:
12808 {
12809 if (!(finishedWork.stateNode !== null)) {
12810 {
12811 throw Error( "This should have a text node initialized. This error is likely caused by a bug in React. Please file an issue." );
12812 }
12813 }
12814
12815 var textInstance = finishedWork.stateNode;
12816 var newText = finishedWork.memoizedProps; // For hydration we reuse the update path but we treat the oldProps
12817 // as the newProps. The updatePayload will contain the real change in
12818 // this case.
12819
12820 var oldText = current !== null ? current.memoizedProps : newText;
12821 return;
12822 }
12823
12824 case HostRoot:
12825 {
12826
12827 return;
12828 }
12829
12830 case Profiler:
12831 {
12832 return;
12833 }
12834
12835 case SuspenseComponent:
12836 {
12837 commitSuspenseComponent(finishedWork);
12838 attachSuspenseRetryListeners(finishedWork);
12839 return;
12840 }
12841
12842 case SuspenseListComponent:
12843 {
12844 attachSuspenseRetryListeners(finishedWork);
12845 return;
12846 }
12847
12848 case IncompleteClassComponent:
12849 {
12850 return;
12851 }
12852
12853 case FundamentalComponent:
12854 {
12855
12856 break;
12857 }
12858
12859 case ScopeComponent:
12860 {
12861
12862 break;
12863 }
12864
12865 case OffscreenComponent:
12866 case LegacyHiddenComponent:
12867 {
12868 var newState = finishedWork.memoizedState;
12869 var isHidden = newState !== null;
12870 hideOrUnhideAllChildren(finishedWork, isHidden);
12871 return;
12872 }
12873 }
12874
12875 {
12876 {
12877 throw Error( "This unit of work tag should not have side-effects. This error is likely caused by a bug in React. Please file an issue." );
12878 }
12879 }
12880}
12881
12882function commitSuspenseComponent(finishedWork) {
12883 var newState = finishedWork.memoizedState;
12884
12885 if (newState !== null) {
12886 markCommitTimeOfFallback();
12887
12888 {
12889 // Hide the Offscreen component that contains the primary children. TODO:
12890 // Ideally, this effect would have been scheduled on the Offscreen fiber
12891 // itself. That's how unhiding works: the Offscreen component schedules an
12892 // effect on itself. However, in this case, the component didn't complete,
12893 // so the fiber was never added to the effect list in the normal path. We
12894 // could have appended it to the effect list in the Suspense component's
12895 // second pass, but doing it this way is less complicated. This would be
12896 // simpler if we got rid of the effect list and traversed the tree, like
12897 // we're planning to do.
12898 var primaryChildParent = finishedWork.child;
12899 hideOrUnhideAllChildren(primaryChildParent, true);
12900 }
12901 }
12902}
12903
12904function attachSuspenseRetryListeners(finishedWork) {
12905 // If this boundary just timed out, then it will have a set of wakeables.
12906 // For each wakeable, attach a listener so that when it resolves, React
12907 // attempts to re-render the boundary in the primary (pre-timeout) state.
12908 var wakeables = finishedWork.updateQueue;
12909
12910 if (wakeables !== null) {
12911 finishedWork.updateQueue = null;
12912 var retryCache = finishedWork.stateNode;
12913
12914 if (retryCache === null) {
12915 retryCache = finishedWork.stateNode = new PossiblyWeakSet();
12916 }
12917
12918 wakeables.forEach(function (wakeable) {
12919 // Memoize using the boundary fiber to prevent redundant listeners.
12920 var retry = resolveRetryWakeable.bind(null, finishedWork, wakeable);
12921
12922 if (!retryCache.has(wakeable)) {
12923 {
12924 if (wakeable.__reactDoNotTraceInteractions !== true) {
12925 retry = tracing.unstable_wrap(retry);
12926 }
12927 }
12928
12929 retryCache.add(wakeable);
12930 wakeable.then(retry, retry);
12931 }
12932 });
12933 }
12934} // This function detects when a Suspense boundary goes from visible to hidden.
12935// It returns false if the boundary is already hidden.
12936// TODO: Use an effect tag.
12937
12938
12939function isSuspenseBoundaryBeingHidden(current, finishedWork) {
12940 if (current !== null) {
12941 var oldState = current.memoizedState;
12942
12943 if (oldState === null || oldState.dehydrated !== null) {
12944 var newState = finishedWork.memoizedState;
12945 return newState !== null && newState.dehydrated === null;
12946 }
12947 }
12948
12949 return false;
12950}
12951
12952function commitResetTextContent(current) {
12953
12954 resetTextContent(current.stateNode);
12955}
12956
12957var COMPONENT_TYPE = 0;
12958var HAS_PSEUDO_CLASS_TYPE = 1;
12959var ROLE_TYPE = 2;
12960var TEST_NAME_TYPE = 3;
12961var TEXT_TYPE = 4;
12962
12963if (typeof Symbol === 'function' && Symbol.for) {
12964 var symbolFor$1 = Symbol.for;
12965 COMPONENT_TYPE = symbolFor$1('selector.component');
12966 HAS_PSEUDO_CLASS_TYPE = symbolFor$1('selector.has_pseudo_class');
12967 ROLE_TYPE = symbolFor$1('selector.role');
12968 TEST_NAME_TYPE = symbolFor$1('selector.test_id');
12969 TEXT_TYPE = symbolFor$1('selector.text');
12970}
12971
12972var ceil = Math.ceil;
12973var ReactCurrentDispatcher$2 = ReactSharedInternals.ReactCurrentDispatcher,
12974 ReactCurrentOwner$2 = ReactSharedInternals.ReactCurrentOwner,
12975 IsSomeRendererActing = ReactSharedInternals.IsSomeRendererActing;
12976var NoContext =
12977/* */
129780;
12979var BatchedContext =
12980/* */
129811;
12982var DiscreteEventContext =
12983/* */
129844;
12985var LegacyUnbatchedContext =
12986/* */
129878;
12988var RenderContext =
12989/* */
1299016;
12991var CommitContext =
12992/* */
1299332;
12994var RetryAfterError =
12995/* */
1299664;
12997var RootIncomplete = 0;
12998var RootFatalErrored = 1;
12999var RootErrored = 2;
13000var RootSuspended = 3;
13001var RootSuspendedWithDelay = 4;
13002var RootCompleted = 5; // Describes where we are in the React execution stack
13003
13004var executionContext = NoContext; // The root we're working on
13005
13006var workInProgressRoot = null; // The fiber we're working on
13007
13008var workInProgress = null; // The lanes we're rendering
13009
13010var workInProgressRootRenderLanes = NoLanes; // Stack that allows components to change the render lanes for its subtree
13011// This is a superset of the lanes we started working on at the root. The only
13012// case where it's different from `workInProgressRootRenderLanes` is when we
13013// enter a subtree that is hidden and needs to be unhidden: Suspense and
13014// Offscreen component.
13015//
13016// Most things in the work loop should deal with workInProgressRootRenderLanes.
13017// Most things in begin/complete phases should deal with subtreeRenderLanes.
13018
13019var subtreeRenderLanes = NoLanes;
13020var subtreeRenderLanesCursor = createCursor(NoLanes); // Whether to root completed, errored, suspended, etc.
13021
13022var workInProgressRootExitStatus = RootIncomplete; // A fatal error, if one is thrown
13023
13024var workInProgressRootFatalError = null; // "Included" lanes refer to lanes that were worked on during this render. It's
13025// slightly different than `renderLanes` because `renderLanes` can change as you
13026// enter and exit an Offscreen tree. This value is the combination of all render
13027// lanes for the entire render phase.
13028
13029var workInProgressRootIncludedLanes = NoLanes; // The work left over by components that were visited during this render. Only
13030// includes unprocessed updates, not work in bailed out children.
13031
13032var workInProgressRootSkippedLanes = NoLanes; // Lanes that were updated (in an interleaved event) during this render.
13033
13034var workInProgressRootUpdatedLanes = NoLanes; // Lanes that were pinged (in an interleaved event) during this render.
13035
13036var workInProgressRootPingedLanes = NoLanes;
13037var mostRecentlyUpdatedRoot = null; // The most recent time we committed a fallback. This lets us ensure a train
13038// model where we don't commit new loading states in too quick succession.
13039
13040var globalMostRecentFallbackTime = 0;
13041var FALLBACK_THROTTLE_MS = 500; // The absolute time for when we should start giving up on rendering
13042// more and prefer CPU suspense heuristics instead.
13043
13044var workInProgressRootRenderTargetTime = Infinity; // How long a render is supposed to take before we start following CPU
13045// suspense heuristics and opt out of rendering more content.
13046
13047var RENDER_TIMEOUT_MS = 500;
13048
13049function resetRenderTimer() {
13050 workInProgressRootRenderTargetTime = now() + RENDER_TIMEOUT_MS;
13051}
13052
13053function getRenderTargetTime() {
13054 return workInProgressRootRenderTargetTime;
13055}
13056var nextEffect = null;
13057var hasUncaughtError = false;
13058var firstUncaughtError = null;
13059var legacyErrorBoundariesThatAlreadyFailed = null;
13060var rootDoesHavePassiveEffects = false;
13061var rootWithPendingPassiveEffects = null;
13062var pendingPassiveEffectsRenderPriority = NoPriority$1;
13063var pendingPassiveEffectsLanes = NoLanes;
13064var pendingPassiveHookEffectsMount = [];
13065var pendingPassiveHookEffectsUnmount = [];
13066var rootsWithPendingDiscreteUpdates = null; // Use these to prevent an infinite loop of nested updates
13067
13068var NESTED_UPDATE_LIMIT = 50;
13069var nestedUpdateCount = 0;
13070var rootWithNestedUpdates = null;
13071var NESTED_PASSIVE_UPDATE_LIMIT = 50;
13072var nestedPassiveUpdateCount = 0; // Marks the need to reschedule pending interactions at these lanes
13073// during the commit phase. This enables them to be traced across components
13074// that spawn new work during render. E.g. hidden boundaries, suspended SSR
13075// hydration or SuspenseList.
13076// TODO: Can use a bitmask instead of an array
13077
13078var spawnedWorkDuringRender = null; // If two updates are scheduled within the same event, we should treat their
13079// event times as simultaneous, even if the actual clock time has advanced
13080// between the first and second call.
13081
13082var currentEventTime = NoTimestamp;
13083var currentEventWipLanes = NoLanes;
13084var currentEventPendingLanes = NoLanes; // Dev only flag that tracks if passive effects are currently being flushed.
13085// We warn about state updates for unmounted components differently in this case.
13086
13087var isFlushingPassiveEffects = false;
13088var focusedInstanceHandle = null;
13089var shouldFireAfterActiveInstanceBlur = false;
13090function getWorkInProgressRoot() {
13091 return workInProgressRoot;
13092}
13093function requestEventTime() {
13094 if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
13095 // We're inside React, so it's fine to read the actual time.
13096 return now();
13097 } // We're not inside React, so we may be in the middle of a browser event.
13098
13099
13100 if (currentEventTime !== NoTimestamp) {
13101 // Use the same start time for all updates until we enter React again.
13102 return currentEventTime;
13103 } // This is the first update since React yielded. Compute a new start time.
13104
13105
13106 currentEventTime = now();
13107 return currentEventTime;
13108}
13109function requestUpdateLane(fiber) {
13110 // Special cases
13111 var mode = fiber.mode;
13112
13113 if ((mode & BlockingMode) === NoMode) {
13114 return SyncLane;
13115 } else if ((mode & ConcurrentMode) === NoMode) {
13116 return getCurrentPriorityLevel() === ImmediatePriority$1 ? SyncLane : SyncBatchedLane;
13117 } // The algorithm for assigning an update to a lane should be stable for all
13118 // updates at the same priority within the same event. To do this, the inputs
13119 // to the algorithm must be the same. For example, we use the `renderLanes`
13120 // to avoid choosing a lane that is already in the middle of rendering.
13121 //
13122 // However, the "included" lanes could be mutated in between updates in the
13123 // same event, like if you perform an update inside `flushSync`. Or any other
13124 // code path that might call `prepareFreshStack`.
13125 //
13126 // The trick we use is to cache the first of each of these inputs within an
13127 // event. Then reset the cached values once we can be sure the event is over.
13128 // Our heuristic for that is whenever we enter a concurrent work loop.
13129 //
13130 // We'll do the same for `currentEventPendingLanes` below.
13131
13132
13133 if (currentEventWipLanes === NoLanes) {
13134 currentEventWipLanes = workInProgressRootIncludedLanes;
13135 }
13136
13137 var isTransition = requestCurrentTransition() !== NoTransition;
13138
13139 if (isTransition) {
13140 if (currentEventPendingLanes !== NoLanes) {
13141 currentEventPendingLanes = mostRecentlyUpdatedRoot !== null ? mostRecentlyUpdatedRoot.pendingLanes : NoLanes;
13142 }
13143
13144 return findTransitionLane(currentEventWipLanes, currentEventPendingLanes);
13145 } // TODO: Remove this dependency on the Scheduler priority.
13146 // To do that, we're replacing it with an update lane priority.
13147
13148
13149 var schedulerPriority = getCurrentPriorityLevel(); // The old behavior was using the priority level of the Scheduler.
13150 // This couples React to the Scheduler internals, so we're replacing it
13151 // with the currentUpdateLanePriority above. As an example of how this
13152 // could be problematic, if we're not inside `Scheduler.runWithPriority`,
13153 // then we'll get the priority of the current running Scheduler task,
13154 // which is probably not what we want.
13155
13156 var lane;
13157
13158 if ( // TODO: Temporary. We're removing the concept of discrete updates.
13159 (executionContext & DiscreteEventContext) !== NoContext && schedulerPriority === UserBlockingPriority$1) {
13160 lane = findUpdateLane(InputDiscreteLanePriority, currentEventWipLanes);
13161 } else {
13162 var schedulerLanePriority = schedulerPriorityToLanePriority(schedulerPriority);
13163
13164 lane = findUpdateLane(schedulerLanePriority, currentEventWipLanes);
13165 }
13166
13167 return lane;
13168}
13169
13170function requestRetryLane(fiber) {
13171 // This is a fork of `requestUpdateLane` designed specifically for Suspense
13172 // "retries" — a special update that attempts to flip a Suspense boundary
13173 // from its placeholder state to its primary/resolved state.
13174 // Special cases
13175 var mode = fiber.mode;
13176
13177 if ((mode & BlockingMode) === NoMode) {
13178 return SyncLane;
13179 } else if ((mode & ConcurrentMode) === NoMode) {
13180 return getCurrentPriorityLevel() === ImmediatePriority$1 ? SyncLane : SyncBatchedLane;
13181 } // See `requestUpdateLane` for explanation of `currentEventWipLanes`
13182
13183
13184 if (currentEventWipLanes === NoLanes) {
13185 currentEventWipLanes = workInProgressRootIncludedLanes;
13186 }
13187
13188 return findRetryLane(currentEventWipLanes);
13189}
13190
13191function scheduleUpdateOnFiber(fiber, lane, eventTime) {
13192 checkForNestedUpdates();
13193 warnAboutRenderPhaseUpdatesInDEV(fiber);
13194 var root = markUpdateLaneFromFiberToRoot(fiber, lane);
13195
13196 if (root === null) {
13197 warnAboutUpdateOnUnmountedFiberInDEV(fiber);
13198 return null;
13199 } // Mark that the root has a pending update.
13200
13201
13202 markRootUpdated(root, lane, eventTime);
13203
13204 if (root === workInProgressRoot) {
13205 // Received an update to a tree that's in the middle of rendering. Mark
13206 // that there was an interleaved update work on this root. Unless the
13207 // `deferRenderPhaseUpdateToNextBatch` flag is off and this is a render
13208 // phase update. In that case, we don't treat render phase updates as if
13209 // they were interleaved, for backwards compat reasons.
13210 {
13211 workInProgressRootUpdatedLanes = mergeLanes(workInProgressRootUpdatedLanes, lane);
13212 }
13213
13214 if (workInProgressRootExitStatus === RootSuspendedWithDelay) {
13215 // The root already suspended with a delay, which means this render
13216 // definitely won't finish. Since we have a new update, let's mark it as
13217 // suspended now, right before marking the incoming update. This has the
13218 // effect of interrupting the current render and switching to the update.
13219 // TODO: Make sure this doesn't override pings that happen while we've
13220 // already started rendering.
13221 markRootSuspended$1(root, workInProgressRootRenderLanes);
13222 }
13223 } // TODO: requestUpdateLanePriority also reads the priority. Pass the
13224 // priority as an argument to that function and this one.
13225
13226
13227 var priorityLevel = getCurrentPriorityLevel();
13228
13229 if (lane === SyncLane) {
13230 if ( // Check if we're inside unbatchedUpdates
13231 (executionContext & LegacyUnbatchedContext) !== NoContext && // Check if we're not already rendering
13232 (executionContext & (RenderContext | CommitContext)) === NoContext) {
13233 // Register pending interactions on the root to avoid losing traced interaction data.
13234 schedulePendingInteractions(root, lane); // This is a legacy edge case. The initial mount of a ReactDOM.render-ed
13235 // root inside of batchedUpdates should be synchronous, but layout updates
13236 // should be deferred until the end of the batch.
13237
13238 performSyncWorkOnRoot(root);
13239 } else {
13240 ensureRootIsScheduled(root, eventTime);
13241 schedulePendingInteractions(root, lane);
13242
13243 if (executionContext === NoContext) {
13244 // Flush the synchronous work now, unless we're already working or inside
13245 // a batch. This is intentionally inside scheduleUpdateOnFiber instead of
13246 // scheduleCallbackForFiber to preserve the ability to schedule a callback
13247 // without immediately flushing it. We only do this for user-initiated
13248 // updates, to preserve historical behavior of legacy mode.
13249 resetRenderTimer();
13250 flushSyncCallbackQueue();
13251 }
13252 }
13253 } else {
13254 // Schedule a discrete update but only if it's not Sync.
13255 if ((executionContext & DiscreteEventContext) !== NoContext && ( // Only updates at user-blocking priority or greater are considered
13256 // discrete, even inside a discrete event.
13257 priorityLevel === UserBlockingPriority$1 || priorityLevel === ImmediatePriority$1)) {
13258 // This is the result of a discrete event. Track the lowest priority
13259 // discrete update per root so we can flush them early, if needed.
13260 if (rootsWithPendingDiscreteUpdates === null) {
13261 rootsWithPendingDiscreteUpdates = new Set([root]);
13262 } else {
13263 rootsWithPendingDiscreteUpdates.add(root);
13264 }
13265 } // Schedule other updates after in case the callback is sync.
13266
13267
13268 ensureRootIsScheduled(root, eventTime);
13269 schedulePendingInteractions(root, lane);
13270 } // We use this when assigning a lane for a transition inside
13271 // `requestUpdateLane`. We assume it's the same as the root being updated,
13272 // since in the common case of a single root app it probably is. If it's not
13273 // the same root, then it's not a huge deal, we just might batch more stuff
13274 // together more than necessary.
13275
13276
13277 mostRecentlyUpdatedRoot = root;
13278} // This is split into a separate function so we can mark a fiber with pending
13279// work without treating it as a typical update that originates from an event;
13280// e.g. retrying a Suspense boundary isn't an update, but it does schedule work
13281// on a fiber.
13282
13283function markUpdateLaneFromFiberToRoot(sourceFiber, lane) {
13284 // Update the source fiber's lanes
13285 sourceFiber.lanes = mergeLanes(sourceFiber.lanes, lane);
13286 var alternate = sourceFiber.alternate;
13287
13288 if (alternate !== null) {
13289 alternate.lanes = mergeLanes(alternate.lanes, lane);
13290 }
13291
13292 {
13293 if (alternate === null && (sourceFiber.flags & (Placement | Hydrating)) !== NoFlags) {
13294 warnAboutUpdateOnNotYetMountedFiberInDEV(sourceFiber);
13295 }
13296 } // Walk the parent path to the root and update the child expiration time.
13297
13298
13299 var node = sourceFiber;
13300 var parent = sourceFiber.return;
13301
13302 while (parent !== null) {
13303 parent.childLanes = mergeLanes(parent.childLanes, lane);
13304 alternate = parent.alternate;
13305
13306 if (alternate !== null) {
13307 alternate.childLanes = mergeLanes(alternate.childLanes, lane);
13308 } else {
13309 {
13310 if ((parent.flags & (Placement | Hydrating)) !== NoFlags) {
13311 warnAboutUpdateOnNotYetMountedFiberInDEV(sourceFiber);
13312 }
13313 }
13314 }
13315
13316 node = parent;
13317 parent = parent.return;
13318 }
13319
13320 if (node.tag === HostRoot) {
13321 var root = node.stateNode;
13322 return root;
13323 } else {
13324 return null;
13325 }
13326} // Use this function to schedule a task for a root. There's only one task per
13327// root; if a task was already scheduled, we'll check to make sure the priority
13328// of the existing task is the same as the priority of the next level that the
13329// root has work on. This function is called on every update, and right before
13330// exiting a task.
13331
13332
13333function ensureRootIsScheduled(root, currentTime) {
13334 var existingCallbackNode = root.callbackNode; // Check if any lanes are being starved by other work. If so, mark them as
13335 // expired so we know to work on those next.
13336
13337 markStarvedLanesAsExpired(root, currentTime); // Determine the next lanes to work on, and their priority.
13338
13339 var nextLanes = getNextLanes(root, root === workInProgressRoot ? workInProgressRootRenderLanes : NoLanes); // This returns the priority level computed during the `getNextLanes` call.
13340
13341 var newCallbackPriority = returnNextLanesPriority();
13342
13343 if (nextLanes === NoLanes) {
13344 // Special case: There's nothing to work on.
13345 if (existingCallbackNode !== null) {
13346 cancelCallback(existingCallbackNode);
13347 root.callbackNode = null;
13348 root.callbackPriority = NoLanePriority;
13349 }
13350
13351 return;
13352 } // Check if there's an existing task. We may be able to reuse it.
13353
13354
13355 if (existingCallbackNode !== null) {
13356 var existingCallbackPriority = root.callbackPriority;
13357
13358 if (existingCallbackPriority === newCallbackPriority) {
13359 // The priority hasn't changed. We can reuse the existing task. Exit.
13360 return;
13361 } // The priority changed. Cancel the existing callback. We'll schedule a new
13362 // one below.
13363
13364
13365 cancelCallback(existingCallbackNode);
13366 } // Schedule a new callback.
13367
13368
13369 var newCallbackNode;
13370
13371 if (newCallbackPriority === SyncLanePriority) {
13372 // Special case: Sync React callbacks are scheduled on a special
13373 // internal queue
13374 newCallbackNode = scheduleSyncCallback(performSyncWorkOnRoot.bind(null, root));
13375 } else if (newCallbackPriority === SyncBatchedLanePriority) {
13376 newCallbackNode = scheduleCallback(ImmediatePriority$1, performSyncWorkOnRoot.bind(null, root));
13377 } else {
13378 var schedulerPriorityLevel = lanePriorityToSchedulerPriority(newCallbackPriority);
13379 newCallbackNode = scheduleCallback(schedulerPriorityLevel, performConcurrentWorkOnRoot.bind(null, root));
13380 }
13381
13382 root.callbackPriority = newCallbackPriority;
13383 root.callbackNode = newCallbackNode;
13384} // This is the entry point for every concurrent task, i.e. anything that
13385// goes through Scheduler.
13386
13387
13388function performConcurrentWorkOnRoot(root) {
13389 // Since we know we're in a React event, we can clear the current
13390 // event time. The next update will compute a new event time.
13391 currentEventTime = NoTimestamp;
13392 currentEventWipLanes = NoLanes;
13393 currentEventPendingLanes = NoLanes;
13394
13395 if (!((executionContext & (RenderContext | CommitContext)) === NoContext)) {
13396 {
13397 throw Error( "Should not already be working." );
13398 }
13399 } // Flush any pending passive effects before deciding which lanes to work on,
13400 // in case they schedule additional work.
13401
13402
13403 var originalCallbackNode = root.callbackNode;
13404 var didFlushPassiveEffects = flushPassiveEffects();
13405
13406 if (didFlushPassiveEffects) {
13407 // Something in the passive effect phase may have canceled the current task.
13408 // Check if the task node for this root was changed.
13409 if (root.callbackNode !== originalCallbackNode) {
13410 // The current task was canceled. Exit. We don't need to call
13411 // `ensureRootIsScheduled` because the check above implies either that
13412 // there's a new task, or that there's no remaining work on this root.
13413 return null;
13414 }
13415 } // Determine the next expiration time to work on, using the fields stored
13416 // on the root.
13417
13418
13419 var lanes = getNextLanes(root, root === workInProgressRoot ? workInProgressRootRenderLanes : NoLanes);
13420
13421 if (lanes === NoLanes) {
13422 // Defensive coding. This is never expected to happen.
13423 return null;
13424 }
13425
13426 var exitStatus = renderRootConcurrent(root, lanes);
13427
13428 if (includesSomeLane(workInProgressRootIncludedLanes, workInProgressRootUpdatedLanes)) {
13429 // The render included lanes that were updated during the render phase.
13430 // For example, when unhiding a hidden tree, we include all the lanes
13431 // that were previously skipped when the tree was hidden. That set of
13432 // lanes is a superset of the lanes we started rendering with.
13433 //
13434 // So we'll throw out the current work and restart.
13435 prepareFreshStack(root, NoLanes);
13436 } else if (exitStatus !== RootIncomplete) {
13437 if (exitStatus === RootErrored) {
13438 executionContext |= RetryAfterError; // If an error occurred during hydration,
13439 // discard server response and fall back to client side render.
13440
13441 if (root.hydrate) {
13442 root.hydrate = false;
13443 clearContainer(root.containerInfo);
13444 } // If something threw an error, try rendering one more time. We'll render
13445 // synchronously to block concurrent data mutations, and we'll includes
13446 // all pending updates are included. If it still fails after the second
13447 // attempt, we'll give up and commit the resulting tree.
13448
13449
13450 lanes = getLanesToRetrySynchronouslyOnError(root);
13451
13452 if (lanes !== NoLanes) {
13453 exitStatus = renderRootSync(root, lanes);
13454 }
13455 }
13456
13457 if (exitStatus === RootFatalErrored) {
13458 var fatalError = workInProgressRootFatalError;
13459 prepareFreshStack(root, NoLanes);
13460 markRootSuspended$1(root, lanes);
13461 ensureRootIsScheduled(root, now());
13462 throw fatalError;
13463 } // We now have a consistent tree. The next step is either to commit it,
13464 // or, if something suspended, wait to commit it after a timeout.
13465
13466
13467 var finishedWork = root.current.alternate;
13468 root.finishedWork = finishedWork;
13469 root.finishedLanes = lanes;
13470 finishConcurrentRender(root, exitStatus, lanes);
13471 }
13472
13473 ensureRootIsScheduled(root, now());
13474
13475 if (root.callbackNode === originalCallbackNode) {
13476 // The task node scheduled for this root is the same one that's
13477 // currently executed. Need to return a continuation.
13478 return performConcurrentWorkOnRoot.bind(null, root);
13479 }
13480
13481 return null;
13482}
13483
13484function finishConcurrentRender(root, exitStatus, lanes) {
13485 switch (exitStatus) {
13486 case RootIncomplete:
13487 case RootFatalErrored:
13488 {
13489 {
13490 {
13491 throw Error( "Root did not complete. This is a bug in React." );
13492 }
13493 }
13494 }
13495 // Flow knows about invariant, so it complains if I add a break
13496 // statement, but eslint doesn't know about invariant, so it complains
13497 // if I do. eslint-disable-next-line no-fallthrough
13498
13499 case RootErrored:
13500 {
13501 // We should have already attempted to retry this tree. If we reached
13502 // this point, it errored again. Commit it.
13503 commitRoot(root);
13504 break;
13505 }
13506
13507 case RootSuspended:
13508 {
13509 markRootSuspended$1(root, lanes); // We have an acceptable loading state. We need to figure out if we
13510 // should immediately commit it or wait a bit.
13511
13512 if (includesOnlyRetries(lanes) && // do not delay if we're inside an act() scope
13513 !shouldForceFlushFallbacksInDEV()) {
13514 // This render only included retries, no updates. Throttle committing
13515 // retries so that we don't show too many loading states too quickly.
13516 var msUntilTimeout = globalMostRecentFallbackTime + FALLBACK_THROTTLE_MS - now(); // Don't bother with a very short suspense time.
13517
13518 if (msUntilTimeout > 10) {
13519 var nextLanes = getNextLanes(root, NoLanes);
13520
13521 if (nextLanes !== NoLanes) {
13522 // There's additional work on this root.
13523 break;
13524 }
13525
13526 var suspendedLanes = root.suspendedLanes;
13527
13528 if (!isSubsetOfLanes(suspendedLanes, lanes)) {
13529 // We should prefer to render the fallback of at the last
13530 // suspended level. Ping the last suspended level to try
13531 // rendering it again.
13532 // FIXME: What if the suspended lanes are Idle? Should not restart.
13533 var eventTime = requestEventTime();
13534 markRootPinged(root, suspendedLanes);
13535 break;
13536 } // The render is suspended, it hasn't timed out, and there's no
13537 // lower priority work to do. Instead of committing the fallback
13538 // immediately, wait for more data to arrive.
13539
13540
13541 root.timeoutHandle = scheduleTimeout(commitRoot.bind(null, root), msUntilTimeout);
13542 break;
13543 }
13544 } // The work expired. Commit immediately.
13545
13546
13547 commitRoot(root);
13548 break;
13549 }
13550
13551 case RootSuspendedWithDelay:
13552 {
13553 markRootSuspended$1(root, lanes);
13554
13555 if (includesOnlyTransitions(lanes)) {
13556 // This is a transition, so we should exit without committing a
13557 // placeholder and without scheduling a timeout. Delay indefinitely
13558 // until we receive more data.
13559 break;
13560 }
13561
13562 if (!shouldForceFlushFallbacksInDEV()) {
13563 // This is not a transition, but we did trigger an avoided state.
13564 // Schedule a placeholder to display after a short delay, using the Just
13565 // Noticeable Difference.
13566 // TODO: Is the JND optimization worth the added complexity? If this is
13567 // the only reason we track the event time, then probably not.
13568 // Consider removing.
13569 var mostRecentEventTime = getMostRecentEventTime(root, lanes);
13570 var eventTimeMs = mostRecentEventTime;
13571 var timeElapsedMs = now() - eventTimeMs;
13572
13573 var _msUntilTimeout = jnd(timeElapsedMs) - timeElapsedMs; // Don't bother with a very short suspense time.
13574
13575
13576 if (_msUntilTimeout > 10) {
13577 // Instead of committing the fallback immediately, wait for more data
13578 // to arrive.
13579 root.timeoutHandle = scheduleTimeout(commitRoot.bind(null, root), _msUntilTimeout);
13580 break;
13581 }
13582 } // Commit the placeholder.
13583
13584
13585 commitRoot(root);
13586 break;
13587 }
13588
13589 case RootCompleted:
13590 {
13591 // The work completed. Ready to commit.
13592 commitRoot(root);
13593 break;
13594 }
13595
13596 default:
13597 {
13598 {
13599 {
13600 throw Error( "Unknown root exit status." );
13601 }
13602 }
13603 }
13604 }
13605}
13606
13607function markRootSuspended$1(root, suspendedLanes) {
13608 // When suspending, we should always exclude lanes that were pinged or (more
13609 // rarely, since we try to avoid it) updated during the render phase.
13610 // TODO: Lol maybe there's a better way to factor this besides this
13611 // obnoxiously named function :)
13612 suspendedLanes = removeLanes(suspendedLanes, workInProgressRootPingedLanes);
13613 suspendedLanes = removeLanes(suspendedLanes, workInProgressRootUpdatedLanes);
13614 markRootSuspended(root, suspendedLanes);
13615} // This is the entry point for synchronous tasks that don't go
13616// through Scheduler
13617
13618
13619function performSyncWorkOnRoot(root) {
13620 if (!((executionContext & (RenderContext | CommitContext)) === NoContext)) {
13621 {
13622 throw Error( "Should not already be working." );
13623 }
13624 }
13625
13626 flushPassiveEffects();
13627 var lanes;
13628 var exitStatus;
13629
13630 if (root === workInProgressRoot && includesSomeLane(root.expiredLanes, workInProgressRootRenderLanes)) {
13631 // There's a partial tree, and at least one of its lanes has expired. Finish
13632 // rendering it before rendering the rest of the expired work.
13633 lanes = workInProgressRootRenderLanes;
13634 exitStatus = renderRootSync(root, lanes);
13635
13636 if (includesSomeLane(workInProgressRootIncludedLanes, workInProgressRootUpdatedLanes)) {
13637 // The render included lanes that were updated during the render phase.
13638 // For example, when unhiding a hidden tree, we include all the lanes
13639 // that were previously skipped when the tree was hidden. That set of
13640 // lanes is a superset of the lanes we started rendering with.
13641 //
13642 // Note that this only happens when part of the tree is rendered
13643 // concurrently. If the whole tree is rendered synchronously, then there
13644 // are no interleaved events.
13645 lanes = getNextLanes(root, lanes);
13646 exitStatus = renderRootSync(root, lanes);
13647 }
13648 } else {
13649 lanes = getNextLanes(root, NoLanes);
13650 exitStatus = renderRootSync(root, lanes);
13651 }
13652
13653 if (root.tag !== LegacyRoot && exitStatus === RootErrored) {
13654 executionContext |= RetryAfterError; // If an error occurred during hydration,
13655 // discard server response and fall back to client side render.
13656
13657 if (root.hydrate) {
13658 root.hydrate = false;
13659 clearContainer(root.containerInfo);
13660 } // If something threw an error, try rendering one more time. We'll render
13661 // synchronously to block concurrent data mutations, and we'll includes
13662 // all pending updates are included. If it still fails after the second
13663 // attempt, we'll give up and commit the resulting tree.
13664
13665
13666 lanes = getLanesToRetrySynchronouslyOnError(root);
13667
13668 if (lanes !== NoLanes) {
13669 exitStatus = renderRootSync(root, lanes);
13670 }
13671 }
13672
13673 if (exitStatus === RootFatalErrored) {
13674 var fatalError = workInProgressRootFatalError;
13675 prepareFreshStack(root, NoLanes);
13676 markRootSuspended$1(root, lanes);
13677 ensureRootIsScheduled(root, now());
13678 throw fatalError;
13679 } // We now have a consistent tree. Because this is a sync render, we
13680 // will commit it even if something suspended.
13681
13682
13683 var finishedWork = root.current.alternate;
13684 root.finishedWork = finishedWork;
13685 root.finishedLanes = lanes;
13686 commitRoot(root); // Before exiting, make sure there's a callback scheduled for the next
13687 // pending level.
13688
13689 ensureRootIsScheduled(root, now());
13690 return null;
13691}
13692function flushSync(fn, a) {
13693 var prevExecutionContext = executionContext;
13694
13695 if ((prevExecutionContext & (RenderContext | CommitContext)) !== NoContext) {
13696 {
13697 error('flushSync was called from inside a lifecycle method. React cannot ' + 'flush when React is already rendering. Consider moving this call to ' + 'a scheduler task or micro task.');
13698 }
13699
13700 return fn(a);
13701 }
13702
13703 executionContext |= BatchedContext;
13704
13705 {
13706 try {
13707 if (fn) {
13708 return runWithPriority(ImmediatePriority$1, fn.bind(null, a));
13709 } else {
13710 return undefined;
13711 }
13712 } finally {
13713 executionContext = prevExecutionContext; // Flush the immediate callbacks that were scheduled during this batch.
13714 // Note that this will happen even if batchedUpdates is higher up
13715 // the stack.
13716
13717 flushSyncCallbackQueue();
13718 }
13719 }
13720}
13721function pushRenderLanes(fiber, lanes) {
13722 push(subtreeRenderLanesCursor, subtreeRenderLanes, fiber);
13723 subtreeRenderLanes = mergeLanes(subtreeRenderLanes, lanes);
13724 workInProgressRootIncludedLanes = mergeLanes(workInProgressRootIncludedLanes, lanes);
13725}
13726function popRenderLanes(fiber) {
13727 subtreeRenderLanes = subtreeRenderLanesCursor.current;
13728 pop(subtreeRenderLanesCursor, fiber);
13729}
13730
13731function prepareFreshStack(root, lanes) {
13732 root.finishedWork = null;
13733 root.finishedLanes = NoLanes;
13734 var timeoutHandle = root.timeoutHandle;
13735
13736 if (timeoutHandle !== noTimeout) {
13737 // The root previous suspended and scheduled a timeout to commit a fallback
13738 // state. Now that we have additional work, cancel the timeout.
13739 root.timeoutHandle = noTimeout; // $FlowFixMe Complains noTimeout is not a TimeoutID, despite the check above
13740
13741 cancelTimeout(timeoutHandle);
13742 }
13743
13744 if (workInProgress !== null) {
13745 var interruptedWork = workInProgress.return;
13746
13747 while (interruptedWork !== null) {
13748 unwindInterruptedWork(interruptedWork);
13749 interruptedWork = interruptedWork.return;
13750 }
13751 }
13752
13753 workInProgressRoot = root;
13754 workInProgress = createWorkInProgress(root.current, null);
13755 workInProgressRootRenderLanes = subtreeRenderLanes = workInProgressRootIncludedLanes = lanes;
13756 workInProgressRootExitStatus = RootIncomplete;
13757 workInProgressRootFatalError = null;
13758 workInProgressRootSkippedLanes = NoLanes;
13759 workInProgressRootUpdatedLanes = NoLanes;
13760 workInProgressRootPingedLanes = NoLanes;
13761
13762 {
13763 spawnedWorkDuringRender = null;
13764 }
13765
13766 {
13767 ReactStrictModeWarnings.discardPendingWarnings();
13768 }
13769}
13770
13771function handleError(root, thrownValue) {
13772 do {
13773 var erroredWork = workInProgress;
13774
13775 try {
13776 // Reset module-level state that was set during the render phase.
13777 resetContextDependencies();
13778 resetHooksAfterThrow();
13779 resetCurrentFiber(); // TODO: I found and added this missing line while investigating a
13780 // separate issue. Write a regression test using string refs.
13781
13782 ReactCurrentOwner$2.current = null;
13783
13784 if (erroredWork === null || erroredWork.return === null) {
13785 // Expected to be working on a non-root fiber. This is a fatal error
13786 // because there's no ancestor that can handle it; the root is
13787 // supposed to capture all errors that weren't caught by an error
13788 // boundary.
13789 workInProgressRootExitStatus = RootFatalErrored;
13790 workInProgressRootFatalError = thrownValue; // Set `workInProgress` to null. This represents advancing to the next
13791 // sibling, or the parent if there are no siblings. But since the root
13792 // has no siblings nor a parent, we set it to null. Usually this is
13793 // handled by `completeUnitOfWork` or `unwindWork`, but since we're
13794 // intentionally not calling those, we need set it here.
13795 // TODO: Consider calling `unwindWork` to pop the contexts.
13796
13797 workInProgress = null;
13798 return;
13799 }
13800
13801 if (enableProfilerTimer && erroredWork.mode & ProfileMode) {
13802 // Record the time spent rendering before an error was thrown. This
13803 // avoids inaccurate Profiler durations in the case of a
13804 // suspended render.
13805 stopProfilerTimerIfRunningAndRecordDelta(erroredWork, true);
13806 }
13807
13808 throwException(root, erroredWork.return, erroredWork, thrownValue, workInProgressRootRenderLanes);
13809 completeUnitOfWork(erroredWork);
13810 } catch (yetAnotherThrownValue) {
13811 // Something in the return path also threw.
13812 thrownValue = yetAnotherThrownValue;
13813
13814 if (workInProgress === erroredWork && erroredWork !== null) {
13815 // If this boundary has already errored, then we had trouble processing
13816 // the error. Bubble it to the next boundary.
13817 erroredWork = erroredWork.return;
13818 workInProgress = erroredWork;
13819 } else {
13820 erroredWork = workInProgress;
13821 }
13822
13823 continue;
13824 } // Return to the normal work loop.
13825
13826
13827 return;
13828 } while (true);
13829}
13830
13831function pushDispatcher() {
13832 var prevDispatcher = ReactCurrentDispatcher$2.current;
13833 ReactCurrentDispatcher$2.current = ContextOnlyDispatcher;
13834
13835 if (prevDispatcher === null) {
13836 // The React isomorphic package does not include a default dispatcher.
13837 // Instead the first renderer will lazily attach one, in order to give
13838 // nicer error messages.
13839 return ContextOnlyDispatcher;
13840 } else {
13841 return prevDispatcher;
13842 }
13843}
13844
13845function popDispatcher(prevDispatcher) {
13846 ReactCurrentDispatcher$2.current = prevDispatcher;
13847}
13848
13849function pushInteractions(root) {
13850 {
13851 var prevInteractions = tracing.__interactionsRef.current;
13852 tracing.__interactionsRef.current = root.memoizedInteractions;
13853 return prevInteractions;
13854 }
13855}
13856
13857function popInteractions(prevInteractions) {
13858 {
13859 tracing.__interactionsRef.current = prevInteractions;
13860 }
13861}
13862
13863function markCommitTimeOfFallback() {
13864 globalMostRecentFallbackTime = now();
13865}
13866function markSkippedUpdateLanes(lane) {
13867 workInProgressRootSkippedLanes = mergeLanes(lane, workInProgressRootSkippedLanes);
13868}
13869function renderDidSuspend() {
13870 if (workInProgressRootExitStatus === RootIncomplete) {
13871 workInProgressRootExitStatus = RootSuspended;
13872 }
13873}
13874function renderDidSuspendDelayIfPossible() {
13875 if (workInProgressRootExitStatus === RootIncomplete || workInProgressRootExitStatus === RootSuspended) {
13876 workInProgressRootExitStatus = RootSuspendedWithDelay;
13877 } // Check if there are updates that we skipped tree that might have unblocked
13878 // this render.
13879
13880
13881 if (workInProgressRoot !== null && (includesNonIdleWork(workInProgressRootSkippedLanes) || includesNonIdleWork(workInProgressRootUpdatedLanes))) {
13882 // Mark the current render as suspended so that we switch to working on
13883 // the updates that were skipped. Usually we only suspend at the end of
13884 // the render phase.
13885 // TODO: We should probably always mark the root as suspended immediately
13886 // (inside this function), since by suspending at the end of the render
13887 // phase introduces a potential mistake where we suspend lanes that were
13888 // pinged or updated while we were rendering.
13889 markRootSuspended$1(workInProgressRoot, workInProgressRootRenderLanes);
13890 }
13891}
13892function renderDidError() {
13893 if (workInProgressRootExitStatus !== RootCompleted) {
13894 workInProgressRootExitStatus = RootErrored;
13895 }
13896} // Called during render to determine if anything has suspended.
13897// Returns false if we're not sure.
13898
13899function renderHasNotSuspendedYet() {
13900 // If something errored or completed, we can't really be sure,
13901 // so those are false.
13902 return workInProgressRootExitStatus === RootIncomplete;
13903}
13904
13905function renderRootSync(root, lanes) {
13906 var prevExecutionContext = executionContext;
13907 executionContext |= RenderContext;
13908 var prevDispatcher = pushDispatcher(); // If the root or lanes have changed, throw out the existing stack
13909 // and prepare a fresh one. Otherwise we'll continue where we left off.
13910
13911 if (workInProgressRoot !== root || workInProgressRootRenderLanes !== lanes) {
13912 prepareFreshStack(root, lanes);
13913 startWorkOnPendingInteractions(root, lanes);
13914 }
13915
13916 var prevInteractions = pushInteractions(root);
13917
13918 do {
13919 try {
13920 workLoopSync();
13921 break;
13922 } catch (thrownValue) {
13923 handleError(root, thrownValue);
13924 }
13925 } while (true);
13926
13927 resetContextDependencies();
13928
13929 {
13930 popInteractions(prevInteractions);
13931 }
13932
13933 executionContext = prevExecutionContext;
13934 popDispatcher(prevDispatcher);
13935
13936 if (workInProgress !== null) {
13937 // This is a sync render, so we should have finished the whole tree.
13938 {
13939 {
13940 throw Error( "Cannot commit an incomplete root. This error is likely caused by a bug in React. Please file an issue." );
13941 }
13942 }
13943 }
13944
13945
13946 workInProgressRoot = null;
13947 workInProgressRootRenderLanes = NoLanes;
13948 return workInProgressRootExitStatus;
13949} // The work loop is an extremely hot path. Tell Closure not to inline it.
13950
13951/** @noinline */
13952
13953
13954function workLoopSync() {
13955 // Already timed out, so perform work without checking if we need to yield.
13956 while (workInProgress !== null) {
13957 performUnitOfWork(workInProgress);
13958 }
13959}
13960
13961function renderRootConcurrent(root, lanes) {
13962 var prevExecutionContext = executionContext;
13963 executionContext |= RenderContext;
13964 var prevDispatcher = pushDispatcher(); // If the root or lanes have changed, throw out the existing stack
13965 // and prepare a fresh one. Otherwise we'll continue where we left off.
13966
13967 if (workInProgressRoot !== root || workInProgressRootRenderLanes !== lanes) {
13968 resetRenderTimer();
13969 prepareFreshStack(root, lanes);
13970 startWorkOnPendingInteractions(root, lanes);
13971 }
13972
13973 var prevInteractions = pushInteractions(root);
13974
13975 do {
13976 try {
13977 workLoopConcurrent();
13978 break;
13979 } catch (thrownValue) {
13980 handleError(root, thrownValue);
13981 }
13982 } while (true);
13983
13984 resetContextDependencies();
13985
13986 {
13987 popInteractions(prevInteractions);
13988 }
13989
13990 popDispatcher(prevDispatcher);
13991 executionContext = prevExecutionContext;
13992
13993
13994 if (workInProgress !== null) {
13995
13996 return RootIncomplete;
13997 } else {
13998
13999
14000 workInProgressRoot = null;
14001 workInProgressRootRenderLanes = NoLanes; // Return the final exit status.
14002
14003 return workInProgressRootExitStatus;
14004 }
14005}
14006/** @noinline */
14007
14008
14009function workLoopConcurrent() {
14010 // Perform work until Scheduler asks us to yield
14011 while (workInProgress !== null && !shouldYield()) {
14012 performUnitOfWork(workInProgress);
14013 }
14014}
14015
14016function performUnitOfWork(unitOfWork) {
14017 // The current, flushed, state of this fiber is the alternate. Ideally
14018 // nothing should rely on this, but relying on it here means that we don't
14019 // need an additional field on the work in progress.
14020 var current = unitOfWork.alternate;
14021 setCurrentFiber(unitOfWork);
14022 var next;
14023
14024 if ( (unitOfWork.mode & ProfileMode) !== NoMode) {
14025 startProfilerTimer(unitOfWork);
14026 next = beginWork$1(current, unitOfWork, subtreeRenderLanes);
14027 stopProfilerTimerIfRunningAndRecordDelta(unitOfWork, true);
14028 } else {
14029 next = beginWork$1(current, unitOfWork, subtreeRenderLanes);
14030 }
14031
14032 resetCurrentFiber();
14033 unitOfWork.memoizedProps = unitOfWork.pendingProps;
14034
14035 if (next === null) {
14036 // If this doesn't spawn new work, complete the current work.
14037 completeUnitOfWork(unitOfWork);
14038 } else {
14039 workInProgress = next;
14040 }
14041
14042 ReactCurrentOwner$2.current = null;
14043}
14044
14045function completeUnitOfWork(unitOfWork) {
14046 // Attempt to complete the current unit of work, then move to the next
14047 // sibling. If there are no more siblings, return to the parent fiber.
14048 var completedWork = unitOfWork;
14049
14050 do {
14051 // The current, flushed, state of this fiber is the alternate. Ideally
14052 // nothing should rely on this, but relying on it here means that we don't
14053 // need an additional field on the work in progress.
14054 var current = completedWork.alternate;
14055 var returnFiber = completedWork.return; // Check if the work completed or if something threw.
14056
14057 if ((completedWork.flags & Incomplete) === NoFlags) {
14058 setCurrentFiber(completedWork);
14059 var next = void 0;
14060
14061 if ( (completedWork.mode & ProfileMode) === NoMode) {
14062 next = completeWork(current, completedWork, subtreeRenderLanes);
14063 } else {
14064 startProfilerTimer(completedWork);
14065 next = completeWork(current, completedWork, subtreeRenderLanes); // Update render duration assuming we didn't error.
14066
14067 stopProfilerTimerIfRunningAndRecordDelta(completedWork, false);
14068 }
14069
14070 resetCurrentFiber();
14071
14072 if (next !== null) {
14073 // Completing this fiber spawned new work. Work on that next.
14074 workInProgress = next;
14075 return;
14076 }
14077
14078 resetChildLanes(completedWork);
14079
14080 if (returnFiber !== null && // Do not append effects to parents if a sibling failed to complete
14081 (returnFiber.flags & Incomplete) === NoFlags) {
14082 // Append all the effects of the subtree and this fiber onto the effect
14083 // list of the parent. The completion order of the children affects the
14084 // side-effect order.
14085 if (returnFiber.firstEffect === null) {
14086 returnFiber.firstEffect = completedWork.firstEffect;
14087 }
14088
14089 if (completedWork.lastEffect !== null) {
14090 if (returnFiber.lastEffect !== null) {
14091 returnFiber.lastEffect.nextEffect = completedWork.firstEffect;
14092 }
14093
14094 returnFiber.lastEffect = completedWork.lastEffect;
14095 } // If this fiber had side-effects, we append it AFTER the children's
14096 // side-effects. We can perform certain side-effects earlier if needed,
14097 // by doing multiple passes over the effect list. We don't want to
14098 // schedule our own side-effect on our own list because if end up
14099 // reusing children we'll schedule this effect onto itself since we're
14100 // at the end.
14101
14102
14103 var flags = completedWork.flags; // Skip both NoWork and PerformedWork tags when creating the effect
14104 // list. PerformedWork effect is read by React DevTools but shouldn't be
14105 // committed.
14106
14107 if (flags > PerformedWork) {
14108 if (returnFiber.lastEffect !== null) {
14109 returnFiber.lastEffect.nextEffect = completedWork;
14110 } else {
14111 returnFiber.firstEffect = completedWork;
14112 }
14113
14114 returnFiber.lastEffect = completedWork;
14115 }
14116 }
14117 } else {
14118 // This fiber did not complete because something threw. Pop values off
14119 // the stack without entering the complete phase. If this is a boundary,
14120 // capture values if possible.
14121 var _next = unwindWork(completedWork); // Because this fiber did not complete, don't reset its expiration time.
14122
14123
14124 if (_next !== null) {
14125 // If completing this work spawned new work, do that next. We'll come
14126 // back here again.
14127 // Since we're restarting, remove anything that is not a host effect
14128 // from the effect tag.
14129 _next.flags &= HostEffectMask;
14130 workInProgress = _next;
14131 return;
14132 }
14133
14134 if ( (completedWork.mode & ProfileMode) !== NoMode) {
14135 // Record the render duration for the fiber that errored.
14136 stopProfilerTimerIfRunningAndRecordDelta(completedWork, false); // Include the time spent working on failed children before continuing.
14137
14138 var actualDuration = completedWork.actualDuration;
14139 var child = completedWork.child;
14140
14141 while (child !== null) {
14142 actualDuration += child.actualDuration;
14143 child = child.sibling;
14144 }
14145
14146 completedWork.actualDuration = actualDuration;
14147 }
14148
14149 if (returnFiber !== null) {
14150 // Mark the parent fiber as incomplete and clear its effect list.
14151 returnFiber.firstEffect = returnFiber.lastEffect = null;
14152 returnFiber.flags |= Incomplete;
14153 }
14154 }
14155
14156 var siblingFiber = completedWork.sibling;
14157
14158 if (siblingFiber !== null) {
14159 // If there is more work to do in this returnFiber, do that next.
14160 workInProgress = siblingFiber;
14161 return;
14162 } // Otherwise, return to the parent
14163
14164
14165 completedWork = returnFiber; // Update the next thing we're working on in case something throws.
14166
14167 workInProgress = completedWork;
14168 } while (completedWork !== null); // We've reached the root.
14169
14170
14171 if (workInProgressRootExitStatus === RootIncomplete) {
14172 workInProgressRootExitStatus = RootCompleted;
14173 }
14174}
14175
14176function resetChildLanes(completedWork) {
14177 if ( // TODO: Move this check out of the hot path by moving `resetChildLanes`
14178 // to switch statement in `completeWork`.
14179 (completedWork.tag === LegacyHiddenComponent || completedWork.tag === OffscreenComponent) && completedWork.memoizedState !== null && !includesSomeLane(subtreeRenderLanes, OffscreenLane) && (completedWork.mode & ConcurrentMode) !== NoLanes) {
14180 // The children of this component are hidden. Don't bubble their
14181 // expiration times.
14182 return;
14183 }
14184
14185 var newChildLanes = NoLanes; // Bubble up the earliest expiration time.
14186
14187 if ( (completedWork.mode & ProfileMode) !== NoMode) {
14188 // In profiling mode, resetChildExpirationTime is also used to reset
14189 // profiler durations.
14190 var actualDuration = completedWork.actualDuration;
14191 var treeBaseDuration = completedWork.selfBaseDuration; // When a fiber is cloned, its actualDuration is reset to 0. This value will
14192 // only be updated if work is done on the fiber (i.e. it doesn't bailout).
14193 // When work is done, it should bubble to the parent's actualDuration. If
14194 // the fiber has not been cloned though, (meaning no work was done), then
14195 // this value will reflect the amount of time spent working on a previous
14196 // render. In that case it should not bubble. We determine whether it was
14197 // cloned by comparing the child pointer.
14198
14199 var shouldBubbleActualDurations = completedWork.alternate === null || completedWork.child !== completedWork.alternate.child;
14200 var child = completedWork.child;
14201
14202 while (child !== null) {
14203 newChildLanes = mergeLanes(newChildLanes, mergeLanes(child.lanes, child.childLanes));
14204
14205 if (shouldBubbleActualDurations) {
14206 actualDuration += child.actualDuration;
14207 }
14208
14209 treeBaseDuration += child.treeBaseDuration;
14210 child = child.sibling;
14211 }
14212
14213 var isTimedOutSuspense = completedWork.tag === SuspenseComponent && completedWork.memoizedState !== null;
14214
14215 if (isTimedOutSuspense) {
14216 // Don't count time spent in a timed out Suspense subtree as part of the base duration.
14217 var primaryChildFragment = completedWork.child;
14218
14219 if (primaryChildFragment !== null) {
14220 treeBaseDuration -= primaryChildFragment.treeBaseDuration;
14221 }
14222 }
14223
14224 completedWork.actualDuration = actualDuration;
14225 completedWork.treeBaseDuration = treeBaseDuration;
14226 } else {
14227 var _child = completedWork.child;
14228
14229 while (_child !== null) {
14230 newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child.lanes, _child.childLanes));
14231 _child = _child.sibling;
14232 }
14233 }
14234
14235 completedWork.childLanes = newChildLanes;
14236}
14237
14238function commitRoot(root) {
14239 var renderPriorityLevel = getCurrentPriorityLevel();
14240 runWithPriority(ImmediatePriority$1, commitRootImpl.bind(null, root, renderPriorityLevel));
14241 return null;
14242}
14243
14244function commitRootImpl(root, renderPriorityLevel) {
14245 do {
14246 // `flushPassiveEffects` will call `flushSyncUpdateQueue` at the end, which
14247 // means `flushPassiveEffects` will sometimes result in additional
14248 // passive effects. So we need to keep flushing in a loop until there are
14249 // no more pending effects.
14250 // TODO: Might be better if `flushPassiveEffects` did not automatically
14251 // flush synchronous work at the end, to avoid factoring hazards like this.
14252 flushPassiveEffects();
14253 } while (rootWithPendingPassiveEffects !== null);
14254
14255 flushRenderPhaseStrictModeWarningsInDEV();
14256
14257 if (!((executionContext & (RenderContext | CommitContext)) === NoContext)) {
14258 {
14259 throw Error( "Should not already be working." );
14260 }
14261 }
14262
14263 var finishedWork = root.finishedWork;
14264 var lanes = root.finishedLanes;
14265
14266 if (finishedWork === null) {
14267
14268 return null;
14269 }
14270
14271 root.finishedWork = null;
14272 root.finishedLanes = NoLanes;
14273
14274 if (!(finishedWork !== root.current)) {
14275 {
14276 throw Error( "Cannot commit the same tree as before. This error is likely caused by a bug in React. Please file an issue." );
14277 }
14278 } // commitRoot never returns a continuation; it always finishes synchronously.
14279 // So we can clear these now to allow a new callback to be scheduled.
14280
14281
14282 root.callbackNode = null; // Update the first and last pending times on this root. The new first
14283 // pending time is whatever is left on the root fiber.
14284
14285 var remainingLanes = mergeLanes(finishedWork.lanes, finishedWork.childLanes);
14286 markRootFinished(root, remainingLanes); // Clear already finished discrete updates in case that a later call of
14287 // `flushDiscreteUpdates` starts a useless render pass which may cancels
14288 // a scheduled timeout.
14289
14290 if (rootsWithPendingDiscreteUpdates !== null) {
14291 if (!hasDiscreteLanes(remainingLanes) && rootsWithPendingDiscreteUpdates.has(root)) {
14292 rootsWithPendingDiscreteUpdates.delete(root);
14293 }
14294 }
14295
14296 if (root === workInProgressRoot) {
14297 // We can reset these now that they are finished.
14298 workInProgressRoot = null;
14299 workInProgress = null;
14300 workInProgressRootRenderLanes = NoLanes;
14301 } // Get the list of effects.
14302
14303
14304 var firstEffect;
14305
14306 if (finishedWork.flags > PerformedWork) {
14307 // A fiber's effect list consists only of its children, not itself. So if
14308 // the root has an effect, we need to add it to the end of the list. The
14309 // resulting list is the set that would belong to the root's parent, if it
14310 // had one; that is, all the effects in the tree including the root.
14311 if (finishedWork.lastEffect !== null) {
14312 finishedWork.lastEffect.nextEffect = finishedWork;
14313 firstEffect = finishedWork.firstEffect;
14314 } else {
14315 firstEffect = finishedWork;
14316 }
14317 } else {
14318 // There is no effect on the root.
14319 firstEffect = finishedWork.firstEffect;
14320 }
14321
14322 if (firstEffect !== null) {
14323
14324 var prevExecutionContext = executionContext;
14325 executionContext |= CommitContext;
14326 var prevInteractions = pushInteractions(root); // Reset this to null before calling lifecycles
14327
14328 ReactCurrentOwner$2.current = null; // The commit phase is broken into several sub-phases. We do a separate pass
14329 // of the effect list for each phase: all mutation effects come before all
14330 // layout effects, and so on.
14331 // The first phase a "before mutation" phase. We use this phase to read the
14332 // state of the host tree right before we mutate it. This is where
14333 // getSnapshotBeforeUpdate is called.
14334
14335 focusedInstanceHandle = prepareForCommit(root.containerInfo);
14336 shouldFireAfterActiveInstanceBlur = false;
14337 nextEffect = firstEffect;
14338
14339 do {
14340 {
14341 invokeGuardedCallback(null, commitBeforeMutationEffects, null);
14342
14343 if (hasCaughtError()) {
14344 if (!(nextEffect !== null)) {
14345 {
14346 throw Error( "Should be working on an effect." );
14347 }
14348 }
14349
14350 var error = clearCaughtError();
14351 captureCommitPhaseError(nextEffect, error);
14352 nextEffect = nextEffect.nextEffect;
14353 }
14354 }
14355 } while (nextEffect !== null); // We no longer need to track the active instance fiber
14356
14357
14358 focusedInstanceHandle = null;
14359
14360 {
14361 // Mark the current commit time to be shared by all Profilers in this
14362 // batch. This enables them to be grouped later.
14363 recordCommitTime();
14364 } // The next phase is the mutation phase, where we mutate the host tree.
14365
14366
14367 nextEffect = firstEffect;
14368
14369 do {
14370 {
14371 invokeGuardedCallback(null, commitMutationEffects, null, root, renderPriorityLevel);
14372
14373 if (hasCaughtError()) {
14374 if (!(nextEffect !== null)) {
14375 {
14376 throw Error( "Should be working on an effect." );
14377 }
14378 }
14379
14380 var _error = clearCaughtError();
14381
14382 captureCommitPhaseError(nextEffect, _error);
14383 nextEffect = nextEffect.nextEffect;
14384 }
14385 }
14386 } while (nextEffect !== null);
14387
14388 resetAfterCommit(root.containerInfo); // The work-in-progress tree is now the current tree. This must come after
14389 // the mutation phase, so that the previous tree is still current during
14390 // componentWillUnmount, but before the layout phase, so that the finished
14391 // work is current during componentDidMount/Update.
14392
14393 root.current = finishedWork; // The next phase is the layout phase, where we call effects that read
14394 // the host tree after it's been mutated. The idiomatic use case for this is
14395 // layout, but class component lifecycles also fire here for legacy reasons.
14396
14397 nextEffect = firstEffect;
14398
14399 do {
14400 {
14401 invokeGuardedCallback(null, commitLayoutEffects, null, root, lanes);
14402
14403 if (hasCaughtError()) {
14404 if (!(nextEffect !== null)) {
14405 {
14406 throw Error( "Should be working on an effect." );
14407 }
14408 }
14409
14410 var _error2 = clearCaughtError();
14411
14412 captureCommitPhaseError(nextEffect, _error2);
14413 nextEffect = nextEffect.nextEffect;
14414 }
14415 }
14416 } while (nextEffect !== null);
14417
14418 nextEffect = null; // Tell Scheduler to yield at the end of the frame, so the browser has an
14419 // opportunity to paint.
14420
14421 requestPaint();
14422
14423 {
14424 popInteractions(prevInteractions);
14425 }
14426
14427 executionContext = prevExecutionContext;
14428 } else {
14429 // No effects.
14430 root.current = finishedWork; // Measure these anyway so the flamegraph explicitly shows that there were
14431 // no effects.
14432 // TODO: Maybe there's a better way to report this.
14433
14434 {
14435 recordCommitTime();
14436 }
14437 }
14438
14439 var rootDidHavePassiveEffects = rootDoesHavePassiveEffects;
14440
14441 if (rootDoesHavePassiveEffects) {
14442 // This commit has passive effects. Stash a reference to them. But don't
14443 // schedule a callback until after flushing layout work.
14444 rootDoesHavePassiveEffects = false;
14445 rootWithPendingPassiveEffects = root;
14446 pendingPassiveEffectsLanes = lanes;
14447 pendingPassiveEffectsRenderPriority = renderPriorityLevel;
14448 } else {
14449 // We are done with the effect chain at this point so let's clear the
14450 // nextEffect pointers to assist with GC. If we have passive effects, we'll
14451 // clear this in flushPassiveEffects.
14452 nextEffect = firstEffect;
14453
14454 while (nextEffect !== null) {
14455 var nextNextEffect = nextEffect.nextEffect;
14456 nextEffect.nextEffect = null;
14457
14458 if (nextEffect.flags & Deletion) {
14459 detachFiberAfterEffects(nextEffect);
14460 }
14461
14462 nextEffect = nextNextEffect;
14463 }
14464 } // Read this again, since an effect might have updated it
14465
14466
14467 remainingLanes = root.pendingLanes; // Check if there's remaining work on this root
14468
14469 if (remainingLanes !== NoLanes) {
14470 {
14471 if (spawnedWorkDuringRender !== null) {
14472 var expirationTimes = spawnedWorkDuringRender;
14473 spawnedWorkDuringRender = null;
14474
14475 for (var i = 0; i < expirationTimes.length; i++) {
14476 scheduleInteractions(root, expirationTimes[i], root.memoizedInteractions);
14477 }
14478 }
14479
14480 schedulePendingInteractions(root, remainingLanes);
14481 }
14482 } else {
14483 // If there's no remaining work, we can clear the set of already failed
14484 // error boundaries.
14485 legacyErrorBoundariesThatAlreadyFailed = null;
14486 }
14487
14488 {
14489 if (!rootDidHavePassiveEffects) {
14490 // If there are no passive effects, then we can complete the pending interactions.
14491 // Otherwise, we'll wait until after the passive effects are flushed.
14492 // Wait to do this until after remaining work has been scheduled,
14493 // so that we don't prematurely signal complete for interactions when there's e.g. hidden work.
14494 finishPendingInteractions(root, lanes);
14495 }
14496 }
14497
14498 if (remainingLanes === SyncLane) {
14499 // Count the number of times the root synchronously re-renders without
14500 // finishing. If there are too many, it indicates an infinite update loop.
14501 if (root === rootWithNestedUpdates) {
14502 nestedUpdateCount++;
14503 } else {
14504 nestedUpdateCount = 0;
14505 rootWithNestedUpdates = root;
14506 }
14507 } else {
14508 nestedUpdateCount = 0;
14509 }
14510
14511 onCommitRoot(finishedWork.stateNode, renderPriorityLevel);
14512 // additional work on this root is scheduled.
14513
14514
14515 ensureRootIsScheduled(root, now());
14516
14517 if (hasUncaughtError) {
14518 hasUncaughtError = false;
14519 var _error3 = firstUncaughtError;
14520 firstUncaughtError = null;
14521 throw _error3;
14522 }
14523
14524 if ((executionContext & LegacyUnbatchedContext) !== NoContext) {
14525 // a ReactDOM.render-ed root inside of batchedUpdates. The commit fired
14526 // synchronously, but layout updates should be deferred until the end
14527 // of the batch.
14528
14529
14530 return null;
14531 } // If layout work was scheduled, flush it now.
14532
14533
14534 flushSyncCallbackQueue();
14535
14536 return null;
14537}
14538
14539function commitBeforeMutationEffects() {
14540 while (nextEffect !== null) {
14541 var current = nextEffect.alternate;
14542
14543 if (!shouldFireAfterActiveInstanceBlur && focusedInstanceHandle !== null) {
14544 if ((nextEffect.flags & Deletion) !== NoFlags) {
14545 if (doesFiberContain(nextEffect, focusedInstanceHandle)) {
14546 shouldFireAfterActiveInstanceBlur = true;
14547 }
14548 } else {
14549 // TODO: Move this out of the hot path using a dedicated effect tag.
14550 if (nextEffect.tag === SuspenseComponent && isSuspenseBoundaryBeingHidden(current, nextEffect) && doesFiberContain(nextEffect, focusedInstanceHandle)) {
14551 shouldFireAfterActiveInstanceBlur = true;
14552 }
14553 }
14554 }
14555
14556 var flags = nextEffect.flags;
14557
14558 if ((flags & Snapshot) !== NoFlags) {
14559 setCurrentFiber(nextEffect);
14560 commitBeforeMutationLifeCycles(current, nextEffect);
14561 resetCurrentFiber();
14562 }
14563
14564 if ((flags & Passive) !== NoFlags) {
14565 // If there are passive effects, schedule a callback to flush at
14566 // the earliest opportunity.
14567 if (!rootDoesHavePassiveEffects) {
14568 rootDoesHavePassiveEffects = true;
14569 scheduleCallback(NormalPriority$1, function () {
14570 flushPassiveEffects();
14571 return null;
14572 });
14573 }
14574 }
14575
14576 nextEffect = nextEffect.nextEffect;
14577 }
14578}
14579
14580function commitMutationEffects(root, renderPriorityLevel) {
14581 // TODO: Should probably move the bulk of this function to commitWork.
14582 while (nextEffect !== null) {
14583 setCurrentFiber(nextEffect);
14584 var flags = nextEffect.flags;
14585
14586 if (flags & ContentReset) {
14587 commitResetTextContent(nextEffect);
14588 }
14589
14590 if (flags & Ref) {
14591 var current = nextEffect.alternate;
14592
14593 if (current !== null) {
14594 commitDetachRef(current);
14595 }
14596 } // The following switch statement is only concerned about placement,
14597 // updates, and deletions. To avoid needing to add a case for every possible
14598 // bitmap value, we remove the secondary effects from the effect tag and
14599 // switch on that value.
14600
14601
14602 var primaryFlags = flags & (Placement | Update | Deletion | Hydrating);
14603
14604 switch (primaryFlags) {
14605 case Placement:
14606 {
14607 commitPlacement(nextEffect); // Clear the "placement" from effect tag so that we know that this is
14608 // inserted, before any life-cycles like componentDidMount gets called.
14609 // TODO: findDOMNode doesn't rely on this any more but isMounted does
14610 // and isMounted is deprecated anyway so we should be able to kill this.
14611
14612 nextEffect.flags &= ~Placement;
14613 break;
14614 }
14615
14616 case PlacementAndUpdate:
14617 {
14618 // Placement
14619 commitPlacement(nextEffect); // Clear the "placement" from effect tag so that we know that this is
14620 // inserted, before any life-cycles like componentDidMount gets called.
14621
14622 nextEffect.flags &= ~Placement; // Update
14623
14624 var _current = nextEffect.alternate;
14625 commitWork(_current, nextEffect);
14626 break;
14627 }
14628
14629 case Hydrating:
14630 {
14631 nextEffect.flags &= ~Hydrating;
14632 break;
14633 }
14634
14635 case HydratingAndUpdate:
14636 {
14637 nextEffect.flags &= ~Hydrating; // Update
14638
14639 var _current2 = nextEffect.alternate;
14640 commitWork(_current2, nextEffect);
14641 break;
14642 }
14643
14644 case Update:
14645 {
14646 var _current3 = nextEffect.alternate;
14647 commitWork(_current3, nextEffect);
14648 break;
14649 }
14650
14651 case Deletion:
14652 {
14653 commitDeletion(root, nextEffect);
14654 break;
14655 }
14656 }
14657
14658 resetCurrentFiber();
14659 nextEffect = nextEffect.nextEffect;
14660 }
14661}
14662
14663function commitLayoutEffects(root, committedLanes) {
14664
14665
14666 while (nextEffect !== null) {
14667 setCurrentFiber(nextEffect);
14668 var flags = nextEffect.flags;
14669
14670 if (flags & (Update | Callback)) {
14671 var current = nextEffect.alternate;
14672 commitLifeCycles(root, current, nextEffect);
14673 }
14674
14675 {
14676 if (flags & Ref) {
14677 commitAttachRef(nextEffect);
14678 }
14679 }
14680
14681 resetCurrentFiber();
14682 nextEffect = nextEffect.nextEffect;
14683 }
14684}
14685
14686function flushPassiveEffects() {
14687 // Returns whether passive effects were flushed.
14688 if (pendingPassiveEffectsRenderPriority !== NoPriority$1) {
14689 var priorityLevel = pendingPassiveEffectsRenderPriority > NormalPriority$1 ? NormalPriority$1 : pendingPassiveEffectsRenderPriority;
14690 pendingPassiveEffectsRenderPriority = NoPriority$1;
14691
14692 {
14693 return runWithPriority(priorityLevel, flushPassiveEffectsImpl);
14694 }
14695 }
14696
14697 return false;
14698}
14699function enqueuePendingPassiveHookEffectMount(fiber, effect) {
14700 pendingPassiveHookEffectsMount.push(effect, fiber);
14701
14702 if (!rootDoesHavePassiveEffects) {
14703 rootDoesHavePassiveEffects = true;
14704 scheduleCallback(NormalPriority$1, function () {
14705 flushPassiveEffects();
14706 return null;
14707 });
14708 }
14709}
14710function enqueuePendingPassiveHookEffectUnmount(fiber, effect) {
14711 pendingPassiveHookEffectsUnmount.push(effect, fiber);
14712
14713 {
14714 fiber.flags |= PassiveUnmountPendingDev;
14715 var alternate = fiber.alternate;
14716
14717 if (alternate !== null) {
14718 alternate.flags |= PassiveUnmountPendingDev;
14719 }
14720 }
14721
14722 if (!rootDoesHavePassiveEffects) {
14723 rootDoesHavePassiveEffects = true;
14724 scheduleCallback(NormalPriority$1, function () {
14725 flushPassiveEffects();
14726 return null;
14727 });
14728 }
14729}
14730
14731function invokePassiveEffectCreate(effect) {
14732 var create = effect.create;
14733 effect.destroy = create();
14734}
14735
14736function flushPassiveEffectsImpl() {
14737 if (rootWithPendingPassiveEffects === null) {
14738 return false;
14739 }
14740
14741 var root = rootWithPendingPassiveEffects;
14742 var lanes = pendingPassiveEffectsLanes;
14743 rootWithPendingPassiveEffects = null;
14744 pendingPassiveEffectsLanes = NoLanes;
14745
14746 if (!((executionContext & (RenderContext | CommitContext)) === NoContext)) {
14747 {
14748 throw Error( "Cannot flush passive effects while already rendering." );
14749 }
14750 }
14751
14752 {
14753 isFlushingPassiveEffects = true;
14754 }
14755
14756 var prevExecutionContext = executionContext;
14757 executionContext |= CommitContext;
14758 var prevInteractions = pushInteractions(root); // It's important that ALL pending passive effect destroy functions are called
14759 // before ANY passive effect create functions are called.
14760 // Otherwise effects in sibling components might interfere with each other.
14761 // e.g. a destroy function in one component may unintentionally override a ref
14762 // value set by a create function in another component.
14763 // Layout effects have the same constraint.
14764 // First pass: Destroy stale passive effects.
14765
14766 var unmountEffects = pendingPassiveHookEffectsUnmount;
14767 pendingPassiveHookEffectsUnmount = [];
14768
14769 for (var i = 0; i < unmountEffects.length; i += 2) {
14770 var _effect = unmountEffects[i];
14771 var fiber = unmountEffects[i + 1];
14772 var destroy = _effect.destroy;
14773 _effect.destroy = undefined;
14774
14775 {
14776 fiber.flags &= ~PassiveUnmountPendingDev;
14777 var alternate = fiber.alternate;
14778
14779 if (alternate !== null) {
14780 alternate.flags &= ~PassiveUnmountPendingDev;
14781 }
14782 }
14783
14784 if (typeof destroy === 'function') {
14785 {
14786 setCurrentFiber(fiber);
14787
14788 {
14789 invokeGuardedCallback(null, destroy, null);
14790 }
14791
14792 if (hasCaughtError()) {
14793 if (!(fiber !== null)) {
14794 {
14795 throw Error( "Should be working on an effect." );
14796 }
14797 }
14798
14799 var error = clearCaughtError();
14800 captureCommitPhaseError(fiber, error);
14801 }
14802
14803 resetCurrentFiber();
14804 }
14805 }
14806 } // Second pass: Create new passive effects.
14807
14808
14809 var mountEffects = pendingPassiveHookEffectsMount;
14810 pendingPassiveHookEffectsMount = [];
14811
14812 for (var _i = 0; _i < mountEffects.length; _i += 2) {
14813 var _effect2 = mountEffects[_i];
14814 var _fiber = mountEffects[_i + 1];
14815
14816 {
14817 setCurrentFiber(_fiber);
14818
14819 {
14820 invokeGuardedCallback(null, invokePassiveEffectCreate, null, _effect2);
14821 }
14822
14823 if (hasCaughtError()) {
14824 if (!(_fiber !== null)) {
14825 {
14826 throw Error( "Should be working on an effect." );
14827 }
14828 }
14829
14830 var _error4 = clearCaughtError();
14831
14832 captureCommitPhaseError(_fiber, _error4);
14833 }
14834
14835 resetCurrentFiber();
14836 }
14837 } // Note: This currently assumes there are no passive effects on the root fiber
14838 // because the root is not part of its own effect list.
14839 // This could change in the future.
14840
14841
14842 var effect = root.current.firstEffect;
14843
14844 while (effect !== null) {
14845 var nextNextEffect = effect.nextEffect; // Remove nextEffect pointer to assist GC
14846
14847 effect.nextEffect = null;
14848
14849 if (effect.flags & Deletion) {
14850 detachFiberAfterEffects(effect);
14851 }
14852
14853 effect = nextNextEffect;
14854 }
14855
14856 {
14857 popInteractions(prevInteractions);
14858 finishPendingInteractions(root, lanes);
14859 }
14860
14861 {
14862 isFlushingPassiveEffects = false;
14863 }
14864
14865 executionContext = prevExecutionContext;
14866 flushSyncCallbackQueue(); // If additional passive effects were scheduled, increment a counter. If this
14867 // exceeds the limit, we'll fire a warning.
14868
14869 nestedPassiveUpdateCount = rootWithPendingPassiveEffects === null ? 0 : nestedPassiveUpdateCount + 1;
14870 return true;
14871}
14872
14873function isAlreadyFailedLegacyErrorBoundary(instance) {
14874 return legacyErrorBoundariesThatAlreadyFailed !== null && legacyErrorBoundariesThatAlreadyFailed.has(instance);
14875}
14876function markLegacyErrorBoundaryAsFailed(instance) {
14877 if (legacyErrorBoundariesThatAlreadyFailed === null) {
14878 legacyErrorBoundariesThatAlreadyFailed = new Set([instance]);
14879 } else {
14880 legacyErrorBoundariesThatAlreadyFailed.add(instance);
14881 }
14882}
14883
14884function prepareToThrowUncaughtError(error) {
14885 if (!hasUncaughtError) {
14886 hasUncaughtError = true;
14887 firstUncaughtError = error;
14888 }
14889}
14890
14891var onUncaughtError = prepareToThrowUncaughtError;
14892
14893function captureCommitPhaseErrorOnRoot(rootFiber, sourceFiber, error) {
14894 var errorInfo = createCapturedValue(error, sourceFiber);
14895 var update = createRootErrorUpdate(rootFiber, errorInfo, SyncLane);
14896 enqueueUpdate(rootFiber, update);
14897 var eventTime = requestEventTime();
14898 var root = markUpdateLaneFromFiberToRoot(rootFiber, SyncLane);
14899
14900 if (root !== null) {
14901 markRootUpdated(root, SyncLane, eventTime);
14902 ensureRootIsScheduled(root, eventTime);
14903 schedulePendingInteractions(root, SyncLane);
14904 }
14905}
14906
14907function captureCommitPhaseError(sourceFiber, error) {
14908 if (sourceFiber.tag === HostRoot) {
14909 // Error was thrown at the root. There is no parent, so the root
14910 // itself should capture it.
14911 captureCommitPhaseErrorOnRoot(sourceFiber, sourceFiber, error);
14912 return;
14913 }
14914
14915 var fiber = sourceFiber.return;
14916
14917 while (fiber !== null) {
14918 if (fiber.tag === HostRoot) {
14919 captureCommitPhaseErrorOnRoot(fiber, sourceFiber, error);
14920 return;
14921 } else if (fiber.tag === ClassComponent) {
14922 var ctor = fiber.type;
14923 var instance = fiber.stateNode;
14924
14925 if (typeof ctor.getDerivedStateFromError === 'function' || typeof instance.componentDidCatch === 'function' && !isAlreadyFailedLegacyErrorBoundary(instance)) {
14926 var errorInfo = createCapturedValue(error, sourceFiber);
14927 var update = createClassErrorUpdate(fiber, errorInfo, SyncLane);
14928 enqueueUpdate(fiber, update);
14929 var eventTime = requestEventTime();
14930 var root = markUpdateLaneFromFiberToRoot(fiber, SyncLane);
14931
14932 if (root !== null) {
14933 markRootUpdated(root, SyncLane, eventTime);
14934 ensureRootIsScheduled(root, eventTime);
14935 schedulePendingInteractions(root, SyncLane);
14936 } else {
14937 // This component has already been unmounted.
14938 // We can't schedule any follow up work for the root because the fiber is already unmounted,
14939 // but we can still call the log-only boundary so the error isn't swallowed.
14940 //
14941 // TODO This is only a temporary bandaid for the old reconciler fork.
14942 // We can delete this special case once the new fork is merged.
14943 if (typeof instance.componentDidCatch === 'function' && !isAlreadyFailedLegacyErrorBoundary(instance)) {
14944 try {
14945 instance.componentDidCatch(error, errorInfo);
14946 } catch (errorToIgnore) {// TODO Ignore this error? Rethrow it?
14947 // This is kind of an edge case.
14948 }
14949 }
14950 }
14951
14952 return;
14953 }
14954 }
14955
14956 fiber = fiber.return;
14957 }
14958}
14959function pingSuspendedRoot(root, wakeable, pingedLanes) {
14960 var pingCache = root.pingCache;
14961
14962 if (pingCache !== null) {
14963 // The wakeable resolved, so we no longer need to memoize, because it will
14964 // never be thrown again.
14965 pingCache.delete(wakeable);
14966 }
14967
14968 var eventTime = requestEventTime();
14969 markRootPinged(root, pingedLanes);
14970
14971 if (workInProgressRoot === root && isSubsetOfLanes(workInProgressRootRenderLanes, pingedLanes)) {
14972 // Received a ping at the same priority level at which we're currently
14973 // rendering. We might want to restart this render. This should mirror
14974 // the logic of whether or not a root suspends once it completes.
14975 // TODO: If we're rendering sync either due to Sync, Batched or expired,
14976 // we should probably never restart.
14977 // If we're suspended with delay, or if it's a retry, we'll always suspend
14978 // so we can always restart.
14979 if (workInProgressRootExitStatus === RootSuspendedWithDelay || workInProgressRootExitStatus === RootSuspended && includesOnlyRetries(workInProgressRootRenderLanes) && now() - globalMostRecentFallbackTime < FALLBACK_THROTTLE_MS) {
14980 // Restart from the root.
14981 prepareFreshStack(root, NoLanes);
14982 } else {
14983 // Even though we can't restart right now, we might get an
14984 // opportunity later. So we mark this render as having a ping.
14985 workInProgressRootPingedLanes = mergeLanes(workInProgressRootPingedLanes, pingedLanes);
14986 }
14987 }
14988
14989 ensureRootIsScheduled(root, eventTime);
14990 schedulePendingInteractions(root, pingedLanes);
14991}
14992
14993function retryTimedOutBoundary(boundaryFiber, retryLane) {
14994 // The boundary fiber (a Suspense component or SuspenseList component)
14995 // previously was rendered in its fallback state. One of the promises that
14996 // suspended it has resolved, which means at least part of the tree was
14997 // likely unblocked. Try rendering again, at a new expiration time.
14998 if (retryLane === NoLane) {
14999 retryLane = requestRetryLane(boundaryFiber);
15000 } // TODO: Special case idle priority?
15001
15002
15003 var eventTime = requestEventTime();
15004 var root = markUpdateLaneFromFiberToRoot(boundaryFiber, retryLane);
15005
15006 if (root !== null) {
15007 markRootUpdated(root, retryLane, eventTime);
15008 ensureRootIsScheduled(root, eventTime);
15009 schedulePendingInteractions(root, retryLane);
15010 }
15011}
15012function resolveRetryWakeable(boundaryFiber, wakeable) {
15013 var retryLane = NoLane; // Default
15014
15015 var retryCache;
15016
15017 {
15018 retryCache = boundaryFiber.stateNode;
15019 }
15020
15021 if (retryCache !== null) {
15022 // The wakeable resolved, so we no longer need to memoize, because it will
15023 // never be thrown again.
15024 retryCache.delete(wakeable);
15025 }
15026
15027 retryTimedOutBoundary(boundaryFiber, retryLane);
15028} // Computes the next Just Noticeable Difference (JND) boundary.
15029// The theory is that a person can't tell the difference between small differences in time.
15030// Therefore, if we wait a bit longer than necessary that won't translate to a noticeable
15031// difference in the experience. However, waiting for longer might mean that we can avoid
15032// showing an intermediate loading state. The longer we have already waited, the harder it
15033// is to tell small differences in time. Therefore, the longer we've already waited,
15034// the longer we can wait additionally. At some point we have to give up though.
15035// We pick a train model where the next boundary commits at a consistent schedule.
15036// These particular numbers are vague estimates. We expect to adjust them based on research.
15037
15038function jnd(timeElapsed) {
15039 return timeElapsed < 120 ? 120 : timeElapsed < 480 ? 480 : timeElapsed < 1080 ? 1080 : timeElapsed < 1920 ? 1920 : timeElapsed < 3000 ? 3000 : timeElapsed < 4320 ? 4320 : ceil(timeElapsed / 1960) * 1960;
15040}
15041
15042function checkForNestedUpdates() {
15043 if (nestedUpdateCount > NESTED_UPDATE_LIMIT) {
15044 nestedUpdateCount = 0;
15045 rootWithNestedUpdates = null;
15046
15047 {
15048 {
15049 throw Error( "Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops." );
15050 }
15051 }
15052 }
15053
15054 {
15055 if (nestedPassiveUpdateCount > NESTED_PASSIVE_UPDATE_LIMIT) {
15056 nestedPassiveUpdateCount = 0;
15057
15058 error('Maximum update depth exceeded. This can happen when a component ' + "calls setState inside useEffect, but useEffect either doesn't " + 'have a dependency array, or one of the dependencies changes on ' + 'every render.');
15059 }
15060 }
15061}
15062
15063function flushRenderPhaseStrictModeWarningsInDEV() {
15064 {
15065 ReactStrictModeWarnings.flushLegacyContextWarning();
15066
15067 {
15068 ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings();
15069 }
15070 }
15071}
15072
15073var didWarnStateUpdateForNotYetMountedComponent = null;
15074
15075function warnAboutUpdateOnNotYetMountedFiberInDEV(fiber) {
15076 {
15077 if ((executionContext & RenderContext) !== NoContext) {
15078 // We let the other warning about render phase updates deal with this one.
15079 return;
15080 }
15081
15082 if (!(fiber.mode & (BlockingMode | ConcurrentMode))) {
15083 return;
15084 }
15085
15086 var tag = fiber.tag;
15087
15088 if (tag !== IndeterminateComponent && tag !== HostRoot && tag !== ClassComponent && tag !== FunctionComponent && tag !== ForwardRef && tag !== MemoComponent && tag !== SimpleMemoComponent && tag !== Block) {
15089 // Only warn for user-defined components, not internal ones like Suspense.
15090 return;
15091 } // We show the whole stack but dedupe on the top component's name because
15092 // the problematic code almost always lies inside that component.
15093
15094
15095 var componentName = getComponentName(fiber.type) || 'ReactComponent';
15096
15097 if (didWarnStateUpdateForNotYetMountedComponent !== null) {
15098 if (didWarnStateUpdateForNotYetMountedComponent.has(componentName)) {
15099 return;
15100 }
15101
15102 didWarnStateUpdateForNotYetMountedComponent.add(componentName);
15103 } else {
15104 didWarnStateUpdateForNotYetMountedComponent = new Set([componentName]);
15105 }
15106
15107 var previousFiber = current;
15108
15109 try {
15110 setCurrentFiber(fiber);
15111
15112 error("Can't perform a React state update on a component that hasn't mounted yet. " + 'This indicates that you have a side-effect in your render function that ' + 'asynchronously later calls tries to update the component. Move this work to ' + 'useEffect instead.');
15113 } finally {
15114 if (previousFiber) {
15115 setCurrentFiber(fiber);
15116 } else {
15117 resetCurrentFiber();
15118 }
15119 }
15120 }
15121}
15122
15123var didWarnStateUpdateForUnmountedComponent = null;
15124
15125function warnAboutUpdateOnUnmountedFiberInDEV(fiber) {
15126 {
15127 var tag = fiber.tag;
15128
15129 if (tag !== HostRoot && tag !== ClassComponent && tag !== FunctionComponent && tag !== ForwardRef && tag !== MemoComponent && tag !== SimpleMemoComponent && tag !== Block) {
15130 // Only warn for user-defined components, not internal ones like Suspense.
15131 return;
15132 } // If there are pending passive effects unmounts for this Fiber,
15133 // we can assume that they would have prevented this update.
15134
15135
15136 if ((fiber.flags & PassiveUnmountPendingDev) !== NoFlags) {
15137 return;
15138 } // We show the whole stack but dedupe on the top component's name because
15139 // the problematic code almost always lies inside that component.
15140
15141
15142 var componentName = getComponentName(fiber.type) || 'ReactComponent';
15143
15144 if (didWarnStateUpdateForUnmountedComponent !== null) {
15145 if (didWarnStateUpdateForUnmountedComponent.has(componentName)) {
15146 return;
15147 }
15148
15149 didWarnStateUpdateForUnmountedComponent.add(componentName);
15150 } else {
15151 didWarnStateUpdateForUnmountedComponent = new Set([componentName]);
15152 }
15153
15154 if (isFlushingPassiveEffects) ; else {
15155 var previousFiber = current;
15156
15157 try {
15158 setCurrentFiber(fiber);
15159
15160 error("Can't perform a React state update on an unmounted component. This " + 'is a no-op, but it indicates a memory leak in your application. To ' + 'fix, cancel all subscriptions and asynchronous tasks in %s.', tag === ClassComponent ? 'the componentWillUnmount method' : 'a useEffect cleanup function');
15161 } finally {
15162 if (previousFiber) {
15163 setCurrentFiber(fiber);
15164 } else {
15165 resetCurrentFiber();
15166 }
15167 }
15168 }
15169 }
15170}
15171
15172var beginWork$1;
15173
15174{
15175 var dummyFiber = null;
15176
15177 beginWork$1 = function (current, unitOfWork, lanes) {
15178 // If a component throws an error, we replay it again in a synchronously
15179 // dispatched event, so that the debugger will treat it as an uncaught
15180 // error See ReactErrorUtils for more information.
15181 // Before entering the begin phase, copy the work-in-progress onto a dummy
15182 // fiber. If beginWork throws, we'll use this to reset the state.
15183 var originalWorkInProgressCopy = assignFiberPropertiesInDEV(dummyFiber, unitOfWork);
15184
15185 try {
15186 return beginWork(current, unitOfWork, lanes);
15187 } catch (originalError) {
15188 if (originalError !== null && typeof originalError === 'object' && typeof originalError.then === 'function') {
15189 // Don't replay promises. Treat everything else like an error.
15190 throw originalError;
15191 } // Keep this code in sync with handleError; any changes here must have
15192 // corresponding changes there.
15193
15194
15195 resetContextDependencies();
15196 resetHooksAfterThrow(); // Don't reset current debug fiber, since we're about to work on the
15197 // same fiber again.
15198 // Unwind the failed stack frame
15199
15200 unwindInterruptedWork(unitOfWork); // Restore the original properties of the fiber.
15201
15202 assignFiberPropertiesInDEV(unitOfWork, originalWorkInProgressCopy);
15203
15204 if ( unitOfWork.mode & ProfileMode) {
15205 // Reset the profiler timer.
15206 startProfilerTimer(unitOfWork);
15207 } // Run beginWork again.
15208
15209
15210 invokeGuardedCallback(null, beginWork, null, current, unitOfWork, lanes);
15211
15212 if (hasCaughtError()) {
15213 var replayError = clearCaughtError(); // `invokeGuardedCallback` sometimes sets an expando `_suppressLogging`.
15214 // Rethrow this error instead of the original one.
15215
15216 throw replayError;
15217 } else {
15218 // This branch is reachable if the render phase is impure.
15219 throw originalError;
15220 }
15221 }
15222 };
15223}
15224
15225var didWarnAboutUpdateInRender = false;
15226var didWarnAboutUpdateInRenderForAnotherComponent;
15227
15228{
15229 didWarnAboutUpdateInRenderForAnotherComponent = new Set();
15230}
15231
15232function warnAboutRenderPhaseUpdatesInDEV(fiber) {
15233 {
15234 if (isRendering && (executionContext & RenderContext) !== NoContext && !getIsUpdatingOpaqueValueInRenderPhaseInDEV()) {
15235 switch (fiber.tag) {
15236 case FunctionComponent:
15237 case ForwardRef:
15238 case SimpleMemoComponent:
15239 {
15240 var renderingComponentName = workInProgress && getComponentName(workInProgress.type) || 'Unknown'; // Dedupe by the rendering component because it's the one that needs to be fixed.
15241
15242 var dedupeKey = renderingComponentName;
15243
15244 if (!didWarnAboutUpdateInRenderForAnotherComponent.has(dedupeKey)) {
15245 didWarnAboutUpdateInRenderForAnotherComponent.add(dedupeKey);
15246 var setStateComponentName = getComponentName(fiber.type) || 'Unknown';
15247
15248 error('Cannot update a component (`%s`) while rendering a ' + 'different component (`%s`). To locate the bad setState() call inside `%s`, ' + 'follow the stack trace as described in https://reactjs.org/link/setstate-in-render', setStateComponentName, renderingComponentName, renderingComponentName);
15249 }
15250
15251 break;
15252 }
15253
15254 case ClassComponent:
15255 {
15256 if (!didWarnAboutUpdateInRender) {
15257 error('Cannot update during an existing state transition (such as ' + 'within `render`). Render methods should be a pure ' + 'function of props and state.');
15258
15259 didWarnAboutUpdateInRender = true;
15260 }
15261
15262 break;
15263 }
15264 }
15265 }
15266 }
15267} // a 'shared' variable that changes when act() opens/closes in tests.
15268
15269var didWarnAboutUnmockedScheduler = false; // TODO Before we release concurrent mode, revisit this and decide whether a mocked
15270// scheduler is the actual recommendation. The alternative could be a testing build,
15271// a new lib, or whatever; we dunno just yet. This message is for early adopters
15272// to get their tests right.
15273
15274function warnIfUnmockedScheduler(fiber) {
15275 {
15276 if (didWarnAboutUnmockedScheduler === false && Scheduler.unstable_flushAllWithoutAsserting === undefined) {
15277 if (fiber.mode & BlockingMode || fiber.mode & ConcurrentMode) {
15278 didWarnAboutUnmockedScheduler = true;
15279
15280 error('In Concurrent or Sync modes, the "scheduler" module needs to be mocked ' + 'to guarantee consistent behaviour across tests and browsers. ' + 'For example, with jest: \n' + // Break up requires to avoid accidentally parsing them as dependencies.
15281 "jest.mock('scheduler', () => require" + "('scheduler/unstable_mock'));\n\n" + 'For more info, visit https://reactjs.org/link/mock-scheduler');
15282 }
15283 }
15284 }
15285}
15286
15287function computeThreadID(root, lane) {
15288 // Interaction threads are unique per root and expiration time.
15289 // NOTE: Intentionally unsound cast. All that matters is that it's a number
15290 // and it represents a batch of work. Could make a helper function instead,
15291 // but meh this is fine for now.
15292 return lane * 1000 + root.interactionThreadID;
15293}
15294
15295function markSpawnedWork(lane) {
15296
15297 if (spawnedWorkDuringRender === null) {
15298 spawnedWorkDuringRender = [lane];
15299 } else {
15300 spawnedWorkDuringRender.push(lane);
15301 }
15302}
15303
15304function scheduleInteractions(root, lane, interactions) {
15305
15306 if (interactions.size > 0) {
15307 var pendingInteractionMap = root.pendingInteractionMap;
15308 var pendingInteractions = pendingInteractionMap.get(lane);
15309
15310 if (pendingInteractions != null) {
15311 interactions.forEach(function (interaction) {
15312 if (!pendingInteractions.has(interaction)) {
15313 // Update the pending async work count for previously unscheduled interaction.
15314 interaction.__count++;
15315 }
15316
15317 pendingInteractions.add(interaction);
15318 });
15319 } else {
15320 pendingInteractionMap.set(lane, new Set(interactions)); // Update the pending async work count for the current interactions.
15321
15322 interactions.forEach(function (interaction) {
15323 interaction.__count++;
15324 });
15325 }
15326
15327 var subscriber = tracing.__subscriberRef.current;
15328
15329 if (subscriber !== null) {
15330 var threadID = computeThreadID(root, lane);
15331 subscriber.onWorkScheduled(interactions, threadID);
15332 }
15333 }
15334}
15335
15336function schedulePendingInteractions(root, lane) {
15337
15338 scheduleInteractions(root, lane, tracing.__interactionsRef.current);
15339}
15340
15341function startWorkOnPendingInteractions(root, lanes) {
15342 // we can accurately attribute time spent working on it, And so that cascading
15343 // work triggered during the render phase will be associated with it.
15344
15345
15346 var interactions = new Set();
15347 root.pendingInteractionMap.forEach(function (scheduledInteractions, scheduledLane) {
15348 if (includesSomeLane(lanes, scheduledLane)) {
15349 scheduledInteractions.forEach(function (interaction) {
15350 return interactions.add(interaction);
15351 });
15352 }
15353 }); // Store the current set of interactions on the FiberRoot for a few reasons:
15354 // We can re-use it in hot functions like performConcurrentWorkOnRoot()
15355 // without having to recalculate it. We will also use it in commitWork() to
15356 // pass to any Profiler onRender() hooks. This also provides DevTools with a
15357 // way to access it when the onCommitRoot() hook is called.
15358
15359 root.memoizedInteractions = interactions;
15360
15361 if (interactions.size > 0) {
15362 var subscriber = tracing.__subscriberRef.current;
15363
15364 if (subscriber !== null) {
15365 var threadID = computeThreadID(root, lanes);
15366
15367 try {
15368 subscriber.onWorkStarted(interactions, threadID);
15369 } catch (error) {
15370 // If the subscriber throws, rethrow it in a separate task
15371 scheduleCallback(ImmediatePriority$1, function () {
15372 throw error;
15373 });
15374 }
15375 }
15376 }
15377}
15378
15379function finishPendingInteractions(root, committedLanes) {
15380
15381 var remainingLanesAfterCommit = root.pendingLanes;
15382 var subscriber;
15383
15384 try {
15385 subscriber = tracing.__subscriberRef.current;
15386
15387 if (subscriber !== null && root.memoizedInteractions.size > 0) {
15388 // FIXME: More than one lane can finish in a single commit.
15389 var threadID = computeThreadID(root, committedLanes);
15390 subscriber.onWorkStopped(root.memoizedInteractions, threadID);
15391 }
15392 } catch (error) {
15393 // If the subscriber throws, rethrow it in a separate task
15394 scheduleCallback(ImmediatePriority$1, function () {
15395 throw error;
15396 });
15397 } finally {
15398 // Clear completed interactions from the pending Map.
15399 // Unless the render was suspended or cascading work was scheduled,
15400 // In which case– leave pending interactions until the subsequent render.
15401 var pendingInteractionMap = root.pendingInteractionMap;
15402 pendingInteractionMap.forEach(function (scheduledInteractions, lane) {
15403 // Only decrement the pending interaction count if we're done.
15404 // If there's still work at the current priority,
15405 // That indicates that we are waiting for suspense data.
15406 if (!includesSomeLane(remainingLanesAfterCommit, lane)) {
15407 pendingInteractionMap.delete(lane);
15408 scheduledInteractions.forEach(function (interaction) {
15409 interaction.__count--;
15410
15411 if (subscriber !== null && interaction.__count === 0) {
15412 try {
15413 subscriber.onInteractionScheduledWorkCompleted(interaction);
15414 } catch (error) {
15415 // If the subscriber throws, rethrow it in a separate task
15416 scheduleCallback(ImmediatePriority$1, function () {
15417 throw error;
15418 });
15419 }
15420 }
15421 });
15422 }
15423 });
15424 }
15425} // `act` testing API
15426
15427function shouldForceFlushFallbacksInDEV() {
15428 // Never force flush in production. This function should get stripped out.
15429 return actingUpdatesScopeDepth > 0;
15430}
15431// so we can tell if any async act() calls try to run in parallel.
15432
15433
15434var actingUpdatesScopeDepth = 0;
15435
15436function detachFiberAfterEffects(fiber) {
15437 fiber.sibling = null;
15438 fiber.stateNode = null;
15439}
15440
15441var resolveFamily = null; // $FlowFixMe Flow gets confused by a WeakSet feature check below.
15442
15443var failedBoundaries = null;
15444var setRefreshHandler = function (handler) {
15445 {
15446 resolveFamily = handler;
15447 }
15448};
15449function resolveFunctionForHotReloading(type) {
15450 {
15451 if (resolveFamily === null) {
15452 // Hot reloading is disabled.
15453 return type;
15454 }
15455
15456 var family = resolveFamily(type);
15457
15458 if (family === undefined) {
15459 return type;
15460 } // Use the latest known implementation.
15461
15462
15463 return family.current;
15464 }
15465}
15466function resolveClassForHotReloading(type) {
15467 // No implementation differences.
15468 return resolveFunctionForHotReloading(type);
15469}
15470function resolveForwardRefForHotReloading(type) {
15471 {
15472 if (resolveFamily === null) {
15473 // Hot reloading is disabled.
15474 return type;
15475 }
15476
15477 var family = resolveFamily(type);
15478
15479 if (family === undefined) {
15480 // Check if we're dealing with a real forwardRef. Don't want to crash early.
15481 if (type !== null && type !== undefined && typeof type.render === 'function') {
15482 // ForwardRef is special because its resolved .type is an object,
15483 // but it's possible that we only have its inner render function in the map.
15484 // If that inner render function is different, we'll build a new forwardRef type.
15485 var currentRender = resolveFunctionForHotReloading(type.render);
15486
15487 if (type.render !== currentRender) {
15488 var syntheticType = {
15489 $$typeof: REACT_FORWARD_REF_TYPE,
15490 render: currentRender
15491 };
15492
15493 if (type.displayName !== undefined) {
15494 syntheticType.displayName = type.displayName;
15495 }
15496
15497 return syntheticType;
15498 }
15499 }
15500
15501 return type;
15502 } // Use the latest known implementation.
15503
15504
15505 return family.current;
15506 }
15507}
15508function isCompatibleFamilyForHotReloading(fiber, element) {
15509 {
15510 if (resolveFamily === null) {
15511 // Hot reloading is disabled.
15512 return false;
15513 }
15514
15515 var prevType = fiber.elementType;
15516 var nextType = element.type; // If we got here, we know types aren't === equal.
15517
15518 var needsCompareFamilies = false;
15519 var $$typeofNextType = typeof nextType === 'object' && nextType !== null ? nextType.$$typeof : null;
15520
15521 switch (fiber.tag) {
15522 case ClassComponent:
15523 {
15524 if (typeof nextType === 'function') {
15525 needsCompareFamilies = true;
15526 }
15527
15528 break;
15529 }
15530
15531 case FunctionComponent:
15532 {
15533 if (typeof nextType === 'function') {
15534 needsCompareFamilies = true;
15535 } else if ($$typeofNextType === REACT_LAZY_TYPE) {
15536 // We don't know the inner type yet.
15537 // We're going to assume that the lazy inner type is stable,
15538 // and so it is sufficient to avoid reconciling it away.
15539 // We're not going to unwrap or actually use the new lazy type.
15540 needsCompareFamilies = true;
15541 }
15542
15543 break;
15544 }
15545
15546 case ForwardRef:
15547 {
15548 if ($$typeofNextType === REACT_FORWARD_REF_TYPE) {
15549 needsCompareFamilies = true;
15550 } else if ($$typeofNextType === REACT_LAZY_TYPE) {
15551 needsCompareFamilies = true;
15552 }
15553
15554 break;
15555 }
15556
15557 case MemoComponent:
15558 case SimpleMemoComponent:
15559 {
15560 if ($$typeofNextType === REACT_MEMO_TYPE) {
15561 // TODO: if it was but can no longer be simple,
15562 // we shouldn't set this.
15563 needsCompareFamilies = true;
15564 } else if ($$typeofNextType === REACT_LAZY_TYPE) {
15565 needsCompareFamilies = true;
15566 }
15567
15568 break;
15569 }
15570
15571 default:
15572 return false;
15573 } // Check if both types have a family and it's the same one.
15574
15575
15576 if (needsCompareFamilies) {
15577 // Note: memo() and forwardRef() we'll compare outer rather than inner type.
15578 // This means both of them need to be registered to preserve state.
15579 // If we unwrapped and compared the inner types for wrappers instead,
15580 // then we would risk falsely saying two separate memo(Foo)
15581 // calls are equivalent because they wrap the same Foo function.
15582 var prevFamily = resolveFamily(prevType);
15583
15584 if (prevFamily !== undefined && prevFamily === resolveFamily(nextType)) {
15585 return true;
15586 }
15587 }
15588
15589 return false;
15590 }
15591}
15592function markFailedErrorBoundaryForHotReloading(fiber) {
15593 {
15594 if (resolveFamily === null) {
15595 // Hot reloading is disabled.
15596 return;
15597 }
15598
15599 if (typeof WeakSet !== 'function') {
15600 return;
15601 }
15602
15603 if (failedBoundaries === null) {
15604 failedBoundaries = new WeakSet();
15605 }
15606
15607 failedBoundaries.add(fiber);
15608 }
15609}
15610var scheduleRefresh = function (root, update) {
15611 {
15612 if (resolveFamily === null) {
15613 // Hot reloading is disabled.
15614 return;
15615 }
15616
15617 var staleFamilies = update.staleFamilies,
15618 updatedFamilies = update.updatedFamilies;
15619 flushPassiveEffects();
15620 flushSync(function () {
15621 scheduleFibersWithFamiliesRecursively(root.current, updatedFamilies, staleFamilies);
15622 });
15623 }
15624};
15625var scheduleRoot = function (root, element) {
15626 {
15627 if (root.context !== emptyContextObject) {
15628 // Super edge case: root has a legacy _renderSubtree context
15629 // but we don't know the parentComponent so we can't pass it.
15630 // Just ignore. We'll delete this with _renderSubtree code path later.
15631 return;
15632 }
15633
15634 flushPassiveEffects();
15635 flushSync(function () {
15636 updateContainer(element, root, null, null);
15637 });
15638 }
15639};
15640
15641function scheduleFibersWithFamiliesRecursively(fiber, updatedFamilies, staleFamilies) {
15642 {
15643 var alternate = fiber.alternate,
15644 child = fiber.child,
15645 sibling = fiber.sibling,
15646 tag = fiber.tag,
15647 type = fiber.type;
15648 var candidateType = null;
15649
15650 switch (tag) {
15651 case FunctionComponent:
15652 case SimpleMemoComponent:
15653 case ClassComponent:
15654 candidateType = type;
15655 break;
15656
15657 case ForwardRef:
15658 candidateType = type.render;
15659 break;
15660 }
15661
15662 if (resolveFamily === null) {
15663 throw new Error('Expected resolveFamily to be set during hot reload.');
15664 }
15665
15666 var needsRender = false;
15667 var needsRemount = false;
15668
15669 if (candidateType !== null) {
15670 var family = resolveFamily(candidateType);
15671
15672 if (family !== undefined) {
15673 if (staleFamilies.has(family)) {
15674 needsRemount = true;
15675 } else if (updatedFamilies.has(family)) {
15676 if (tag === ClassComponent) {
15677 needsRemount = true;
15678 } else {
15679 needsRender = true;
15680 }
15681 }
15682 }
15683 }
15684
15685 if (failedBoundaries !== null) {
15686 if (failedBoundaries.has(fiber) || alternate !== null && failedBoundaries.has(alternate)) {
15687 needsRemount = true;
15688 }
15689 }
15690
15691 if (needsRemount) {
15692 fiber._debugNeedsRemount = true;
15693 }
15694
15695 if (needsRemount || needsRender) {
15696 scheduleUpdateOnFiber(fiber, SyncLane, NoTimestamp);
15697 }
15698
15699 if (child !== null && !needsRemount) {
15700 scheduleFibersWithFamiliesRecursively(child, updatedFamilies, staleFamilies);
15701 }
15702
15703 if (sibling !== null) {
15704 scheduleFibersWithFamiliesRecursively(sibling, updatedFamilies, staleFamilies);
15705 }
15706 }
15707}
15708
15709var findHostInstancesForRefresh = function (root, families) {
15710 {
15711 var hostInstances = new Set();
15712 var types = new Set(families.map(function (family) {
15713 return family.current;
15714 }));
15715 findHostInstancesForMatchingFibersRecursively(root.current, types, hostInstances);
15716 return hostInstances;
15717 }
15718};
15719
15720function findHostInstancesForMatchingFibersRecursively(fiber, types, hostInstances) {
15721 {
15722 var child = fiber.child,
15723 sibling = fiber.sibling,
15724 tag = fiber.tag,
15725 type = fiber.type;
15726 var candidateType = null;
15727
15728 switch (tag) {
15729 case FunctionComponent:
15730 case SimpleMemoComponent:
15731 case ClassComponent:
15732 candidateType = type;
15733 break;
15734
15735 case ForwardRef:
15736 candidateType = type.render;
15737 break;
15738 }
15739
15740 var didMatch = false;
15741
15742 if (candidateType !== null) {
15743 if (types.has(candidateType)) {
15744 didMatch = true;
15745 }
15746 }
15747
15748 if (didMatch) {
15749 // We have a match. This only drills down to the closest host components.
15750 // There's no need to search deeper because for the purpose of giving
15751 // visual feedback, "flashing" outermost parent rectangles is sufficient.
15752 findHostInstancesForFiberShallowly(fiber, hostInstances);
15753 } else {
15754 // If there's no match, maybe there will be one further down in the child tree.
15755 if (child !== null) {
15756 findHostInstancesForMatchingFibersRecursively(child, types, hostInstances);
15757 }
15758 }
15759
15760 if (sibling !== null) {
15761 findHostInstancesForMatchingFibersRecursively(sibling, types, hostInstances);
15762 }
15763 }
15764}
15765
15766function findHostInstancesForFiberShallowly(fiber, hostInstances) {
15767 {
15768 var foundHostInstances = findChildHostInstancesForFiberShallowly(fiber, hostInstances);
15769
15770 if (foundHostInstances) {
15771 return;
15772 } // If we didn't find any host children, fallback to closest host parent.
15773
15774
15775 var node = fiber;
15776
15777 while (true) {
15778 switch (node.tag) {
15779 case HostComponent:
15780 hostInstances.add(node.stateNode);
15781 return;
15782
15783 case HostPortal:
15784 hostInstances.add(node.stateNode.containerInfo);
15785 return;
15786
15787 case HostRoot:
15788 hostInstances.add(node.stateNode.containerInfo);
15789 return;
15790 }
15791
15792 if (node.return === null) {
15793 throw new Error('Expected to reach root first.');
15794 }
15795
15796 node = node.return;
15797 }
15798 }
15799}
15800
15801function findChildHostInstancesForFiberShallowly(fiber, hostInstances) {
15802 {
15803 var node = fiber;
15804 var foundHostInstances = false;
15805
15806 while (true) {
15807 if (node.tag === HostComponent) {
15808 // We got a match.
15809 foundHostInstances = true;
15810 hostInstances.add(node.stateNode); // There may still be more, so keep searching.
15811 } else if (node.child !== null) {
15812 node.child.return = node;
15813 node = node.child;
15814 continue;
15815 }
15816
15817 if (node === fiber) {
15818 return foundHostInstances;
15819 }
15820
15821 while (node.sibling === null) {
15822 if (node.return === null || node.return === fiber) {
15823 return foundHostInstances;
15824 }
15825
15826 node = node.return;
15827 }
15828
15829 node.sibling.return = node.return;
15830 node = node.sibling;
15831 }
15832 }
15833
15834 return false;
15835}
15836
15837var hasBadMapPolyfill;
15838
15839{
15840 hasBadMapPolyfill = false;
15841
15842 try {
15843 var nonExtensibleObject = Object.preventExtensions({});
15844 /* eslint-disable no-new */
15845
15846 new Map([[nonExtensibleObject, null]]);
15847 new Set([nonExtensibleObject]);
15848 /* eslint-enable no-new */
15849 } catch (e) {
15850 // TODO: Consider warning about bad polyfills
15851 hasBadMapPolyfill = true;
15852 }
15853}
15854
15855var debugCounter = 1;
15856
15857function FiberNode(tag, pendingProps, key, mode) {
15858 // Instance
15859 this.tag = tag;
15860 this.key = key;
15861 this.elementType = null;
15862 this.type = null;
15863 this.stateNode = null; // Fiber
15864
15865 this.return = null;
15866 this.child = null;
15867 this.sibling = null;
15868 this.index = 0;
15869 this.ref = null;
15870 this.pendingProps = pendingProps;
15871 this.memoizedProps = null;
15872 this.updateQueue = null;
15873 this.memoizedState = null;
15874 this.dependencies = null;
15875 this.mode = mode; // Effects
15876
15877 this.flags = NoFlags;
15878 this.nextEffect = null;
15879 this.firstEffect = null;
15880 this.lastEffect = null;
15881 this.lanes = NoLanes;
15882 this.childLanes = NoLanes;
15883 this.alternate = null;
15884
15885 {
15886 // Note: The following is done to avoid a v8 performance cliff.
15887 //
15888 // Initializing the fields below to smis and later updating them with
15889 // double values will cause Fibers to end up having separate shapes.
15890 // This behavior/bug has something to do with Object.preventExtension().
15891 // Fortunately this only impacts DEV builds.
15892 // Unfortunately it makes React unusably slow for some applications.
15893 // To work around this, initialize the fields below with doubles.
15894 //
15895 // Learn more about this here:
15896 // https://github.com/facebook/react/issues/14365
15897 // https://bugs.chromium.org/p/v8/issues/detail?id=8538
15898 this.actualDuration = Number.NaN;
15899 this.actualStartTime = Number.NaN;
15900 this.selfBaseDuration = Number.NaN;
15901 this.treeBaseDuration = Number.NaN; // It's okay to replace the initial doubles with smis after initialization.
15902 // This won't trigger the performance cliff mentioned above,
15903 // and it simplifies other profiler code (including DevTools).
15904
15905 this.actualDuration = 0;
15906 this.actualStartTime = -1;
15907 this.selfBaseDuration = 0;
15908 this.treeBaseDuration = 0;
15909 }
15910
15911 {
15912 // This isn't directly used but is handy for debugging internals:
15913 this._debugID = debugCounter++;
15914 this._debugSource = null;
15915 this._debugOwner = null;
15916 this._debugNeedsRemount = false;
15917 this._debugHookTypes = null;
15918
15919 if (!hasBadMapPolyfill && typeof Object.preventExtensions === 'function') {
15920 Object.preventExtensions(this);
15921 }
15922 }
15923} // This is a constructor function, rather than a POJO constructor, still
15924// please ensure we do the following:
15925// 1) Nobody should add any instance methods on this. Instance methods can be
15926// more difficult to predict when they get optimized and they are almost
15927// never inlined properly in static compilers.
15928// 2) Nobody should rely on `instanceof Fiber` for type testing. We should
15929// always know when it is a fiber.
15930// 3) We might want to experiment with using numeric keys since they are easier
15931// to optimize in a non-JIT environment.
15932// 4) We can easily go from a constructor to a createFiber object literal if that
15933// is faster.
15934// 5) It should be easy to port this to a C struct and keep a C implementation
15935// compatible.
15936
15937
15938var createFiber = function (tag, pendingProps, key, mode) {
15939 // $FlowFixMe: the shapes are exact here but Flow doesn't like constructors
15940 return new FiberNode(tag, pendingProps, key, mode);
15941};
15942
15943function shouldConstruct$1(Component) {
15944 var prototype = Component.prototype;
15945 return !!(prototype && prototype.isReactComponent);
15946}
15947
15948function isSimpleFunctionComponent(type) {
15949 return typeof type === 'function' && !shouldConstruct$1(type) && type.defaultProps === undefined;
15950}
15951function resolveLazyComponentTag(Component) {
15952 if (typeof Component === 'function') {
15953 return shouldConstruct$1(Component) ? ClassComponent : FunctionComponent;
15954 } else if (Component !== undefined && Component !== null) {
15955 var $$typeof = Component.$$typeof;
15956
15957 if ($$typeof === REACT_FORWARD_REF_TYPE) {
15958 return ForwardRef;
15959 }
15960
15961 if ($$typeof === REACT_MEMO_TYPE) {
15962 return MemoComponent;
15963 }
15964 }
15965
15966 return IndeterminateComponent;
15967} // This is used to create an alternate fiber to do work on.
15968
15969function createWorkInProgress(current, pendingProps) {
15970 var workInProgress = current.alternate;
15971
15972 if (workInProgress === null) {
15973 // We use a double buffering pooling technique because we know that we'll
15974 // only ever need at most two versions of a tree. We pool the "other" unused
15975 // node that we're free to reuse. This is lazily created to avoid allocating
15976 // extra objects for things that are never updated. It also allow us to
15977 // reclaim the extra memory if needed.
15978 workInProgress = createFiber(current.tag, pendingProps, current.key, current.mode);
15979 workInProgress.elementType = current.elementType;
15980 workInProgress.type = current.type;
15981 workInProgress.stateNode = current.stateNode;
15982
15983 {
15984 // DEV-only fields
15985 workInProgress._debugID = current._debugID;
15986 workInProgress._debugSource = current._debugSource;
15987 workInProgress._debugOwner = current._debugOwner;
15988 workInProgress._debugHookTypes = current._debugHookTypes;
15989 }
15990
15991 workInProgress.alternate = current;
15992 current.alternate = workInProgress;
15993 } else {
15994 workInProgress.pendingProps = pendingProps; // Needed because Blocks store data on type.
15995
15996 workInProgress.type = current.type; // We already have an alternate.
15997 // Reset the effect tag.
15998
15999 workInProgress.flags = NoFlags; // The effect list is no longer valid.
16000
16001 workInProgress.nextEffect = null;
16002 workInProgress.firstEffect = null;
16003 workInProgress.lastEffect = null;
16004
16005 {
16006 // We intentionally reset, rather than copy, actualDuration & actualStartTime.
16007 // This prevents time from endlessly accumulating in new commits.
16008 // This has the downside of resetting values for different priority renders,
16009 // But works for yielding (the common case) and should support resuming.
16010 workInProgress.actualDuration = 0;
16011 workInProgress.actualStartTime = -1;
16012 }
16013 }
16014
16015 workInProgress.childLanes = current.childLanes;
16016 workInProgress.lanes = current.lanes;
16017 workInProgress.child = current.child;
16018 workInProgress.memoizedProps = current.memoizedProps;
16019 workInProgress.memoizedState = current.memoizedState;
16020 workInProgress.updateQueue = current.updateQueue; // Clone the dependencies object. This is mutated during the render phase, so
16021 // it cannot be shared with the current fiber.
16022
16023 var currentDependencies = current.dependencies;
16024 workInProgress.dependencies = currentDependencies === null ? null : {
16025 lanes: currentDependencies.lanes,
16026 firstContext: currentDependencies.firstContext
16027 }; // These will be overridden during the parent's reconciliation
16028
16029 workInProgress.sibling = current.sibling;
16030 workInProgress.index = current.index;
16031 workInProgress.ref = current.ref;
16032
16033 {
16034 workInProgress.selfBaseDuration = current.selfBaseDuration;
16035 workInProgress.treeBaseDuration = current.treeBaseDuration;
16036 }
16037
16038 {
16039 workInProgress._debugNeedsRemount = current._debugNeedsRemount;
16040
16041 switch (workInProgress.tag) {
16042 case IndeterminateComponent:
16043 case FunctionComponent:
16044 case SimpleMemoComponent:
16045 workInProgress.type = resolveFunctionForHotReloading(current.type);
16046 break;
16047
16048 case ClassComponent:
16049 workInProgress.type = resolveClassForHotReloading(current.type);
16050 break;
16051
16052 case ForwardRef:
16053 workInProgress.type = resolveForwardRefForHotReloading(current.type);
16054 break;
16055 }
16056 }
16057
16058 return workInProgress;
16059} // Used to reuse a Fiber for a second pass.
16060
16061function resetWorkInProgress(workInProgress, renderLanes) {
16062 // This resets the Fiber to what createFiber or createWorkInProgress would
16063 // have set the values to before during the first pass. Ideally this wouldn't
16064 // be necessary but unfortunately many code paths reads from the workInProgress
16065 // when they should be reading from current and writing to workInProgress.
16066 // We assume pendingProps, index, key, ref, return are still untouched to
16067 // avoid doing another reconciliation.
16068 // Reset the effect tag but keep any Placement tags, since that's something
16069 // that child fiber is setting, not the reconciliation.
16070 workInProgress.flags &= Placement; // The effect list is no longer valid.
16071
16072 workInProgress.nextEffect = null;
16073 workInProgress.firstEffect = null;
16074 workInProgress.lastEffect = null;
16075 var current = workInProgress.alternate;
16076
16077 if (current === null) {
16078 // Reset to createFiber's initial values.
16079 workInProgress.childLanes = NoLanes;
16080 workInProgress.lanes = renderLanes;
16081 workInProgress.child = null;
16082 workInProgress.memoizedProps = null;
16083 workInProgress.memoizedState = null;
16084 workInProgress.updateQueue = null;
16085 workInProgress.dependencies = null;
16086 workInProgress.stateNode = null;
16087
16088 {
16089 // Note: We don't reset the actualTime counts. It's useful to accumulate
16090 // actual time across multiple render passes.
16091 workInProgress.selfBaseDuration = 0;
16092 workInProgress.treeBaseDuration = 0;
16093 }
16094 } else {
16095 // Reset to the cloned values that createWorkInProgress would've.
16096 workInProgress.childLanes = current.childLanes;
16097 workInProgress.lanes = current.lanes;
16098 workInProgress.child = current.child;
16099 workInProgress.memoizedProps = current.memoizedProps;
16100 workInProgress.memoizedState = current.memoizedState;
16101 workInProgress.updateQueue = current.updateQueue; // Needed because Blocks store data on type.
16102
16103 workInProgress.type = current.type; // Clone the dependencies object. This is mutated during the render phase, so
16104 // it cannot be shared with the current fiber.
16105
16106 var currentDependencies = current.dependencies;
16107 workInProgress.dependencies = currentDependencies === null ? null : {
16108 lanes: currentDependencies.lanes,
16109 firstContext: currentDependencies.firstContext
16110 };
16111
16112 {
16113 // Note: We don't reset the actualTime counts. It's useful to accumulate
16114 // actual time across multiple render passes.
16115 workInProgress.selfBaseDuration = current.selfBaseDuration;
16116 workInProgress.treeBaseDuration = current.treeBaseDuration;
16117 }
16118 }
16119
16120 return workInProgress;
16121}
16122function createHostRootFiber(tag) {
16123 var mode;
16124
16125 if (tag === ConcurrentRoot) {
16126 mode = ConcurrentMode | BlockingMode | StrictMode;
16127 } else if (tag === BlockingRoot) {
16128 mode = BlockingMode | StrictMode;
16129 } else {
16130 mode = NoMode;
16131 }
16132
16133 if ( isDevToolsPresent) {
16134 // Always collect profile timings when DevTools are present.
16135 // This enables DevTools to start capturing timing at any point–
16136 // Without some nodes in the tree having empty base times.
16137 mode |= ProfileMode;
16138 }
16139
16140 return createFiber(HostRoot, null, null, mode);
16141}
16142function createFiberFromTypeAndProps(type, // React$ElementType
16143key, pendingProps, owner, mode, lanes) {
16144 var fiberTag = IndeterminateComponent; // The resolved type is set if we know what the final type will be. I.e. it's not lazy.
16145
16146 var resolvedType = type;
16147
16148 if (typeof type === 'function') {
16149 if (shouldConstruct$1(type)) {
16150 fiberTag = ClassComponent;
16151
16152 {
16153 resolvedType = resolveClassForHotReloading(resolvedType);
16154 }
16155 } else {
16156 {
16157 resolvedType = resolveFunctionForHotReloading(resolvedType);
16158 }
16159 }
16160 } else if (typeof type === 'string') {
16161 fiberTag = HostComponent;
16162 } else {
16163 getTag: switch (type) {
16164 case REACT_FRAGMENT_TYPE:
16165 return createFiberFromFragment(pendingProps.children, mode, lanes, key);
16166
16167 case REACT_DEBUG_TRACING_MODE_TYPE:
16168 fiberTag = Mode;
16169 mode |= DebugTracingMode;
16170 break;
16171
16172 case REACT_STRICT_MODE_TYPE:
16173 fiberTag = Mode;
16174 mode |= StrictMode;
16175 break;
16176
16177 case REACT_PROFILER_TYPE:
16178 return createFiberFromProfiler(pendingProps, mode, lanes, key);
16179
16180 case REACT_SUSPENSE_TYPE:
16181 return createFiberFromSuspense(pendingProps, mode, lanes, key);
16182
16183 case REACT_SUSPENSE_LIST_TYPE:
16184 return createFiberFromSuspenseList(pendingProps, mode, lanes, key);
16185
16186 case REACT_OFFSCREEN_TYPE:
16187 return createFiberFromOffscreen(pendingProps, mode, lanes, key);
16188
16189 case REACT_LEGACY_HIDDEN_TYPE:
16190 return createFiberFromLegacyHidden(pendingProps, mode, lanes, key);
16191
16192 case REACT_SCOPE_TYPE:
16193
16194 // eslint-disable-next-line no-fallthrough
16195
16196 default:
16197 {
16198 if (typeof type === 'object' && type !== null) {
16199 switch (type.$$typeof) {
16200 case REACT_PROVIDER_TYPE:
16201 fiberTag = ContextProvider;
16202 break getTag;
16203
16204 case REACT_CONTEXT_TYPE:
16205 // This is a consumer
16206 fiberTag = ContextConsumer;
16207 break getTag;
16208
16209 case REACT_FORWARD_REF_TYPE:
16210 fiberTag = ForwardRef;
16211
16212 {
16213 resolvedType = resolveForwardRefForHotReloading(resolvedType);
16214 }
16215
16216 break getTag;
16217
16218 case REACT_MEMO_TYPE:
16219 fiberTag = MemoComponent;
16220 break getTag;
16221
16222 case REACT_LAZY_TYPE:
16223 fiberTag = LazyComponent;
16224 resolvedType = null;
16225 break getTag;
16226
16227 case REACT_BLOCK_TYPE:
16228 fiberTag = Block;
16229 break getTag;
16230 }
16231 }
16232
16233 var info = '';
16234
16235 {
16236 if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
16237 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.';
16238 }
16239
16240 var ownerName = owner ? getComponentName(owner.type) : null;
16241
16242 if (ownerName) {
16243 info += '\n\nCheck the render method of `' + ownerName + '`.';
16244 }
16245 }
16246
16247 {
16248 {
16249 throw Error( "Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: " + (type == null ? type : typeof type) + "." + info );
16250 }
16251 }
16252 }
16253 }
16254 }
16255
16256 var fiber = createFiber(fiberTag, pendingProps, key, mode);
16257 fiber.elementType = type;
16258 fiber.type = resolvedType;
16259 fiber.lanes = lanes;
16260
16261 {
16262 fiber._debugOwner = owner;
16263 }
16264
16265 return fiber;
16266}
16267function createFiberFromElement(element, mode, lanes) {
16268 var owner = null;
16269
16270 {
16271 owner = element._owner;
16272 }
16273
16274 var type = element.type;
16275 var key = element.key;
16276 var pendingProps = element.props;
16277 var fiber = createFiberFromTypeAndProps(type, key, pendingProps, owner, mode, lanes);
16278
16279 {
16280 fiber._debugSource = element._source;
16281 fiber._debugOwner = element._owner;
16282 }
16283
16284 return fiber;
16285}
16286function createFiberFromFragment(elements, mode, lanes, key) {
16287 var fiber = createFiber(Fragment, elements, key, mode);
16288 fiber.lanes = lanes;
16289 return fiber;
16290}
16291
16292function createFiberFromProfiler(pendingProps, mode, lanes, key) {
16293 {
16294 if (typeof pendingProps.id !== 'string') {
16295 error('Profiler must specify an "id" as a prop');
16296 }
16297 }
16298
16299 var fiber = createFiber(Profiler, pendingProps, key, mode | ProfileMode); // TODO: The Profiler fiber shouldn't have a type. It has a tag.
16300
16301 fiber.elementType = REACT_PROFILER_TYPE;
16302 fiber.type = REACT_PROFILER_TYPE;
16303 fiber.lanes = lanes;
16304
16305 {
16306 fiber.stateNode = {
16307 effectDuration: 0,
16308 passiveEffectDuration: 0
16309 };
16310 }
16311
16312 return fiber;
16313}
16314
16315function createFiberFromSuspense(pendingProps, mode, lanes, key) {
16316 var fiber = createFiber(SuspenseComponent, pendingProps, key, mode); // TODO: The SuspenseComponent fiber shouldn't have a type. It has a tag.
16317 // This needs to be fixed in getComponentName so that it relies on the tag
16318 // instead.
16319
16320 fiber.type = REACT_SUSPENSE_TYPE;
16321 fiber.elementType = REACT_SUSPENSE_TYPE;
16322 fiber.lanes = lanes;
16323 return fiber;
16324}
16325function createFiberFromSuspenseList(pendingProps, mode, lanes, key) {
16326 var fiber = createFiber(SuspenseListComponent, pendingProps, key, mode);
16327
16328 {
16329 // TODO: The SuspenseListComponent fiber shouldn't have a type. It has a tag.
16330 // This needs to be fixed in getComponentName so that it relies on the tag
16331 // instead.
16332 fiber.type = REACT_SUSPENSE_LIST_TYPE;
16333 }
16334
16335 fiber.elementType = REACT_SUSPENSE_LIST_TYPE;
16336 fiber.lanes = lanes;
16337 return fiber;
16338}
16339function createFiberFromOffscreen(pendingProps, mode, lanes, key) {
16340 var fiber = createFiber(OffscreenComponent, pendingProps, key, mode); // TODO: The OffscreenComponent fiber shouldn't have a type. It has a tag.
16341 // This needs to be fixed in getComponentName so that it relies on the tag
16342 // instead.
16343
16344 {
16345 fiber.type = REACT_OFFSCREEN_TYPE;
16346 }
16347
16348 fiber.elementType = REACT_OFFSCREEN_TYPE;
16349 fiber.lanes = lanes;
16350 return fiber;
16351}
16352function createFiberFromLegacyHidden(pendingProps, mode, lanes, key) {
16353 var fiber = createFiber(LegacyHiddenComponent, pendingProps, key, mode); // TODO: The LegacyHidden fiber shouldn't have a type. It has a tag.
16354 // This needs to be fixed in getComponentName so that it relies on the tag
16355 // instead.
16356
16357 {
16358 fiber.type = REACT_LEGACY_HIDDEN_TYPE;
16359 }
16360
16361 fiber.elementType = REACT_LEGACY_HIDDEN_TYPE;
16362 fiber.lanes = lanes;
16363 return fiber;
16364}
16365function createFiberFromText(content, mode, lanes) {
16366 var fiber = createFiber(HostText, content, null, mode);
16367 fiber.lanes = lanes;
16368 return fiber;
16369}
16370function createFiberFromPortal(portal, mode, lanes) {
16371 var pendingProps = portal.children !== null ? portal.children : [];
16372 var fiber = createFiber(HostPortal, pendingProps, portal.key, mode);
16373 fiber.lanes = lanes;
16374 fiber.stateNode = {
16375 containerInfo: portal.containerInfo,
16376 pendingChildren: null,
16377 // Used by persistent updates
16378 implementation: portal.implementation
16379 };
16380 return fiber;
16381} // Used for stashing WIP properties to replay failed work in DEV.
16382
16383function assignFiberPropertiesInDEV(target, source) {
16384 if (target === null) {
16385 // This Fiber's initial properties will always be overwritten.
16386 // We only use a Fiber to ensure the same hidden class so DEV isn't slow.
16387 target = createFiber(IndeterminateComponent, null, null, NoMode);
16388 } // This is intentionally written as a list of all properties.
16389 // We tried to use Object.assign() instead but this is called in
16390 // the hottest path, and Object.assign() was too slow:
16391 // https://github.com/facebook/react/issues/12502
16392 // This code is DEV-only so size is not a concern.
16393
16394
16395 target.tag = source.tag;
16396 target.key = source.key;
16397 target.elementType = source.elementType;
16398 target.type = source.type;
16399 target.stateNode = source.stateNode;
16400 target.return = source.return;
16401 target.child = source.child;
16402 target.sibling = source.sibling;
16403 target.index = source.index;
16404 target.ref = source.ref;
16405 target.pendingProps = source.pendingProps;
16406 target.memoizedProps = source.memoizedProps;
16407 target.updateQueue = source.updateQueue;
16408 target.memoizedState = source.memoizedState;
16409 target.dependencies = source.dependencies;
16410 target.mode = source.mode;
16411 target.flags = source.flags;
16412 target.nextEffect = source.nextEffect;
16413 target.firstEffect = source.firstEffect;
16414 target.lastEffect = source.lastEffect;
16415 target.lanes = source.lanes;
16416 target.childLanes = source.childLanes;
16417 target.alternate = source.alternate;
16418
16419 {
16420 target.actualDuration = source.actualDuration;
16421 target.actualStartTime = source.actualStartTime;
16422 target.selfBaseDuration = source.selfBaseDuration;
16423 target.treeBaseDuration = source.treeBaseDuration;
16424 }
16425
16426 target._debugID = source._debugID;
16427 target._debugSource = source._debugSource;
16428 target._debugOwner = source._debugOwner;
16429 target._debugNeedsRemount = source._debugNeedsRemount;
16430 target._debugHookTypes = source._debugHookTypes;
16431 return target;
16432}
16433
16434function FiberRootNode(containerInfo, tag, hydrate) {
16435 this.tag = tag;
16436 this.containerInfo = containerInfo;
16437 this.pendingChildren = null;
16438 this.current = null;
16439 this.pingCache = null;
16440 this.finishedWork = null;
16441 this.timeoutHandle = noTimeout;
16442 this.context = null;
16443 this.pendingContext = null;
16444 this.hydrate = hydrate;
16445 this.callbackNode = null;
16446 this.callbackPriority = NoLanePriority;
16447 this.eventTimes = createLaneMap(NoLanes);
16448 this.expirationTimes = createLaneMap(NoTimestamp);
16449 this.pendingLanes = NoLanes;
16450 this.suspendedLanes = NoLanes;
16451 this.pingedLanes = NoLanes;
16452 this.expiredLanes = NoLanes;
16453 this.mutableReadLanes = NoLanes;
16454 this.finishedLanes = NoLanes;
16455 this.entangledLanes = NoLanes;
16456 this.entanglements = createLaneMap(NoLanes);
16457
16458 {
16459 this.interactionThreadID = tracing.unstable_getThreadID();
16460 this.memoizedInteractions = new Set();
16461 this.pendingInteractionMap = new Map();
16462 }
16463
16464 {
16465 switch (tag) {
16466 case BlockingRoot:
16467 this._debugRootType = 'createBlockingRoot()';
16468 break;
16469
16470 case ConcurrentRoot:
16471 this._debugRootType = 'createRoot()';
16472 break;
16473
16474 case LegacyRoot:
16475 this._debugRootType = 'createLegacyRoot()';
16476 break;
16477 }
16478 }
16479}
16480
16481function createFiberRoot(containerInfo, tag, hydrate, hydrationCallbacks) {
16482 var root = new FiberRootNode(containerInfo, tag, hydrate);
16483 // stateNode is any.
16484
16485
16486 var uninitializedFiber = createHostRootFiber(tag);
16487 root.current = uninitializedFiber;
16488 uninitializedFiber.stateNode = root;
16489 initializeUpdateQueue(uninitializedFiber);
16490 return root;
16491}
16492
16493var didWarnAboutNestedUpdates;
16494
16495{
16496 didWarnAboutNestedUpdates = false;
16497}
16498
16499function getContextForSubtree(parentComponent) {
16500 if (!parentComponent) {
16501 return emptyContextObject;
16502 }
16503
16504 var fiber = get(parentComponent);
16505 var parentContext = findCurrentUnmaskedContext(fiber);
16506
16507 if (fiber.tag === ClassComponent) {
16508 var Component = fiber.type;
16509
16510 if (isContextProvider(Component)) {
16511 return processChildContext(fiber, Component, parentContext);
16512 }
16513 }
16514
16515 return parentContext;
16516}
16517
16518function createContainer(containerInfo, tag, hydrate, hydrationCallbacks) {
16519 return createFiberRoot(containerInfo, tag, hydrate);
16520}
16521function updateContainer(element, container, parentComponent, callback) {
16522 {
16523 onScheduleRoot(container, element);
16524 }
16525
16526 var current$1 = container.current;
16527 var eventTime = requestEventTime();
16528
16529 {
16530 // $FlowExpectedError - jest isn't a global, and isn't recognized outside of tests
16531 if ('undefined' !== typeof jest) {
16532 warnIfUnmockedScheduler(current$1);
16533 }
16534 }
16535
16536 var lane = requestUpdateLane(current$1);
16537
16538 var context = getContextForSubtree(parentComponent);
16539
16540 if (container.context === null) {
16541 container.context = context;
16542 } else {
16543 container.pendingContext = context;
16544 }
16545
16546 {
16547 if (isRendering && current !== null && !didWarnAboutNestedUpdates) {
16548 didWarnAboutNestedUpdates = true;
16549
16550 error('Render methods should be a pure function of props and state; ' + 'triggering nested component updates from render is not allowed. ' + 'If necessary, trigger nested updates in componentDidUpdate.\n\n' + 'Check the render method of %s.', getComponentName(current.type) || 'Unknown');
16551 }
16552 }
16553
16554 var update = createUpdate(eventTime, lane); // Caution: React DevTools currently depends on this property
16555 // being called "element".
16556
16557 update.payload = {
16558 element: element
16559 };
16560 callback = callback === undefined ? null : callback;
16561
16562 if (callback !== null) {
16563 {
16564 if (typeof callback !== 'function') {
16565 error('render(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callback);
16566 }
16567 }
16568
16569 update.callback = callback;
16570 }
16571
16572 enqueueUpdate(current$1, update);
16573 scheduleUpdateOnFiber(current$1, lane, eventTime);
16574 return lane;
16575}
16576
16577var shouldSuspendImpl = function (fiber) {
16578 return false;
16579};
16580
16581function shouldSuspend(fiber) {
16582 return shouldSuspendImpl(fiber);
16583}
16584var overrideHookState = null;
16585var overrideHookStateDeletePath = null;
16586var overrideHookStateRenamePath = null;
16587var overrideProps = null;
16588var overridePropsDeletePath = null;
16589var overridePropsRenamePath = null;
16590var scheduleUpdate = null;
16591var setSuspenseHandler = null;
16592
16593{
16594 var copyWithDeleteImpl = function (obj, path, index) {
16595 var key = path[index];
16596 var updated = Array.isArray(obj) ? obj.slice() : _assign({}, obj);
16597
16598 if (index + 1 === path.length) {
16599 if (Array.isArray(updated)) {
16600 updated.splice(key, 1);
16601 } else {
16602 delete updated[key];
16603 }
16604
16605 return updated;
16606 } // $FlowFixMe number or string is fine here
16607
16608
16609 updated[key] = copyWithDeleteImpl(obj[key], path, index + 1);
16610 return updated;
16611 };
16612
16613 var copyWithDelete = function (obj, path) {
16614 return copyWithDeleteImpl(obj, path, 0);
16615 };
16616
16617 var copyWithRenameImpl = function (obj, oldPath, newPath, index) {
16618 var oldKey = oldPath[index];
16619 var updated = Array.isArray(obj) ? obj.slice() : _assign({}, obj);
16620
16621 if (index + 1 === oldPath.length) {
16622 var newKey = newPath[index]; // $FlowFixMe number or string is fine here
16623
16624 updated[newKey] = updated[oldKey];
16625
16626 if (Array.isArray(updated)) {
16627 updated.splice(oldKey, 1);
16628 } else {
16629 delete updated[oldKey];
16630 }
16631 } else {
16632 // $FlowFixMe number or string is fine here
16633 updated[oldKey] = copyWithRenameImpl( // $FlowFixMe number or string is fine here
16634 obj[oldKey], oldPath, newPath, index + 1);
16635 }
16636
16637 return updated;
16638 };
16639
16640 var copyWithRename = function (obj, oldPath, newPath) {
16641 if (oldPath.length !== newPath.length) {
16642 warn('copyWithRename() expects paths of the same length');
16643
16644 return;
16645 } else {
16646 for (var i = 0; i < newPath.length - 1; i++) {
16647 if (oldPath[i] !== newPath[i]) {
16648 warn('copyWithRename() expects paths to be the same except for the deepest key');
16649
16650 return;
16651 }
16652 }
16653 }
16654
16655 return copyWithRenameImpl(obj, oldPath, newPath, 0);
16656 };
16657
16658 var copyWithSetImpl = function (obj, path, index, value) {
16659 if (index >= path.length) {
16660 return value;
16661 }
16662
16663 var key = path[index];
16664 var updated = Array.isArray(obj) ? obj.slice() : _assign({}, obj); // $FlowFixMe number or string is fine here
16665
16666 updated[key] = copyWithSetImpl(obj[key], path, index + 1, value);
16667 return updated;
16668 };
16669
16670 var copyWithSet = function (obj, path, value) {
16671 return copyWithSetImpl(obj, path, 0, value);
16672 };
16673
16674 var findHook = function (fiber, id) {
16675 // For now, the "id" of stateful hooks is just the stateful hook index.
16676 // This may change in the future with e.g. nested hooks.
16677 var currentHook = fiber.memoizedState;
16678
16679 while (currentHook !== null && id > 0) {
16680 currentHook = currentHook.next;
16681 id--;
16682 }
16683
16684 return currentHook;
16685 }; // Support DevTools editable values for useState and useReducer.
16686
16687
16688 overrideHookState = function (fiber, id, path, value) {
16689 var hook = findHook(fiber, id);
16690
16691 if (hook !== null) {
16692 var newState = copyWithSet(hook.memoizedState, path, value);
16693 hook.memoizedState = newState;
16694 hook.baseState = newState; // We aren't actually adding an update to the queue,
16695 // because there is no update we can add for useReducer hooks that won't trigger an error.
16696 // (There's no appropriate action type for DevTools overrides.)
16697 // As a result though, React will see the scheduled update as a noop and bailout.
16698 // Shallow cloning props works as a workaround for now to bypass the bailout check.
16699
16700 fiber.memoizedProps = _assign({}, fiber.memoizedProps);
16701 scheduleUpdateOnFiber(fiber, SyncLane, NoTimestamp);
16702 }
16703 };
16704
16705 overrideHookStateDeletePath = function (fiber, id, path) {
16706 var hook = findHook(fiber, id);
16707
16708 if (hook !== null) {
16709 var newState = copyWithDelete(hook.memoizedState, path);
16710 hook.memoizedState = newState;
16711 hook.baseState = newState; // We aren't actually adding an update to the queue,
16712 // because there is no update we can add for useReducer hooks that won't trigger an error.
16713 // (There's no appropriate action type for DevTools overrides.)
16714 // As a result though, React will see the scheduled update as a noop and bailout.
16715 // Shallow cloning props works as a workaround for now to bypass the bailout check.
16716
16717 fiber.memoizedProps = _assign({}, fiber.memoizedProps);
16718 scheduleUpdateOnFiber(fiber, SyncLane, NoTimestamp);
16719 }
16720 };
16721
16722 overrideHookStateRenamePath = function (fiber, id, oldPath, newPath) {
16723 var hook = findHook(fiber, id);
16724
16725 if (hook !== null) {
16726 var newState = copyWithRename(hook.memoizedState, oldPath, newPath);
16727 hook.memoizedState = newState;
16728 hook.baseState = newState; // We aren't actually adding an update to the queue,
16729 // because there is no update we can add for useReducer hooks that won't trigger an error.
16730 // (There's no appropriate action type for DevTools overrides.)
16731 // As a result though, React will see the scheduled update as a noop and bailout.
16732 // Shallow cloning props works as a workaround for now to bypass the bailout check.
16733
16734 fiber.memoizedProps = _assign({}, fiber.memoizedProps);
16735 scheduleUpdateOnFiber(fiber, SyncLane, NoTimestamp);
16736 }
16737 }; // Support DevTools props for function components, forwardRef, memo, host components, etc.
16738
16739
16740 overrideProps = function (fiber, path, value) {
16741 fiber.pendingProps = copyWithSet(fiber.memoizedProps, path, value);
16742
16743 if (fiber.alternate) {
16744 fiber.alternate.pendingProps = fiber.pendingProps;
16745 }
16746
16747 scheduleUpdateOnFiber(fiber, SyncLane, NoTimestamp);
16748 };
16749
16750 overridePropsDeletePath = function (fiber, path) {
16751 fiber.pendingProps = copyWithDelete(fiber.memoizedProps, path);
16752
16753 if (fiber.alternate) {
16754 fiber.alternate.pendingProps = fiber.pendingProps;
16755 }
16756
16757 scheduleUpdateOnFiber(fiber, SyncLane, NoTimestamp);
16758 };
16759
16760 overridePropsRenamePath = function (fiber, oldPath, newPath) {
16761 fiber.pendingProps = copyWithRename(fiber.memoizedProps, oldPath, newPath);
16762
16763 if (fiber.alternate) {
16764 fiber.alternate.pendingProps = fiber.pendingProps;
16765 }
16766
16767 scheduleUpdateOnFiber(fiber, SyncLane, NoTimestamp);
16768 };
16769
16770 scheduleUpdate = function (fiber) {
16771 scheduleUpdateOnFiber(fiber, SyncLane, NoTimestamp);
16772 };
16773
16774 setSuspenseHandler = function (newShouldSuspendImpl) {
16775 shouldSuspendImpl = newShouldSuspendImpl;
16776 };
16777}
16778
16779function findHostInstanceByFiber(fiber) {
16780 var hostFiber = findCurrentHostFiber(fiber);
16781
16782 if (hostFiber === null) {
16783 return null;
16784 }
16785
16786 return hostFiber.stateNode;
16787}
16788
16789function emptyFindFiberByHostInstance(instance) {
16790 return null;
16791}
16792
16793function getCurrentFiberForDevTools() {
16794 return current;
16795}
16796
16797function injectIntoDevTools(devToolsConfig) {
16798 var findFiberByHostInstance = devToolsConfig.findFiberByHostInstance;
16799 var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
16800 return injectInternals({
16801 bundleType: devToolsConfig.bundleType,
16802 version: devToolsConfig.version,
16803 rendererPackageName: devToolsConfig.rendererPackageName,
16804 rendererConfig: devToolsConfig.rendererConfig,
16805 overrideHookState: overrideHookState,
16806 overrideHookStateDeletePath: overrideHookStateDeletePath,
16807 overrideHookStateRenamePath: overrideHookStateRenamePath,
16808 overrideProps: overrideProps,
16809 overridePropsDeletePath: overridePropsDeletePath,
16810 overridePropsRenamePath: overridePropsRenamePath,
16811 setSuspenseHandler: setSuspenseHandler,
16812 scheduleUpdate: scheduleUpdate,
16813 currentDispatcherRef: ReactCurrentDispatcher,
16814 findHostInstanceByFiber: findHostInstanceByFiber,
16815 findFiberByHostInstance: findFiberByHostInstance || emptyFindFiberByHostInstance,
16816 // React Refresh
16817 findHostInstancesForRefresh: findHostInstancesForRefresh ,
16818 scheduleRefresh: scheduleRefresh ,
16819 scheduleRoot: scheduleRoot ,
16820 setRefreshHandler: setRefreshHandler ,
16821 // Enables DevTools to append owner stacks to error messages in DEV mode.
16822 getCurrentFiber: getCurrentFiberForDevTools
16823 });
16824}
16825
16826Mode$1.setCurrent( // Change to 'art/modes/dom' for easier debugging via SVG
16827FastNoSideEffects);
16828/** Declarative fill-type objects; API design not finalized */
16829
16830var slice = Array.prototype.slice;
16831
16832var LinearGradient = /*#__PURE__*/function () {
16833 function LinearGradient(stops, x1, y1, x2, y2) {
16834 this._args = slice.call(arguments);
16835 }
16836
16837 var _proto = LinearGradient.prototype;
16838
16839 _proto.applyFill = function applyFill(node) {
16840 node.fillLinear.apply(node, this._args);
16841 };
16842
16843 return LinearGradient;
16844}();
16845
16846var RadialGradient = /*#__PURE__*/function () {
16847 function RadialGradient(stops, fx, fy, rx, ry, cx, cy) {
16848 this._args = slice.call(arguments);
16849 }
16850
16851 var _proto2 = RadialGradient.prototype;
16852
16853 _proto2.applyFill = function applyFill(node) {
16854 node.fillRadial.apply(node, this._args);
16855 };
16856
16857 return RadialGradient;
16858}();
16859
16860var Pattern = /*#__PURE__*/function () {
16861 function Pattern(url, width, height, left, top) {
16862 this._args = slice.call(arguments);
16863 }
16864
16865 var _proto3 = Pattern.prototype;
16866
16867 _proto3.applyFill = function applyFill(node) {
16868 node.fillImage.apply(node, this._args);
16869 };
16870
16871 return Pattern;
16872}();
16873/** React Components */
16874
16875
16876var Surface = /*#__PURE__*/function (_React$Component) {
16877 _inheritsLoose(Surface, _React$Component);
16878
16879 function Surface() {
16880 return _React$Component.apply(this, arguments) || this;
16881 }
16882
16883 var _proto4 = Surface.prototype;
16884
16885 _proto4.componentDidMount = function componentDidMount() {
16886 var _this$props = this.props,
16887 height = _this$props.height,
16888 width = _this$props.width;
16889 this._surface = Mode$1.Surface(+width, +height, this._tagRef);
16890 this._mountNode = createContainer(this._surface, LegacyRoot, false);
16891 updateContainer(this.props.children, this._mountNode, this);
16892 };
16893
16894 _proto4.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
16895 var props = this.props;
16896
16897 if (props.height !== prevProps.height || props.width !== prevProps.width) {
16898 this._surface.resize(+props.width, +props.height);
16899 }
16900
16901 updateContainer(this.props.children, this._mountNode, this);
16902
16903 if (this._surface.render) {
16904 this._surface.render();
16905 }
16906 };
16907
16908 _proto4.componentWillUnmount = function componentWillUnmount() {
16909 updateContainer(null, this._mountNode, this);
16910 };
16911
16912 _proto4.render = function render() {
16913 var _this = this;
16914
16915 // This is going to be a placeholder because we don't know what it will
16916 // actually resolve to because ART may render canvas, vml or svg tags here.
16917 // We only allow a subset of properties since others might conflict with
16918 // ART's properties.
16919 var props = this.props; // TODO: ART's Canvas Mode overrides surface title and cursor
16920
16921 var Tag = Mode$1.Surface.tagName;
16922 return /*#__PURE__*/React.createElement(Tag, {
16923 ref: function (ref) {
16924 return _this._tagRef = ref;
16925 },
16926 accessKey: props.accessKey,
16927 className: props.className,
16928 draggable: props.draggable,
16929 role: props.role,
16930 style: props.style,
16931 tabIndex: props.tabIndex,
16932 title: props.title
16933 });
16934 };
16935
16936 return Surface;
16937}(React.Component);
16938
16939var Text = /*#__PURE__*/function (_React$Component2) {
16940 _inheritsLoose(Text, _React$Component2);
16941
16942 function Text(props) {
16943 var _this2;
16944
16945 _this2 = _React$Component2.call(this, props) || this; // We allow reading these props. Ideally we could expose the Text node as
16946 // ref directly.
16947
16948 ['height', 'width', 'x', 'y'].forEach(function (key) {
16949 Object.defineProperty(_assertThisInitialized(_this2), key, {
16950 get: function () {
16951 return this._text ? this._text[key] : undefined;
16952 }
16953 });
16954 });
16955 return _this2;
16956 }
16957
16958 var _proto5 = Text.prototype;
16959
16960 _proto5.render = function render() {
16961 var _this3 = this;
16962
16963 // This means you can't have children that render into strings...
16964 var T = TYPES.TEXT;
16965 return /*#__PURE__*/React.createElement(T, _extends({}, this.props, {
16966 ref: function (t) {
16967 return _this3._text = t;
16968 }
16969 }), childrenAsString(this.props.children));
16970 };
16971
16972 return Text;
16973}(React.Component);
16974
16975injectIntoDevTools({
16976 findFiberByHostInstance: function () {
16977 return null;
16978 },
16979 bundleType: 1 ,
16980 version: ReactVersion,
16981 rendererPackageName: 'react-art'
16982});
16983/** API */
16984
16985var ClippingRectangle = TYPES.CLIPPING_RECTANGLE;
16986var Group = TYPES.GROUP;
16987var Shape = TYPES.SHAPE;
16988var Path = Mode$1.Path;
16989
16990exports.Transform = Transform;
16991exports.ClippingRectangle = ClippingRectangle;
16992exports.Group = Group;
16993exports.LinearGradient = LinearGradient;
16994exports.Path = Path;
16995exports.Pattern = Pattern;
16996exports.RadialGradient = RadialGradient;
16997exports.Shape = Shape;
16998exports.Surface = Surface;
16999exports.Text = Text;
17000 })();
17001}