@octanejs/tanstack-start 0.1.0

package/src/internal/start-plugin-core/vite/start-manifest-plugin/plugin.js

@@ -0,0 +1,103 @@
+import { DEV_CLIENT_ENTRY, START_ENVIRONMENT_NAMES } from '../../constants.js';
+import { createVirtualModule } from '../createVirtualModule.js';
+import {
+	buildStartManifest,
+	createManifestAssetResolvers,
+	serializeStartManifest,
+} from '../../start-manifest-plugin/manifestBuilder.js';
+import { normalizeViteClientBuild } from './normalized-client-build.js';
+import { rootRouteId } from '@tanstack/router-core';
+import { VIRTUAL_MODULES } from '@tanstack/start-server-core';
+import { joinURL } from 'ufo';
+//#region src/vite/start-manifest-plugin/plugin.ts
+function startManifestPlugin(opts) {
+	let clientBuild;
+	let cssCodeSplitDisabledFileName;
+	return [
+		{
+			name: 'tanstack-start:start-manifest-capture-client-build',
+			applyToEnvironment(environment) {
+				return environment.name === START_ENVIRONMENT_NAMES.client;
+			},
+			enforce: 'post',
+			generateBundle(_options, bundle) {
+				if (this.environment.name !== START_ENVIRONMENT_NAMES.client)
+					throw new Error(
+						`Unexpected environment for client build capture: ${this.environment.name}`,
+					);
+				clientBuild = normalizeViteClientBuild(bundle);
+				cssCodeSplitDisabledFileName = getAssetFileNameByName(bundle, 'style.css');
+			},
+		},
+		createVirtualModule({
+			name: 'tanstack-start:start-manifest-plugin',
+			moduleId: VIRTUAL_MODULES.startManifest,
+			enforce: 'pre',
+			load() {
+				const { resolvedStartConfig, startConfig } = opts.getConfig();
+				const clientEntry = getDevClientEntry({
+					basePath: resolvedStartConfig.basePaths.publicBase,
+					bundledDev: isClientBundledDev(this.environment),
+				});
+				if (this.environment.name !== START_ENVIRONMENT_NAMES.server)
+					return getEmptyStartManifestModule(clientEntry);
+				if (this.environment.config.command === 'serve')
+					return getEmptyStartManifestModule(clientEntry);
+				const routeTreeRoutes = globalThis.TSS_ROUTES_MANIFEST;
+				if (!clientBuild) return getEmptyStartManifestModule(clientEntry);
+				return `export const tsrStartManifest = () => (${serializeStartManifest(
+					buildStartManifest({
+						clientBuild,
+						routeTreeRoutes,
+						basePath: resolvedStartConfig.basePaths.publicBase,
+						inlineCss: startConfig.server.build.inlineCss,
+						additionalRouteAssets: getViteAdditionalRouteAssets({
+							cssCodeSplitDisabledFileName,
+							basePath: resolvedStartConfig.basePaths.publicBase,
+							cssCodeSplit: this.environment.config.build.cssCodeSplit,
+						}),
+					}),
+				)})`;
+			},
+		}),
+	];
+}
+function getViteAdditionalRouteAssets(options) {
+	if (options.cssCodeSplit !== false) return;
+	if (!options.cssCodeSplitDisabledFileName)
+		throw new Error(
+			"TanStack Start could not find Vite's generated `style.css` manifest entry while `build.cssCodeSplit` is disabled",
+		);
+	const { getStylesheetLink } = createManifestAssetResolvers(options.basePath);
+	return { [rootRouteId]: [getStylesheetLink(options.cssCodeSplitDisabledFileName)] };
+}
+function getAssetFileNameByName(bundle, assetName) {
+	for (const fileName in bundle) {
+		const bundleEntry = bundle[fileName];
+		if (bundleEntry.type !== 'asset') continue;
+		if (bundleEntry.name === assetName) return fileName;
+		if ('names' in bundleEntry && bundleEntry.names.includes(assetName)) return fileName;
+	}
+}
+function getEmptyStartManifestModule(clientEntry) {
+	return `export const tsrStartManifest = () => ({
+      routes: {
+        __root__: {
+          preloads: ['${clientEntry}'],
+          scripts: [{ attrs: { type: 'module', async: true, src: '${clientEntry}' } }],
+        },
+      },
+    })`;
+}
+function getDevClientEntry(opts) {
+	if (opts.bundledDev) return joinURL(opts.basePath, 'assets', 'index.js');
+	return joinURL(opts.basePath, '@id', DEV_CLIENT_ENTRY);
+}
+function isClientBundledDev(environment) {
+	return (
+		environment.config.command === 'serve' &&
+		environment.config.environments?.[START_ENVIRONMENT_NAMES.client]?.isBundled === true
+	);
+}
+//#endregion
+export { startManifestPlugin };

