@hitch42/applet 0.1.1-beta.1 → 0.1.1-beta.10

package/dist/vite.js

@@ -1,16 +1,301 @@
-import { i as APPLET_CODE_PATTERN, n as appletManifestSchema, r as appletSourceDefinitionSchema } from "./manifest-DyoJ1MIL.js";
-import { i as resolveInstanceUrl, n as organizationInstanceUrl } from "./auth-DaVK0k5R.js";
-import { c as writeClientEntry, i as writeRegisterDeclaration, l as writeManifestGen, r as syncContract, s as writeAppletRoot, u as writeServerEntry } from "./generate-CH0VQmUi.js";
-import { i as resolveWorkspaceOrg } from "./load-config-BnxocLAQ.js";
-import { existsSync } from "node:fs";
-import { appendFile, readFile, readdir, rm, writeFile } from "node:fs/promises";
-import { basename, relative, resolve } from "node:path";
+import { n as meSchema } from "./me-BW7Paary.js";
+import { i as APPLET_CODE_PATTERN, n as appletManifestSchema, r as appletSourceDefinitionSchema } from "./manifest-CJSL9GuC.js";
+import { a as openQueryCacheDatabase } from "./query-cache-CXmAyLv3.js";
+import { d as HITCH_USER_HEADER, u as HITCH_SESSION_HEADER } from "./headers-DkNr9MLJ.js";
+import { a as workflowOutcomeSchema, n as runWorkflowJournal } from "./workflow-engine-BOTzURKM.js";
+import { c as bearerToken, d as resolveAuthForOrg, f as resolveInstanceUrl, l as organizationInstanceUrl, t as resolveWorkspaceOrg, u as rejectEnvironmentKey } from "./workspace-D0dnnlxL.js";
+import { c as writeClientEntry, i as writeRegisterDeclaration, l as writeManifestGen, r as syncContract, s as writeAppletRoot, u as writeServerEntry } from "./generate-BEIYs17x.js";
+import { randomUUID } from "node:crypto";
+import { existsSync, mkdirSync, readFileSync, rmSync, writeFileSync } from "node:fs";
+import { appendFile, readdir, rm, writeFile } from "node:fs/promises";
+import { createServer } from "node:http";
+import { basename, dirname, relative, resolve } from "node:path";
 import { cloudflare } from "@cloudflare/vite-plugin";
 import { tanstackRouter } from "@tanstack/router-plugin/vite";
 import react from "@vitejs/plugin-react";
