Skip to content

Commit b0942ed

Browse files
sebmarkbagesebmarkbage
committed
Switch the default revealOrder to "forwards" and tail "hidden" on SuspenseList (#35018)
We have warned about this for a while now so we can make the switch. Often when you reach for SuspenseList, you mean forwards. It doesn't make sense to have the default to just be a noop. While "together" is another useful mode that's more like a Group so isn't so associated with the default as List. So we're switching it. However, tail=hidden isn't as obvious of a default it does allow for a convenient pattern for streaming in list of items by default. This doesn't yet switch the rendering order of "backwards". That's coming in a follow up. DiffTrain build for [26cf280](26cf280)
1 parent 99c8e7c commit b0942ed

File tree

21 files changed

+710
-722
lines changed

21 files changed

+710
-722
lines changed

‎compiled-rn/VERSION_NATIVE_FB‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
19.3.0-native-fb-fb0d9607-20251028
1+
19.3.0-native-fb-26cf2804-20251031

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-dev.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<e1e450b3b95de7d8f80f90c3d38937c2>>
10+
* @generated SignedSource<<da345fecadc4b716e88ea4fed647b21d>>
1111
*/
1212

1313
"use strict";
@@ -414,5 +414,5 @@ __DEV__ &&
414414
exports.useFormStatus = function () {
415415
return resolveDispatcher().useHostTransitionStatus();
416416
};
417-
exports.version = "19.3.0-native-fb-fb0d9607-20251028";
417+
exports.version = "19.3.0-native-fb-26cf2804-20251031";
418418
})();

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-prod.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<6ccde66f506aa67928a71a64170bf809>>
10+
* @generated SignedSource<<1ff853794d6562c8967f2250a6a9cd89>>
1111
*/
1212