package/src/internal/start-plugin-core/vite/start-router-plugin/plugin.d.ts

@@ -0,0 +1,9 @@
+import { GetConfigFn } from '../../types.js';
+import { TanStackStartVitePluginCoreOptions } from '../types.js';
+import { PluginOption } from 'vite';
+import { TanStackStartInputConfig } from '../../schema.js';
+export declare function tanStackStartRouter(
+	startPluginOpts: TanStackStartInputConfig,
+	getConfig: GetConfigFn,
+	corePluginOpts: TanStackStartVitePluginCoreOptions,
+): Array<PluginOption>;

package/src/internal/start-plugin-core/vite/start-router-plugin/plugin.js

@@ -0,0 +1,143 @@
+import { VITE_ENVIRONMENT_NAMES } from '../../constants.js';
+import { routesManifestPlugin } from '../../start-router-plugin/generator-plugins/routes-manifest-plugin.js';
+import { prerenderRoutesPlugin } from '../../start-router-plugin/generator-plugins/prerender-routes-plugin.js';
+import { composeGeneratorPlugins } from '../../start-router-plugin/generator-plugins/compose-generator-plugins.js';
+import { buildRouteTreeFileFooterFromConfig } from '../../start-router-plugin/route-tree-footer.js';
+import '../../start-router-plugin/constants.js';
+import { pruneServerOnlySubtrees } from '../../start-router-plugin/pruneServerOnlySubtrees.js';
+import path from 'pathe';
+import { normalizePath } from 'vite';
+import { createRouterPluginContext } from '#tanstack-start/router-plugin/context';
+import {
+	tanStackRouterCodeSplitter,
+	tanstackRouterGenerator,
+} from '#tanstack-start/router-plugin/vite';
+//#region src/vite/start-router-plugin/plugin.ts
+function isServerOnlyNode(node) {
+	if (!node?.createFileRouteProps) return false;
+	return node.createFileRouteProps.has('server') && node.createFileRouteProps.size === 1;
+}
+function tanStackStartRouter(startPluginOpts, getConfig, corePluginOpts) {
+	const routerPluginContext = createRouterPluginContext();
+	const getGeneratedRouteTreePath = () => {
+		const { startConfig } = getConfig();
+		return path.resolve(startConfig.router.generatedRouteTree);
+	};
+	let clientEnvironment = null;
+	function invalidate() {
+		if (!clientEnvironment) return;
+		const mod = clientEnvironment.moduleGraph.getModuleById(getGeneratedRouteTreePath());
+		if (mod) clientEnvironment.moduleGraph.invalidateModule(mod);
+		clientEnvironment.hot.send({
+			type: 'full-reload',
+			path: '*',
+		});
+	}
+	let generatorInstance = null;
+	const clientTreeGeneratorPlugin = {
+		name: 'start-client-tree-plugin',
+		init({ generator }) {
+			generatorInstance = generator;
+		},
+		afterTransform({ node, prevNode }) {
+			if (isServerOnlyNode(node) !== isServerOnlyNode(prevNode)) invalidate();
+		},
+	};
+	let routeTreeFileFooter = null;
+	function getRouteTreeFileFooter() {
+		if (routeTreeFileFooter) return routeTreeFileFooter;
+		routeTreeFileFooter = [
+			...buildRouteTreeFileFooterFromConfig({
+				generatedRouteTreePath: getGeneratedRouteTreePath(),
+				getConfig,
+				corePluginOpts,
+			}),
+		];
+		return routeTreeFileFooter;
+	}
+	let resolvedGeneratedRouteTreePath = null;
+	const clientTreePlugin = {
+		name: 'tanstack-start:route-tree-client-plugin',
+		enforce: 'pre',
+		applyToEnvironment: (env) => env.name === VITE_ENVIRONMENT_NAMES.client,
+		configureServer(server) {
+			clientEnvironment = server.environments[VITE_ENVIRONMENT_NAMES.client];
+		},
+		config() {
+			resolvedGeneratedRouteTreePath = normalizePath(getGeneratedRouteTreePath());
+			clientTreePlugin.load.filter = {
+				id: { include: new RegExp(resolvedGeneratedRouteTreePath) },
+			};
+		},
+		load: {
+			filter: {},
+			async handler() {
+				if (!generatorInstance) throw new Error('Generator instance not initialized');
+				const crawlingResult = await generatorInstance.getCrawlingResult();
+				if (!crawlingResult) throw new Error('Crawling result not available');
+				const prunedAcc = pruneServerOnlySubtrees(crawlingResult);
+				const acc = {
+					...crawlingResult.acc,
+					...prunedAcc,
+				};
+				return {
+					code: generatorInstance.buildRouteTree({
+						...crawlingResult,
+						acc,
+						config: {
+							disableTypes: true,
+							enableRouteTreeFormatting: false,
+							routeTreeFileHeader: [],
+							routeTreeFileFooter: [],
+						},
+					}).routeTreeContent,
+					map: null,
+				};
+			},
+		},
+	};
+	return [
+		clientTreePlugin,
+		tanstackRouterGenerator(() => {
+			const routerConfig = getConfig().startConfig.router;
+			const builtInPlugins = [clientTreeGeneratorPlugin, routesManifestPlugin()];
+			if (startPluginOpts.prerender?.enabled === true) builtInPlugins.push(prerenderRoutesPlugin());
+			const plugins = composeGeneratorPlugins({
+				frameworkPlugins: corePluginOpts.routerGeneratorPlugins,
+				userPlugins: routerConfig.plugins,
+				builtInPlugins,
+			});
+			return {
+				...routerConfig,
+				target: corePluginOpts.framework,
+				routeTreeFileFooter: getRouteTreeFileFooter,
+				plugins,
+			};
+		}, routerPluginContext),
+		tanStackRouterCodeSplitter(() => {
+			const routerConfig = getConfig().startConfig.router;
+			return {
+				...routerConfig,
+				codeSplittingOptions: {
+					...routerConfig.codeSplittingOptions,
+					deleteNodes: ['ssr', 'server', 'headers'],
+					addHmr: true,
+				},
+				plugin: { vite: { environmentName: VITE_ENVIRONMENT_NAMES.client } },
+			};
+		}, routerPluginContext),
+		tanStackRouterCodeSplitter(() => {
+			const routerConfig = getConfig().startConfig.router;
+			return {
+				...routerConfig,
+				codeSplittingOptions: {
+					...routerConfig.codeSplittingOptions,
+					addHmr: false,
+				},
+				plugin: { vite: { environmentName: VITE_ENVIRONMENT_NAMES.server } },
+			};
+		}, routerPluginContext),
+	];
+}
+//#endregion
+export { tanStackStartRouter };