+import { Readable } from "node:stream";
+import { pipeline } from "node:stream/promises";
+//#region src/dev-proxy.ts
+const REQUEST_DROP = /* @__PURE__ */ new Set([
+	"host",
+	"connection",
+	"content-length",
+	"cookie",
+	"authorization",
+	"origin",
+	"referer",
+	"accept-encoding"
+]);
+const RESPONSE_DROP = /* @__PURE__ */ new Set([
+	"content-encoding",
+	"content-length",
+	"transfer-encoding",
+	"connection",
+	"set-cookie"
+]);
+function refusesClient(headers, clientAddress) {
+	if (![
+		"127.0.0.1",
+		"::1",
+		"::ffff:127.0.0.1"
+	].includes(clientAddress ?? "")) return true;
+	const get = (name) => headers instanceof Headers ? headers.get(name) : headers[name]?.toString() ?? null;
+	const host = get("host") ?? get(":authority");
+	const origin = get("origin");
+	return origin !== null && (host === null || !URL.canParse(origin) || new URL(origin).host !== host) || get("sec-fetch-site") === "cross-site";
+}
+function createDevProxy(options) {
+	let warnedAboutUnauthorized = false;
+	return async (request, clientAddress) => {
+		if (refusesClient(request.headers, clientAddress)) return new Response(null, { status: 403 });
+		const intercepted = await options.intercept?.(request);
+		if (intercepted !== void 0) return intercepted;
+		const headers = new Headers(request.headers);
+		[...headers.keys()].filter((name) => REQUEST_DROP.has(name) || name.startsWith("x-hitch-")).forEach((name) => headers.delete(name));
+		headers.set("authorization", `Bearer ${options.token}`);
+		const url = new URL(request.url);
+		const upstream = await globalThis.fetch(`${options.orgUrl}${url.pathname}${url.search}`, {
+			method: request.method,
+			headers,
+			body: request.body,
+			signal: request.signal,
+			...request.body === null ? {} : { duplex: "half" }
+		});
+		if (upstream.status === 401 && !warnedAboutUnauthorized) {
+			warnedAboutUnauthorized = true;
+			options.warn(options.source === "environment" ? "HITCH_API_KEY was rejected." : "Your login expired. Run applet login, then restart the dev server.");
+		}
+		const responseHeaders = new Headers(upstream.headers);
+		[...responseHeaders.keys()].filter((name) => RESPONSE_DROP.has(name)).forEach((name) => responseHeaders.delete(name));
+		return new Response(upstream.body, {
+			status: upstream.status,
+			statusText: upstream.statusText,
+			headers: responseHeaders
+		});
+	};
+}
+async function serveDevProxy(request, response, handler) {
+	const controller = new AbortController();
+	const onClose = () => {
+		if (!response.writableFinished) controller.abort();
+	};
+	response.on("close", onClose);
+	try {
+		const authority = request.headers[":authority"];
+		const host = request.headers.host ?? (Array.isArray(authority) ? authority[0] : authority);
+		const url = `http://${host ?? "localhost"}${request.url ?? "/"}`;
+		const result = await handler(new Request(url, {
+			method: request.method,
+			headers: {
+				...Object.fromEntries(Object.entries(request.headers).filter(([name]) => !name.startsWith(":"))),
+				host: host ?? "localhost"
+			},
+			signal: controller.signal,
+			...["GET", "HEAD"].includes(request.method ?? "GET") ? {} : {
+				body: Readable.toWeb(request),
+				duplex: "half"
+			}
+		}), request.socket.remoteAddress);
+		response.writeHead(result.status, result.statusText, Object.fromEntries(result.headers));
+		if (result.body === null) {
+			response.end();
+			return;
+		}
+		await pipeline(Readable.fromWeb(result.body), response);
+	} catch (error) {
+		if (!controller.signal.aborted || !(error instanceof Error) || error.name !== "AbortError" && error.code !== "ERR_STREAM_PREMATURE_CLOSE") throw error;
+	} finally {
+		response.off("close", onClose);
+	}
+}
+//#endregion
+//#region src/dev-workflows.ts
+const RUN_STATUSES = [
+	"in_progress",
+	"sleeping",
+	"success",
+	"error",
+	"terminated",
+	"open"
+];
+const badRequest = (message) => Response.json({
+	code: "BAD_REQUEST",
+	message
+}, { status: 400 });
+const workflowCodeError = (code) => code.length < 1 || code.length > 64 ? badRequest("The workflow code must have 1 to 64 characters.") : void 0;
+const UUID_PATTERN = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+function createDevWorkflows(options) {
+	const runs = /* @__PURE__ */ new Map();
+	const controller = new AbortController();
+	const stopped = () => controller.signal.aborted;
+	const wait = (milliseconds) => {
+		if (controller.signal.aborted) return Promise.reject(/* @__PURE__ */ new Error("The dev server stopped."));
+		return new Promise((resolve, reject) => {
+			const deadline = Date.now() + Math.max(0, milliseconds);
+			let timer;
+			const schedule = () => {
+				const remaining = deadline - Date.now();
+				if (remaining <= 0) {
+					controller.signal.removeEventListener("abort", onAbort);
+					resolve();
+					return;
+				}
+				timer = setTimeout(schedule, Math.min(remaining, 2147483647));
+			};
+			const onAbort = () => {
+				clearTimeout(timer);
+				controller.signal.removeEventListener("abort", onAbort);
+				reject(/* @__PURE__ */ new Error("The dev server stopped."));
+			};
+			controller.signal.addEventListener("abort", onAbort, { once: true });
+			schedule();
+		});
+	};
+	const record = (run, outcome) => {
+		switch (outcome.kind) {
+			case "step":
+			case "step_error":
+				run.status = "in_progress";
+				run.sleep_until = null;
+				break;
+			case "sleep":
+				run.status = "sleeping";
+				run.sleep_until = new Date(outcome.until).toISOString();
+				break;
+			case "done":
+				run.status = "success";
+				run.result = outcome.result ?? null;
+				run.sleep_until = null;
+				run.finished_at = (/* @__PURE__ */ new Date()).toISOString();
+				break;
+			case "error":
+				run.status = "error";
+				run.error = outcome.message.slice(0, 2048);
+				run.sleep_until = null;
+				run.finished_at = (/* @__PURE__ */ new Date()).toISOString();
+		}
+	};
+	const start = (workflow, payload) => {
+		const run = {
+			id: randomUUID(),
+			workflow,
+			status: "in_progress",
+			result: null,
+			error: null,
+			sleep_until: null,
+			started_at: (/* @__PURE__ */ new Date()).toISOString(),
+			finished_at: null
+		};
+		runs.set(run.id, run);
+		options.logger.info(`ℹ Workflow ${workflow} run ${run.id} started.`);
+		runWorkflowJournal({
+			invoke: async (_name, fn) => {
+				if (controller.signal.aborted) throw new Error("The dev server stopped.");
+				for (let attempt = 0;; attempt += 1) try {
+					const outcome = await fn();
+					if (stopped()) throw new Error("The dev server stopped.");
+					return outcome;
+				} catch (error) {
+					if (stopped() || attempt === 5) throw error;
+					const message = error instanceof Error ? error.message : String(error);
+					options.logger.error(`Workflow ${workflow} run ${run.id} invoke failed, retrying: ${message}`);
+					await wait(1e3 * 2 ** attempt);
+				}
+			},
+			sleep: (_name, milliseconds) => options.skipSleep ? Promise.resolve() : wait(milliseconds),
+			sleepUntil: (_name, until) => options.skipSleep ? Promise.resolve() : wait(until.getTime() - Date.now())
+		}, async (journal) => {
+			const outcome = await options.invoke(workflow, {
+				payload,
+				journal
+			});
+			record(run, outcome);
+			return outcome;
+		}).then(() => options.logger.info(`ℹ Workflow ${workflow} run ${run.id} succeeded.`), (error) => {
+			if (controller.signal.aborted) return;
+			const message = (error instanceof Error ? error.message : String(error)).slice(0, 2048);
+			run.status = "error";
+			run.error = message;
+			run.sleep_until = null;
+			run.finished_at = (/* @__PURE__ */ new Date()).toISOString();
+			options.logger.error(`Workflow ${workflow} run ${run.id} failed: ${message}`);
+		});
+		return run;
+	};
+	const handle = (request) => {
+		const url = new URL(request.url);
+		const prefix = `/api/v1/applets/${encodeURIComponent(options.appletCode)}`;
+		if (!url.pathname.startsWith(`${prefix}/`)) return void 0;
+		const path = url.pathname.slice(prefix.length);
+		const startMatch = /^\/workflows\/([^/]+)\/runs$/.exec(path);
+		if (request.method === "POST" && startMatch !== null) return (async () => {
+			let body;
+			try {
+				const text = await request.text();
+				body = text === "" ? {} : JSON.parse(text);
+			} catch {
+				return badRequest("The body must be a JSON object with a payload key.");
+			}
+			if (body === null || typeof body !== "object" || Array.isArray(body) || Object.keys(body).some((key) => key !== "payload")) return badRequest("The body must be a JSON object with a payload key.");
+			let workflow;
+			try {
+				workflow = decodeURIComponent(startMatch[1]);
+			} catch (error) {
+				if (error instanceof URIError) return badRequest(error.message);
+				throw error;
+			}
+			const codeError = workflowCodeError(workflow);
+			if (codeError !== void 0) return codeError;
+			const run = start(workflow, "payload" in body ? body.payload : void 0);
+			return Response.json({ data: {
+				id: run.id,
+				workflow: run.workflow,
+				status: "in_progress"
+			} }, { status: 201 });
+		})();
+		const getMatch = /^\/workflows\/([^/]+)\/runs\/([^/]+)$/.exec(path);
+		if (request.method === "GET" && getMatch !== null) {
+			let workflow;
+			let id;
+			try {
+				workflow = decodeURIComponent(getMatch[1]);
+				id = decodeURIComponent(getMatch[2]);
+			} catch (error) {
+				if (error instanceof URIError) return Promise.resolve(badRequest(error.message));
+				throw error;
+			}
+			const codeError = workflowCodeError(workflow);
+			if (codeError !== void 0) return Promise.resolve(codeError);
+			if (!UUID_PATTERN.test(id)) return Promise.resolve(badRequest("The run id must be a uuid."));
+			const run = runs.get(id);
+			return Promise.resolve(run?.workflow === workflow ? Response.json({ data: run }) : Response.json({
+				code: "workflow_run_not_found",
+				message: "The workflow run does not exist."
+			}, { status: 404 }));
+		}
+		if (request.method === "GET" && path === "/workflow-runs") {
+			const status = url.searchParams.get("status");
+			const limitValue = url.searchParams.get("limit");
+			const limit = limitValue === null ? 50 : Number(limitValue);
+			if (status !== null && !RUN_STATUSES.some((value) => value === status)) return Promise.resolve(badRequest("Invalid workflow run status."));
+			if (!Number.isInteger(limit) || limit < 1 || limit > 100) return Promise.resolve(badRequest("The limit must be an integer from 1 to 100."));
+			const workflow = url.searchParams.get("workflow");
+			const codeError = workflow === null ? void 0 : workflowCodeError(workflow);
+			if (codeError !== void 0) return Promise.resolve(codeError);
+			const data = [...runs.values()].filter((run) => (workflow === null || run.workflow === workflow) && (status === null || status === run.status || status === "open" && ["in_progress", "sleeping"].includes(run.status))).reverse().slice(0, limit).map(({ result: _result, ...summary }) => summary);
+			return Promise.resolve(Response.json({ data }));
+		}
+	};
+	return {
+		handle,
+		stop: () => controller.abort()
+	};
+}
+//#endregion
 //#region src/vite.ts
 const APPLET_COMPATIBILITY_DATE = "2026-07-14";
 const APPLET_COMPATIBILITY_FLAGS = ["nodejs_compat"];
