Skip to content

Commit ad69c65

Browse files
committed
Release Fragment refs to Canary (facebook#34720)
## Overview This PR adds the `ref` prop to `<Fragment>` in `react@canary`. This means this API is ready for final feedback and prepared for a semver stable release. ## What this means Shipping Fragment refs to canary means they have gone through extensive testing in production, we are confident in the stability of the APIs, and we are preparing to release it in a future semver stable version. Libraries and frameworks following the [Canary Workflow](https://react.dev/blog/2023/05/03/react-canaries) should begin implementing and testing these features. ## Why we follow the Canary Workflow To prepare for semver stable, libraries should test canary features like Fragment refs with `react@canary` to confirm compatibility and prepare for the next semver release in a myriad of environments and configurations used throughout the React ecosystem. This provides libraries with ample time to catch any issues we missed before slamming them with problems in the wider semver release. Since these features have already gone through extensive production testing, and we are confident they are stable, frameworks following the [Canary Workflow](https://react.dev/blog/2023/05/03/react-canaries) can also begin adopting canary features like Fragment refs. This adoption is similar to how different Browsers implement new proposed browser features before they are added to the standard. If a frameworks adopts a canary feature, they are committing to stability for their users by ensuring any API changes before a semver stable release are opaque and non-breaking to their users. Apps not using a framework are also free to adopt canary features like Fragment refs as long as they follow the [Canary Workflow](https://react.dev/blog/2023/05/03/react-canaries), but we generally recommend waiting for a semver stable release unless you have the capacity to commit to following along with the canary changes and debugging library compatibility issues. Waiting for semver stable means you're able to benefit from libraries testing and confirming support, and use semver as signal for which version of a library you can use with support of the feature. ## Docs Check out the ["React Labs: View Transitions, Activity, and more"](https://react.dev/blog/2025/04/23/react-labs-view-transitions-activity-and-more#fragment-refs) blog post, and [the new docs for Fragment refs`](https://react.dev/reference/react/Fragment#fragmentinstance) for more info. DiffTrain build for [a4eb2df](facebook@a4eb2df)
1 parent 950ede8 commit ad69c65

35 files changed

+134
-127
lines changed

compiled/eslint-plugin-react-hooks/index.js

Lines changed: 22 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ var BabelParser = require('@babel/parser');
2525
var zod = require('zod');
2626
var zodValidationError = require('zod-validation-error');
2727
var crypto = require('crypto');
28+
var HermesParser = require('hermes-parser');
2829
var util = require('util');
2930

3031
const SETTINGS_KEY = 'react-hooks';
@@ -54226,14 +54227,28 @@ function runReactCompilerImpl({ sourceCode, filename, userOpts, }) {
5422654227
(_b = options.logger) === null || _b === void 0 ? void 0 : _b.logEvent(filename, err);
5422754228
}
5422854229
let babelAST = null;
54229-
try {
54230-
babelAST = BabelParser.parse(sourceCode.text, {
54231-
sourceFilename: filename,
54232-
sourceType: 'unambiguous',
54233-
plugins: ['typescript', 'jsx'],
54234-
});
54230+
if (filename.endsWith('.tsx') || filename.endsWith('.ts')) {
54231+
try {
54232+
babelAST = BabelParser.parse(sourceCode.text, {
54233+
sourceFilename: filename,
54234+
sourceType: 'unambiguous',
54235+
plugins: ['typescript', 'jsx'],
54236+
});
54237+
}
54238+
catch (_c) {
54239+
}
5423554240
}
54236-
catch (err) {
54241+
else {
54242+
try {
54243+
babelAST = HermesParser.parse(sourceCode.text, {
54244+
babel: true,
54245+
enableExperimentalComponentSyntax: true,
54246+
sourceFilename: filename,
54247+
sourceType: 'module',
54248+
});
54249+
}
54250+
catch (_d) {
54251+
}
5423754252
}
5423854253
if (babelAST != null) {
5423954254
results.flowSuppressions = getFlowSuppressions(sourceCode);

compiled/facebook-www/REVISION

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
1be3ce9996f05ceb74fd8c11f08a84a5e57098f3
1+
a4eb2dfa6fec3da5a947eb84c99b059890bb5241
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
1be3ce9996f05ceb74fd8c11f08a84a5e57098f3
1+
a4eb2dfa6fec3da5a947eb84c99b059890bb5241

compiled/facebook-www/React-dev.classic.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -965,6 +965,7 @@ __DEV__ &&
965965
exports.PureComponent = PureComponent;
966966
exports.StrictMode = REACT_STRICT_MODE_TYPE;
967967
exports.Suspense = REACT_SUSPENSE_TYPE;
968+
exports.ViewTransition = REACT_VIEW_TRANSITION_TYPE;
968969
exports.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE =
969970
ReactSharedInternals;
970971
exports.__COMPILER_RUNTIME = fnName;
@@ -1079,6 +1080,7 @@ __DEV__ &&
10791080
}
10801081
};
10811082
};
1083+
exports.addTransitionType = addTransitionType;
10821084
exports.c = useMemoCache;
10831085
exports.cache = function (fn) {
10841086
return function () {
@@ -1458,7 +1460,7 @@ __DEV__ &&
14581460
exports.useTransition = function () {
14591461
return resolveDispatcher().useTransition();
14601462
};
1461-
exports.version = "19.3.0-www-classic-1be3ce99-20251006";
1463+
exports.version = "19.3.0-www-classic-a4eb2dfa-20251006";
14621464
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
14631465
"function" ===
14641466
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-dev.modern.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -965,6 +965,7 @@ __DEV__ &&
965965
exports.PureComponent = PureComponent;
966966
exports.StrictMode = REACT_STRICT_MODE_TYPE;
967967
exports.Suspense = REACT_SUSPENSE_TYPE;
968+
exports.ViewTransition = REACT_VIEW_TRANSITION_TYPE;
968969
exports.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE =
969970
ReactSharedInternals;
970971
exports.__COMPILER_RUNTIME = fnName;
@@ -1079,6 +1080,7 @@ __DEV__ &&
10791080
}
10801081
};
10811082
};
1083+
exports.addTransitionType = addTransitionType;
10821084
exports.c = useMemoCache;
10831085
exports.cache = function (fn) {
10841086
return function () {
@@ -1458,7 +1460,7 @@ __DEV__ &&
14581460
exports.useTransition = function () {
14591461
return resolveDispatcher().useTransition();
14601462
};
1461-
exports.version = "19.3.0-www-modern-1be3ce99-20251006";
1463+
exports.version = "19.3.0-www-modern-a4eb2dfa-20251006";
14621464
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
14631465
"function" ===
14641466
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-prod.classic.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -422,12 +422,14 @@ exports.Profiler = REACT_PROFILER_TYPE;
422422
exports.PureComponent = PureComponent;
423423
exports.StrictMode = REACT_STRICT_MODE_TYPE;
424424
exports.Suspense = REACT_SUSPENSE_TYPE;
425+
exports.ViewTransition = REACT_VIEW_TRANSITION_TYPE;
425426
exports.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE =
426427
ReactSharedInternals;
427428
exports.__COMPILER_RUNTIME = ReactCompilerRuntime;
428429
exports.act = function () {
429430
throw Error("act(...) is not supported in production builds of React.");
430431
};
432+
exports.addTransitionType = addTransitionType;
431433
exports.c = useMemoCache;
432434
exports.cache = function (fn) {
433435
return function () {
@@ -604,4 +606,4 @@ exports.useSyncExternalStore = function (
604606
exports.useTransition = function () {
605607
return ReactSharedInternals.H.useTransition();
606608
};
607-
exports.version = "19.3.0-www-classic-1be3ce99-20251006";
609+
exports.version = "19.3.0-www-classic-a4eb2dfa-20251006";

compiled/facebook-www/React-prod.modern.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -422,12 +422,14 @@ exports.Profiler = REACT_PROFILER_TYPE;
422422
exports.PureComponent = PureComponent;
423423
exports.StrictMode = REACT_STRICT_MODE_TYPE;
424424
exports.Suspense = REACT_SUSPENSE_TYPE;
425+
exports.ViewTransition = REACT_VIEW_TRANSITION_TYPE;
425426
exports.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE =
426427
ReactSharedInternals;
427428
exports.__COMPILER_RUNTIME = ReactCompilerRuntime;
428429
exports.act = function () {
429430
throw Error("act(...) is not supported in production builds of React.");
430431
};
432+
exports.addTransitionType = addTransitionType;
431433
exports.c = useMemoCache;
432434
exports.cache = function (fn) {
433435
return function () {
@@ -604,4 +606,4 @@ exports.useSyncExternalStore = function (
604606
exports.useTransition = function () {
605607
return ReactSharedInternals.H.useTransition();
606608
};
607-
exports.version = "19.3.0-www-modern-1be3ce99-20251006";
609+
exports.version = "19.3.0-www-modern-a4eb2dfa-20251006";

compiled/facebook-www/React-profiling.classic.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -426,12 +426,14 @@ exports.Profiler = REACT_PROFILER_TYPE;
426426
exports.PureComponent = PureComponent;
427427
exports.StrictMode = REACT_STRICT_MODE_TYPE;
428428
exports.Suspense = REACT_SUSPENSE_TYPE;
429+
exports.ViewTransition = REACT_VIEW_TRANSITION_TYPE;
429430
exports.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE =
430431
ReactSharedInternals;
431432
exports.__COMPILER_RUNTIME = ReactCompilerRuntime;
432433
exports.act = function () {
433434
throw Error("act(...) is not supported in production builds of React.");
434435
};
436+
exports.addTransitionType = addTransitionType;
435437
exports.c = useMemoCache;
436438
exports.cache = function (fn) {
437439
return function () {
@@ -608,7 +610,7 @@ exports.useSyncExternalStore = function (
608610
exports.useTransition = function () {
609611
return ReactSharedInternals.H.useTransition();
610612
};
611-
exports.version = "19.3.0-www-classic-1be3ce99-20251006";
613+
exports.version = "19.3.0-www-classic-a4eb2dfa-20251006";
612614
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
613615
"function" ===
614616
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-profiling.modern.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -426,12 +426,14 @@ exports.Profiler = REACT_PROFILER_TYPE;
426426
exports.PureComponent = PureComponent;
427427
exports.StrictMode = REACT_STRICT_MODE_TYPE;
428428
exports.Suspense = REACT_SUSPENSE_TYPE;
429+
exports.ViewTransition = REACT_VIEW_TRANSITION_TYPE;
429430
exports.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE =
430431
ReactSharedInternals;
431432
exports.__COMPILER_RUNTIME = ReactCompilerRuntime;
432433
exports.act = function () {
433434
throw Error("act(...) is not supported in production builds of React.");
434435
};
436+
exports.addTransitionType = addTransitionType;
435437
exports.c = useMemoCache;
436438
exports.cache = function (fn) {
437439
return function () {
@@ -608,7 +610,7 @@ exports.useSyncExternalStore = function (
608610
exports.useTransition = function () {
609611
return ReactSharedInternals.H.useTransition();
610612
};
611-
exports.version = "19.3.0-www-modern-1be3ce99-20251006";
613+
exports.version = "19.3.0-www-modern-a4eb2dfa-20251006";
612614
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
613615
"function" ===
614616
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/ReactART-dev.classic.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20348,10 +20348,10 @@ __DEV__ &&
2034820348
(function () {
2034920349
var internals = {
2035020350
bundleType: 1,
20351-
version: "19.3.0-www-classic-1be3ce99-20251006",
20351+
version: "19.3.0-www-classic-a4eb2dfa-20251006",
2035220352
rendererPackageName: "react-art",
2035320353
currentDispatcherRef: ReactSharedInternals,
20354-
reconcilerVersion: "19.3.0-www-classic-1be3ce99-20251006"
20354+
reconcilerVersion: "19.3.0-www-classic-a4eb2dfa-20251006"
2035520355
};
2035620356
internals.overrideHookState = overrideHookState;
2035720357
internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -20386,7 +20386,7 @@ __DEV__ &&
2038620386
exports.Shape = Shape;
2038720387
exports.Surface = Surface;
2038820388
exports.Text = Text;
20389-
exports.version = "19.3.0-www-classic-1be3ce99-20251006";
20389+
exports.version = "19.3.0-www-classic-a4eb2dfa-20251006";
2039020390
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
2039120391
"function" ===
2039220392
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

0 commit comments

Comments
 (0)