@teamscala/service-boot 0.23.447 → 0.23.448

package/package.json

@@ -6,7 +6,7 @@
   },
   "name": "@teamscala/service-boot",
   "type": "module",
-  "version": "0.23.447",
+  "version": "0.23.448",
   "sideEffects": false,
   "imports": {
     "#service-boot/*": "./src/*",

package/src/read-html-template.ts

@@ -53,6 +53,7 @@
 
 import { createCache } from "@teamscala/cache/create-cache";
 import { readClientBuildStatus } from "./build-client-assets/manifest.ts";
+import { themeFontsLink } from "./theme-fonts-link.ts";
 import { join } from "node:path";
 
 interface AssetManifest {
@@ -67,7 +68,7 @@ const PAGE_DOCUMENT = `<!doctype html>
 		<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, interactive-widget=resizes-content" />
 		<link rel="preconnect" href="https://fonts.googleapis.com" />
 		<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-		<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=optional" />
+		<!--theme-fonts-->
 		<link rel="stylesheet" href="{{stylesPath}}" />
 		<!--head-outlet-->
 	</head>
@@ -140,7 +141,11 @@ export async function readHtmlTemplate(): Promise<string> {
 	}
 	let html = PAGE_DOCUMENT
 		.replace(/\{\{stylesPath\}\}/g, manifest.stylesPath)
-		.replace(/\{\{hydratePath\}\}/g, manifest.hydratePath);
+		.replace(/\{\{hydratePath\}\}/g, manifest.hydratePath)
+		// The head's font families derive from the css_theme row (one source);
+		// captured at cache build — boot-time semantics, a row edit reaches the
+		// envelope on the next service restart.
+		.replace("<!--theme-fonts-->", () => themeFontsLink());
 	// Tombstone stamp — surfaces a failed client build at the served layer.
 	// `<meta>` in <head> is the minimum-invasive vehicle (no layout shift, no
 	// JS dependency, visible via view-source / devtools / a future status

package/src/theme-fonts-link.test.ts

@@ -0,0 +1,98 @@
+/**
+ * @system ui-service-boot
+ * @status handwritten
+ * @edit edit directly
+ *
+ * The served <head> carries every font family the css_theme row declares —
+ * derived from the row (one source), never a hard-coded family list. The old
+ * envelope loaded only Inter, so the proposal heading variant's manuscript
+ * serif never loaded and fell back to Times (2026-09-02).
+ */
+
+import { describe, expect, mock, test } from "bun:test";
+
+type ConfigRow = { fonts?: Record<string, string> } | undefined;
+let injectedConfig: ConfigRow;
+
+mock.module("@teamscala/db/registry/accessors", () => ({
+	getEntryConfig: (_type: string, _slug: string) => injectedConfig,
+}));
+
+const { readHtmlTemplate } = await import("./read-html-template.ts");
+const { primaryFontFamily, themeFontFamilies, themeFontsLink } = await import(
+	"./theme-fonts-link.ts"
+);
+
+const { mkdir, mkdtemp, rm } = await import("node:fs/promises");
+const { tmpdir } = await import("node:os");
+const { join } = await import("node:path");
+const { beforeEach, afterEach } = await import("bun:test");
+
+let dir: string;
+let origCwd: string;
+
+beforeEach(async () => {
+	origCwd = process.cwd();
+	dir = await mkdtemp(join(tmpdir(), "theme-fonts-link-"));
+	await mkdir(join(dir, "dist", "client"), { recursive: true });
+	process.chdir(dir);
+});
+
+afterEach(async () => {
+	process.chdir(origCwd);
+	await rm(dir, { recursive: true, force: true });
+});
+
+async function writeManifest(): Promise<void> {
+	await Bun.file(
+		join(dir, "dist", "client", "asset-manifest.json"),
+	).write(
+		`${JSON.stringify({ stylesPath: "/assets/styles.css", hydratePath: "/assets/hydrate.js" }, null, 2)}\n`,
+	);
+}
+
+async function servedHead(): Promise<string> {
+	await writeManifest();
+	const html = await readHtmlTemplate();
+	return html.slice(0, html.indexOf("</head>"));
+}
+
+describe("theme-fonts-link", () => {
+	test("primaryFontFamily takes the first family of a stack", () => {
+		expect(primaryFontFamily("Inter, sans-serif")).toBe("Inter");
+		expect(primaryFontFamily("'Playfair Display'")).toBe("Playfair Display");
+	});
+
+	test("families derive from the css_theme row, deduplicated", () => {
+		injectedConfig = {
+			fonts: {
+				body: "Inter, sans-serif",
+				heading: "Inter, sans-serif",
+				manuscript: "Playfair Display",
+			},
+		};
+		expect(themeFontFamilies()).toEqual(["Inter", "Playfair Display"]);
+	});
+
+	test("the served head carries every family the row declares", async () => {
+		injectedConfig = {
+			fonts: {
+				body: "Inter, sans-serif",
+				heading: "Inter, sans-serif",
+				manuscript: "Playfair Display",
+			},
+		};
+		const head = await servedHead();
+		expect(head).toContain("family=Inter");
+		expect(head).toContain(encodeURIComponent("Playfair Display"));
+		expect(head).not.toContain("<!--theme-fonts-->");
+	});
+
+	test("an absent row degrades to no fonts link — never throws", async () => {
+		injectedConfig = undefined;
+		expect(themeFontsLink()).toBe("");
+		const head = await servedHead();
+		expect(head).not.toContain("fonts.googleapis.com/css2");
+		expect(head).toContain("<!--head-outlet-->");
+	});
+});

package/src/theme-fonts-link.ts

@@ -0,0 +1,64 @@
+/**
+ * @system ui-service-boot
+ * @status handwritten
+ * @edit edit directly
+ *
+ * Derives the document head's Google Fonts link from the `css_theme` row's
+ * `fonts` map — the ONE source for the families a page's variants reference
+ * (`the-theme-decides-colour-not-the-component` extends to type). The old
+ * envelope hard-coded Inter, so a proposal heading naming a manuscript serif
+ * ("Playfair Display") never had its family loaded and fell back to Times
+ * (2026-09-02). Now every family the row declares is loaded; a family a
+ * variant names that the row does not declare is a row defect, caught at the
+ * row's schema boundary.
+ *
+ * Read from the boot registry cache (captured at service boot, the same
+ * semantics as the resource_loader capture) and guarded: a missing or
+ * unreadable row degrades to NO fonts link — system fonts render, the page
+ * still works. This module must never throw into the document builder.
+ */
+
+import { getEntryConfig } from "@teamscala/db/registry/accessors";
+
+interface ThemeFontsConfig {
+	fonts?: Record<string, string>;
+}
+
+/** The primary family name of a CSS font stack: "Inter, sans-serif" →
+ * "Inter"; "Playfair Display" → "Playfair Display". */
+export function primaryFontFamily(stack: string): string {
+	const first = stack.split(",")[0] ?? "";
+	return first.trim().replace(/^['"]|['"]$/g, "");
+}
+
+/** The declared theme families, deduplicated by primary family, in row
+ * order (body, heading, manuscript, mono…). Empty when the row is absent. */
+export function themeFontFamilies(): string[] {
+	try {
+		const config = getEntryConfig<ThemeFontsConfig>("css_theme", "default");
+		const fonts = config?.fonts ?? {};
+		const seen = new Set<string>();
+		const families: string[] = [];
+		for (const value of Object.values(fonts)) {
+			if (typeof value !== "string" || value.trim() === "") continue;
+			const primary = primaryFontFamily(value);
+			if (primary === "" || seen.has(primary)) continue;
+			seen.add(primary);
+			families.push(primary);
+		}
+		return families;
+	} catch {
+		return [];
+	}
+}
+
+/** The <link> tag loading every declared theme family, or "" when none. */
+export function themeFontsLink(): string {
+	const families = themeFontFamilies();
+	if (families.length === 0) return "";
+	const WEIGHTS = "400;500;600;700";
+	const params = families
+		.map((family) => `family=${encodeURIComponent(family)}:wght@${WEIGHTS}`)
+		.join("&");
+	return `<link rel="stylesheet" href="https://fonts.googleapis.com/css2?${params}&display=optional" />`;
+}