react-dom 16.6.0-alpha.8af6728 → 16.6.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/react-dom-server.browser.development.js +637 -166
- package/cjs/react-dom-server.browser.production.min.js +37 -35
- package/cjs/react-dom-server.node.development.js +644 -169
- package/cjs/react-dom-server.node.production.min.js +39 -37
- package/cjs/react-dom-test-utils.development.js +18 -58
- package/cjs/react-dom-test-utils.production.min.js +5 -5
- package/cjs/react-dom-unstable-native-dependencies.development.js +11 -50
- package/cjs/react-dom-unstable-native-dependencies.production.min.js +2 -2
- package/cjs/react-dom.development.js +2401 -1042
- package/cjs/react-dom.production.min.js +208 -202
- package/cjs/react-dom.profiling.min.js +229 -220
- package/package.json +21 -4
- package/umd/react-dom-server.browser.development.js +685 -214
- package/umd/react-dom-server.browser.production.min.js +33 -29
- package/umd/react-dom-test-utils.development.js +18 -58
- package/umd/react-dom-test-utils.production.min.js +18 -18
- package/umd/react-dom-unstable-native-dependencies.development.js +11 -50
- package/umd/react-dom-unstable-native-dependencies.production.min.js +2 -2
- package/umd/react-dom.development.js +2402 -1042
- package/umd/react-dom.production.min.js +193 -189
- package/umd/react-dom.profiling.min.js +198 -194
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license React v16.6.
|
|
1
|
+
/** @license React v16.6.1
|
|
2
2
|
* react-dom-server.browser.development.js
|
|
3
3
|
*
|
|
4
4
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
@@ -62,7 +62,7 @@ function invariant(condition, format, a, b, c, d, e, f) {
|
|
|
62
62
|
|
|
63
63
|
// TODO: this is special because it gets imported during build.
|
|
64
64
|
|
|
65
|
-
var ReactVersion = '16.6.
|
|
65
|
+
var ReactVersion = '16.6.3';
|
|
66
66
|
|
|
67
67
|
var ReactInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
|
68
68
|
|
|
@@ -94,63 +94,24 @@ var warningWithoutStack = function () {};
|
|
|
94
94
|
return;
|
|
95
95
|
}
|
|
96
96
|
if (typeof console !== 'undefined') {
|
|
97
|
-
var
|
|
97
|
+
var argsWithFormat = args.map(function (item) {
|
|
98
98
|
return '' + item;
|
|
99
|
-
})
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
f = _args$map[5],
|
|
106
|
-
g = _args$map[6],
|
|
107
|
-
h = _args$map[7];
|
|
108
|
-
|
|
109
|
-
var message = 'Warning: ' + format;
|
|
110
|
-
|
|
111
|
-
// We intentionally don't use spread (or .apply) because it breaks IE9:
|
|
112
|
-
// https://github.com/facebook/react/issues/13610
|
|
113
|
-
switch (args.length) {
|
|
114
|
-
case 0:
|
|
115
|
-
console.error(message);
|
|
116
|
-
break;
|
|
117
|
-
case 1:
|
|
118
|
-
console.error(message, a);
|
|
119
|
-
break;
|
|
120
|
-
case 2:
|
|
121
|
-
console.error(message, a, b);
|
|
122
|
-
break;
|
|
123
|
-
case 3:
|
|
124
|
-
console.error(message, a, b, c);
|
|
125
|
-
break;
|
|
126
|
-
case 4:
|
|
127
|
-
console.error(message, a, b, c, d);
|
|
128
|
-
break;
|
|
129
|
-
case 5:
|
|
130
|
-
console.error(message, a, b, c, d, e);
|
|
131
|
-
break;
|
|
132
|
-
case 6:
|
|
133
|
-
console.error(message, a, b, c, d, e, f);
|
|
134
|
-
break;
|
|
135
|
-
case 7:
|
|
136
|
-
console.error(message, a, b, c, d, e, f, g);
|
|
137
|
-
break;
|
|
138
|
-
case 8:
|
|
139
|
-
console.error(message, a, b, c, d, e, f, g, h);
|
|
140
|
-
break;
|
|
141
|
-
default:
|
|
142
|
-
throw new Error('warningWithoutStack() currently supports at most 8 arguments.');
|
|
143
|
-
}
|
|
99
|
+
});
|
|
100
|
+
argsWithFormat.unshift('Warning: ' + format);
|
|
101
|
+
|
|
102
|
+
// We intentionally don't use spread (or .apply) directly because it
|
|
103
|
+
// breaks IE9: https://github.com/facebook/react/issues/13610
|
|
104
|
+
Function.prototype.apply.call(console.error, console, argsWithFormat);
|
|
144
105
|
}
|
|
145
106
|
try {
|
|
146
107
|
// --- Welcome to debugging React ---
|
|
147
108
|
// This error was thrown as a convenience so that you can use this stack
|
|
148
109
|
// to find the callsite that caused this warning to fire.
|
|
149
110
|
var argIndex = 0;
|
|
150
|
-
var
|
|
111
|
+
var message = 'Warning: ' + format.replace(/%s/g, function () {
|
|
151
112
|
return args[argIndex++];
|
|
152
113
|
});
|
|
153
|
-
throw new Error(
|
|
114
|
+
throw new Error(message);
|
|
154
115
|
} catch (x) {}
|
|
155
116
|
};
|
|
156
117
|
}
|
|
@@ -168,17 +129,23 @@ var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeac
|
|
|
168
129
|
var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
|
|
169
130
|
var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
|
|
170
131
|
var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace;
|
|
132
|
+
|
|
171
133
|
var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
|
|
172
134
|
var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
|
|
173
135
|
var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
|
|
136
|
+
var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
|
|
137
|
+
var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
|
|
174
138
|
|
|
175
139
|
var Resolved = 1;
|
|
176
140
|
|
|
177
141
|
|
|
142
|
+
function refineResolvedLazyComponent(lazyComponent) {
|
|
143
|
+
return lazyComponent._status === Resolved ? lazyComponent._result : null;
|
|
144
|
+
}
|
|
178
145
|
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
return
|
|
146
|
+
function getWrappedName(outerType, innerType, wrapperName) {
|
|
147
|
+
var functionName = innerType.displayName || innerType.name || '';
|
|
148
|
+
return outerType.displayName || (functionName !== '' ? wrapperName + '(' + functionName + ')' : wrapperName);
|
|
182
149
|
}
|
|
183
150
|
|
|
184
151
|
function getComponentName(type) {
|
|
@@ -218,16 +185,17 @@ function getComponentName(type) {
|
|
|
218
185
|
case REACT_PROVIDER_TYPE:
|
|
219
186
|
return 'Context.Provider';
|
|
220
187
|
case REACT_FORWARD_REF_TYPE:
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
return type.
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
188
|
+
return getWrappedName(type, type.render, 'ForwardRef');
|
|
189
|
+
case REACT_MEMO_TYPE:
|
|
190
|
+
return getComponentName(type.type);
|
|
191
|
+
case REACT_LAZY_TYPE:
|
|
192
|
+
{
|
|
193
|
+
var thenable = type;
|
|
194
|
+
var resolvedThenable = refineResolvedLazyComponent(thenable);
|
|
195
|
+
if (resolvedThenable) {
|
|
196
|
+
return getComponentName(resolvedThenable);
|
|
197
|
+
}
|
|
198
|
+
}
|
|
231
199
|
}
|
|
232
200
|
}
|
|
233
201
|
return null;
|
|
@@ -316,6 +284,70 @@ var warning = warningWithoutStack$1;
|
|
|
316
284
|
|
|
317
285
|
var warning$1 = warning;
|
|
318
286
|
|
|
287
|
+
var BEFORE_SLASH_RE = /^(.*)[\\\/]/;
|
|
288
|
+
|
|
289
|
+
var describeComponentFrame = function (name, source, ownerName) {
|
|
290
|
+
var sourceInfo = '';
|
|
291
|
+
if (source) {
|
|
292
|
+
var path = source.fileName;
|
|
293
|
+
var fileName = path.replace(BEFORE_SLASH_RE, '');
|
|
294
|
+
{
|
|
295
|
+
// In DEV, include code for a common special case:
|
|
296
|
+
// prefer "folder/index.js" instead of just "index.js".
|
|
297
|
+
if (/^index\./.test(fileName)) {
|
|
298
|
+
var match = path.match(BEFORE_SLASH_RE);
|
|
299
|
+
if (match) {
|
|
300
|
+
var pathBeforeSlash = match[1];
|
|
301
|
+
if (pathBeforeSlash) {
|
|
302
|
+
var folderName = pathBeforeSlash.replace(BEFORE_SLASH_RE, '');
|
|
303
|
+
fileName = folderName + '/' + fileName;
|
|
304
|
+
}
|
|
305
|
+
}
|
|
306
|
+
}
|
|
307
|
+
}
|
|
308
|
+
sourceInfo = ' (at ' + fileName + ':' + source.lineNumber + ')';
|
|
309
|
+
} else if (ownerName) {
|
|
310
|
+
sourceInfo = ' (created by ' + ownerName + ')';
|
|
311
|
+
}
|
|
312
|
+
return '\n in ' + (name || 'Unknown') + sourceInfo;
|
|
313
|
+
};
|
|
314
|
+
|
|
315
|
+
var enableHooks = false;
|
|
316
|
+
// Helps identify side effects in begin-phase lifecycle hooks and setState reducers:
|
|
317
|
+
|
|
318
|
+
|
|
319
|
+
// In some cases, StrictMode should also double-render lifecycles.
|
|
320
|
+
// This can be confusing for tests though,
|
|
321
|
+
// And it can be bad for performance in production.
|
|
322
|
+
// This feature flag can be used to control the behavior:
|
|
323
|
+
|
|
324
|
+
|
|
325
|
+
// To preserve the "Pause on caught exceptions" behavior of the debugger, we
|
|
326
|
+
// replay the begin phase of a failed component inside invokeGuardedCallback.
|
|
327
|
+
|
|
328
|
+
|
|
329
|
+
// Warn about deprecated, async-unsafe lifecycles; relates to RFC #6:
|
|
330
|
+
var warnAboutDeprecatedLifecycles = false;
|
|
331
|
+
|
|
332
|
+
// Gather advanced timing metrics for Profiler subtrees.
|
|
333
|
+
|
|
334
|
+
|
|
335
|
+
// Trace which interactions trigger each commit.
|
|
336
|
+
|
|
337
|
+
|
|
338
|
+
// Only used in www builds.
|
|
339
|
+
var enableSuspenseServerRenderer = false;
|
|
340
|
+
|
|
341
|
+
// Only used in www builds.
|
|
342
|
+
|
|
343
|
+
|
|
344
|
+
// React Fire: prevent the value and checked attributes from syncing
|
|
345
|
+
// with their related DOM properties
|
|
346
|
+
|
|
347
|
+
|
|
348
|
+
// These APIs will no longer be "unstable" in the upcoming 16.7 release,
|
|
349
|
+
// Control this behavior with a flag to support 16.6 minor releases in the meanwhile.
|
|
350
|
+
|
|
319
351
|
/**
|
|
320
352
|
* Copyright (c) 2013-present, Facebook, Inc.
|
|
321
353
|
*
|
|
@@ -421,64 +453,113 @@ function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
|
|
|
421
453
|
|
|
422
454
|
var checkPropTypes_1 = checkPropTypes;
|
|
423
455
|
|
|
424
|
-
var
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
if (source) {
|
|
429
|
-
var path = source.fileName;
|
|
430
|
-
var fileName = path.replace(BEFORE_SLASH_RE, '');
|
|
431
|
-
{
|
|
432
|
-
// In DEV, include code for a common special case:
|
|
433
|
-
// prefer "folder/index.js" instead of just "index.js".
|
|
434
|
-
if (/^index\./.test(fileName)) {
|
|
435
|
-
var match = path.match(BEFORE_SLASH_RE);
|
|
436
|
-
if (match) {
|
|
437
|
-
var pathBeforeSlash = match[1];
|
|
438
|
-
if (pathBeforeSlash) {
|
|
439
|
-
var folderName = pathBeforeSlash.replace(BEFORE_SLASH_RE, '');
|
|
440
|
-
fileName = folderName + '/' + fileName;
|
|
441
|
-
}
|
|
442
|
-
}
|
|
443
|
-
}
|
|
444
|
-
}
|
|
445
|
-
sourceInfo = ' (at ' + fileName + ':' + source.lineNumber + ')';
|
|
446
|
-
} else if (ownerName) {
|
|
447
|
-
sourceInfo = ' (created by ' + ownerName + ')';
|
|
448
|
-
}
|
|
449
|
-
return '\n in ' + (name || 'Unknown') + sourceInfo;
|
|
450
|
-
};
|
|
451
|
-
|
|
452
|
-
// Helps identify side effects in begin-phase lifecycle hooks and setState reducers:
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
// In some cases, StrictMode should also double-render lifecycles.
|
|
456
|
-
// This can be confusing for tests though,
|
|
457
|
-
// And it can be bad for performance in production.
|
|
458
|
-
// This feature flag can be used to control the behavior:
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
// To preserve the "Pause on caught exceptions" behavior of the debugger, we
|
|
462
|
-
// replay the begin phase of a failed component inside invokeGuardedCallback.
|
|
456
|
+
var ReactDebugCurrentFrame$1 = void 0;
|
|
457
|
+
{
|
|
458
|
+
ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
459
|
+
}
|
|
463
460
|
|
|
461
|
+
var didWarnAboutInvalidateContextType = {};
|
|
464
462
|
|
|
465
|
-
|
|
466
|
-
|
|
463
|
+
var emptyObject = {};
|
|
464
|
+
{
|
|
465
|
+
Object.freeze(emptyObject);
|
|
466
|
+
}
|
|
467
467
|
|
|
468
|
-
|
|
468
|
+
function maskContext(type, context) {
|
|
469
|
+
var contextTypes = type.contextTypes;
|
|
470
|
+
if (!contextTypes) {
|
|
471
|
+
return emptyObject;
|
|
472
|
+
}
|
|
473
|
+
var maskedContext = {};
|
|
474
|
+
for (var contextName in contextTypes) {
|
|
475
|
+
maskedContext[contextName] = context[contextName];
|
|
476
|
+
}
|
|
477
|
+
return maskedContext;
|
|
478
|
+
}
|
|
469
479
|
|
|
480
|
+
function checkContextTypes(typeSpecs, values, location) {
|
|
481
|
+
{
|
|
482
|
+
checkPropTypes_1(typeSpecs, values, location, 'Component', ReactDebugCurrentFrame$1.getCurrentStack);
|
|
483
|
+
}
|
|
484
|
+
}
|
|
470
485
|
|
|
471
|
-
|
|
486
|
+
function validateContextBounds(context, threadID) {
|
|
487
|
+
// If we don't have enough slots in this context to store this threadID,
|
|
488
|
+
// fill it in without leaving any holes to ensure that the VM optimizes
|
|
489
|
+
// this as non-holey index properties.
|
|
490
|
+
for (var i = context._threadCount; i <= threadID; i++) {
|
|
491
|
+
// We assume that this is the same as the defaultValue which might not be
|
|
492
|
+
// true if we're rendering inside a secondary renderer but they are
|
|
493
|
+
// secondary because these use cases are very rare.
|
|
494
|
+
context[i] = context._currentValue2;
|
|
495
|
+
context._threadCount = i + 1;
|
|
496
|
+
}
|
|
497
|
+
}
|
|
472
498
|
|
|
499
|
+
function processContext(type, context, threadID) {
|
|
500
|
+
var contextType = type.contextType;
|
|
501
|
+
if (typeof contextType === 'object' && contextType !== null) {
|
|
502
|
+
{
|
|
503
|
+
if (contextType.$$typeof !== REACT_CONTEXT_TYPE) {
|
|
504
|
+
var name = getComponentName(type) || 'Component';
|
|
505
|
+
if (!didWarnAboutInvalidateContextType[name]) {
|
|
506
|
+
didWarnAboutInvalidateContextType[name] = true;
|
|
507
|
+
warningWithoutStack$1(false, '%s defines an invalid contextType. ' + 'contextType should point to the Context object returned by React.createContext(). ' + 'Did you accidentally pass the Context.Provider instead?', name);
|
|
508
|
+
}
|
|
509
|
+
}
|
|
510
|
+
}
|
|
511
|
+
validateContextBounds(contextType, threadID);
|
|
512
|
+
return contextType[threadID];
|
|
513
|
+
} else {
|
|
514
|
+
var maskedContext = maskContext(type, context);
|
|
515
|
+
{
|
|
516
|
+
if (type.contextTypes) {
|
|
517
|
+
checkContextTypes(type.contextTypes, maskedContext, 'context');
|
|
518
|
+
}
|
|
519
|
+
}
|
|
520
|
+
return maskedContext;
|
|
521
|
+
}
|
|
522
|
+
}
|
|
473
523
|
|
|
474
|
-
//
|
|
475
|
-
|
|
524
|
+
// Allocates a new index for each request. Tries to stay as compact as possible so that these
|
|
525
|
+
// indices can be used to reference a tightly packaged array. As opposed to being used in a Map.
|
|
526
|
+
// The first allocated index is 1.
|
|
476
527
|
|
|
477
|
-
|
|
528
|
+
var nextAvailableThreadIDs = new Uint16Array(16);
|
|
529
|
+
for (var i = 0; i < 15; i++) {
|
|
530
|
+
nextAvailableThreadIDs[i] = i + 1;
|
|
531
|
+
}
|
|
532
|
+
nextAvailableThreadIDs[15] = 0;
|
|
533
|
+
|
|
534
|
+
function growThreadCountAndReturnNextAvailable() {
|
|
535
|
+
var oldArray = nextAvailableThreadIDs;
|
|
536
|
+
var oldSize = oldArray.length;
|
|
537
|
+
var newSize = oldSize * 2;
|
|
538
|
+
!(newSize <= 0x10000) ? invariant(false, 'Maximum number of concurrent React renderers exceeded. This can happen if you are not properly destroying the Readable provided by React. Ensure that you call .destroy() on it if you no longer want to read from it, and did not read to the end. If you use .pipe() this should be automatic.') : void 0;
|
|
539
|
+
var newArray = new Uint16Array(newSize);
|
|
540
|
+
newArray.set(oldArray);
|
|
541
|
+
nextAvailableThreadIDs = newArray;
|
|
542
|
+
nextAvailableThreadIDs[0] = oldSize + 1;
|
|
543
|
+
for (var _i = oldSize; _i < newSize - 1; _i++) {
|
|
544
|
+
nextAvailableThreadIDs[_i] = _i + 1;
|
|
545
|
+
}
|
|
546
|
+
nextAvailableThreadIDs[newSize - 1] = 0;
|
|
547
|
+
return oldSize;
|
|
548
|
+
}
|
|
478
549
|
|
|
550
|
+
function allocThreadID() {
|
|
551
|
+
var nextID = nextAvailableThreadIDs[0];
|
|
552
|
+
if (nextID === 0) {
|
|
553
|
+
return growThreadCountAndReturnNextAvailable();
|
|
554
|
+
}
|
|
555
|
+
nextAvailableThreadIDs[0] = nextAvailableThreadIDs[nextID];
|
|
556
|
+
return nextID;
|
|
557
|
+
}
|
|
479
558
|
|
|
480
|
-
|
|
481
|
-
|
|
559
|
+
function freeThreadID(id) {
|
|
560
|
+
nextAvailableThreadIDs[id] = nextAvailableThreadIDs[0];
|
|
561
|
+
nextAvailableThreadIDs[0] = id;
|
|
562
|
+
}
|
|
482
563
|
|
|
483
564
|
// A reserved attribute.
|
|
484
565
|
// It is handled by React separately and shouldn't be written to the DOM.
|
|
@@ -786,7 +867,7 @@ function escapeHtml(string) {
|
|
|
786
867
|
|
|
787
868
|
var escape = void 0;
|
|
788
869
|
var html = '';
|
|
789
|
-
var index = 0;
|
|
870
|
+
var index = void 0;
|
|
790
871
|
var lastIndex = 0;
|
|
791
872
|
|
|
792
873
|
for (index = match.index; index < str.length; index++) {
|
|
@@ -913,6 +994,297 @@ function createMarkupForCustomAttribute(name, value) {
|
|
|
913
994
|
return name + '=' + quoteAttributeValueForBrowser(value);
|
|
914
995
|
}
|
|
915
996
|
|
|
997
|
+
function areHookInputsEqual(arr1, arr2) {
|
|
998
|
+
// Don't bother comparing lengths in prod because these arrays should be
|
|
999
|
+
// passed inline.
|
|
1000
|
+
{
|
|
1001
|
+
!(arr1.length === arr2.length) ? warning$1(false, 'Detected a variable number of hook dependencies. The length of the ' + 'dependencies array should be constant between renders.\n\n' + 'Previous: %s\n' + 'Incoming: %s', arr1.join(', '), arr2.join(', ')) : void 0;
|
|
1002
|
+
}
|
|
1003
|
+
for (var i = 0; i < arr1.length; i++) {
|
|
1004
|
+
// Inlined Object.is polyfill.
|
|
1005
|
+
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
|
|
1006
|
+
var val1 = arr1[i];
|
|
1007
|
+
var val2 = arr2[i];
|
|
1008
|
+
if (val1 === val2 && (val1 !== 0 || 1 / val1 === 1 / val2) || val1 !== val1 && val2 !== val2 // eslint-disable-line no-self-compare
|
|
1009
|
+
) {
|
|
1010
|
+
continue;
|
|
1011
|
+
}
|
|
1012
|
+
return false;
|
|
1013
|
+
}
|
|
1014
|
+
return true;
|
|
1015
|
+
}
|
|
1016
|
+
|
|
1017
|
+
var currentlyRenderingComponent = null;
|
|
1018
|
+
var firstWorkInProgressHook = null;
|
|
1019
|
+
var workInProgressHook = null;
|
|
1020
|
+
// Whether the work-in-progress hook is a re-rendered hook
|
|
1021
|
+
var isReRender = false;
|
|
1022
|
+
// Whether an update was scheduled during the currently executing render pass.
|
|
1023
|
+
var didScheduleRenderPhaseUpdate = false;
|
|
1024
|
+
// Lazily created map of render-phase updates
|
|
1025
|
+
var renderPhaseUpdates = null;
|
|
1026
|
+
// Counter to prevent infinite loops.
|
|
1027
|
+
var numberOfReRenders = 0;
|
|
1028
|
+
var RE_RENDER_LIMIT = 25;
|
|
1029
|
+
|
|
1030
|
+
function resolveCurrentlyRenderingComponent() {
|
|
1031
|
+
!(currentlyRenderingComponent !== null) ? invariant(false, 'Hooks can only be called inside the body of a function component.') : void 0;
|
|
1032
|
+
return currentlyRenderingComponent;
|
|
1033
|
+
}
|
|
1034
|
+
|
|
1035
|
+
function createHook() {
|
|
1036
|
+
return {
|
|
1037
|
+
memoizedState: null,
|
|
1038
|
+
queue: null,
|
|
1039
|
+
next: null
|
|
1040
|
+
};
|
|
1041
|
+
}
|
|
1042
|
+
|
|
1043
|
+
function createWorkInProgressHook() {
|
|
1044
|
+
if (workInProgressHook === null) {
|
|
1045
|
+
// This is the first hook in the list
|
|
1046
|
+
if (firstWorkInProgressHook === null) {
|
|
1047
|
+
isReRender = false;
|
|
1048
|
+
firstWorkInProgressHook = workInProgressHook = createHook();
|
|
1049
|
+
} else {
|
|
1050
|
+
// There's already a work-in-progress. Reuse it.
|
|
1051
|
+
isReRender = true;
|
|
1052
|
+
workInProgressHook = firstWorkInProgressHook;
|
|
1053
|
+
}
|
|
1054
|
+
} else {
|
|
1055
|
+
if (workInProgressHook.next === null) {
|
|
1056
|
+
isReRender = false;
|
|
1057
|
+
// Append to the end of the list
|
|
1058
|
+
workInProgressHook = workInProgressHook.next = createHook();
|
|
1059
|
+
} else {
|
|
1060
|
+
// There's already a work-in-progress. Reuse it.
|
|
1061
|
+
isReRender = true;
|
|
1062
|
+
workInProgressHook = workInProgressHook.next;
|
|
1063
|
+
}
|
|
1064
|
+
}
|
|
1065
|
+
return workInProgressHook;
|
|
1066
|
+
}
|
|
1067
|
+
|
|
1068
|
+
function prepareToUseHooks(componentIdentity) {
|
|
1069
|
+
currentlyRenderingComponent = componentIdentity;
|
|
1070
|
+
|
|
1071
|
+
// The following should have already been reset
|
|
1072
|
+
// didScheduleRenderPhaseUpdate = false;
|
|
1073
|
+
// firstWorkInProgressHook = null;
|
|
1074
|
+
// numberOfReRenders = 0;
|
|
1075
|
+
// renderPhaseUpdates = null;
|
|
1076
|
+
// workInProgressHook = null;
|
|
1077
|
+
}
|
|
1078
|
+
|
|
1079
|
+
function finishHooks(Component, props, children, refOrContext) {
|
|
1080
|
+
// This must be called after every function component to prevent hooks from
|
|
1081
|
+
// being used in classes.
|
|
1082
|
+
|
|
1083
|
+
while (didScheduleRenderPhaseUpdate) {
|
|
1084
|
+
// Updates were scheduled during the render phase. They are stored in
|
|
1085
|
+
// the `renderPhaseUpdates` map. Call the component again, reusing the
|
|
1086
|
+
// work-in-progress hooks and applying the additional updates on top. Keep
|
|
1087
|
+
// restarting until no more updates are scheduled.
|
|
1088
|
+
didScheduleRenderPhaseUpdate = false;
|
|
1089
|
+
numberOfReRenders += 1;
|
|
1090
|
+
|
|
1091
|
+
// Start over from the beginning of the list
|
|
1092
|
+
workInProgressHook = null;
|
|
1093
|
+
|
|
1094
|
+
children = Component(props, refOrContext);
|
|
1095
|
+
}
|
|
1096
|
+
currentlyRenderingComponent = null;
|
|
1097
|
+
firstWorkInProgressHook = null;
|
|
1098
|
+
numberOfReRenders = 0;
|
|
1099
|
+
renderPhaseUpdates = null;
|
|
1100
|
+
workInProgressHook = null;
|
|
1101
|
+
|
|
1102
|
+
// These were reset above
|
|
1103
|
+
// currentlyRenderingComponent = null;
|
|
1104
|
+
// didScheduleRenderPhaseUpdate = false;
|
|
1105
|
+
// firstWorkInProgressHook = null;
|
|
1106
|
+
// numberOfReRenders = 0;
|
|
1107
|
+
// renderPhaseUpdates = null;
|
|
1108
|
+
// workInProgressHook = null;
|
|
1109
|
+
|
|
1110
|
+
return children;
|
|
1111
|
+
}
|
|
1112
|
+
|
|
1113
|
+
function readContext(context, observedBits) {
|
|
1114
|
+
var threadID = currentThreadID;
|
|
1115
|
+
validateContextBounds(context, threadID);
|
|
1116
|
+
return context[threadID];
|
|
1117
|
+
}
|
|
1118
|
+
|
|
1119
|
+
function useContext(context, observedBits) {
|
|
1120
|
+
resolveCurrentlyRenderingComponent();
|
|
1121
|
+
var threadID = currentThreadID;
|
|
1122
|
+
validateContextBounds(context, threadID);
|
|
1123
|
+
return context[threadID];
|
|
1124
|
+
}
|
|
1125
|
+
|
|
1126
|
+
function basicStateReducer(state, action) {
|
|
1127
|
+
return typeof action === 'function' ? action(state) : action;
|
|
1128
|
+
}
|
|
1129
|
+
|
|
1130
|
+
function useState(initialState) {
|
|
1131
|
+
return useReducer(basicStateReducer,
|
|
1132
|
+
// useReducer has a special case to support lazy useState initializers
|
|
1133
|
+
initialState);
|
|
1134
|
+
}
|
|
1135
|
+
|
|
1136
|
+
function useReducer(reducer, initialState, initialAction) {
|
|
1137
|
+
currentlyRenderingComponent = resolveCurrentlyRenderingComponent();
|
|
1138
|
+
workInProgressHook = createWorkInProgressHook();
|
|
1139
|
+
if (isReRender) {
|
|
1140
|
+
// This is a re-render. Apply the new render phase updates to the previous
|
|
1141
|
+
var _queue = workInProgressHook.queue;
|
|
1142
|
+
var _dispatch = _queue.dispatch;
|
|
1143
|
+
if (renderPhaseUpdates !== null) {
|
|
1144
|
+
// Render phase updates are stored in a map of queue -> linked list
|
|
1145
|
+
var firstRenderPhaseUpdate = renderPhaseUpdates.get(_queue);
|
|
1146
|
+
if (firstRenderPhaseUpdate !== undefined) {
|
|
1147
|
+
renderPhaseUpdates.delete(_queue);
|
|
1148
|
+
var newState = workInProgressHook.memoizedState;
|
|
1149
|
+
var update = firstRenderPhaseUpdate;
|
|
1150
|
+
do {
|
|
1151
|
+
// Process this render phase update. We don't have to check the
|
|
1152
|
+
// priority because it will always be the same as the current
|
|
1153
|
+
// render's.
|
|
1154
|
+
var _action = update.action;
|
|
1155
|
+
newState = reducer(newState, _action);
|
|
1156
|
+
update = update.next;
|
|
1157
|
+
} while (update !== null);
|
|
1158
|
+
|
|
1159
|
+
workInProgressHook.memoizedState = newState;
|
|
1160
|
+
|
|
1161
|
+
return [newState, _dispatch];
|
|
1162
|
+
}
|
|
1163
|
+
}
|
|
1164
|
+
return [workInProgressHook.memoizedState, _dispatch];
|
|
1165
|
+
} else {
|
|
1166
|
+
if (reducer === basicStateReducer) {
|
|
1167
|
+
// Special case for `useState`.
|
|
1168
|
+
if (typeof initialState === 'function') {
|
|
1169
|
+
initialState = initialState();
|
|
1170
|
+
}
|
|
1171
|
+
} else if (initialAction !== undefined && initialAction !== null) {
|
|
1172
|
+
initialState = reducer(initialState, initialAction);
|
|
1173
|
+
}
|
|
1174
|
+
workInProgressHook.memoizedState = initialState;
|
|
1175
|
+
var _queue2 = workInProgressHook.queue = {
|
|
1176
|
+
last: null,
|
|
1177
|
+
dispatch: null
|
|
1178
|
+
};
|
|
1179
|
+
var _dispatch2 = _queue2.dispatch = dispatchAction.bind(null, currentlyRenderingComponent, _queue2);
|
|
1180
|
+
return [workInProgressHook.memoizedState, _dispatch2];
|
|
1181
|
+
}
|
|
1182
|
+
}
|
|
1183
|
+
|
|
1184
|
+
function useMemo(nextCreate, inputs) {
|
|
1185
|
+
currentlyRenderingComponent = resolveCurrentlyRenderingComponent();
|
|
1186
|
+
workInProgressHook = createWorkInProgressHook();
|
|
1187
|
+
|
|
1188
|
+
var nextInputs = inputs !== undefined && inputs !== null ? inputs : [nextCreate];
|
|
1189
|
+
|
|
1190
|
+
if (workInProgressHook !== null && workInProgressHook.memoizedState !== null) {
|
|
1191
|
+
var prevState = workInProgressHook.memoizedState;
|
|
1192
|
+
var prevInputs = prevState[1];
|
|
1193
|
+
if (areHookInputsEqual(nextInputs, prevInputs)) {
|
|
1194
|
+
return prevState[0];
|
|
1195
|
+
}
|
|
1196
|
+
}
|
|
1197
|
+
|
|
1198
|
+
var nextValue = nextCreate();
|
|
1199
|
+
workInProgressHook.memoizedState = [nextValue, nextInputs];
|
|
1200
|
+
return nextValue;
|
|
1201
|
+
}
|
|
1202
|
+
|
|
1203
|
+
function useRef(initialValue) {
|
|
1204
|
+
currentlyRenderingComponent = resolveCurrentlyRenderingComponent();
|
|
1205
|
+
workInProgressHook = createWorkInProgressHook();
|
|
1206
|
+
var previousRef = workInProgressHook.memoizedState;
|
|
1207
|
+
if (previousRef === null) {
|
|
1208
|
+
var ref = { current: initialValue };
|
|
1209
|
+
{
|
|
1210
|
+
Object.seal(ref);
|
|
1211
|
+
}
|
|
1212
|
+
workInProgressHook.memoizedState = ref;
|
|
1213
|
+
return ref;
|
|
1214
|
+
} else {
|
|
1215
|
+
return previousRef;
|
|
1216
|
+
}
|
|
1217
|
+
}
|
|
1218
|
+
|
|
1219
|
+
function useMutationEffect(create, inputs) {
|
|
1220
|
+
warning$1(false, 'useMutationEffect does nothing on the server, because its effect cannot ' + "be encoded into the server renderer's output format. This will lead " + 'to a mismatch between the initial, non-hydrated UI and the intended ' + 'UI. To avoid this, useMutationEffect should only be used in ' + 'components that render exclusively on the client.');
|
|
1221
|
+
}
|
|
1222
|
+
|
|
1223
|
+
function useLayoutEffect(create, inputs) {
|
|
1224
|
+
warning$1(false, 'useLayoutEffect does nothing on the server, because its effect cannot ' + "be encoded into the server renderer's output format. This will lead " + 'to a mismatch between the initial, non-hydrated UI and the intended ' + 'UI. To avoid this, useLayoutEffect should only be used in ' + 'components that render exclusively on the client.');
|
|
1225
|
+
}
|
|
1226
|
+
|
|
1227
|
+
function dispatchAction(componentIdentity, queue, action) {
|
|
1228
|
+
!(numberOfReRenders < RE_RENDER_LIMIT) ? invariant(false, 'Too many re-renders. React limits the number of renders to prevent an infinite loop.') : void 0;
|
|
1229
|
+
|
|
1230
|
+
if (componentIdentity === currentlyRenderingComponent) {
|
|
1231
|
+
// This is a render phase update. Stash it in a lazily-created map of
|
|
1232
|
+
// queue -> linked list of updates. After this render pass, we'll restart
|
|
1233
|
+
// and apply the stashed updates on top of the work-in-progress hook.
|
|
1234
|
+
didScheduleRenderPhaseUpdate = true;
|
|
1235
|
+
var update = {
|
|
1236
|
+
action: action,
|
|
1237
|
+
next: null
|
|
1238
|
+
};
|
|
1239
|
+
if (renderPhaseUpdates === null) {
|
|
1240
|
+
renderPhaseUpdates = new Map();
|
|
1241
|
+
}
|
|
1242
|
+
var firstRenderPhaseUpdate = renderPhaseUpdates.get(queue);
|
|
1243
|
+
if (firstRenderPhaseUpdate === undefined) {
|
|
1244
|
+
renderPhaseUpdates.set(queue, update);
|
|
1245
|
+
} else {
|
|
1246
|
+
// Append the update to the end of the list.
|
|
1247
|
+
var lastRenderPhaseUpdate = firstRenderPhaseUpdate;
|
|
1248
|
+
while (lastRenderPhaseUpdate.next !== null) {
|
|
1249
|
+
lastRenderPhaseUpdate = lastRenderPhaseUpdate.next;
|
|
1250
|
+
}
|
|
1251
|
+
lastRenderPhaseUpdate.next = update;
|
|
1252
|
+
}
|
|
1253
|
+
} else {
|
|
1254
|
+
// This means an update has happened after the function component has
|
|
1255
|
+
// returned. On the server this is a no-op. In React Fiber, the update
|
|
1256
|
+
// would be scheduled for a future render.
|
|
1257
|
+
}
|
|
1258
|
+
}
|
|
1259
|
+
|
|
1260
|
+
function noop() {}
|
|
1261
|
+
|
|
1262
|
+
var currentThreadID = 0;
|
|
1263
|
+
|
|
1264
|
+
function setCurrentThreadID(threadID) {
|
|
1265
|
+
currentThreadID = threadID;
|
|
1266
|
+
}
|
|
1267
|
+
|
|
1268
|
+
var Dispatcher = {
|
|
1269
|
+
readContext: readContext,
|
|
1270
|
+
useContext: useContext,
|
|
1271
|
+
useMemo: useMemo,
|
|
1272
|
+
useReducer: useReducer,
|
|
1273
|
+
useRef: useRef,
|
|
1274
|
+
useState: useState,
|
|
1275
|
+
useMutationEffect: useMutationEffect,
|
|
1276
|
+
useLayoutEffect: useLayoutEffect,
|
|
1277
|
+
// useImperativeMethods is not run in the server environment
|
|
1278
|
+
useImperativeMethods: noop,
|
|
1279
|
+
// Callbacks are not run in the server environment.
|
|
1280
|
+
useCallback: noop,
|
|
1281
|
+
// Effects are not run in the server environment.
|
|
1282
|
+
useEffect: noop
|
|
1283
|
+
};
|
|
1284
|
+
var DispatcherWithoutHooks = {
|
|
1285
|
+
readContext: readContext
|
|
1286
|
+
};
|
|
1287
|
+
|
|
916
1288
|
var HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
|
|
917
1289
|
var MATH_NAMESPACE = 'http://www.w3.org/1998/Math/MathML';
|
|
918
1290
|
var SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
|
|
@@ -948,14 +1320,14 @@ function getChildNamespace(parentNamespace, type) {
|
|
|
948
1320
|
return parentNamespace;
|
|
949
1321
|
}
|
|
950
1322
|
|
|
951
|
-
var ReactDebugCurrentFrame$
|
|
1323
|
+
var ReactDebugCurrentFrame$2 = null;
|
|
952
1324
|
|
|
953
1325
|
var ReactControlledValuePropTypes = {
|
|
954
1326
|
checkPropTypes: null
|
|
955
1327
|
};
|
|
956
1328
|
|
|
957
1329
|
{
|
|
958
|
-
ReactDebugCurrentFrame$
|
|
1330
|
+
ReactDebugCurrentFrame$2 = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
959
1331
|
|
|
960
1332
|
var hasReadOnlyValue = {
|
|
961
1333
|
button: true,
|
|
@@ -987,7 +1359,7 @@ var ReactControlledValuePropTypes = {
|
|
|
987
1359
|
* this outside of the ReactDOM controlled form components.
|
|
988
1360
|
*/
|
|
989
1361
|
ReactControlledValuePropTypes.checkPropTypes = function (tagName, props) {
|
|
990
|
-
checkPropTypes_1(propTypes, props, 'prop', tagName, ReactDebugCurrentFrame$
|
|
1362
|
+
checkPropTypes_1(propTypes, props, 'prop', tagName, ReactDebugCurrentFrame$2.getStackAddendum);
|
|
991
1363
|
};
|
|
992
1364
|
}
|
|
993
1365
|
|
|
@@ -1024,9 +1396,9 @@ var voidElementTags = _assign({
|
|
|
1024
1396
|
// or add stack by default to invariants where possible.
|
|
1025
1397
|
var HTML = '__html';
|
|
1026
1398
|
|
|
1027
|
-
var ReactDebugCurrentFrame$
|
|
1399
|
+
var ReactDebugCurrentFrame$3 = null;
|
|
1028
1400
|
{
|
|
1029
|
-
ReactDebugCurrentFrame$
|
|
1401
|
+
ReactDebugCurrentFrame$3 = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
1030
1402
|
}
|
|
1031
1403
|
|
|
1032
1404
|
function assertValidProps(tag, props) {
|
|
@@ -1035,7 +1407,7 @@ function assertValidProps(tag, props) {
|
|
|
1035
1407
|
}
|
|
1036
1408
|
// Note the use of `==` which checks for null or undefined.
|
|
1037
1409
|
if (voidElementTags[tag]) {
|
|
1038
|
-
!(props.children == null && props.dangerouslySetInnerHTML == null) ? invariant(false, '%s is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`.%s', tag, ReactDebugCurrentFrame$
|
|
1410
|
+
!(props.children == null && props.dangerouslySetInnerHTML == null) ? invariant(false, '%s is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`.%s', tag, ReactDebugCurrentFrame$3.getStackAddendum()) : void 0;
|
|
1039
1411
|
}
|
|
1040
1412
|
if (props.dangerouslySetInnerHTML != null) {
|
|
1041
1413
|
!(props.children == null) ? invariant(false, 'Can only set one of `children` or `props.dangerouslySetInnerHTML`.') : void 0;
|
|
@@ -1044,7 +1416,7 @@ function assertValidProps(tag, props) {
|
|
|
1044
1416
|
{
|
|
1045
1417
|
!(props.suppressContentEditableWarning || !props.contentEditable || props.children == null) ? warning$1(false, 'A component is `contentEditable` and contains `children` managed by ' + 'React. It is now your responsibility to guarantee that none of ' + 'those nodes are unexpectedly modified or duplicated. This is ' + 'probably not intentional.') : void 0;
|
|
1046
1418
|
}
|
|
1047
|
-
!(props.style == null || typeof props.style === 'object') ? invariant(false, 'The `style` prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + \'em\'}} when using JSX.%s', ReactDebugCurrentFrame$
|
|
1419
|
+
!(props.style == null || typeof props.style === 'object') ? invariant(false, 'The `style` prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + \'em\'}} when using JSX.%s', ReactDebugCurrentFrame$3.getStackAddendum()) : void 0;
|
|
1048
1420
|
}
|
|
1049
1421
|
|
|
1050
1422
|
/**
|
|
@@ -2153,6 +2525,7 @@ var toArray = React.Children.toArray;
|
|
|
2153
2525
|
// Each stack is an array of frames which may contain nested stacks of elements.
|
|
2154
2526
|
var currentDebugStacks = [];
|
|
2155
2527
|
|
|
2528
|
+
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
|
|
2156
2529
|
var ReactDebugCurrentFrame = void 0;
|
|
2157
2530
|
var prevGetCurrentStackImpl = null;
|
|
2158
2531
|
var getCurrentServerStackImpl = function () {
|
|
@@ -2166,6 +2539,7 @@ var validatePropertiesInDevelopment = function (type, props) {};
|
|
|
2166
2539
|
var pushCurrentDebugStack = function (stack) {};
|
|
2167
2540
|
var pushElementToDebugStack = function (element) {};
|
|
2168
2541
|
var popCurrentDebugStack = function () {};
|
|
2542
|
+
var hasWarnedAboutUsingContextAsConsumer = false;
|
|
2169
2543
|
|
|
2170
2544
|
{
|
|
2171
2545
|
ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
@@ -2376,39 +2750,6 @@ function flattenOptionChildren(children) {
|
|
|
2376
2750
|
return content;
|
|
2377
2751
|
}
|
|
2378
2752
|
|
|
2379
|
-
var emptyObject = {};
|
|
2380
|
-
{
|
|
2381
|
-
Object.freeze(emptyObject);
|
|
2382
|
-
}
|
|
2383
|
-
|
|
2384
|
-
function maskContext(type, context) {
|
|
2385
|
-
var contextTypes = type.contextTypes;
|
|
2386
|
-
if (!contextTypes) {
|
|
2387
|
-
return emptyObject;
|
|
2388
|
-
}
|
|
2389
|
-
var maskedContext = {};
|
|
2390
|
-
for (var contextName in contextTypes) {
|
|
2391
|
-
maskedContext[contextName] = context[contextName];
|
|
2392
|
-
}
|
|
2393
|
-
return maskedContext;
|
|
2394
|
-
}
|
|
2395
|
-
|
|
2396
|
-
function checkContextTypes(typeSpecs, values, location) {
|
|
2397
|
-
{
|
|
2398
|
-
checkPropTypes_1(typeSpecs, values, location, 'Component', getCurrentServerStackImpl);
|
|
2399
|
-
}
|
|
2400
|
-
}
|
|
2401
|
-
|
|
2402
|
-
function processContext(type, context) {
|
|
2403
|
-
var maskedContext = maskContext(type, context);
|
|
2404
|
-
{
|
|
2405
|
-
if (type.contextTypes) {
|
|
2406
|
-
checkContextTypes(type.contextTypes, maskedContext, 'context');
|
|
2407
|
-
}
|
|
2408
|
-
}
|
|
2409
|
-
return maskedContext;
|
|
2410
|
-
}
|
|
2411
|
-
|
|
2412
2753
|
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
|
2413
2754
|
var STYLE = 'style';
|
|
2414
2755
|
var RESERVED_PROPS = {
|
|
@@ -2463,7 +2804,7 @@ function validateRenderResult(child, type) {
|
|
|
2463
2804
|
}
|
|
2464
2805
|
}
|
|
2465
2806
|
|
|
2466
|
-
function resolve(child, context) {
|
|
2807
|
+
function resolve(child, context, threadID) {
|
|
2467
2808
|
while (React.isValidElement(child)) {
|
|
2468
2809
|
// Safe because we just checked it's an element.
|
|
2469
2810
|
var element = child;
|
|
@@ -2479,7 +2820,7 @@ function resolve(child, context) {
|
|
|
2479
2820
|
|
|
2480
2821
|
// Extra closure so queue and replace can be captured properly
|
|
2481
2822
|
function processChild(element, Component) {
|
|
2482
|
-
var publicContext = processContext(Component, context);
|
|
2823
|
+
var publicContext = processContext(Component, context, threadID);
|
|
2483
2824
|
|
|
2484
2825
|
var queue = [];
|
|
2485
2826
|
var replace = false;
|
|
@@ -2548,7 +2889,11 @@ function resolve(child, context) {
|
|
|
2548
2889
|
}
|
|
2549
2890
|
}
|
|
2550
2891
|
}
|
|
2892
|
+
var componentIdentity = {};
|
|
2893
|
+
prepareToUseHooks(componentIdentity);
|
|
2551
2894
|
inst = Component(element.props, publicContext, updater);
|
|
2895
|
+
inst = finishHooks(Component, element.props, inst, publicContext);
|
|
2896
|
+
|
|
2552
2897
|
if (inst == null || inst.render == null) {
|
|
2553
2898
|
child = inst;
|
|
2554
2899
|
validateRenderResult(child, Component);
|
|
@@ -2650,6 +2995,7 @@ function resolve(child, context) {
|
|
|
2650
2995
|
var ReactDOMServerRenderer = function () {
|
|
2651
2996
|
// DEV-only
|
|
2652
2997
|
|
|
2998
|
+
// TODO: type this more strictly:
|
|
2653
2999
|
function ReactDOMServerRenderer(children, makeStaticMarkup) {
|
|
2654
3000
|
_classCallCheck(this, ReactDOMServerRenderer);
|
|
2655
3001
|
|
|
@@ -2668,11 +3014,13 @@ var ReactDOMServerRenderer = function () {
|
|
|
2668
3014
|
{
|
|
2669
3015
|
topFrame.debugElementStack = [];
|
|
2670
3016
|
}
|
|
3017
|
+
this.threadID = allocThreadID();
|
|
2671
3018
|
this.stack = [topFrame];
|
|
2672
3019
|
this.exhausted = false;
|
|
2673
3020
|
this.currentSelectValue = null;
|
|
2674
3021
|
this.previousWasTextNode = false;
|
|
2675
3022
|
this.makeStaticMarkup = makeStaticMarkup;
|
|
3023
|
+
this.suspenseDepth = 0;
|
|
2676
3024
|
|
|
2677
3025
|
// Context (new API)
|
|
2678
3026
|
this.contextIndex = -1;
|
|
@@ -2683,6 +3031,13 @@ var ReactDOMServerRenderer = function () {
|
|
|
2683
3031
|
}
|
|
2684
3032
|
}
|
|
2685
3033
|
|
|
3034
|
+
ReactDOMServerRenderer.prototype.destroy = function destroy() {
|
|
3035
|
+
if (!this.exhausted) {
|
|
3036
|
+
this.exhausted = true;
|
|
3037
|
+
freeThreadID(this.threadID);
|
|
3038
|
+
}
|
|
3039
|
+
};
|
|
3040
|
+
|
|
2686
3041
|
/**
|
|
2687
3042
|
* Note: We use just two stacks regardless of how many context providers you have.
|
|
2688
3043
|
* Providers are always popped in the reverse order to how they were pushed
|
|
@@ -2693,13 +3048,12 @@ var ReactDOMServerRenderer = function () {
|
|
|
2693
3048
|
* https://github.com/facebook/react/pull/12985#issuecomment-396301248
|
|
2694
3049
|
*/
|
|
2695
3050
|
|
|
2696
|
-
// TODO: type this more strictly:
|
|
2697
|
-
|
|
2698
|
-
|
|
2699
3051
|
ReactDOMServerRenderer.prototype.pushProvider = function pushProvider(provider) {
|
|
2700
3052
|
var index = ++this.contextIndex;
|
|
2701
3053
|
var context = provider.type._context;
|
|
2702
|
-
var
|
|
3054
|
+
var threadID = this.threadID;
|
|
3055
|
+
validateContextBounds(context, threadID);
|
|
3056
|
+
var previousValue = context[threadID];
|
|
2703
3057
|
|
|
2704
3058
|
// Remember which value to restore this context to on our way up.
|
|
2705
3059
|
this.contextStack[index] = context;
|
|
@@ -2710,7 +3064,7 @@ var ReactDOMServerRenderer = function () {
|
|
|
2710
3064
|
}
|
|
2711
3065
|
|
|
2712
3066
|
// Mutate the current value.
|
|
2713
|
-
context
|
|
3067
|
+
context[threadID] = provider.props.value;
|
|
2714
3068
|
};
|
|
2715
3069
|
|
|
2716
3070
|
ReactDOMServerRenderer.prototype.popProvider = function popProvider(provider) {
|
|
@@ -2733,7 +3087,9 @@ var ReactDOMServerRenderer = function () {
|
|
|
2733
3087
|
this.contextIndex--;
|
|
2734
3088
|
|
|
2735
3089
|
// Restore to the previous value we stored as we were walking down.
|
|
2736
|
-
context
|
|
3090
|
+
// We've already verified that this context has been expanded to accommodate
|
|
3091
|
+
// this thread id, so we don't need to do it again.
|
|
3092
|
+
context[this.threadID] = previousValue;
|
|
2737
3093
|
};
|
|
2738
3094
|
|
|
2739
3095
|
ReactDOMServerRenderer.prototype.read = function read(bytes) {
|
|
@@ -2741,42 +3097,89 @@ var ReactDOMServerRenderer = function () {
|
|
|
2741
3097
|
return null;
|
|
2742
3098
|
}
|
|
2743
3099
|
|
|
2744
|
-
var
|
|
2745
|
-
|
|
2746
|
-
|
|
2747
|
-
|
|
2748
|
-
|
|
2749
|
-
|
|
2750
|
-
|
|
2751
|
-
|
|
2752
|
-
|
|
2753
|
-
|
|
2754
|
-
|
|
2755
|
-
|
|
3100
|
+
var prevThreadID = currentThreadID;
|
|
3101
|
+
setCurrentThreadID(this.threadID);
|
|
3102
|
+
var prevDispatcher = ReactCurrentOwner.currentDispatcher;
|
|
3103
|
+
if (enableHooks) {
|
|
3104
|
+
ReactCurrentOwner.currentDispatcher = Dispatcher;
|
|
3105
|
+
} else {
|
|
3106
|
+
ReactCurrentOwner.currentDispatcher = DispatcherWithoutHooks;
|
|
3107
|
+
}
|
|
3108
|
+
try {
|
|
3109
|
+
// Markup generated within <Suspense> ends up buffered until we know
|
|
3110
|
+
// nothing in that boundary suspended
|
|
3111
|
+
var out = [''];
|
|
3112
|
+
var suspended = false;
|
|
3113
|
+
while (out[0].length < bytes) {
|
|
3114
|
+
if (this.stack.length === 0) {
|
|
3115
|
+
this.exhausted = true;
|
|
3116
|
+
freeThreadID(this.threadID);
|
|
3117
|
+
break;
|
|
2756
3118
|
}
|
|
2757
|
-
this.stack.
|
|
2758
|
-
if (frame.
|
|
2759
|
-
|
|
2760
|
-
|
|
2761
|
-
|
|
2762
|
-
|
|
3119
|
+
var frame = this.stack[this.stack.length - 1];
|
|
3120
|
+
if (suspended || frame.childIndex >= frame.children.length) {
|
|
3121
|
+
var _footer = frame.footer;
|
|
3122
|
+
if (_footer !== '') {
|
|
3123
|
+
this.previousWasTextNode = false;
|
|
3124
|
+
}
|
|
3125
|
+
this.stack.pop();
|
|
3126
|
+
if (frame.type === 'select') {
|
|
3127
|
+
this.currentSelectValue = null;
|
|
3128
|
+
} else if (frame.type != null && frame.type.type != null && frame.type.type.$$typeof === REACT_PROVIDER_TYPE) {
|
|
3129
|
+
var provider = frame.type;
|
|
3130
|
+
this.popProvider(provider);
|
|
3131
|
+
} else if (frame.type === REACT_SUSPENSE_TYPE) {
|
|
3132
|
+
this.suspenseDepth--;
|
|
3133
|
+
var buffered = out.pop();
|
|
3134
|
+
|
|
3135
|
+
if (suspended) {
|
|
3136
|
+
suspended = false;
|
|
3137
|
+
// If rendering was suspended at this boundary, render the fallbackFrame
|
|
3138
|
+
var _fallbackFrame = frame.fallbackFrame;
|
|
3139
|
+
!_fallbackFrame ? invariant(false, 'suspense fallback not found, something is broken') : void 0;
|
|
3140
|
+
this.stack.push(_fallbackFrame);
|
|
3141
|
+
// Skip flushing output since we're switching to the fallback
|
|
3142
|
+
continue;
|
|
3143
|
+
} else {
|
|
3144
|
+
out[this.suspenseDepth] += buffered;
|
|
3145
|
+
}
|
|
3146
|
+
}
|
|
3147
|
+
|
|
3148
|
+
// Flush output
|
|
3149
|
+
out[this.suspenseDepth] += _footer;
|
|
3150
|
+
continue;
|
|
3151
|
+
}
|
|
3152
|
+
var child = frame.children[frame.childIndex++];
|
|
3153
|
+
|
|
3154
|
+
var outBuffer = '';
|
|
3155
|
+
{
|
|
3156
|
+
pushCurrentDebugStack(this.stack);
|
|
3157
|
+
// We're starting work on this frame, so reset its inner stack.
|
|
3158
|
+
frame.debugElementStack.length = 0;
|
|
2763
3159
|
}
|
|
2764
|
-
continue;
|
|
2765
|
-
}
|
|
2766
|
-
var child = frame.children[frame.childIndex++];
|
|
2767
|
-
{
|
|
2768
|
-
pushCurrentDebugStack(this.stack);
|
|
2769
|
-
// We're starting work on this frame, so reset its inner stack.
|
|
2770
|
-
frame.debugElementStack.length = 0;
|
|
2771
3160
|
try {
|
|
2772
|
-
|
|
2773
|
-
|
|
3161
|
+
outBuffer += this.render(child, frame.context, frame.domNamespace);
|
|
3162
|
+
} catch (err) {
|
|
3163
|
+
if (enableSuspenseServerRenderer && typeof err.then === 'function') {
|
|
3164
|
+
suspended = true;
|
|
3165
|
+
} else {
|
|
3166
|
+
throw err;
|
|
3167
|
+
}
|
|
2774
3168
|
} finally {
|
|
2775
|
-
|
|
3169
|
+
{
|
|
3170
|
+
popCurrentDebugStack();
|
|
3171
|
+
}
|
|
3172
|
+
}
|
|
3173
|
+
if (out.length <= this.suspenseDepth) {
|
|
3174
|
+
out.push('');
|
|
2776
3175
|
}
|
|
3176
|
+
out[this.suspenseDepth] += outBuffer;
|
|
2777
3177
|
}
|
|
3178
|
+
return out[0];
|
|
3179
|
+
} finally {
|
|
3180
|
+
ReactCurrentOwner.currentDispatcher = prevDispatcher;
|
|
3181
|
+
setCurrentThreadID(prevThreadID);
|
|
2778
3182
|
}
|
|
2779
|
-
return out;
|
|
2780
3183
|
};
|
|
2781
3184
|
|
|
2782
3185
|
ReactDOMServerRenderer.prototype.render = function render(child, context, parentNamespace) {
|
|
@@ -2796,7 +3199,7 @@ var ReactDOMServerRenderer = function () {
|
|
|
2796
3199
|
} else {
|
|
2797
3200
|
var nextChild = void 0;
|
|
2798
3201
|
|
|
2799
|
-
var _resolve = resolve(child, context);
|
|
3202
|
+
var _resolve = resolve(child, context, this.threadID);
|
|
2800
3203
|
|
|
2801
3204
|
nextChild = _resolve.child;
|
|
2802
3205
|
context = _resolve.context;
|
|
@@ -2858,12 +3261,21 @@ var ReactDOMServerRenderer = function () {
|
|
|
2858
3261
|
case REACT_SUSPENSE_TYPE:
|
|
2859
3262
|
{
|
|
2860
3263
|
if (enableSuspenseServerRenderer) {
|
|
2861
|
-
var
|
|
2862
|
-
|
|
2863
|
-
|
|
2864
|
-
var _frame2 = {
|
|
3264
|
+
var fallbackChildren = toArray(nextChild.props.fallback);
|
|
3265
|
+
var _nextChildren2 = toArray(nextChild.props.children);
|
|
3266
|
+
var _fallbackFrame2 = {
|
|
2865
3267
|
type: null,
|
|
2866
3268
|
domNamespace: parentNamespace,
|
|
3269
|
+
children: fallbackChildren,
|
|
3270
|
+
childIndex: 0,
|
|
3271
|
+
context: context,
|
|
3272
|
+
footer: '',
|
|
3273
|
+
out: ''
|
|
3274
|
+
};
|
|
3275
|
+
var _frame2 = {
|
|
3276
|
+
fallbackFrame: _fallbackFrame2,
|
|
3277
|
+
type: REACT_SUSPENSE_TYPE,
|
|
3278
|
+
domNamespace: parentNamespace,
|
|
2867
3279
|
children: _nextChildren2,
|
|
2868
3280
|
childIndex: 0,
|
|
2869
3281
|
context: context,
|
|
@@ -2871,9 +3283,13 @@ var ReactDOMServerRenderer = function () {
|
|
|
2871
3283
|
};
|
|
2872
3284
|
{
|
|
2873
3285
|
_frame2.debugElementStack = [];
|
|
3286
|
+
_fallbackFrame2.debugElementStack = [];
|
|
2874
3287
|
}
|
|
2875
3288
|
this.stack.push(_frame2);
|
|
3289
|
+
this.suspenseDepth++;
|
|
2876
3290
|
return '';
|
|
3291
|
+
} else {
|
|
3292
|
+
invariant(false, 'ReactDOMServer does not yet support Suspense.');
|
|
2877
3293
|
}
|
|
2878
3294
|
}
|
|
2879
3295
|
// eslint-disable-next-line-no-fallthrough
|
|
@@ -2885,7 +3301,12 @@ var ReactDOMServerRenderer = function () {
|
|
|
2885
3301
|
case REACT_FORWARD_REF_TYPE:
|
|
2886
3302
|
{
|
|
2887
3303
|
var element = nextChild;
|
|
2888
|
-
var _nextChildren3 =
|
|
3304
|
+
var _nextChildren3 = void 0;
|
|
3305
|
+
var componentIdentity = {};
|
|
3306
|
+
prepareToUseHooks(componentIdentity);
|
|
3307
|
+
_nextChildren3 = elementType.render(element.props, element.ref);
|
|
3308
|
+
_nextChildren3 = finishHooks(elementType.render, element.props, _nextChildren3, element.ref);
|
|
3309
|
+
_nextChildren3 = toArray(_nextChildren3);
|
|
2889
3310
|
var _frame3 = {
|
|
2890
3311
|
type: null,
|
|
2891
3312
|
domNamespace: parentNamespace,
|
|
@@ -2900,51 +3321,93 @@ var ReactDOMServerRenderer = function () {
|
|
|
2900
3321
|
this.stack.push(_frame3);
|
|
2901
3322
|
return '';
|
|
2902
3323
|
}
|
|
3324
|
+
case REACT_MEMO_TYPE:
|
|
3325
|
+
{
|
|
3326
|
+
var _element = nextChild;
|
|
3327
|
+
var _nextChildren4 = [React.createElement(elementType.type, _assign({ ref: _element.ref }, _element.props))];
|
|
3328
|
+
var _frame4 = {
|
|
3329
|
+
type: null,
|
|
3330
|
+
domNamespace: parentNamespace,
|
|
3331
|
+
children: _nextChildren4,
|
|
3332
|
+
childIndex: 0,
|
|
3333
|
+
context: context,
|
|
3334
|
+
footer: ''
|
|
3335
|
+
};
|
|
3336
|
+
{
|
|
3337
|
+
_frame4.debugElementStack = [];
|
|
3338
|
+
}
|
|
3339
|
+
this.stack.push(_frame4);
|
|
3340
|
+
return '';
|
|
3341
|
+
}
|
|
2903
3342
|
case REACT_PROVIDER_TYPE:
|
|
2904
3343
|
{
|
|
2905
3344
|
var provider = nextChild;
|
|
2906
3345
|
var nextProps = provider.props;
|
|
2907
|
-
var
|
|
2908
|
-
var
|
|
3346
|
+
var _nextChildren5 = toArray(nextProps.children);
|
|
3347
|
+
var _frame5 = {
|
|
2909
3348
|
type: provider,
|
|
2910
3349
|
domNamespace: parentNamespace,
|
|
2911
|
-
children:
|
|
3350
|
+
children: _nextChildren5,
|
|
2912
3351
|
childIndex: 0,
|
|
2913
3352
|
context: context,
|
|
2914
3353
|
footer: ''
|
|
2915
3354
|
};
|
|
2916
3355
|
{
|
|
2917
|
-
|
|
3356
|
+
_frame5.debugElementStack = [];
|
|
2918
3357
|
}
|
|
2919
3358
|
|
|
2920
3359
|
this.pushProvider(provider);
|
|
2921
3360
|
|
|
2922
|
-
this.stack.push(
|
|
3361
|
+
this.stack.push(_frame5);
|
|
2923
3362
|
return '';
|
|
2924
3363
|
}
|
|
2925
3364
|
case REACT_CONTEXT_TYPE:
|
|
2926
3365
|
{
|
|
2927
|
-
var
|
|
2928
|
-
|
|
2929
|
-
|
|
3366
|
+
var reactContext = nextChild.type;
|
|
3367
|
+
// The logic below for Context differs depending on PROD or DEV mode. In
|
|
3368
|
+
// DEV mode, we create a separate object for Context.Consumer that acts
|
|
3369
|
+
// like a proxy to Context. This proxy object adds unnecessary code in PROD
|
|
3370
|
+
// so we use the old behaviour (Context.Consumer references Context) to
|
|
3371
|
+
// reduce size and overhead. The separate object references context via
|
|
3372
|
+
// a property called "_context", which also gives us the ability to check
|
|
3373
|
+
// in DEV mode if this property exists or not and warn if it does not.
|
|
3374
|
+
{
|
|
3375
|
+
if (reactContext._context === undefined) {
|
|
3376
|
+
// This may be because it's a Context (rather than a Consumer).
|
|
3377
|
+
// Or it may be because it's older React where they're the same thing.
|
|
3378
|
+
// We only want to warn if we're sure it's a new React.
|
|
3379
|
+
if (reactContext !== reactContext.Consumer) {
|
|
3380
|
+
if (!hasWarnedAboutUsingContextAsConsumer) {
|
|
3381
|
+
hasWarnedAboutUsingContextAsConsumer = true;
|
|
3382
|
+
warning$1(false, 'Rendering <Context> directly is not supported and will be removed in ' + 'a future major release. Did you mean to render <Context.Consumer> instead?');
|
|
3383
|
+
}
|
|
3384
|
+
}
|
|
3385
|
+
} else {
|
|
3386
|
+
reactContext = reactContext._context;
|
|
3387
|
+
}
|
|
3388
|
+
}
|
|
3389
|
+
var _nextProps = nextChild.props;
|
|
3390
|
+
var threadID = this.threadID;
|
|
3391
|
+
validateContextBounds(reactContext, threadID);
|
|
3392
|
+
var nextValue = reactContext[threadID];
|
|
2930
3393
|
|
|
2931
|
-
var
|
|
2932
|
-
var
|
|
3394
|
+
var _nextChildren6 = toArray(_nextProps.children(nextValue));
|
|
3395
|
+
var _frame6 = {
|
|
2933
3396
|
type: nextChild,
|
|
2934
3397
|
domNamespace: parentNamespace,
|
|
2935
|
-
children:
|
|
3398
|
+
children: _nextChildren6,
|
|
2936
3399
|
childIndex: 0,
|
|
2937
3400
|
context: context,
|
|
2938
3401
|
footer: ''
|
|
2939
3402
|
};
|
|
2940
3403
|
{
|
|
2941
|
-
|
|
3404
|
+
_frame6.debugElementStack = [];
|
|
2942
3405
|
}
|
|
2943
|
-
this.stack.push(
|
|
3406
|
+
this.stack.push(_frame6);
|
|
2944
3407
|
return '';
|
|
2945
3408
|
}
|
|
2946
|
-
|
|
2947
|
-
|
|
3409
|
+
case REACT_LAZY_TYPE:
|
|
3410
|
+
invariant(false, 'ReactDOMServer does not yet support lazy-loaded components.');
|
|
2948
3411
|
}
|
|
2949
3412
|
}
|
|
2950
3413
|
|
|
@@ -3161,8 +3624,12 @@ var ReactDOMServerRenderer = function () {
|
|
|
3161
3624
|
*/
|
|
3162
3625
|
function renderToString(element) {
|
|
3163
3626
|
var renderer = new ReactDOMServerRenderer(element, false);
|
|
3164
|
-
|
|
3165
|
-
|
|
3627
|
+
try {
|
|
3628
|
+
var markup = renderer.read(Infinity);
|
|
3629
|
+
return markup;
|
|
3630
|
+
} finally {
|
|
3631
|
+
renderer.destroy();
|
|
3632
|
+
}
|
|
3166
3633
|
}
|
|
3167
3634
|
|
|
3168
3635
|
/**
|
|
@@ -3172,8 +3639,12 @@ function renderToString(element) {
|
|
|
3172
3639
|
*/
|
|
3173
3640
|
function renderToStaticMarkup(element) {
|
|
3174
3641
|
var renderer = new ReactDOMServerRenderer(element, true);
|
|
3175
|
-
|
|
3176
|
-
|
|
3642
|
+
try {
|
|
3643
|
+
var markup = renderer.read(Infinity);
|
|
3644
|
+
return markup;
|
|
3645
|
+
} finally {
|
|
3646
|
+
renderer.destroy();
|
|
3647
|
+
}
|
|
3177
3648
|
}
|
|
3178
3649
|
|
|
3179
3650
|
function renderToNodeStream() {
|