Expose ReactNativeVersion API

packages/new-app-screen/src/NewAppScreen.js

@@ -13,6 +13,7 @@ import {ThemedText, useTheme} from './Theme';
 import * as React from 'react';
 import {
   Image,
+  ReactNativeVersion,
   ScrollView,
   StyleSheet,
   Text,
@@ -22,7 +23,6 @@ import {
   useWindowDimensions,
 } from 'react-native';
 import openURLInBrowser from 'react-native/Libraries/Core/Devtools/openURLInBrowser';
-import {version as ReactNativeVersion} from 'react-native/Libraries/Core/ReactNativeVersion';
 
 export type NewAppScreenProps = $ReadOnly<{
   templateFileName?: string,
@@ -109,19 +109,9 @@ export default function NewAppScreen({
 }
 
 function getVersionLabel(): React.Node {
-  const version =
-    [
-      ReactNativeVersion.major,
-      ReactNativeVersion.minor,
-      ReactNativeVersion.patch,
-    ].join('.') +
-    (ReactNativeVersion.prerelease != null
-      ? '-' + ReactNativeVersion.prerelease
-      : '');
-
   return (
     <ThemedText color="secondary" style={styles.label}>
-      Version: {version}
+      Version: {ReactNativeVersion.getVersionString()}
     </ThemedText>
   );
 }

packages/react-native/Libraries/Core/ReactNativeVersion.js

@@ -9,14 +9,41 @@
  * @generated by scripts/releases/set-version.js
  */
 
-export const version: $ReadOnly<{
-  major: number,
-  minor: number,
-  patch: number,
-  prerelease: string | null,
-}> = {
-  major: 1000,
-  minor: 0,
-  patch: 0,
-  prerelease: null,
+/**
+ * Object containing the current React Native version.
+ *
+ * Specifically, this is the source of truth for the resolved `react-native`
+ * package in the JavaScript bundle. Apps and libraries can use this to
+ * determine compatibility or enable version-specific features.
+ *
+ * @example
+ * ```js
+ * // Get the full version string
+ * const version = ReactNativeVersion.getVersionString();
+ *
+ * // Access individual version components
+ * const major = ReactNativeVersion.major;
+ * ```
+ */
+export default class ReactNativeVersion {
+  static major: number = 1000;
+  static minor: number = 0;
+  static patch: number = 0;
+  static prerelease: string | null = null;
+
+  static getVersionString(): string {
+    return `${this.major}.${this.minor}.${this.patch}${this.prerelease != null ? `-${this.prerelease}` : ''}`;
+  }
+}
+
+/**
+ * @deprecated Compatibility export — please import `ReactNativeVersion` from
+ *   `react-native`.
+ * See https://github.com/react-native-community/discussions-and-proposals/pull/894.
+ */
+export const version = {
+  major: ReactNativeVersion.major,
+  minor: ReactNativeVersion.minor,
+  patch: ReactNativeVersion.patch,
+  prerelease: ReactNativeVersion.prerelease,
 };

packages/react-native/ReactNativeApi.d.ts

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<a942544e271327a89ec40682d3ec736d>>
+ * @generated SignedSource<<7839de712363f6691821e0c77dc6b8e8>>
  *
  * This file was generated by scripts/js-api/build-types/index.js.
  */
@@ -3994,6 +3994,13 @@ declare class ReactNativeElement_default
   get offsetWidth(): number
   setNativeProps(nativeProps: {}): void
 }
+declare class ReactNativeVersion {
+  static major: number
+  static minor: number
+  static patch: number
+  static prerelease: null | string
+  static getVersionString(): string
+}
 declare class ReadOnlyCharacterData_default extends ReadOnlyNode_default {
   get data(): string
   get length(): number
@@ -6080,6 +6087,7 @@ export {
   PushNotificationIOS, // b4d1fe78
   PushNotificationPermissions, // c2e7ae4f
   Rationale, // 5df1b1c1
+  ReactNativeVersion, // abd76827
   RefreshControl, // effd2a00
   RefreshControlProps, // fca5a05f
   RefreshControlPropsAndroid, // 99f64c97

packages/react-native/index.js

@@ -289,6 +289,9 @@ module.exports = {
   get requireNativeComponent() {
     return require('./Libraries/ReactNative/requireNativeComponent').default;
   },
+  get ReactNativeVersion() {
+    return require('./Libraries/Core/ReactNativeVersion').default;
+  },
   get RootTagContext() {
     return require('./Libraries/ReactNative/RootTag').RootTagContext;
   },

packages/react-native/index.js.flow

@@ -358,6 +358,8 @@ export {default as processColor} from './Libraries/StyleSheet/processColor';
 export {default as registerCallableModule} from './Libraries/Core/registerCallableModule';
 export {default as requireNativeComponent} from './Libraries/ReactNative/requireNativeComponent';
 
+export {default as ReactNativeVersion} from './Libraries/Core/ReactNativeVersion';
+
 export type {RootTag} from './Libraries/ReactNative/RootTag';
 export {RootTagContext} from './Libraries/ReactNative/RootTag';
 

scripts/releases/__tests__/__snapshots__/set-rn-artifacts-version-test.js.snap

@@ -12,16 +12,43 @@ exports[`updateReactNativeArtifacts should set nightly version: packages/react-n
  * << GENERATED >>
  */
 
-export const version: $ReadOnly<{
-  major: number,
-  minor: number,
-  patch: number,
-  prerelease: string | null,
-}> = {
-  major: 0,
-  minor: 81,
-  patch: 0,
-  prerelease: 'nightly-29282302-abcd1234',
+/**
+ * Object containing the current React Native version.
+ *
+ * Specifically, this is the source of truth for the resolved \`react-native\`
+ * package in the JavaScript bundle. Apps and libraries can use this to
+ * determine compatibility or enable version-specific features.
+ *
+ * @example
+ * \`\`\`js
+ * // Get the full version string
+ * const version = ReactNativeVersion.getVersionString();
+ *
+ * // Access individual version components
+ * const major = ReactNativeVersion.major;
+ * \`\`\`
+ */
+export default class ReactNativeVersion {
+  static major: number = 0;
+  static minor: number = 81;
+  static patch: number = 0;
+  static prerelease: string | null = 'nightly-29282302-abcd1234';
+
+  static getVersionString(): string {
+    return \`\${this.major}.\${this.minor}.\${this.patch}\${this.prerelease != null ? \`-\${this.prerelease}\` : ''}\`;
+  }
+}
+
+/**
+ * @deprecated Compatibility export — please import \`ReactNativeVersion\` from
+ *   \`react-native\`.
+ * See https://github.com/react-native-community/discussions-and-proposals/pull/894.
+ */
+export const version = {
+  major: ReactNativeVersion.major,
+  minor: ReactNativeVersion.minor,
+  patch: ReactNativeVersion.patch,
+  prerelease: ReactNativeVersion.prerelease,
 };
 "
 `;
@@ -140,16 +167,43 @@ exports[`updateReactNativeArtifacts should set release version: packages/react-n
  * << GENERATED >>
  */
 
-export const version: $ReadOnly<{
-  major: number,
-  minor: number,
-  patch: number,
-  prerelease: string | null,
-}> = {
-  major: 0,
-  minor: 81,
-  patch: 0,
-  prerelease: null,
+/**
+ * Object containing the current React Native version.
+ *
+ * Specifically, this is the source of truth for the resolved \`react-native\`
+ * package in the JavaScript bundle. Apps and libraries can use this to
+ * determine compatibility or enable version-specific features.
+ *
+ * @example
+ * \`\`\`js
+ * // Get the full version string
+ * const version = ReactNativeVersion.getVersionString();
+ *
+ * // Access individual version components
+ * const major = ReactNativeVersion.major;
+ * \`\`\`
+ */
+export default class ReactNativeVersion {
+  static major: number = 0;
+  static minor: number = 81;
+  static patch: number = 0;
+  static prerelease: string | null = null;
+
+  static getVersionString(): string {
+    return \`\${this.major}.\${this.minor}.\${this.patch}\${this.prerelease != null ? \`-\${this.prerelease}\` : ''}\`;
+  }
+}
+
+/**
+ * @deprecated Compatibility export — please import \`ReactNativeVersion\` from
+ *   \`react-native\`.
+ * See https://github.com/react-native-community/discussions-and-proposals/pull/894.
+ */
+export const version = {
+  major: ReactNativeVersion.major,
+  minor: ReactNativeVersion.minor,
+  patch: ReactNativeVersion.patch,
+  prerelease: ReactNativeVersion.prerelease,
 };
 "
 `;

scripts/releases/templates/ReactNativeVersion.js-template.js

@@ -23,17 +23,42 @@ module.exports = ({version} /*: {version: Version} */) /*: string */ => `/**
  * ${'@'}generated by scripts/releases/set-version.js
  */
 
-export const version: $ReadOnly<{
-  major: number,
-  minor: number,
-  patch: number,
-  prerelease: string | null,
-}> = {
-  major: ${version.major},
-  minor: ${version.minor},
-  patch: ${version.patch},
-  prerelease: ${
-    version.prerelease != null ? `'${version.prerelease}'` : 'null'
-  },
+/**
+ * Object containing the current React Native version.
+ *
+ * Specifically, this is the source of truth for the resolved \`react-native\`
+ * package in the JavaScript bundle. Apps and libraries can use this to
+ * determine compatibility or enable version-specific features.
+ *
+ * @example
+ * \`\`\`js
+ * // Get the full version string
+ * const version = ReactNativeVersion.getVersionString();
+ *
+ * // Access individual version components
+ * const major = ReactNativeVersion.major;
+ * \`\`\`
+ */
+export default class ReactNativeVersion {
+  static major: number = ${version.major};
+  static minor: number = ${version.minor};
+  static patch: number = ${version.patch};
+  static prerelease: string | null = ${version.prerelease != null ? `'${version.prerelease}'` : 'null'};
+
+  static getVersionString(): string {
+    return \`${"${this.major}.${this.minor}.${this.patch}${this.prerelease != null ? `-${this.prerelease}` : ''}"}\`;
+  }
+}
+
+/**
+ * @deprecated Compatibility export — please import \`ReactNativeVersion\` from
+ *   \`react-native\`.
+ * See https://github.com/react-native-community/discussions-and-proposals/pull/894.
+ */
+export const version = {
+  major: ReactNativeVersion.major,
+  minor: ReactNativeVersion.minor,
+  patch: ReactNativeVersion.patch,
+  prerelease: ReactNativeVersion.prerelease,
 };
 `;