camox 0.59.0 → 0.60.2

package/dist/features/studio/components/ThreadMessages.js

@@ -14,9 +14,9 @@ import { MessageScroller, MessageScrollerButton, MessageScrollerContent, Message
 * A thread's messages, and the agent's squareling, which always lives in it. An empty thread has
 * it greet the editor; when the first message arrives, it moves to the end of the thread, and
 * stays there after each message. While a run is going or a message is still `sending` (on its
-* way to the thread, which hasn't accepted it yet), its face says whether the agent thinks or
-* acts (uses its tools, or builds its code). While the end of a turn builds the agent's code, or
-* the agent fixes a build error, it says so in words too. Each editor's message shows its
+* way to the thread, which hasn't accepted it yet), its face and a line beside it say what the
+* agent does, never how: thinking, looking around, making changes, building, fixing the build,
+* or starting a draft. Each editor's message shows its
 * sender's avatar, without their name. A Live turn handed off to a draft ends on the draft's
 * card, which `onOpenDraft` opens.
 */
@@ -154,73 +154,143 @@ function useSquarelingMorph(empty) {
 	return node;
 }
 /**
-* The squareling at the end of the thread: idle between turns, at work during one. Shown in the
-* last message, not after it: the scroller only brings a message the editor just sent into view
-* when it's appended last, and it arrives while the agent is already working.
+* The squareling at the end of the thread: idle between turns, at work during one, saying what
+* the agent does. Shown in the last message, not after it: the scroller only brings a message the
+* editor just sent into view when it's appended last, and it arrives while the agent is already
+* working.
 */
 function AgentPresence(t0) {
-	const $ = c(13);
+	const $ = c(8);
 	const { view: t1, working, squareling } = t0;
-	const { status, usingTools } = t1;
-	let t2;
-	if ($[0] !== status || $[1] !== usingTools || $[2] !== working) {
-		t2 = working ? squarelingStatus(status, usingTools) : "idle";
-		$[0] = status;
-		$[1] = usingTools;
-		$[2] = working;
-		$[3] = t2;
-	} else t2 = $[3];
+	const { activity } = t1;
+	const shown = useSteadyActivity(working ? activity ?? "thinking" : void 0);
+	const t2 = shown ? SQUARELING_STATUSES[shown] : "idle";
 	let t3;
-	if ($[4] !== squareling || $[5] !== t2) {
+	if ($[0] !== squareling || $[1] !== t2) {
 		t3 = /* @__PURE__ */ jsx(Squareling, {
 			ref: squareling,
 			status: t2,
 			className: "size-6"
 		});
-		$[4] = squareling;
-		$[5] = t2;
-		$[6] = t3;
-	} else t3 = $[6];
+		$[0] = squareling;
+		$[1] = t2;
+		$[2] = t3;
+	} else t3 = $[2];
 	let t4;
-	if ($[7] !== status || $[8] !== working) {
-		t4 = working && (status ? /* @__PURE__ */ jsx("span", {
+	if ($[3] !== shown) {
+		t4 = shown && /* @__PURE__ */ jsx("span", {
 			className: "shimmer",
-			children: STATUS_LINES[status]
-		}) : /* @__PURE__ */ jsx("span", {
-			className: "sr-only",
-			children: "Working…"
-		}));
-		$[7] = status;
-		$[8] = working;
-		$[9] = t4;
-	} else t4 = $[9];
+			children: ACTIVITY_LINES[shown]
+		});
+		$[3] = shown;
+		$[4] = t4;
+	} else t4 = $[4];
 	let t5;
-	if ($[10] !== t3 || $[11] !== t4) {
+	if ($[5] !== t3 || $[6] !== t4) {
 		t5 = /* @__PURE__ */ jsxs("div", {
 			role: "status",
 			className: "text-muted-foreground flex items-center gap-2 text-sm",
 			children: [t3, t4]
 		});
-		$[10] = t3;
-		$[11] = t4;
-		$[12] = t5;
-	} else t5 = $[12];
+		$[5] = t3;
+		$[6] = t4;
+		$[7] = t5;
+	} else t5 = $[7];
 	return t5;
 }
-function squarelingStatus(status, usingTools) {
-	if (status === "fixing") return "fixing";
-	return status === "building" || usingTools ? "acting" : "thinking";
+/**
+* How long a line saying what the agent does stays at least, in ms, so editors have time to read
+* it: a round of tool calls can take far less.
+*/
+const ACTIVITY_MIN_DURATION = 2e3;
+/**
+* How long the agent must keep doing something before a line says so, in ms: thinking briefly
+* between two rounds of tool calls never shows.
+*/
+const ACTIVITY_SETTLE_DURATION = 800;
+/**
+* `activity` as a line shows it, steadied: a new activity shows once it lasted
+* `ACTIVITY_SETTLE_DURATION` and the line before held for `ACTIVITY_MIN_DURATION`, so a brief
+* one never shows. Only the line lags: a turn that starts or ends shows at once.
+*/
+function useSteadyActivity(activity) {
+	const $ = c(10);
+	let t0;
+	if ($[0] !== activity) {
+		t0 = { activity };
+		$[0] = activity;
+		$[1] = t0;
+	} else t0 = $[1];
+	const [latest, setLatest] = React.useState(t0);
+	const [lasted, setLasted] = React.useState();
+	let t1;
+	if ($[2] !== activity) {
+		t1 = { activity };
+		$[2] = activity;
+		$[3] = t1;
+	} else t1 = $[3];
+	const [held, setHeld] = React.useState(t1);
+	const [settled, setSettled] = React.useState();
+	let t2;
+	let t3;
+	if ($[4] !== latest) {
+		t2 = () => {
+			const timer = setTimeout(() => setLasted(latest), 800);
+			return () => clearTimeout(timer);
+		};
+		t3 = [latest];
+		$[4] = latest;
+		$[5] = t2;
+		$[6] = t3;
+	} else {
+		t2 = $[5];
+		t3 = $[6];
+	}
+	React.useEffect(t2, t3);
+	let t4;
+	let t5;
+	if ($[7] !== held) {
+		t4 = () => {
+			const timer_0 = setTimeout(() => setSettled(held), ACTIVITY_MIN_DURATION);
+			return () => clearTimeout(timer_0);
+		};
+		t5 = [held];
+		$[7] = held;
+		$[8] = t4;
+		$[9] = t5;
+	} else {
+		t4 = $[8];
+		t5 = $[9];
+	}
+	React.useEffect(t4, t5);
+	if (activity !== latest.activity) setLatest({ activity });
+	else if (activity !== held.activity) {
+		if (!activity || !held.activity || lasted === latest && settled === held) setHeld({ activity });
+	}
+	return activity && (held.activity ?? activity);
 }
+const SQUARELING_STATUSES = {
+	thinking: "thinking",
+	exploring: "exploring",
+	changing: "changing",
+	building: "building",
+	fixing: "fixing",
+	startingDraft: "changing"
+};
+const ACTIVITY_LINES = {
+	thinking: "Thinking…",
+	exploring: "Looking around…",
+	changing: "Making changes…",
+	building: "Building…",
+	fixing: "Fixing the build…",
+	startingDraft: "Starting a draft…"
+};
 /** How a member's pushed code built, as the thread says it. */
 const PUSH_OUTCOMES = {
 	built: "Built, and in the preview.",
 	typeErrors: "Built, with type errors that block publishing.",
 	notPreviewed: "Built, but the preview can’t show it."
 };
-const STATUS_LINES = {
-	building: "Building…",
-	fixing: "Fixing a build error…"
-};
 function ThreadMessageRow(t0) {
 	const $ = c(36);
 	const { message, onOpenDraft } = t0;
@@ -506,4 +576,4 @@ function SenderAvatar(t0) {
 }
 
 //#endregion
-export { ThreadMessages };
+export { ACTIVITY_MIN_DURATION, ThreadMessages };

package/dist/features/studio/editorWhereContext.js

@@ -0,0 +1,11 @@
+import * as React from "react";
+
+//#region src/features/studio/editorWhereContext.ts
+/**
+* Where the editor is in the Website Section: the Page they look at, or the Canvas with no page
+* selected. Undefined elsewhere in the Studio. Their messages to the agent carry it as a hint.
+*/
+const EditorWhereContext = React.createContext(void 0);
+
+//#endregion
+export { EditorWhereContext };

package/dist/features/studio/useEditorSelection.js

@@ -0,0 +1,135 @@
+import { placedRecords } from "../../lib/normalized-data.js";
+import { reads, useReadQuery } from "../../lib/studio-reads.js";
+import { useBlockDefinition, useCollectionDefinition } from "../../lib/studio-definitions.js";
+import { isBlockPlacement, previewStore, selectionBlockId, selectionForOwner, selectionItemId } from "../preview/previewStore.js";
+import { entityName } from "../preview/entityName.js";
+import { contentFieldSchema } from "../preview/components/contentFieldSchema.js";
+import { formatFieldName } from "../preview/components/ItemFieldsEditor.js";
+import { getSchemaForItem } from "../preview/components/SelectionEditor.js";
+import { c } from "react/compiler-runtime";
+import { useSelector } from "@xstate/store-react";
+
+//#region src/features/studio/useEditorSelection.ts
+/** The owner the page the editor looks at edits, as the editing frame names it. */
+function ownerOf(where) {
+	if (where?.on !== "page") return null;
+	if (where.layoutId != null) return {
+		kind: "layout",
+		layoutId: where.layoutId
+	};
+	if (where.pageId != null) return {
+		kind: "page",
+		pageId: where.pageId
+	};
+	return null;
+}
+/** The selection as the agent reads it, from the parts the studio loaded. */
+function editorSelectionOf({ selection, block, items, schema, records, recordSchema }) {
+	const fieldLabel = (fieldSchema, fieldName) => contentFieldSchema(fieldSchema, fieldName)?.title ?? formatFieldName(fieldName);
+	const path = [];
+	const blockId = selectionBlockId(selection) ?? void 0;
+	if (blockId) path.push(block?.title ?? "Block");
+	for (const item of items) path.push(entityName(item, "Item"));
+	const recordSelected = selection.type === "record" || selection.type === "record-field";
+	if (recordSelected) path.push(...records.length > 0 ? records.map((record) => record.title || "Record") : ["Record"]);
+	let fieldName;
+	if (selection.type === "block-field" || selection.type === "item-field") {
+		fieldName = selection.fieldName;
+		path.push(fieldLabel(schema, fieldName));
+	} else if (selection.type === "record-field") {
+		fieldName = selection.recordFieldName;
+		path.push(fieldLabel(recordSchema, fieldName));
+	}
+	const itemId = selectionItemId(selection) ?? void 0;
+	const recordId = recordSelected ? selection.nested?.recordId ?? selection.recordId : void 0;
+	return {
+		path,
+		...blockId ? { blockId } : {},
+		...itemId ? { itemId } : {},
+		...recordId ? { recordId } : {},
+		...fieldName ? { fieldName } : {}
+	};
+}
+/**
+* What the editor has selected on the page they look at, as the agent reads it, or undefined
+* with nothing selected there.
+*/
+function useEditorSelection(where) {
+	const $ = c(12);
+	let t0;
+	if ($[0] !== where) {
+		t0 = ownerOf(where);
+		$[0] = where;
+		$[1] = t0;
+	} else t0 = $[1];
+	const owner = t0;
+	let t1;
+	if ($[2] !== owner) {
+		t1 = (state) => selectionForOwner(state.context, owner);
+		$[2] = owner;
+		$[3] = t1;
+	} else t1 = $[3];
+	const selection = useSelector(previewStore, t1);
+	const blockId = selectionBlockId(selection);
+	const itemId = selectionItemId(selection);
+	const t2 = blockId != null;
+	let t3;
+	if ($[4] !== t2) {
+		t3 = { enabled: t2 };
+		$[4] = t2;
+		$[5] = t3;
+	} else t3 = $[5];
+	const { data: bundle } = useReadQuery(reads.blockBundle(blockId), t3);
+	const blockDef = useBlockDefinition(bundle?.block.type);
+	bundle?.repeatableItems;
+	let t4;
+	if ($[6] !== bundle?.repeatableItems) {
+		t4 = bundle?.repeatableItems ?? [];
+		$[6] = bundle?.repeatableItems;
+		$[7] = t4;
+	} else t4 = $[7];
+	let t5;
+	if ($[8] !== t4) {
+		t5 = new Map(t4.map(_temp));
+		$[8] = t4;
+		$[9] = t5;
+	} else t5 = $[9];
+	const itemsMap = t5;
+	const items = [];
+	for (let item_0 = itemId ? itemsMap.get(itemId) : void 0; item_0;) {
+		items.unshift(item_0);
+		item_0 = item_0.parentItemId ? itemsMap.get(item_0.parentItemId) : void 0;
+	}
+	const schema = blockDef && itemId ? getSchemaForItem(blockDef.contentSchema, itemId, itemsMap) : blockDef?.contentSchema;
+	const records = [];
+	if ((selection?.type === "record" || selection?.type === "record-field") && isBlockPlacement(selection)) {
+		const placer = itemId ? items.at(-1) : bundle?.block;
+		let t6;
+		if ($[10] !== selection.recordId) {
+			t6 = (record) => record.id === selection.recordId;
+			$[10] = selection.recordId;
+			$[11] = t6;
+		} else t6 = $[11];
+		const outer = placedRecords(placer?.references, selection.fieldName).find(t6);
+		if (outer) records.push(outer);
+		const { nested } = selection;
+		const linked = nested && placedRecords(outer?.references, nested.fieldName).find((record_0) => record_0.id === nested.recordId);
+		if (linked) records.push(linked);
+	}
+	const recordSchema = useCollectionDefinition(records.at(-1)?.collectionId)?.contentSchema;
+	if (!selection) return;
+	return editorSelectionOf({
+		selection,
+		block: blockDef,
+		items,
+		schema,
+		records,
+		recordSchema
+	});
+}
+function _temp(item) {
+	return [item.id, item];
+}
+
+//#endregion
+export { editorSelectionOf, useEditorSelection };

package/dist/features/vite/hostedChecks.js

@@ -6,7 +6,7 @@ import { Visitor, parseSync } from "vite-plus";
 //#region src/features/vite/hostedChecks.ts
 /**
 * Set by Camox's revision and release sandboxes: a hosted project's build checks the code an
-* agent may have written (ADR 0021). `apps/landing` and dev mode never set it.
+* agent may have written (ADR 0021). Dev mode never sets it.
 */
 const HOSTED_BUILD_ENV = "CAMOX_INTERNAL_HOSTED";
 const sdkRoot = resolve(dirname(fileURLToPath(import.meta.url)), "../../..");

package/dist/features/vite/runtimeDev.js

@@ -73,7 +73,8 @@ function resolveCamoxSourceImport(id) {
 		"camox/_internal/rendererClient": resolve(sdkRoot, "src/features/runtime/rendererClient.tsx"),
 		"camox/_internal/studioServer": resolve(sdkRoot, "src/features/runtime/studioServer.tsx"),
 		"camox/_internal/runtime": resolve(sdkRoot, "src/features/runtime/runtime.ts"),
-		"camox/worker": resolve(sdkRoot, "src/features/runtime/worker.ts")
+		"camox/worker": resolve(sdkRoot, "src/features/runtime/worker.ts"),
+		"camox/_internal/workerRuntime": resolve(sdkRoot, "src/features/runtime/workerRuntime.ts")
 	}[id];
 	if (!sourceImport || !existsSync(sourceImport)) return;
 	return sourceImport;

package/dist/features/vite/sdkBundleBuild.js

@@ -0,0 +1,74 @@
+import { sdkBundleEntryFile } from "../sdkBundle/specifiers.js";
+import { SDK_BUNDLE_BUILD_MANIFEST, sdkBundlePath } from "../sdkBundle/sdkBundleName.js";
+import { SDK_BUNDLE_MANIFEST } from "../sdkBundle/buildSdkBundle.js";
+import { buildsAgainstSdkBundle, ensureLocalSdkBundle } from "../sdkBundle/localSdkBundle.js";
+import { createRequire } from "node:module";
+import { readFileSync, readdirSync } from "node:fs";
+import { dirname, join, posix, resolve } from "node:path";
+
+//#region src/features/vite/sdkBundleBuild.ts
+/**
+* The SDK Bundle a build builds against, from the local cache, or undefined when the switch is
+* off and the build is whole-app.
+*/
+async function sdkBundleBuildState({ root, settings, mayBuild }) {
+	if (!buildsAgainstSdkBundle()) return;
+	let built = false;
+	const bundle = await ensureLocalSdkBundle({
+		root,
+		settings,
+		mayBuild,
+		onBuild: () => {
+			built = true;
+		}
+	});
+	const names = {
+		browser: bundle.browser.name,
+		workerd: bundle.workerd.name
+	};
+	const stylesheet = readdirSync(bundle.browser.dir).find((file) => /^camox-studio-.*\.css$/.test(file));
+	if (!stylesheet) throw new Error(`Camox: the SDK Bundle ${names.browser} has no Studio stylesheet.`);
+	const websiteRequire = createRequire(join(root, "package.json"));
+	/** What each target holds: its entry files by specifier, and by the file a path specifier names. */
+	const held = (dir) => {
+		const { entries } = JSON.parse(readFileSync(join(dir, SDK_BUNDLE_MANIFEST), "utf8"));
+		const byFile = /* @__PURE__ */ new Map();
+		for (const specifier of Object.keys(entries)) if (/\.[cm]?js$/.test(specifier)) byFile.set(websiteRequire.resolve(specifier), sdkBundleEntryFile(specifier));
+		return {
+			entries,
+			byFile
+		};
+	};
+	const holds = {
+		browser: held(bundle.browser.dir),
+		workerd: held(bundle.workerd.dir)
+	};
+	return {
+		names,
+		built,
+		studioStylesheetUrl: sdkBundlePath(names.browser) + stylesheet,
+		manifest: {
+			fileName: SDK_BUNDLE_BUILD_MANIFEST,
+			source: `${JSON.stringify(names)}\n`
+		},
+		resolve(id, importer, consumer) {
+			const target = consumer === "client" ? "browser" : "workerd";
+			const { entries, byFile } = holds[target];
+			const file = Object.hasOwn(entries, id) ? entries[id] : id.startsWith(".") && importer ? byFile.get(resolve(dirname(importer), id)) : void 0;
+			if (!file) return;
+			return {
+				id: sdkBundlePath(names[target]) + file,
+				external: "absolute"
+			};
+		},
+		relativizeWorkerImports(code, fileName) {
+			const prefix = sdkBundlePath(names.workerd);
+			if (!code.includes(prefix)) return;
+			const toRoot = posix.relative(posix.dirname(fileName), "") || ".";
+			return code.replaceAll(new RegExp(`(["'\`])${prefix.replaceAll("/", "\\/")}`, "g"), `$1${toRoot}${prefix}`);
+		}
+	};
+}
+
+//#endregion
+export { sdkBundleBuildState };

package/dist/features/vite/staticAssetHeaders.js

@@ -5,17 +5,20 @@ import { join, relative } from "node:path";
 /** Where the client build puts the files it names by their content's hash. */
 const HASHED_DIRS = ["assets", "_chunks"];
 const IMMUTABLE = "public, max-age=31536000, immutable";
+/** Where a build against an SDK Bundle serves its files, under the bundle's name (ADR 0029). */
+const SDK_BUNDLE_DIR = "_camox/sdk";
 /** Workers Static Assets reads at most this many rules. */
 const MAX_RULES = 100;
 /**
 * The `_headers` file Workers Static Assets serves the client build with. Files under
 * `/assets/` and `/_chunks/` are named by their content's hash, so browsers keep them for good;
 * the files there named otherwise, the entry chunks pages load by a fixed name and whatever the
-* app's public directory puts there, keep the default, which revalidates. The app's own
-* `_headers` comes first, as it wrote it.
+* app's public directory puts there, keep the default, which revalidates. A build against an
+* SDK Bundle has its files under `/_camox/sdk/<name>/`, which never change under a name either.
+* The app's own `_headers` comes first, as it wrote it.
 */
-function staticAssetHeaders({ ownHeaders, unhashedFiles }) {
-	const rules = [...HASHED_DIRS.map((dir) => `/${dir}/*\n  Cache-Control: ${IMMUTABLE}`), ...[...unhashedFiles].sort().map((file) => `/${file}\n  ! Cache-Control`)];
+function staticAssetHeaders({ ownHeaders, unhashedFiles, sdkBundle = false }) {
+	const rules = [...(sdkBundle ? [...HASHED_DIRS, SDK_BUNDLE_DIR] : HASHED_DIRS).map((dir) => `/${dir}/*\n  Cache-Control: ${IMMUTABLE}`), ...[...unhashedFiles].sort().map((file) => `/${file}\n  ! Cache-Control`)];
 	const own = ownHeaders?.trimEnd();
 	const ownRules = own ? own.split("\n").filter((line) => /^\S/.test(line) && !line.startsWith("#")) : [];
 	if (ownRules.length + rules.length > MAX_RULES) throw new Error(`Camox: _headers would hold ${ownRules.length + rules.length} rules, past Workers Static Assets' ${MAX_RULES}. Move the public directory's files out of /assets/ and /_chunks/, or drop rules from public/_headers.`);

package/dist/features/vite/vite.d.ts

@@ -29,8 +29,6 @@ export interface CamoxPluginOptions {
     apiUrl?: string;
     /** URL of the Camox authentication backend (default: https://app.camox.ai) */
     authenticationUrl?: string;
-    /** Show Tanstack query devtools (default: false) */
-    enableTanstackDevtools?: boolean;
     /** Enable experimental features (default: false). */
     enableExperimentalFeatures?: boolean;
     /** Disable automatic code generation (route and layout files) (default: false) */

package/dist/features/vite/vite.js

@@ -10,6 +10,7 @@ import { installDevSignInLink } from "./devSignIn.js";
 import { HOSTED_BUILD_ENV, forbiddenImport, misnamedBlock, readHostedProject } from "./hostedChecks.js";
 import { generateIconTypes } from "./iconGeneration.js";
 import { generateLayoutFiles, watchLayoutFiles } from "./layoutGeneration.js";
+import { sdkBundleBuildState } from "./sdkBundleBuild.js";
 import { publicFilesInHashedDirs, readOwnHeaders, staticAssetHeaders, unhashedEntries } from "./staticAssetHeaders.js";
 import { buildClientThenWorker } from "./workerBuild.js";
 import { VIRTUAL_CAMOX_APP, syncDefinitions, syncDefinitionsToApi } from "./definitionsSync.js";
@@ -185,7 +186,6 @@ function camox(options) {
 	const projectUuid = projectIdOf(options);
 	const apiUrl = options._internal?.apiUrl ?? PRODUCTION_API_URL;
 	const authenticationUrl = options._internal?.authenticationUrl ?? DEFAULT_AUTHENTICATION_URL;
-	const enableTanstackDevtools = options._internal?.enableTanstackDevtools ?? false;
 	const disableCodeGen = options._internal?.disableCodeGen ?? false;
 	const runtimeBasePath = options._internal?.runtimeBasePath;
 	let isBuild = false;
@@ -200,6 +200,8 @@ function camox(options) {
 	let localDeployToken;
 	let blockChunks = {};
 	let devServer;
+	/** Set when the build builds against an SDK Bundle. */
+	let sdkBundle;
 	return {
 		name: "camox",
 		enforce: "pre",
@@ -209,6 +211,10 @@ function camox(options) {
 				const forbidden = forbiddenImport(hostedProject, id, importer);
 				if (forbidden) this.error(forbidden);
 			}
+			if (sdkBundle) {
+				const external = sdkBundle.resolve(id, importer, this.environment.config.consumer);
+				if (external) return external;
+			}
 			const runtimeId = resolveRuntimeDevId(id, importer);
 			if (runtimeId) return runtimeId;
 			if (id === VIRTUAL_STUDIO_CSS) return RESOLVED_VIRTUAL_STUDIO_CSS;
@@ -216,6 +222,7 @@ function camox(options) {
 		},
 		async load(id, loadOptions) {
 			const stylesDir = resolve(sdkRoot, !isBuild && isSdkSource ? ".dev" : "dist");
+			if (id === RESOLVED_VIRTUAL_STUDIO_CSS && sdkBundle) return `export default ${JSON.stringify(sdkBundle.studioStylesheetUrl)};`;
 			if (id === RESOLVED_VIRTUAL_STUDIO_CSS) {
 				const cssPath = resolve(stylesDir, "studio.css");
 				if (isBuild) {
@@ -257,7 +264,19 @@ function camox(options) {
 			}
 			return transformArtifactRuntime(code, id);
 		},
+		renderChunk(code, chunk) {
+			if (!sdkBundle || this.environment.config.consumer !== "server") return;
+			const relative = sdkBundle.relativizeWorkerImports(code, chunk.fileName);
+			return relative === void 0 ? void 0 : {
+				code: relative,
+				map: null
+			};
+		},
 		generateBundle(_outputOptions, bundle) {
+			if (sdkBundle && this.environment.config.consumer === "server") this.emitFile({
+				type: "asset",
+				...sdkBundle.manifest
+			});
 			if (this.environment.name !== "client") return;
 			blockChunks = collectBlockChunks(bundle, resolvedConfig.root);
 			if (!isBuild) return;
@@ -267,7 +286,8 @@ function camox(options) {
 				fileName: "_headers",
 				source: staticAssetHeaders({
 					ownHeaders: readOwnHeaders(publicDir),
-					unhashedFiles: [...unhashedEntries(bundle), ...publicFilesInHashedDirs(publicDir)]
+					unhashedFiles: [...unhashedEntries(bundle), ...publicFilesInHashedDirs(publicDir)],
+					sdkBundle: sdkBundle !== void 0
 				})
 			});
 		},
@@ -279,6 +299,16 @@ function camox(options) {
 			isDryRun = isRelease && release === "dry-run";
 			if (env.command === "serve" && !env.isPreview) localDeployToken = localDeployTokenOf(apiUrl, options);
 			if (!isBuild) localAuth = readAuthTokenForUrl(authenticationUrl);
+			if (isBuild) sdkBundle = await sdkBundleBuildState({
+				root: resolve(_config.root ?? process.cwd()),
+				settings: {
+					iconIds,
+					telemetryDisabled: !!options.disableTelemetry,
+					experimentalFeatures: options._internal?.enableExperimentalFeatures ?? false,
+					apiUrl
+				},
+				mayBuild: !(isRelease && process.env["CAMOX_INTERNAL_HOSTED"] === "1")
+			});
 			return {
 				...isBuild && {
 					base: "./",
@@ -296,7 +326,6 @@ function camox(options) {
 				define: {
 					__CAMOX_ICON_IDS__: JSON.stringify(iconIds),
 					__CAMOX_TELEMETRY_DISABLED__: JSON.stringify(!!options.disableTelemetry),
-					__ENABLE_TANSTACK_DEVTOOLS__: JSON.stringify(enableTanstackDevtools),
 					__CAMOX_ENABLE_EXPERIMENTAL_FEATURES__: JSON.stringify(options._internal?.enableExperimentalFeatures ?? false),
 					__CAMOX_API_URL__: JSON.stringify(apiUrl),
 					__CAMOX_AUTHENTICATION_URL__: JSON.stringify(authenticationUrl),
@@ -361,6 +390,7 @@ function camox(options) {
 			else if (localDeployToken) target = "local Live";
 			else if (!isBuild && !localAuth) target = "authentication required";
 			config.logger.info(`${mode} Camox app (${target})`, { timestamp: true });
+			if (sdkBundle?.built) config.logger.info(`Built the SDK Bundle ${sdkBundle.names.browser} (browser) and ${sdkBundle.names.workerd} (workerd) into its cache`, { timestamp: true });
 		},
 		configureServer(server) {
 			devServer = server;