package/src/internal/start-plugin-core/vite/types.d.ts

@@ -0,0 +1,17 @@
+import { TanStackStartCoreOptions } from '../types.js';
+export interface ViteRscForwardSsrResolverStrategy {
+	type: 'vite-rsc-forward';
+	sourceEnvironmentName: string;
+	sourceEntry: string;
+	exportName: 'getServerFnById';
+}
+export type SsrResolverStrategy =
+	| {
+			type: 'default';
+	  }
+	| ViteRscForwardSsrResolverStrategy;
+export type TanStackStartVitePluginCoreOptions = TanStackStartCoreOptions & {
+	providerEnvironmentName: string;
+	ssrIsProvider: boolean;
+	ssrResolverStrategy: SsrResolverStrategy;
+};

package/src/package-names.js

@@ -0,0 +1,10 @@
+export const OCTANE_ROUTER_PACKAGE = '@octanejs/tanstack-router';
+export const OCTANE_START_PACKAGE = '@octanejs/tanstack-start';
+
+export function getRouterPackage(framework) {
+	return framework === 'octane' ? OCTANE_ROUTER_PACKAGE : `@tanstack/${framework}-router`;
+}
+
+export function getStartPackage(framework) {
+	return framework === 'octane' ? OCTANE_START_PACKAGE : `@tanstack/${framework}-start`;
+}

