feat(@astrojs/react): export renderer for easy loading (#11234)

* wip

* feat(@astrojs/react): export `renderer` for easy loading

* restore change

* chore: address feedback

* revert changes

* revert changes to react integration

* update changeset

2 files changed, 55 insertions, 48 deletions

diff --git a/packages/integrations/react/src/index.ts b/packages/integrations/react/src/index.ts
index 85d79eef8..c20146949 100644
--- a/packages/integrations/react/src/index.ts
+++ b/packages/integrations/react/src/index.ts
@@ -1,7 +1,13 @@
 import react, { type Options as ViteReactPluginOptions } from '@vitejs/plugin-react';
-import type { AstroIntegration, ContainerRenderer } from 'astro';
-import { version as ReactVersion } from 'react-dom';
+import type {AstroIntegration, ContainerRenderer} from 'astro';
 import type * as vite from 'vite';
+import {
+	getReactMajorVersion,
+	isUnsupportedVersion,
+	versionsConfig,
+	type ReactVersionConfig,
+	type SupportedReactVersion,
+} from './version.js';
 
 export type ReactIntegrationOptions = Pick<
 	ViteReactPluginOptions,
@@ -12,39 +18,6 @@ export type ReactIntegrationOptions = Pick<
 
 const FAST_REFRESH_PREAMBLE = react.preambleCode;
 
-const versionsConfig = {
-	17: {
-		server: '@astrojs/react/server-v17.js',
-		client: '@astrojs/react/client-v17.js',
-		externals: ['react-dom/server.js', 'react-dom/client.js'],
-	},
-	18: {
-		server: '@astrojs/react/server.js',
-		client: '@astrojs/react/client.js',
-		externals: ['react-dom/server', 'react-dom/client'],
-	},
-	19: {
-		server: '@astrojs/react/server.js',
-		client: '@astrojs/react/client.js',
-		externals: ['react-dom/server', 'react-dom/client'],
-	},
-};
-
-type SupportedReactVersion = keyof typeof versionsConfig;
-type ReactVersionConfig = (typeof versionsConfig)[SupportedReactVersion];
-
-function getReactMajorVersion(): number {
-	const matches = /\d+\./.exec(ReactVersion);
-	if (!matches) {
-		return NaN;
-	}
-	return Number(matches[0]);
-}
-
-function isUnsupportedVersion(majorVersion: number) {
-	return majorVersion < 17 || majorVersion > 19 || Number.isNaN(majorVersion);
-}
-
 function getRenderer(reactConfig: ReactVersionConfig) {
 	return {
 		name: '@astrojs/react',
@@ -53,19 +26,6 @@ function getRenderer(reactConfig: ReactVersionConfig) {
 	};
 }
 
-export function getContainerRenderer(): ContainerRenderer {
-	const majorVersion = getReactMajorVersion();
-	if (isUnsupportedVersion(majorVersion)) {
-		throw new Error(`Unsupported React version: ${majorVersion}.`);
-	}
-	const versionConfig = versionsConfig[majorVersion as SupportedReactVersion];
-
-	return {
-		name: '@astrojs/react',
-		serverEntrypoint: versionConfig.server,
-	};
-}
-
 function optionsPlugin(experimentalReactChildren: boolean): vite.Plugin {
 	const virtualModule = 'astro:react:opts';
 	const virtualModuleId = '\0' + virtualModule;
@@ -152,3 +112,16 @@ export default function ({
 		},
 	};
 }
+
+export function getContainerRenderer(): ContainerRenderer {
+	const majorVersion = getReactMajorVersion();
+	if (isUnsupportedVersion(majorVersion)) {
+		throw new Error(`Unsupported React version: ${majorVersion}.`);
+	}
+	const versionConfig = versionsConfig[majorVersion as SupportedReactVersion];
+
+	return {
+		name: '@astrojs/react',
+		serverEntrypoint: versionConfig.server,
+	};
+}
diff --git a/packages/integrations/react/src/version.ts b/packages/integrations/react/src/version.ts
new file mode 100644
index 000000000..dc3a7a85a
--- /dev/null
+++ b/packages/integrations/react/src/version.ts
@@ -0,0 +1,34 @@
+import { version as ReactVersion } from 'react-dom';
+
+export type SupportedReactVersion = keyof typeof versionsConfig;
+export type ReactVersionConfig = (typeof versionsConfig)[SupportedReactVersion];
+
+export function getReactMajorVersion(): number {
+	const matches = /\d+\./.exec(ReactVersion);
+	if (!matches) {
+		return NaN;
+	}
+	return Number(matches[0]);
+}
+
+export function isUnsupportedVersion(majorVersion: number) {
+	return majorVersion < 17 || majorVersion > 19 || Number.isNaN(majorVersion);
+}
+
+export const versionsConfig = {
+	17: {
+		server: '@astrojs/react/server-v17.js',
+		client: '@astrojs/react/client-v17.js',
+		externals: ['react-dom/server.js', 'react-dom/client.js'],
+	},
+	18: {
+		server: '@astrojs/react/server.js',
+		client: '@astrojs/react/client.js',
+		externals: ['react-dom/server', 'react-dom/client'],
+	},
+	19: {
+		server: '@astrojs/react/server.js',
+		client: '@astrojs/react/client.js',
+		externals: ['react-dom/server', 'react-dom/client'],
+	},
+};