+let activeDevListener;
 function clientBootstrapScript(parentOrigin, appletCode) {
 	return `(function () {
   var parentOrigin = ${parentOrigin === void 0 ? "null" : JSON.stringify(parentOrigin)};
@@ -34,6 +319,20 @@ function clientBootstrapScript(parentOrigin, appletCode) {
       : null
   });
 
+  // Opened here so it is ready by the time the applet module restores its
+  // query cache. A failure is reported when the module reads the promise.
+  Object.defineProperty(window, "__hitchCacheDatabase", {
+    configurable: false,
+    writable: false,
+    value: window.parent !== window && parentOrigin !== null
+      ? (function () {
+          var database = (${openQueryCacheDatabase.toString()})();
+          database.catch(function () {});
+          return database;
+        })()
+      : null
+  });
+
   function applyTheme(theme) {
     document.documentElement.classList.toggle("dark", theme === "dark");
   }
@@ -138,7 +437,7 @@ function clientBootstrapScript(parentOrigin, appletCode) {
   });
 })();`;
 }
-function applet(sourceDefinition, options = {}) {
+function applet(sourceDefinition) {
 	const parsedSourceDefinition = appletSourceDefinitionSchema.safeParse(sourceDefinition);
 	if (!parsedSourceDefinition.success) {
 		const raw = sourceDefinition;
@@ -152,6 +451,11 @@ function applet(sourceDefinition, options = {}) {
 	let clearedOutDir = false;
 	let contractSync;
 	let themeStylesheetUrl;
+	let devApiUrl;
+	let devListener;
+	let devLogger;
+	let devWorkflows;
+	let devContext;
 	const virtualRouteConfig = {
 		type: "root",
 		file: "__root.tsx",
@@ -170,6 +474,7 @@ function applet(sourceDefinition, options = {}) {
 		const routesDirectory = resolve(resolvedRoot, "src/client/routes");
 		const hasClient = existsSync(routesDirectory);
 		const hasServer = existsSync(resolve(resolvedRoot, "src/server/main.ts"));
+		if (!hasServer && parsedDefinition.data.telephony?.events?.length) throw new Error("An applet with telephony events must have src/server/main.ts.");
 		if (!hasServer && (parsedDefinition.data.schedules?.length ?? 0) > 0) throw new Error("An applet with schedules must have src/server/main.ts.");
 		const legacyMain = resolve(resolvedRoot, "src/client/main.tsx");
 		const indexHtml = resolve(resolvedRoot, "index.html");
@@ -200,6 +505,11 @@ function applet(sourceDefinition, options = {}) {
 		org: resolveWorkspaceOrg(callerRoot),
 		...parsedDefinition.data
 	});
+	const clsxFromCn = {
+		name: "hitch-clsx",
+		resolveId: (id) => id === "clsx" ? "\0hitch:clsx" : void 0,
+		load: (id) => id === "\0hitch:clsx" ? "export { clsx, clsx as default } from \"cn\";" : void 0
+	};
 	const orchestrator = {
 		name: "hitch-applet",
 		enforce: "pre",
@@ -219,12 +529,9 @@ function applet(sourceDefinition, options = {}) {
 				});
 				clearedOutDir = true;
 			}
-			if (environment.command === "build") themeStylesheetUrl = `${organizationInstanceUrl(await resolveInstanceUrl(void 0, options.store), manifest.org)}/theme.css`;
-			if (environment.command === "build" && manifest.objects.length > 0) {
-				contractSync ??= syncContract(resolve(root, ".hitch"), manifest, {
-					...options,
-					changesetId: (options.store?.env ?? process.env).HITCH_CHANGESET_ID
-				});
+			if (environment.command === "build") themeStylesheetUrl = `${organizationInstanceUrl(await resolveInstanceUrl(), manifest.org)}/theme.css`;
+			if (environment.command === "build") {
+				contractSync ??= syncContract(resolve(root, ".hitch"), manifest);
 				await contractSync;
 			}
 			const hasHitchGen = existsSync(resolve(root, ".hitch/index.ts"));
@@ -239,17 +546,162 @@ function applet(sourceDefinition, options = {}) {
 				hasServer ? writeServerEntry(root, hasHitchGen, manifest.code) : void 0,
 				hasHitchGen ? void 0 : writeRegisterDeclaration(resolve(root, ".hitch"))
 			]);
-			return { base: `/${manifest.code}/` };
+			if (environment.command === "serve" && environment.mode !== "test" && environment.isPreview !== true) {
+				const instanceUrl = await resolveInstanceUrl();
+				const orgUrl = organizationInstanceUrl(instanceUrl, manifest.org);
+				const auth = await resolveAuthForOrg(instanceUrl, manifest.org);
+				if (auth === void 0) throw new Error("Not logged in. Run applet login.");
+				const token = bearerToken(auth);
+				const meResponse = await globalThis.fetch(`${orgUrl}/api/v1/me`, { headers: { authorization: `Bearer ${token}` } });
+				rejectEnvironmentKey(meResponse, auth);
+				if (meResponse.status === 401) throw new Error("Your login expired. Run applet login.");
+				if (!meResponse.ok) throw new Error(`Hitch returned ${meResponse.status} for /api/v1/me.`);
+				const { person } = meSchema.parse(await meResponse.json());
+				const proxy = createDevProxy({
+					orgUrl,
+					token,
+					source: auth.source,
+					warn: (message) => devLogger?.warn(message),
+					intercept: (request) => devWorkflows?.handle(request)
+				});
+				devContext = {
+					person,
+					proxy,
+					orgUrl,
+					cacheBuster: randomUUID()
+				};
+				if (hasServer && devListener === void 0) {
+					if (activeDevListener?.listening) activeDevListener.close();
+					const nonce = randomUUID();
+					devListener = createServer((request, response) => {
+						const url = request.url ?? "";
+						const prefix = `/${nonce}/api`;
+						const address = devListener?.address();
+						if (!(url === prefix || url.startsWith(`${prefix}/`) || url.startsWith(`${prefix}?`)) || address === null || address === void 0 || typeof address === "string" || request.headers.host !== `127.0.0.1:${address.port}`) {
+							response.writeHead(404).end();
+							return;
+						}
+						request.url = url.slice(nonce.length + 1);
+						serveDevProxy(request, response, proxy).catch((error) => {
+							const failure = error instanceof Error ? error : new Error(String(error));
+							devLogger?.error(`Local Hitch proxy failed: ${failure.message}`);
+							response.destroy(failure);
+						});
+					});
+					activeDevListener = devListener;
+					try {
+						await new Promise((resolvePromise, rejectPromise) => {
+							devListener?.once("error", rejectPromise);
+							devListener?.listen(0, "127.0.0.1", resolvePromise);
+						});
+						const address = devListener.address();
+						if (address === null || typeof address === "string") throw new Error("The local Hitch proxy has no port.");
+						devApiUrl = `http://127.0.0.1:${address.port}/${nonce}/api`;
+					} catch (error) {
+						if (devListener.listening) devListener.close();
+						if (activeDevListener === devListener) activeDevListener = void 0;
+						devListener = void 0;
+						throw error;
+					}
+				}
+			}
+			if (environment.mode === "test") {
+				const colocated = (await readdir(resolve(root, "src"), { recursive: true })).filter((path) => /\.(test|spec)\.[cm]?[jt]sx?$/.test(path));
+				if (colocated.length > 0) throw new Error(`Applet tests run only from the test folder. Move ${colocated.map((path) => `src/${path}`).join(", ")} to test/.`);
+			}
+			return {
+				base: `/${manifest.code}/`,
+				test: { include: ["test/**/*.test.{ts,tsx}"] },
+				resolve: { alias: {
+					"clsx/lite": "cn/lite",
+					"tailwind-merge": "cn"
+				} },
+				optimizeDeps: { rolldownOptions: { plugins: [clsxFromCn] } },
+				...hasServer && { environments: { worker: { build: { rollupOptions: { output: { codeSplitting: false } } } } } }
+			};
 		},
 		configResolved(config) {
 			apiManifest = resolveAppletConfig(config.root).manifest;
 		},
 		configureServer(server) {
-			const { manifest, root } = requireAppletConfig();
+			if (devContext === void 0) return;
+			const { manifest } = requireAppletConfig();
+			const { person, proxy, orgUrl, cacheBuster } = devContext;
+			const orgOrigin = new URL(orgUrl).origin;
+			devLogger = server.config.logger;
+			const skipSleep = process.env.HITCH_DEV_SKIP_SLEEP === "1";
+			devWorkflows = createDevWorkflows({
+				appletCode: manifest.code,
+				skipSleep,
+				logger: server.config.logger,
+				invoke: async (workflow, body) => {
+					const address = server.httpServer?.address();
+					if (address === null || address === void 0 || typeof address === "string") throw new Error("The dev server has no port.");
+					const response = await fetch(`http://localhost:${address.port}/${manifest.code}/api/__hitch/workflows/${encodeURIComponent(workflow)}`, {
+						method: "POST",
+						headers: { "content-type": "application/json" },
+						body: JSON.stringify(body)
+					});
+					if (!response.ok) throw new Error(`Workflow worker returned HTTP ${response.status}.`);
+					return workflowOutcomeSchema.parse(await response.json());
+				}
+			});
+			server.config.logger.info(`ℹ Running as ${person.email} in production org "${manifest.org}". Reads and writes use real data with your access.`);
+			if (manifest.requiresChangeset !== void 0) server.config.logger.info(`ℹ This applet requires changeset ${manifest.requiresChangeset}. Local dev uses the live schema, so a pending changeset's schema is not available until it applies.`);
+			if (skipSleep) server.config.logger.info("ℹ HITCH_DEV_SKIP_SLEEP is set. Workflow sleeps and retry delays run at once.");
+			const devServerFile = resolve(requireAppletConfig().root, ".hitch/dev-server.json");
+			let devServerUrl;
+			const removeDevServerFile = () => {
+				if (devServerUrl === void 0) return;
+				try {
+					const file = JSON.parse(readFileSync(devServerFile, "utf8"));
+					if (file !== null && typeof file === "object" && "pid" in file && file.pid === process.pid && "url" in file && file.url === devServerUrl) rmSync(devServerFile, { force: true });
+				} catch (error) {
+					if (!(error instanceof SyntaxError) && !(error instanceof Error && "code" in error && error.code === "ENOENT")) throw error;
+				}
+			};
+			server.httpServer?.once("listening", () => {
+				const address = server.httpServer?.address();
+				if (address === null || address === void 0 || typeof address === "string") return;
+				mkdirSync(dirname(devServerFile), { recursive: true });
+				devServerUrl = `http://localhost:${address.port}`;
+				writeFileSync(devServerFile, JSON.stringify({
+					url: devServerUrl,
+					pid: process.pid
+				}));
+				server.config.logger.info(`ℹ Preview in Hitch: ${orgUrl}/applets/${manifest.code}?_hitch_dev=${address.port}`);
+				process.once("exit", removeDevServerFile);
+			});
+			server.httpServer?.once("close", () => {
+				devWorkflows?.stop();
+				devListener?.close();
+				if (activeDevListener === devListener) activeDevListener = void 0;
+				process.off("exit", removeDevServerFile);
+				removeDevServerFile();
+			});
 			const mount = `/${manifest.code}`;
 			const apiPrefix = `${mount}/api`;
 			server.middlewares.use((request, response, next) => {
+				if (request.url === mount || request.url?.startsWith(`${mount}?`)) request.url = `${mount}/${request.url.slice(mount.length)}`;
 				const url = request.url ?? "";
+				const pathname = url.split("?", 1)[0] ?? "";
+				if (pathname.startsWith("/__applet/context/")) {
+					if (pathname !== `/__applet/context/${manifest.code}` || request.method !== "GET") {
+						response.writeHead(404).end();
+						return;
+					}
+					if (refusesClient(request.headers, request.socket.remoteAddress)) {
+						response.writeHead(403).end();
+						return;
+					}
+					response.setHeader("Cache-Control", "no-store");
+					response.setHeader("Content-Type", "application/json; charset=utf-8");
+					response.end(JSON.stringify({
+						cacheBuster,
+						cacheScope: person.id
+					}));
+					return;
+				}
 				if (url === "/_hitch/client.js" || url.startsWith("/_hitch/client.js?")) {
 					response.statusCode = 200;
 					response.setHeader("Cache-Control", "no-store");
@@ -257,29 +709,37 @@ function applet(sourceDefinition, options = {}) {
 					response.end("// PostHog is disabled in standalone applet development.\n");
 					return;
 				}
-				if (url === "/theme.css" || url.startsWith("/theme.css?")) {
-					readFile(resolve(root, ".hitch/theme.css")).then((theme) => {
-						response.statusCode = 200;
-						response.setHeader("Cache-Control", "no-cache");
-						response.setHeader("Content-Type", "text/css; charset=utf-8");
-						response.end(theme);
-					}, (error) => {
-						if (error instanceof Error && "code" in error && error.code === "ENOENT") {
-							next();
-							return;
-						}
-						next(error);
+				if (url === "/api" || url.startsWith("/api/") || url.startsWith("/api?") || url === "/theme.css" || url.startsWith("/theme.css?")) {
+					serveDevProxy(request, response, proxy).catch((error) => {
+						if (response.headersSent) response.destroy(error instanceof Error ? error : new Error(String(error)));
+						else next(error);
 					});
 					return;
 				}
-				if (url === apiPrefix || url.startsWith(`${apiPrefix}/`) || url.startsWith(`${apiPrefix}?`)) request.url = url.slice(mount.length);
+				if (url === apiPrefix || url.startsWith(`${apiPrefix}/`) || url.startsWith(`${apiPrefix}?`)) {
+					if (refusesClient(request.headers, request.socket.remoteAddress)) {
+						response.writeHead(403).end();
+						return;
+					}
+					request.url = url.slice(mount.length);
+					if (request.url.startsWith("/api/__hitch/") && request.headers.origin !== void 0) {
+						response.writeHead(404).end();
+						return;
+					}
+					request.originalUrl = request.url;
+					request.headers[HITCH_USER_HEADER] = person.id;
+					request.headers[HITCH_SESSION_HEADER] = "local-dev";
+					request.rawHeaders = request.rawHeaders.flatMap((name, index, headers) => index % 2 === 0 && name.toLowerCase() !== "x-hitch-user" && name.toLowerCase() !== "x-hitch-session" ? [name, headers[index + 1] ?? ""] : []);
+					request.rawHeaders.push(HITCH_USER_HEADER, person.id, HITCH_SESSION_HEADER, "local-dev");
+				}
+				response.setHeader("Content-Security-Policy", `frame-ancestors ${orgOrigin}`);
 				next();
 			});
 		},
 		transformIndexHtml: {
 			order: "post",
 			handler(html) {
-				const parentOrigin = themeStylesheetUrl === void 0 ? void 0 : new URL(themeStylesheetUrl).origin;
+				const parentOrigin = devContext?.orgUrl === void 0 ? themeStylesheetUrl === void 0 ? void 0 : new URL(themeStylesheetUrl).origin : new URL(devContext.orgUrl).origin;
 				return {
 					html: themeStylesheetUrl === void 0 ? html : html.replace("href=\"/theme.css\"", `href="${themeStylesheetUrl}"`),
 					tags: [{
@@ -313,7 +773,7 @@ function applet(sourceDefinition, options = {}) {
 				const workerDir = outputOptions.dir ?? resolve(buildRootOutDir, "worker");
 				const mainModule = Object.values(bundle).find((output) => output.type === "chunk" && output.isEntry)?.fileName;
 				const strayModules = (await readdir(workerDir, { recursive: true })).filter((path) => /\.(js|mjs)$/.test(path) && path !== mainModule);
-				if (strayModules.length > 0) throw new Error(`The applet server must bundle to a single worker/index.js module; found: ${strayModules.join(", ")}. Avoid dynamic import() in server code.`);
+				if (strayModules.length > 0) throw new Error(`The applet server must bundle to a single worker/index.js module; found: ${strayModules.join(", ")}.`);
 				console.log(`server → ${relative(requireAppletConfig().root, resolve(workerDir, mainModule ?? ""))}`);
 			}
 		}
@@ -333,7 +793,11 @@ function applet(sourceDefinition, options = {}) {
 					not_found_handling: "single-page-application",
 					run_worker_first: ["/api/*"]
 				} } : {},
-				...hasServer ? { main: resolve(root, ".hitch/entry.server.gen.ts") } : {}
+				...hasServer ? { main: resolve(root, ".hitch/entry.server.gen.ts") } : {},
+				...devApiUrl === void 0 ? {} : { vars: {
+					...workerConfig.vars,
+					HITCH_API_URL: devApiUrl
+				} }
 			};
 		},
 		get viteEnvironment() {
@@ -343,14 +807,19 @@ function applet(sourceDefinition, options = {}) {
 		...plugin,
 		apply: ((_config, { mode }) => mode !== "test")
 	}));
+	const hasClientSource = existsSync(resolve("src/client/routes"));
 	return [
 		orchestrator,
-		...existsSync(resolve("src/client/routes")) ? [tanstackRouter({
+		{
+			...clsxFromCn,
+			enforce: "pre"
+		},
+		...hasClientSource ? [tanstackRouter({
 			generatedRouteTree: ".hitch/routeTree.gen.ts",
 			routesDirectory: "src/client/routes",
 			routeFileIgnorePattern: "__root",
 			virtualRouteConfig
-		}), react()] : [],
+		}), react({ compiler: true })] : [],
 		cloudflarePlugins
 	];
 }