@teardown/cli 2.0.73 → 2.0.75

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@teardown/cli",
-	"version": "2.0.73",
+	"version": "2.0.75",
 	"private": false,
 	"type": "module",
 	"main": "./src/index.ts",
@@ -76,7 +76,7 @@
 	},
 	"devDependencies": {
 		"@biomejs/biome": "2.3.11",
-		"@teardown/tsconfig": "2.0.73",
+		"@teardown/tsconfig": "2.0.75",
 		"@types/bun": "1.3.5",
 		"@types/ejs": "^3.1.5",
 		"typescript": "5.9.3"

package/src/cli/commands/dev.ts

@@ -2,11 +2,12 @@
  * Dev command - starts the Metro bundler
  */
 
-import { spawn } from "node:child_process";
 import { existsSync } from "node:fs";
-import { join } from "node:path";
+import { join, resolve } from "node:path";
 import chalk from "chalk";
 import { Command } from "commander";
+import { attachBundlerToForeground, startBundlerBackground } from "../../utils/bundler";
+import { getNavigationConfig } from "../../utils/metro-config";
 
 /**
  * Check if a metro.config.js file exists in the project
@@ -48,39 +49,60 @@ export function createDevCommand(): Command {
 				console.log(chalk.gray("Tip: Add @teardown/metro-config for 36x faster builds\n"));
 			}
 
-			console.log(chalk.blue("Starting Metro bundler...\n"));
+			// Pre-generate routes if navigation-metro is installed
+			const navigationMetroPath = join(projectRoot, "node_modules/@teardown/navigation-metro");
+			const navConfig = getNavigationConfig(projectRoot);
 
-			const args = ["react-native", "start", "--port", options.port];
+			if (existsSync(navigationMetroPath) && navConfig) {
+				const routesDir = resolve(projectRoot, navConfig.routesDir);
+				const generatedDir = resolve(projectRoot, navConfig.generatedDir);
 
-			if (options.resetCache) {
-				args.push("--reset-cache");
+				if (existsSync(routesDir)) {
+					try {
+						// Dynamic require from user's node_modules
+						// eslint-disable-next-line @typescript-eslint/no-require-imports
+						const { generateAllRouteFiles } = require(navigationMetroPath) as {
+							generateAllRouteFiles: (opts: {
+								routesDir: string;
+								generatedDir: string;
+								prefixes: string[];
+								verbose: boolean;
+							}) => void;
+						};
+						generateAllRouteFiles({
+							routesDir,
+							generatedDir,
+							prefixes: [],
+							verbose: options.verbose,
+						});
+						if (options.verbose) {
+							console.log(chalk.gray("Generated route types\n"));
+						}
+					} catch {
+						// Ignore - Metro will regenerate
+					}
+				}
 			}
 
-			if (options.verbose) {
-				args.push("--verbose");
-			}
+			console.log(chalk.blue("Starting Metro bundler...\n"));
 
-			const proc = spawn("npx", args, {
-				stdio: "inherit",
-				shell: true,
+			const metroProcess = startBundlerBackground({
+				port: options.port,
+				resetCache: options.resetCache,
+				verbose: options.verbose,
 				cwd: projectRoot,
-				env: {
-					...process.env,
-					// Ensure proper encoding for CocoaPods compatibility
-					LANG: "en_US.UTF-8",
-				},
 			});
 
-			proc.on("error", (error) => {
-				console.error(chalk.red(`Failed to start Metro: ${error.message}`));
-				process.exit(1);
-			});
+			// Handle cleanup on SIGINT/SIGTERM
+			const cleanup = () => {
+				metroProcess.kill("SIGTERM");
+				process.exit(0);
+			};
+			process.on("SIGINT", cleanup);
+			process.on("SIGTERM", cleanup);
 
-			proc.on("close", (code) => {
-				if (code !== 0 && code !== null) {
-					process.exit(code);
-				}
-			});
+			// Attach to foreground with interactive input (r, j, d, etc.)
+			attachBundlerToForeground(metroProcess);
 		});
 
 	return dev;

package/src/cli/commands/run.ts

@@ -12,7 +12,7 @@
 
 import { type ChildProcess, exec, spawn } from "node:child_process";
 import { existsSync } from "node:fs";
-import { join } from "node:path";
+import { join, resolve } from "node:path";
 import { createInterface } from "node:readline";
 import { promisify } from "node:util";
 import chalk from "chalk";
@@ -20,6 +20,7 @@ import { Command } from "commander";
 import ora from "ora";
 import { attachBundlerToForeground, startBundlerBackground, waitForBundlerReady } from "../../utils/bundler";
 import { getAppScheme, launchAppWithBundler } from "../../utils/deep-link";
+import { getNavigationConfig } from "../../utils/metro-config";
 
 const execAsync = promisify(exec);
 
@@ -336,6 +337,40 @@ export function createRunCommand(): Command {
 
 				// Start Metro bundler FIRST (unless --no-bundler or --release)
 				if (options.bundler && !options.release) {
+					// Pre-generate routes if navigation-metro is installed
+					const projectRoot = process.cwd();
+					const navigationMetroPath = join(projectRoot, "node_modules/@teardown/navigation-metro");
+					const navConfig = getNavigationConfig(projectRoot);
+
+					if (existsSync(navigationMetroPath) && navConfig) {
+						const routesDir = resolve(projectRoot, navConfig.routesDir);
+						const generatedDir = resolve(projectRoot, navConfig.generatedDir);
+
+						if (existsSync(routesDir)) {
+							try {
+								// Dynamic require from user's node_modules
+								// eslint-disable-next-line @typescript-eslint/no-require-imports
+								const { generateAllRouteFiles } = require(navigationMetroPath) as {
+									generateAllRouteFiles: (opts: {
+										routesDir: string;
+										generatedDir: string;
+										prefixes: string[];
+										verbose: boolean;
+									}) => void;
+								};
+								const slug = getAppScheme(projectRoot) || "app";
+								generateAllRouteFiles({
+									routesDir,
+									generatedDir,
+									prefixes: [`${slug}://`],
+									verbose: false,
+								});
+							} catch {
+								// Ignore - Metro will regenerate
+							}
+						}
+					}
+
 					metroProcess = await startMetroAndWait(options.port, platform);
 				}
 

package/src/config/loader.ts

@@ -358,6 +358,11 @@ export default defineConfig({
     backgroundColor: '#FFFFFF',
   },
 
+  navigation: {
+    routesDir: './src/_routes',
+    generatedDir: './.teardown',
+  },
+
   plugins: [
     // Add your plugins here
   ],

package/src/config/schema.ts

@@ -108,6 +108,20 @@ export const PluginEntrySchema = z.union([
 	z.tuple([z.any()]),
 ]);
 
+/**
+ * Navigation configuration schema
+ */
+export const NavigationConfigSchema = z.object({
+	/** Path to routes directory relative to project root */
+	routesDir: z.string().optional().default("./src/_routes"),
+
+	/** Path for generated type files */
+	generatedDir: z.string().optional().default("./.teardown"),
+
+	/** Auto-populate new route files with template content */
+	autoTemplate: z.boolean().optional().default(true),
+});
+
 /**
  * Main Teardown configuration schema
  */
@@ -150,6 +164,9 @@ export const TeardownConfigSchema = z.object({
 
 	/** Environment variables to inject */
 	env: z.record(z.string(), z.string()).optional(),
+
+	/** Navigation configuration */
+	navigation: NavigationConfigSchema.optional(),
 });
 
 /**
@@ -241,3 +258,4 @@ export type TeardownConfig = z.infer<typeof TeardownConfigSchema>;
 export type iOSConfig = z.infer<typeof iOSConfigSchema>;
 export type AndroidConfig = z.infer<typeof AndroidConfigSchema>;
 export type SplashConfig = z.infer<typeof SplashConfigSchema>;
+export type NavigationConfig = z.infer<typeof NavigationConfigSchema>;

package/src/utils/index.ts

@@ -41,5 +41,7 @@ export {
 	formatKeyValue,
 	formatList,
 } from "./logger";
+export type { NavigationConfig } from "./metro-config";
+export { getNavigationConfig, parseNavigationConfig } from "./metro-config";
 export type { ReporterStep, StepStatus, TerminalReporterConfig } from "./terminal-reporter";
 export { createReporter, TerminalReporter } from "./terminal-reporter";

package/src/utils/metro-config.ts

@@ -0,0 +1,155 @@
+/**
+ * Metro Config Parser
+ *
+ * Extracts navigation configuration from teardown.config.ts or metro.config.js
+ */
+
+import { existsSync, readFileSync } from "node:fs";
+import { join } from "node:path";
+
+/**
+ * Navigation options extracted from config files
+ */
+export interface NavigationConfig {
+	routesDir: string;
+	generatedDir: string;
+}
+
+/**
+ * Default navigation configuration
+ */
+const DEFAULT_CONFIG: NavigationConfig = {
+	routesDir: "./src/_routes",
+	generatedDir: "./.teardown",
+};
+
+/**
+ * Config file names to search for teardown config (in order of priority)
+ */
+const TEARDOWN_CONFIG_FILES = [
+	"teardown.config.ts",
+	"teardown.config.js",
+	"teardown.config.mjs",
+	"launchpad.config.ts",
+];
+
+/**
+ * Finds metro.config.js in the project
+ */
+function findMetroConfig(projectRoot: string): string | null {
+	const configNames = ["metro.config.js", "metro.config.cjs", "metro.config.mjs"];
+
+	for (const name of configNames) {
+		const configPath = join(projectRoot, name);
+		if (existsSync(configPath)) {
+			return configPath;
+		}
+	}
+
+	return null;
+}
+
+/**
+ * Parses metro.config.js to extract withTeardownNavigation options
+ *
+ * This uses simple regex parsing since we can't safely evaluate the JS file.
+ * It looks for patterns like:
+ *   withTeardownNavigation(config, { routesDir: "./src/_routes", generatedDir: "./.teardown" })
+ */
+export function parseNavigationConfig(projectRoot: string): NavigationConfig | null {
+	const configPath = findMetroConfig(projectRoot);
+	if (!configPath) {
+		return null;
+	}
+
+	try {
+		const content = readFileSync(configPath, "utf-8");
+
+		// Check if withTeardownNavigation is used
+		if (!content.includes("withTeardownNavigation")) {
+			return null;
+		}
+
+		// Extract routesDir using regex
+		// Matches: routesDir: "./src/_routes" or routesDir: './src/_routes'
+		const routesDirMatch = content.match(/routesDir:\s*['"]([^'"]+)['"]/);
+		const routesDir = routesDirMatch ? routesDirMatch[1] : DEFAULT_CONFIG.routesDir;
+
+		// Extract generatedDir using regex
+		const generatedDirMatch = content.match(/generatedDir:\s*['"]([^'"]+)['"]/);
+		const generatedDir = generatedDirMatch ? generatedDirMatch[1] : DEFAULT_CONFIG.generatedDir;
+
+		return {
+			routesDir,
+			generatedDir,
+		};
+	} catch {
+		return null;
+	}
+}
+
+/**
+ * Parses teardown.config.ts to extract navigation options
+ *
+ * This uses simple regex parsing since we can't safely evaluate the TS file at runtime.
+ */
+function parseTeardownConfig(projectRoot: string): NavigationConfig | null {
+	for (const fileName of TEARDOWN_CONFIG_FILES) {
+		const configPath = join(projectRoot, fileName);
+		if (existsSync(configPath)) {
+			try {
+				const content = readFileSync(configPath, "utf-8");
+
+				// Check if navigation config exists
+				if (!content.includes("navigation:") && !content.includes("navigation :")) {
+					continue;
+				}
+
+				// Extract routesDir using regex
+				const routesDirMatch = content.match(/routesDir:\s*['"]([^'"]+)['"]/);
+				const generatedDirMatch = content.match(/generatedDir:\s*['"]([^'"]+)['"]/);
+
+				// Only return if we found at least one navigation property
+				if (routesDirMatch || generatedDirMatch) {
+					return {
+						routesDir: routesDirMatch?.[1] ?? DEFAULT_CONFIG.routesDir,
+						generatedDir: generatedDirMatch?.[1] ?? DEFAULT_CONFIG.generatedDir,
+					};
+				}
+			} catch {
+				// Ignore read errors and try next config file
+			}
+		}
+	}
+	return null;
+}
+
+/**
+ * Gets navigation config for a project, with fallbacks
+ *
+ * Priority:
+ * 1. teardown.config.ts navigation section
+ * 2. metro.config.js withTeardownNavigation options
+ * 3. Default config if routes directory exists
+ */
+export function getNavigationConfig(projectRoot: string): NavigationConfig | null {
+	// Try to parse from teardown.config.ts first (single source of truth)
+	const teardownConfig = parseTeardownConfig(projectRoot);
+	if (teardownConfig) {
+		return teardownConfig;
+	}
+
+	// Fallback: parse from metro.config.js (backwards compatibility)
+	const metroConfig = parseNavigationConfig(projectRoot);
+	if (metroConfig) {
+		return metroConfig;
+	}
+
+	// Fallback: check if default routes dir exists
+	const defaultRoutesPath = join(projectRoot, DEFAULT_CONFIG.routesDir);
+	if (existsSync(defaultRoutesPath)) {
+		return DEFAULT_CONFIG;
+	}
+
+	return null;
+}

package/templates/.teardown/linking.generated.ts

@@ -0,0 +1,11 @@
+// Auto-generated by @teardown/navigation
+import type { LinkingOptions } from "@react-navigation/native";
+import type { RouteParams } from "./routes.generated";
+
+export const generatedLinkingConfig: LinkingOptions<RouteParams>["config"] = {
+	screens: {
+		"/home": "home",
+	},
+};
+
+export const defaultPrefixes: string[] = ["app://"];

package/templates/.teardown/manifest.json

@@ -0,0 +1,18 @@
+{
+  "generatedAt": "2026-01-31T19:48:52.201Z",
+  "routeCount": 1,
+  "routes": [
+    {
+      "path": "",
+      "file": "_layout.tsx",
+      "params": [],
+      "layoutType": "stack"
+    },
+    {
+      "path": "/home",
+      "file": "home.tsx",
+      "params": [],
+      "layoutType": "none"
+    }
+  ]
+}

package/templates/.teardown/register.d.ts

@@ -0,0 +1,9 @@
+// Auto-generated by @teardown/navigation
+import type { RouteParams, RoutePath } from "./routes.generated";
+
+declare module '@teardown/navigation' {
+	interface Register {
+		routeParams: RouteParams;
+		routePath: RoutePath;
+	}
+}

package/templates/.teardown/routeTree.generated.ts

@@ -0,0 +1,42 @@
+/* eslint-disable */
+// @ts-nocheck
+
+// Auto-generated by @teardown/navigation
+// Do not edit this file directly
+// Generated at: 2026-01-31T19:48:52.202Z
+
+import type { NavigatorNode } from "@teardown/navigation";
+
+import layout from "../src/_routes/_layout";
+import home from "../src/_routes/home";
+
+export const routeTree: NavigatorNode =
+{
+	type: "stack",
+	layout: layout,
+	screens: {
+		"home": {
+			screen: home,
+			path: "/home",
+		},
+	},
+};
+
+// Flat screens export for backwards compatibility
+export const screens = {
+	"/home": home,
+} as const;
+
+export const layouts = {
+	"src__routes": layout,
+} as const;
+
+export type Screens = typeof screens;
+export type Layouts = typeof layouts;
+export type RouteTreeType = typeof routeTree;
+
+export const routePaths = [
+	"/home",
+] as const;
+
+export type RoutePath = (typeof routePaths)[number];

package/templates/.teardown/routes.generated.ts

@@ -0,0 +1,19 @@
+// Auto-generated by @teardown/navigation
+// Do not edit this file directly
+// Generated at: 2026-01-31T19:48:52.201Z
+
+export interface RouteParams {
+	"/home": undefined;
+}
+
+export type RoutePath = keyof RouteParams;
+
+export type ParamsFor<T extends RoutePath> = RouteParams[T];
+
+export type RouteWithParams = {
+	[K in RoutePath]: RouteParams[K] extends undefined
+		? { path: K }
+		: { path: K; params: RouteParams[K] };
+}[RoutePath];
+
+export type NavigatorType = "stack" | "tabs" | "drawer";

package/templates/metro.config.js

@@ -11,12 +11,11 @@ const { getDefaultConfig, mergeConfig } = require("@react-native/metro-config");
  * - Monorepo/workspace detection and watch folder configuration
  * - Bun-specific handling (.bun directory blocking)
  *
- *
  * withTeardownNavigation() automatically handles:
  * - Type-safe route generation from file-based routes
  * - Deep linking configuration generation
  * - Hot-reload support via file watching in development
- *
+ * - Reads routesDir/generatedDir from teardown.config.ts navigation section
  *
  * withUniwindConfig() enables:
  * - Tailwind CSS 4 support for React Native
@@ -29,11 +28,8 @@ const config = {};
 
 const teardownConfig = withTeardown(mergeConfig(getDefaultConfig(__dirname), config));
 
-const navigationConfig = withTeardownNavigation(teardownConfig, {
-	routesDir: "./src/_routes",
-	generatedDir: "./.teardown",
-	verbose: false,
-});
+// Navigation config is read from teardown.config.ts navigation section
+const navigationConfig = withTeardownNavigation(teardownConfig);
 
 module.exports = withUniwindConfig(navigationConfig, {
 	cssEntryFile: "./src/global.css",

package/templates/src/_routes/home.tsx

@@ -51,7 +51,7 @@ function HomeScreen() {
 					<Card.Title>Getting Started</Card.Title>
 					<Card.Description>
 						1. Explore the components in src/components/ui/{"\n"}
-						2. Add new routes in src/routes/{"\n"}
+						2. Add new routes in src/_routes/{"\n"}
 						3. Customize the theme in global.css{"\n"}
 						4. Build your app!
 					</Card.Description>

package/templates/src/components/ui/text.tsx

@@ -97,17 +97,13 @@ const Text = (props: TextProps) => {
 				invert: invert,
 			}),
 			textClassName,
-			className,
+			className
 		);
 	}, [variant, color, invert, textClassName, className]);
 
 	return (
 		<TextClassContext.Provider value={classNames}>
-			<Animated.Text
-				{...otherProps}
-				className={classNames}
-				allowFontScaling={false}
-			/>
+			<Animated.Text {...otherProps} className={classNames} allowFontScaling={false} />
 		</TextClassContext.Provider>
 	);
 };