package/src/plugin-vite.d.ts

@@ -0,0 +1,23 @@
+import type { TanStackStartViteInputConfig } from '#tanstack-start/plugin-core/vite';
+import type {
+	OctaneRendererBoundaryOptions,
+	OctaneRendererConfigOptions,
+	OctaneRendererRegistryEntry,
+	OctaneRendererRuleOptions,
+	OctaneVitePluginOptions,
+} from 'octane/compiler/vite';
+import type { PluginOption } from 'vite';
+
+export type OctaneRendererDescriptor = Exclude<OctaneRendererRegistryEntry, string>;
+export type OctaneRendererBoundary = OctaneRendererBoundaryOptions;
+export type OctaneRendererRule = OctaneRendererRuleOptions;
+export type OctaneRendererConfig = OctaneRendererConfigOptions;
+export type OctaneCompilerOptions = Omit<OctaneVitePluginOptions, 'ssr'>;
+
+export type TanStackOctaneStartViteInputConfig = TanStackStartViteInputConfig & {
+	octane?: OctaneCompilerOptions;
+};
+
+export declare function tanstackStart(
+	options?: TanStackOctaneStartViteInputConfig,
+): Array<PluginOption>;

package/src/plugin-vite.js

@@ -0,0 +1,62 @@
+import { START_ENVIRONMENT_NAMES, tanStackStartVite } from '#tanstack-start/plugin-core/vite';
+import { octaneRouteGeneratorPlugin } from '@octanejs/tanstack-router/generator-plugin';
+import { octane } from 'octane/compiler/vite';
+import { octaneStartDefaultEntryPaths } from './default-entry-paths.js';
+import { validateOctaneCompilerOptions } from './validate-options.js';
+
+// The Start runtime chain must be source-served. Its compiler removes
+// environment-specific branches; a prebundled dependency bypasses that
+// transform and can execute server-only storage code in the browser.
+const WORKSPACE_SOURCE_EXCLUDES = [
+	'@octanejs/tanstack-start',
+	'@octanejs/tanstack-router',
+	'@tanstack/start-client-core',
+	'@tanstack/start-storage-context',
+	'@tanstack/start-fn-stubs',
+	'@tanstack/start-static-server-functions',
+	'octane',
+];
+
+// The router ships raw TSRX, so its registry subpath imports surface after
+// initial dependency discovery. Predeclare them to prevent a mid-hydration
+// optimized-dependency reload on a cold cache.
+const WORKSPACE_SOURCE_INCLUDES = [
+	'@octanejs/tanstack-router > @tanstack/router-core/isServer',
+	'@octanejs/tanstack-router > @tanstack/router-core/scroll-restoration-script',
+];
+
+export function tanstackStart(options) {
+	const { octane: octaneOptions, ...startOptions } = options ?? {};
+	validateOctaneCompilerOptions(octaneOptions);
+
+	const corePluginOptions = {
+		framework: 'octane',
+		defaultEntryPaths: octaneStartDefaultEntryPaths,
+		providerEnvironmentName: START_ENVIRONMENT_NAMES.server,
+		ssrIsProvider: true,
+		ssrResolverStrategy: { type: 'default' },
+		routerGeneratorPlugins: [octaneRouteGeneratorPlugin()],
+	};
+
+	return [
+		octane(octaneOptions),
+		{
+			name: 'octanejs-tanstack-start:workspace-source-deps',
+			configEnvironment(environmentName, environmentOptions) {
+				const applies =
+					environmentName === START_ENVIRONMENT_NAMES.client ||
+					(environmentName === START_ENVIRONMENT_NAMES.server &&
+						environmentOptions.optimizeDeps?.noDiscovery === false);
+				return applies
+					? {
+							optimizeDeps: {
+								exclude: WORKSPACE_SOURCE_EXCLUDES,
+								include: WORKSPACE_SOURCE_INCLUDES,
+							},
+						}
+					: undefined;
+			},
+		},
+		tanStackStartVite(corePluginOptions, startOptions),
+	];
+}

