@timber-js/app 0.1.57 → 0.2.0-alpha.10

package/dist/index.js

@@ -1,7 +1,7 @@
-import { r as setViteServer, t as formatSize } from "./_chunks/format-DNt20Kt8.js";
-import { i as scanRoutes, n as generateRouteMap, t as collectInterceptionRewrites } from "./_chunks/interception-DGDIjDbR.js";
+import { r as setViteServer, t as formatSize } from "./_chunks/format-DviM89f0.js";
+import { i as scanRoutes, n as generateRouteMap, t as collectInterceptionRewrites } from "./_chunks/interception-BOoWmLUA.js";
 import { existsSync, readFileSync } from "node:fs";
-import { dirname, extname, join, resolve } from "node:path";
+import { dirname, extname, join, normalize, resolve } from "node:path";
 import { fileURLToPath, pathToFileURL } from "node:url";
 import { createRequire } from "node:module";
 import react from "@vitejs/plugin-react";
@@ -11933,7 +11933,9 @@ function generateConfigModule(ctx) {
 		slowPhaseMs: ctx.config.dev?.slowPhaseMs ?? 200,
 		slowRequestMs: ctx.config.slowRequestMs ?? 3e3,
 		cookieSecrets,
-		topLoader: ctx.config.topLoader
+		topLoader: ctx.config.topLoader,
+		responseCache: ctx.config.responseCache,
+		debug: ctx.config.debug ?? false
 	};
 	return [
 		"// Auto-generated runtime config — do not edit.",
@@ -11951,12 +11953,14 @@ function generateConfigModule(ctx) {
 * extensions as timber.config.ts detection.
 */
 function detectInstrumentationFile(root) {
-	for (const ext of [
+	const extensions = [
 		".ts",
 		".js",
 		".mjs"
-	]) {
-		const candidate = resolve(root, `instrumentation${ext}`);
+	];
+	const dirs = [root, resolve(root, "src")];
+	for (const dir of dirs) for (const ext of extensions) {
+		const candidate = resolve(dir, `instrumentation${ext}`);
 		if (existsSync(candidate)) return candidate;
 	}
 	return null;
@@ -12016,17 +12020,20 @@ function timberEntries(ctx) {
 //#region src/plugins/mdx.ts
 var MDX_EXTENSIONS = ["mdx", "md"];
 /**
-* Check if mdx-components.tsx (or .ts, .jsx, .js) exists at the project root.
+* Check if mdx-components.tsx (or .ts, .jsx, .js) exists at the project root
+* or in src/. Root takes precedence, matching Next.js behavior.
 * Returns the absolute path if found, otherwise undefined.
 */
 function findMdxComponents(root) {
-	for (const name of [
+	const candidates = [
 		"mdx-components.tsx",
 		"mdx-components.ts",
 		"mdx-components.jsx",
 		"mdx-components.js"
-	]) {
-		const p = join(root, name);
+	];
+	const dirs = [root, join(root, "src")];
+	for (const dir of dirs) for (const name of candidates) {
+		const p = join(dir, name);
 		if (existsSync(p)) return p;
 	}
 }
@@ -12540,6 +12547,58 @@ export const coerce = stub;
 	};
 }
 //#endregion
+//#region src/fonts/css.ts
+/**
+* Generate a single `@font-face` CSS rule from a descriptor.
+*/
+function generateFontFace(desc) {
+	const lines = [];
+	lines.push("@font-face {");
+	lines.push(`  font-family: '${desc.family}';`);
+	lines.push(`  src: ${desc.src};`);
+	if (desc.weight) lines.push(`  font-weight: ${desc.weight};`);
+	if (desc.style) lines.push(`  font-style: ${desc.style};`);
+	if (desc.display) lines.push(`  font-display: ${desc.display};`);
+	if (desc.unicodeRange) lines.push(`  unicode-range: ${desc.unicodeRange};`);
+	lines.push("}");
+	return lines.join("\n");
+}
+/**
+* Generate multiple `@font-face` rules from an array of descriptors.
+*/
+function generateFontFaces(descriptors) {
+	return descriptors.map(generateFontFace).join("\n\n");
+}
+/**
+* Generate a scoped CSS class that sets a CSS custom property for the font.
+*
+* Example output:
+* ```css
+* .timber-font-inter {
+*   --font-sans: 'Inter', 'Inter Fallback', system-ui, sans-serif;
+* }
+* ```
+*/
+function generateVariableClass(className, variable, fontFamily) {
+	return `.${className} {\n  ${variable}: ${fontFamily};\n}`;
+}
+/**
+* Generate a scoped CSS class that applies font-family directly.
+*
+* Used when no `variable` is specified — the className applies
+* the font-family inline instead of through a CSS custom property.
+*
+* Example output:
+* ```css
+* .timber-font-inter {
+*   font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
+* }
+* ```
+*/
+function generateFontFamilyClass(className, fontFamily) {
+	return `.${className} {\n  font-family: ${fontFamily};\n}`;
+}
+//#endregion
 //#region src/fonts/fallbacks.ts
 /**
 * Lookup table for commonly used Google Fonts.
@@ -12678,6 +12737,26 @@ function getGenericFamily(family) {
 	return "sans-serif";
 }
 /**
+* Generate the full CSS for a size-adjusted fallback font.
+*
+* This produces a complete @font-face block with override descriptors
+* that FontFaceDescriptor doesn't natively support.
+*/
+function generateFallbackCss(family) {
+	const metrics = FALLBACK_METRICS[family.toLowerCase()];
+	if (!metrics) return null;
+	return [
+		"@font-face {",
+		`  font-family: '${`${family} Fallback`}';`,
+		`  src: local('${metrics.fallbackFont}');`,
+		`  size-adjust: ${metrics.sizeAdjust}%;`,
+		`  ascent-override: ${metrics.ascentOverride}%;`,
+		`  descent-override: ${metrics.descentOverride}%;`,
+		`  line-gap-override: ${metrics.lineGapOverride}%;`,
+		"}"
+	].join("\n");
+}
+/**
 * Check whether fallback metrics are available for a font family.
 */
 function hasFallbackMetrics(family) {
@@ -13026,6 +13105,26 @@ function generateFamilyName(sources) {
 	return stem.replace(/[-_]?(Regular|Bold|Italic|Light|Medium|SemiBold|ExtraBold|Thin|Black|Heavy)$/i, "") || stem;
 }
 /**
+* Generate @font-face descriptors for local font sources.
+*
+* Each source entry produces one @font-face rule. The `src` descriptor
+* uses a `url()` pointing to the served path under `/_timber/fonts/`.
+* The `urlPrefix` defaults to `/_timber/fonts` — the path used by both
+* the dev server middleware and the production build output.
+*/
+function generateLocalFontFaces(family, sources, display, urlPrefix = "/_timber/fonts") {
+	return sources.map((entry) => {
+		const format = inferFontFormat(entry.path);
+		return {
+			family,
+			src: `url('${urlPrefix}/${entry.path.split("/").pop() ?? entry.path}') format('${format}')`,
+			weight: entry.weight,
+			style: entry.style,
+			display
+		};
+	});
+}
+/**
 * Build the className for a local font, following the same convention
 * as Google fonts: `timber-font-<lowercase-hyphenated-family>`.
 */
@@ -13261,6 +13360,22 @@ var VIRTUAL_LOCAL = "@timber/fonts/local";
 var RESOLVED_GOOGLE = "\0@timber/fonts/google";
 var RESOLVED_LOCAL = "\0@timber/fonts/local";
 /**
+* Virtual side-effect module that registers font CSS on globalThis.
+*
+* When a file calls localFont() or a Google font function, the transform
+* hook injects `import 'virtual:timber-font-css-register'` into that file.
+* This virtual module sets `globalThis.__timber_font_css` with the combined
+* @font-face CSS. The RSC entry reads it at render time to inline a <style> tag.
+*
+* This approach avoids timing issues because:
+* 1. The font file is in the RSC module graph (imported by layout.tsx)
+* 2. The side-effect import is added to the font file during transform
+* 3. When layout.tsx is loaded, fonts.ts runs → side-effect module runs → globalThis is set
+* 4. RSC entry renders → reads globalThis → inlines <style>
+*/
+var VIRTUAL_FONT_CSS_REGISTER = "virtual:timber-font-css-register";
+var RESOLVED_FONT_CSS_REGISTER = "\0virtual:timber-font-css-register";
+/**
 * Convert a font family name to a PascalCase export name.
 * e.g. "JetBrains Mono" → "JetBrains_Mono"
 */
@@ -13407,6 +13522,35 @@ function generateLocalVirtualModule() {
 	].join("\n");
 }
 /**
+* Generate CSS for a single extracted font.
+*
+* Includes @font-face rules (for local fonts), fallback @font-face,
+* and the scoped class rule.
+*/
+function generateFontCss(font) {
+	const cssParts = [];
+	if (font.provider === "local" && font.localSources) {
+		const faceCss = generateFontFaces(generateLocalFontFaces(font.family, font.localSources, font.display));
+		if (faceCss) cssParts.push(faceCss);
+	}
+	const fallbackCss = generateFallbackCss(font.family);
+	if (fallbackCss) cssParts.push(fallbackCss);
+	if (font.variable) cssParts.push(generateVariableClass(font.className, font.variable, font.fontFamily));
+	else cssParts.push(generateFontFamilyClass(font.className, font.fontFamily));
+	return cssParts.join("\n\n");
+}
+/**
+* Generate the CSS output for all extracted fonts.
+*
+* Includes @font-face rules for local fonts, fallback @font-face rules,
+* and scoped classes.
+*/
+function generateAllFontCss(registry) {
+	const cssParts = [];
+	for (const font of registry.values()) cssParts.push(generateFontCss(font));
+	return cssParts.join("\n\n");
+}
+/**
 * Parse the local name used for the default import of `@timber/fonts/local`.
 *
 * Handles:
@@ -13457,15 +13601,63 @@ function timberFonts(ctx) {
 	return {
 		name: "timber-fonts",
 		resolveId(id) {
-			if (id === VIRTUAL_GOOGLE) return RESOLVED_GOOGLE;
-			if (id === VIRTUAL_LOCAL) return RESOLVED_LOCAL;
+			let cleanId = id.startsWith("\0") ? id.slice(1) : id;
+			if (cleanId.startsWith(ctx.root)) {
+				const stripped = cleanId.slice(ctx.root.length);
+				if (stripped.startsWith("/") || stripped.startsWith("\\")) cleanId = stripped.slice(1);
+				else cleanId = stripped;
+			}
+			if (cleanId === VIRTUAL_GOOGLE) return RESOLVED_GOOGLE;
+			if (cleanId === VIRTUAL_LOCAL) return RESOLVED_LOCAL;
+			if (cleanId === VIRTUAL_FONT_CSS_REGISTER) return RESOLVED_FONT_CSS_REGISTER;
 			return null;
 		},
 		load(id) {
 			if (id === RESOLVED_GOOGLE) return generateGoogleVirtualModule(registry);
 			if (id === RESOLVED_LOCAL) return generateLocalVirtualModule();
+			if (id === RESOLVED_FONT_CSS_REGISTER) {
+				const css = generateAllFontCss(registry);
+				return `globalThis.__timber_font_css = ${JSON.stringify(css)};`;
+			}
 			return null;
 		},
+		configureServer(server) {
+			server.middlewares.use((req, res, next) => {
+				const url = req.url;
+				if (!url || !url.startsWith("/_timber/fonts/")) return next();
+				const requestedFilename = url.slice(15);
+				if (requestedFilename.includes("..") || requestedFilename.includes("/")) {
+					res.statusCode = 400;
+					res.end("Bad request");
+					return;
+				}
+				for (const font of registry.values()) {
+					if (font.provider !== "local" || !font.localSources) continue;
+					for (const src of font.localSources) if ((src.path.split("/").pop() ?? "") === requestedFilename) {
+						const absolutePath = normalize(resolve(src.path));
+						if (!existsSync(absolutePath)) {
+							res.statusCode = 404;
+							res.end("Not found");
+							return;
+						}
+						const data = readFileSync(absolutePath);
+						const ext = absolutePath.split(".").pop()?.toLowerCase();
+						res.setHeader("Content-Type", {
+							woff2: "font/woff2",
+							woff: "font/woff",
+							ttf: "font/ttf",
+							otf: "font/otf",
+							eot: "application/vnd.ms-fontopen"
+						}[ext ?? ""] ?? "application/octet-stream");
+						res.setHeader("Cache-Control", "public, max-age=31536000, immutable");
+						res.setHeader("Access-Control-Allow-Origin", "*");
+						res.end(data);
+						return;
+					}
+				}
+				next();
+			});
+		},
 		async buildStart() {
 			if (ctx.dev) return;
 			const googleFonts = [...registry.values()].filter((f) => f.provider === "google");
@@ -13521,10 +13713,13 @@ function timberFonts(ctx) {
 				}
 			}
 			if (hasLocalImport) transformedCode = transformLocalFonts(transformedCode, code, id, registry, this.error.bind(this));
-			if (transformedCode !== code) return {
-				code: transformedCode,
-				map: null
-			};
+			if (transformedCode !== code) {
+				if (registry.size > 0) transformedCode = `import '${VIRTUAL_FONT_CSS_REGISTER}';\n` + transformedCode;
+				return {
+					code: transformedCode,
+					map: null
+				};
+			}
 			return null;
 		},
 		generateBundle() {
@@ -13533,6 +13728,23 @@ function timberFonts(ctx) {
 				fileName: `_timber/fonts/${cf.hashedFilename}`,
 				source: cf.data
 			});
+			for (const font of registry.values()) {
+				if (font.provider !== "local" || !font.localSources) continue;
+				for (const src of font.localSources) {
+					const absolutePath = normalize(resolve(src.path));
+					if (!existsSync(absolutePath)) {
+						this.warn(`Local font file not found: ${absolutePath}`);
+						continue;
+					}
+					const basename = src.path.split("/").pop() ?? src.path;
+					const data = readFileSync(absolutePath);
+					this.emitFile({
+						type: "asset",
+						fileName: `_timber/fonts/${basename}`,
+						source: data
+					});
+				}
+			}
 			if (!ctx.buildManifest) return;
 			const cachedByFamily = /* @__PURE__ */ new Map();
 			for (const cf of cachedFonts) {
@@ -14237,7 +14449,15 @@ function timberReactProd() {
 *
 * Currently a no-op — Rolldown's default splitting produces the desired
 * output (one main bundle + per-route chunks). The plugin is retained as
-* a hook point for future chunking adjustments if needed.
+* a hook point for future chunking adjustments.
+*
+* NOTE: Ideally we'd use Rolldown's `format: 'app'` (module registry format)
+* which guarantees single-copy module semantics like webpack/Turbopack.
+* However, `format: 'app'` is not yet implemented in Rolldown rc.10.
+* Until it ships, singleton state in navigation-context.ts uses
+* globalThis + Symbol.for as a cross-chunk safety net.
+*
+* Design docs: 27-chunking-strategy.md
 */
 function timberChunks() {
 	return { name: "timber-chunks" };
@@ -14392,7 +14612,17 @@ function classifyRoute(segments, outputMode = "server") {
 function green(text) {
 	return `\x1b[92m${text}\x1b[39m`;
 }
-/** Walk the route tree and collect all leaf routes (pages + API endpoints). */
+/**
+* Walk the route tree and collect all leaf routes (pages + API endpoints).
+*
+* Parallel slots (`@artists`, `@shows`, etc.) are intentionally skipped —
+* they render alongside the parent page at the same URL and are not
+* separately URL-addressable. Their JS is captured in shared/layout chunks.
+*
+* After collection, entries are deduplicated by URL path so that overlapping
+* route groups (e.g. `(browse)` and `(marketing)` both producing `/`) only
+* appear once. The entry with the largest route-specific size wins.
+*/
 function collectRoutes(tree) {
 	const routes = [];
 	function walk(node, chain) {
@@ -14409,10 +14639,14 @@ function collectRoutes(tree) {
 			entryFilePath: node.route.filePath
 		});
 		for (const child of node.children) walk(child, currentChain);
-		for (const slot of node.slots.values()) walk(slot, currentChain);
 	}
 	walk(tree.root, []);
-	return routes;
+	const seen = /* @__PURE__ */ new Map();
+	for (const route of routes) {
+		const existing = seen.get(route.path);
+		if (!existing || route.segments.length > existing.segments.length) seen.set(route.path, route);
+	}
+	return Array.from(seen.values());
 }
 /** Produce formatted report lines for the Vite logger. */
 function buildRouteReport(entries, sharedSize) {