1313
"use strict";
@@ -209,4 +209,4 @@ exports.useFormState = function (action, initialState, permalink) {
209209
exports.useFormStatus = function () {
210210
return ReactSharedInternals.H.useHostTransitionStatus();
211211
};
212-
exports.version = "19.3.0-native-fb-fb0d9607-20251028";
212+
exports.version = "19.3.0-native-fb-26cf2804-20251031";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-profiling.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<6ccde66f506aa67928a71a64170bf809>>
10+
* @generated SignedSource<<1ff853794d6562c8967f2250a6a9cd89>>
1111
*/
1212

1313
"use strict";
@@ -209,4 +209,4 @@ exports.useFormState = function (action, initialState, permalink) {
209209
exports.useFormStatus = function () {
210210
return ReactSharedInternals.H.useHostTransitionStatus();
211211
};
212-
exports.version = "19.3.0-native-fb-fb0d9607-20251028";
212+
exports.version = "19.3.0-native-fb-26cf2804-20251031";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-dev.js‎

Lines changed: 77 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<fea7e70da6ec56bd554b2e339aa29d6b>>
10+
* @generated SignedSource<<922c814d7aca962a5d28d9e2a8396bcb>>
1111
*/
1212

1313
/*
@@ -7842,10 +7842,7 @@ __DEV__ &&
78427842
return node;
78437843
} else if (
78447844
19 === node.tag &&
7845-
("forwards" === node.memoizedProps.revealOrder ||
7846-
"backwards" === node.memoizedProps.revealOrder ||
7847-
"unstable_legacy-backwards" === node.memoizedProps.revealOrder ||
7848-
"together" === node.memoizedProps.revealOrder)
7845+
"independent" !== node.memoizedProps.revealOrder
78497846
) {
78507847
if (0 !== (node.flags & 128)) return node;
78517848
} else if (null !== node.child) {
@@ -11703,19 +11700,17 @@ __DEV__ &&
1170311700
push(suspenseStackCursor, suspenseContext, workInProgress);
1170411701
suspenseContext = null == revealOrder ? "null" : revealOrder;
1170511702
if (
11703+
null != revealOrder &&
1170611704
"forwards" !== revealOrder &&
1170711705
"unstable_legacy-backwards" !== revealOrder &&
1170811706
"together" !== revealOrder &&
1170911707
"independent" !== revealOrder &&
1171011708
!didWarnAboutRevealOrder[suspenseContext]
1171111709
)
1171211710
if (
11713-
((didWarnAboutRevealOrder[suspenseContext] = !0), null == revealOrder)
11711+
((didWarnAboutRevealOrder[suspenseContext] = !0),
11712+
"backwards" === revealOrder)
1171411713
)
11715-
console.error(
11716-
'The default for the <SuspenseList revealOrder="..."> prop is changing. To be future compatible you must explictly specify either "independent" (the current default), "together", "forwards" or "legacy_unstable-backwards".'
11717-
);
11718-
else if ("backwards" === revealOrder)
1171911714
console.error(
1172011715
'The rendering order of <SuspenseList revealOrder="backwards"> is changing. To be future compatible you must specify revealOrder="legacy_unstable-backwards" instead.'
1172111716
);
@@ -11751,36 +11746,28 @@ __DEV__ &&
1175111746
revealOrder
1175211747
);
1175311748
suspenseContext = null == tailMode ? "null" : tailMode;
11754-
if (!didWarnAboutTailOptions[suspenseContext])
11755-
if (null == tailMode) {
11756-
if (
11757-
"forwards" === revealOrder ||
11758-
"backwards" === revealOrder ||
11759-
"unstable_legacy-backwards" === revealOrder
11760-
)
11761-
(didWarnAboutTailOptions[suspenseContext] = !0),
11762-
console.error(
11763-
'The default for the <SuspenseList tail="..."> prop is changing. To be future compatible you must explictly specify either "visible" (the current default), "collapsed" or "hidden".'
11764-
);
11765-
} else
11766-
"visible" !== tailMode &&
11767-
"collapsed" !== tailMode &&
11768-
"hidden" !== tailMode
11769-
? ((didWarnAboutTailOptions[suspenseContext] = !0),
11770-
console.error(
11771-
'"%s" is not a supported value for tail on <SuspenseList />. Did you mean "visible", "collapsed" or "hidden"?',
11772-
tailMode
11773-
))
11774-
: "forwards" !== revealOrder &&
11775-
"backwards" !== revealOrder &&
11776-
"unstable_legacy-backwards" !== revealOrder &&
11777-
((didWarnAboutTailOptions[suspenseContext] = !0),
11778-
console.error(
11779-
'<SuspenseList tail="%s" /> is only valid if revealOrder is "forwards" or "backwards". Did you mean to specify revealOrder="forwards"?',
11780-
tailMode
11781-
));
11749+
didWarnAboutTailOptions[suspenseContext] ||
11750+
null == tailMode ||
11751+
("visible" !== tailMode &&
11752+
"collapsed" !== tailMode &&
11753+
"hidden" !== tailMode
11754+
? ((didWarnAboutTailOptions[suspenseContext] = !0),
11755+
console.error(
11756+
'"%s" is not a supported value for tail on <SuspenseList />. Did you mean "visible", "collapsed" or "hidden"?',
11757+
tailMode
11758+
))
11759+
: null != revealOrder &&
11760+
"forwards" !== revealOrder &&
11761+
"backwards" !== revealOrder &&
11762+
"unstable_legacy-backwards" !== revealOrder &&
11763+
((didWarnAboutTailOptions[suspenseContext] = !0),
11764+
console.error(
11765+
'<SuspenseList tail="%s" /> is only valid if revealOrder is "forwards" (default) or "backwards". Did you mean to specify revealOrder="forwards"?',
11766+
tailMode
11767+
)));
1178211768
a: if (
11783-
("forwards" === revealOrder ||
11769+
(null == revealOrder ||
11770+
"forwards" === revealOrder ||
1178411771
"backwards" === revealOrder ||
1178511772
"unstable_legacy-backwards" === revealOrder) &&
1178611773
void 0 !== newChildren &&
@@ -11845,29 +11832,6 @@ __DEV__ &&
1184511832
current = current.sibling;
1184611833
}
1184711834
switch (revealOrder) {
11848-
case "forwards":
11849-
renderLanes = workInProgress.child;
11850-
for (revealOrder = null; null !== renderLanes; )
11851-
(current = renderLanes.alternate),
11852-
null !== current &&
11853-
null === findFirstSuspended(current) &&
11854-
(revealOrder = renderLanes),
11855-
(renderLanes = renderLanes.sibling);
11856-
renderLanes = revealOrder;
11857-
null === renderLanes
11858-
? ((revealOrder = workInProgress.child),
11859-
(workInProgress.child = null))
11860-
: ((revealOrder = renderLanes.sibling),
11861-
(renderLanes.sibling = null));
11862-
initSuspenseListRenderState(
11863-
workInProgress,
11864-
!1,
11865-
revealOrder,
11866-
renderLanes,
11867-
tailMode,
11868-
newChildren
11869-
);
11870-
break;
1187111835
case "backwards":
1187211836
case "unstable_legacy-backwards":
1187311837
renderLanes = null;
@@ -11902,8 +11866,31 @@ __DEV__ &&
1190211866
newChildren
1190311867
);
1190411868
break;
11905-
default:
11869+
case "independent":
1190611870
workInProgress.memoizedState = null;
11871+
break;
11872+
default:
11873+
renderLanes = workInProgress.child;
11874+
for (revealOrder = null; null !== renderLanes; )
11875+
(current = renderLanes.alternate),
11876+
null !== current &&
11877+
null === findFirstSuspended(current) &&
11878+
(revealOrder = renderLanes),
11879+
(renderLanes = renderLanes.sibling);
11880+
renderLanes = revealOrder;
11881+
null === renderLanes
11882+
? ((revealOrder = workInProgress.child),
11883+
(workInProgress.child = null))
11884+
: ((revealOrder = renderLanes.sibling),
11885+
(renderLanes.sibling = null));
11886+
initSuspenseListRenderState(
11887+
workInProgress,
11888+
!1,
11889+
revealOrder,
11890+
renderLanes,
11891+
tailMode,
11892+
newChildren
11893+
);
1190711894
}
1190811895
return workInProgress.child;
1190911896
}
@@ -12797,26 +12784,31 @@ __DEV__ &&
1279712784
function cutOffTailIfNeeded(renderState, hasRenderedATailFallback) {
1279812785
if (!isHydrating)
1279912786
switch (renderState.tailMode) {
12800-
case "hidden":
12801-
hasRenderedATailFallback = renderState.tail;
12802-
for (var lastTailNode = null; null !== hasRenderedATailFallback; )
12803-
null !== hasRenderedATailFallback.alternate &&
12804-
(lastTailNode = hasRenderedATailFallback),
12805-
(hasRenderedATailFallback = hasRenderedATailFallback.sibling);
12806-
null === lastTailNode
12807-
? (renderState.tail = null)
12808-
: (lastTailNode.sibling = null);
12787+
case "visible":
1280912788
break;
1281012789
case "collapsed":
12811-
lastTailNode = renderState.tail;
12812-
for (var _lastTailNode = null; null !== lastTailNode; )
12813-
null !== lastTailNode.alternate && (_lastTailNode = lastTailNode),
12814-
(lastTailNode = lastTailNode.sibling);
12815-
null === _lastTailNode
12790+
for (
12791+
var tailNode = renderState.tail, lastTailNode = null;
12792+
null !== tailNode;
12793+
12794+
)
12795+
null !== tailNode.alternate && (lastTailNode = tailNode),
12796+
(tailNode = tailNode.sibling);
12797+
null === lastTailNode
1281612798
? hasRenderedATailFallback || null === renderState.tail
1281712799
? (renderState.tail = null)
1281812800
: (renderState.tail.sibling = null)
12819-
: (_lastTailNode.sibling = null);
12801+
: (lastTailNode.sibling = null);
12802+
break;
12803+
default:
12804+
hasRenderedATailFallback = renderState.tail;
12805+
for (tailNode = null; null !== hasRenderedATailFallback; )
12806+
null !== hasRenderedATailFallback.alternate &&
12807+
(tailNode = hasRenderedATailFallback),
12808+
(hasRenderedATailFallback = hasRenderedATailFallback.sibling);
12809+
null === tailNode
12810+
? (renderState.tail = null)
12811+
: (tailNode.sibling = null);
1282012812
}
1282112813
}
1282212814
function bubbleProperties(completedWork) {
@@ -13455,7 +13447,8 @@ __DEV__ &&
1345513447
scheduleRetryEffect(workInProgress, current),
1345613448
cutOffTailIfNeeded(newProps, !0),
1345713449
null === newProps.tail &&
13458-
"hidden" === newProps.tailMode &&
13450+
"collapsed" !== newProps.tailMode &&
13451+
"visible" !== newProps.tailMode &&
1345913452
!nextResource.alternate &&
1346013453
!isHydrating)
1346113454
)
@@ -29744,11 +29737,11 @@ __DEV__ &&
2974429737
};
2974529738
(function () {
2974629739
var isomorphicReactPackageVersion = React.version;
29747-
if ("19.3.0-native-fb-fb0d9607-20251028" !== isomorphicReactPackageVersion)
29740+
if ("19.3.0-native-fb-26cf2804-20251031" !== isomorphicReactPackageVersion)
2974829741
throw Error(
2974929742
'Incompatible React versions: The "react" and "react-dom" packages must have the exact same version. Instead got:\n - react: ' +
2975029743
(isomorphicReactPackageVersion +
29751-
"\n - react-dom: 19.3.0-native-fb-fb0d9607-20251028\nLearn more: https://react.dev/warnings/version-mismatch")
29744+
"\n - react-dom: 19.3.0-native-fb-26cf2804-20251031\nLearn more: https://react.dev/warnings/version-mismatch")
2975229745
);
2975329746
})();
2975429747
("function" === typeof Map &&
@@ -29785,10 +29778,10 @@ __DEV__ &&
2978529778
!(function () {
2978629779
var internals = {
2978729780
bundleType: 1,
29788-
version: "19.3.0-native-fb-fb0d9607-20251028",
29781+
version: "19.3.0-native-fb-26cf2804-20251031",
2978929782
rendererPackageName: "react-dom",
2979029783
currentDispatcherRef: ReactSharedInternals,
29791-
reconcilerVersion: "19.3.0-native-fb-fb0d9607-20251028"
29784+
reconcilerVersion: "19.3.0-native-fb-26cf2804-20251031"
2979229785
};
2979329786
internals.overrideHookState = overrideHookState;
2979429787
internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -29938,5 +29931,5 @@ __DEV__ &&
2993829931
listenToAllSupportedEvents(container);
2993929932
return new ReactDOMHydrationRoot(initialChildren);
2994029933
};
29941-
exports.version = "19.3.0-native-fb-fb0d9607-20251028";
29934+
exports.version = "19.3.0-native-fb-26cf2804-20251031";
2994229935
})();

0 commit comments

Comments
 (0)