package/src/runtime/client/StartClient.d.ts

@@ -0,0 +1,11 @@
+import type { AnyRouter } from '@tanstack/router-core';
+
+export interface StartClientProps {
+	router: AnyRouter;
+}
+
+export declare function StartClient({
+	router,
+}: StartClientProps): import('octane').ElementDescriptor<{
+	router: AnyRouter;
+}>;

package/src/runtime/client/StartClient.js

@@ -0,0 +1,16 @@
+import { HYDRATION_RANGE_BOUNDARY, createElement, hookSlots, useEffect } from 'octane';
+import { RouterProvider } from '@octanejs/tanstack-router';
+
+export function StartClient({ router }) {
+	useEffect(
+		() => {
+			window.$_TSR?.h();
+		},
+		[],
+		startClientEffectSlot,
+	);
+	return createElement(RouterProvider, { router });
+}
+
+StartClient[HYDRATION_RANGE_BOUNDARY] = 'passthrough';
+const startClientEffectSlot = Symbol(hookSlots(1));

package/src/runtime/client/hydrateStart.d.ts

@@ -0,0 +1,4 @@
+import type { AnyRouter } from '@tanstack/router-core';
+
+export declare function waitForRouterMatches(router: AnyRouter): Promise<void>;
+export declare function hydrateStart(): Promise<AnyRouter>;

package/src/runtime/client/hydrateStart.js

@@ -0,0 +1,30 @@
+import { hydrateStart as hydrateStartCore } from '@tanstack/start-client-core/client';
+
+/**
+ * Octane batches router store writes in a transition. The core hydration
+ * promise can therefore settle before hydrated matches are observable to the
+ * first render. Wait for that commit so hydration never adopts the server
+ * document with an empty match tree.
+ */
+export function waitForRouterMatches(router) {
+	const matchesId = router.stores.matchesId;
+	if (matchesId.get().length > 0) return Promise.resolve();
+
+	return new Promise((resolve) => {
+		let resolved = false;
+		const finish = () => {
+			if (resolved || matchesId.get().length === 0) return;
+			resolved = true;
+			subscription.unsubscribe();
+			resolve();
+		};
+		const subscription = matchesId.subscribe(finish);
+		finish();
+	});
+}
+
+export async function hydrateStart() {
+	const router = await hydrateStartCore();
+	await waitForRouterMatches(router);
+	return router;
+}

package/src/runtime/server/StartServer.d.ts

@@ -0,0 +1,10 @@
+import type { AnyRouter } from '@tanstack/router-core';
+import type { ElementDescriptor } from 'octane';
+
+export interface StartServerProps {
+	router: AnyRouter;
+}
+
+export declare function StartServer({
+	router,
+}: StartServerProps): ElementDescriptor<StartServerProps>;

package/src/runtime/server/StartServer.js

@@ -0,0 +1,6 @@
+import { createElement } from 'octane/server';
+import { RouterProvider } from '@octanejs/tanstack-router';
+
+export function StartServer({ router }) {
+	return createElement(RouterProvider, { router });
+}

package/src/runtime/server/defaultRenderHandler.d.ts

@@ -0,0 +1,3 @@
+export declare const defaultRenderHandler: import('@tanstack/start-server-core').HandlerCallback<
+	import('@tanstack/router-core').AnyRouter
+>;

package/src/runtime/server/defaultRenderHandler.js

@@ -0,0 +1,11 @@
+import { defineHandlerCallback } from '@tanstack/start-server-core';
+import { renderRouterToString } from '@octanejs/tanstack-router/ssr/server';
+import { StartServer } from './StartServer.js';
+
+export const defaultRenderHandler = defineHandlerCallback(({ router, responseHeaders }) =>
+	renderRouterToString({
+		router,
+		responseHeaders,
+		App: StartServer,
+	}),
+);

package/src/runtime/server/defaultStreamHandler.d.ts

@@ -0,0 +1,3 @@
+export declare const defaultStreamHandler: import('@tanstack/start-server-core').HandlerCallback<
+	import('@tanstack/router-core').AnyRouter
+>;

package/src/runtime/server/defaultStreamHandler.js

@@ -0,0 +1,13 @@
+import { defineHandlerCallback } from '@tanstack/start-server-core';
+import { renderRouterToStream } from '@octanejs/tanstack-router/ssr/server';
+import { StartServer } from './StartServer.js';
+
+export const defaultStreamHandler = defineHandlerCallback(
+	async ({ request, router, responseHeaders }) =>
+		await renderRouterToStream({
+			request,
+			router,
+			responseHeaders,
+			App: StartServer,
+		}),
+);

package/src/server-entry.d.ts

@@ -0,0 +1,11 @@
+import type { Register } from '@octanejs/tanstack-start';
+import type { RequestHandler } from './server.js';
+
+export type ServerEntry = {
+	fetch: RequestHandler<Register>;
+};
+
+export declare function createServerEntry(entry: ServerEntry): ServerEntry;
+
+declare const defaultEntry: ServerEntry;
+export default defaultEntry;

package/src/server-entry.js

@@ -0,0 +1,13 @@
+import { createStartHandler, defaultStreamHandler } from './server.js';
+
+const fetch = createStartHandler(defaultStreamHandler);
+
+export function createServerEntry(entry) {
+	return {
+		async fetch(...args) {
+			return await entry.fetch(...args);
+		},
+	};
+}
+
+export default createServerEntry({ fetch });

package/src/server-only.d.ts

@@ -0,0 +1 @@
+export {};

package/src/server-rpc.d.ts

@@ -0,0 +1 @@
+export { createServerRpc } from '@tanstack/start-server-core/createServerRpc';

package/src/server-rpc.js

@@ -0,0 +1 @@
+export { createServerRpc } from '@tanstack/start-server-core/createServerRpc';

package/src/server.d.ts

@@ -0,0 +1,6 @@
+export { StartServer } from './runtime/server/StartServer.js';
+export type { StartServerProps } from './runtime/server/StartServer.js';
+export { defaultStreamHandler } from './runtime/server/defaultStreamHandler.js';
+export { defaultRenderHandler } from './runtime/server/defaultRenderHandler.js';
+export type { RequestHandler, RequestOptions } from '@tanstack/start-server-core';
+export * from '@tanstack/start-server-core';

package/src/server.js

@@ -0,0 +1,4 @@
+export { StartServer } from './runtime/server/StartServer.js';
+export { defaultStreamHandler } from './runtime/server/defaultStreamHandler.js';
+export { defaultRenderHandler } from './runtime/server/defaultRenderHandler.js';
+export * from '@tanstack/start-server-core';

package/src/ssr-rpc.d.ts

@@ -0,0 +1 @@
+export { createSsrRpc } from '@tanstack/start-server-core/createSsrRpc';

package/src/ssr-rpc.js

@@ -0,0 +1 @@
+export { createSsrRpc } from '@tanstack/start-server-core/createSsrRpc';

package/src/use-server-fn.d.ts

@@ -0,0 +1,3 @@
+export declare function useServerFn<T extends (...deps: Array<any>) => Promise<any>>(
+	serverFn: T,
+): (...args: Parameters<T>) => ReturnType<T>;

package/src/use-server-fn.js

@@ -0,0 +1,18 @@
+import { isRedirect, useRouter } from '@octanejs/tanstack-router';
+
+export function useServerFn(serverFn) {
+	const router = useRouter();
+	return async (...args) => {
+		try {
+			const response = await serverFn(...args);
+			if (isRedirect(response)) throw response;
+			return response;
+		} catch (error) {
+			if (isRedirect(error)) {
+				error.options._fromLocation = router.stores.location.get();
+				return router.navigate(router.resolveRedirect(error).options);
+			}
+			throw error;
+		}
+	};
+}

package/src/validate-options.js

@@ -0,0 +1,7 @@
+export function validateOctaneCompilerOptions(octaneOptions) {
+	if (octaneOptions && 'ssr' in octaneOptions) {
+		throw new Error(
+			'`octane.ssr` is not supported by TanStack Start. Start compiles its client and server environments separately and selects the correct Octane compilation mode for each one.',
+		);
+	}
+}