camox 0.36.0 → 0.36.1

package/dist/features/preview/CamoxPreview.js

@@ -51,9 +51,9 @@ function pageStructureQueryFn(path, projectSlug, source) {
 }
 function usePreviewedPage() {
 	const $ = c(26);
-	if ($[0] !== "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d") {
+	if ($[0] !== "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a") {
 		for (let $i = 0; $i < 26; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d";
+		$[0] = "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a";
 	}
 	const { pathname } = useLocation();
 	const queryClient = useQueryClient();
@@ -150,9 +150,9 @@ function _temp(state) {
 }
 const BlockRenderer = (t0) => {
 	const $ = c(23);
-	if ($[0] !== "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d") {
+	if ($[0] !== "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a") {
 		for (let $i = 0; $i < 23; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d";
+		$[0] = "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a";
 	}
 	const { blockId, mode, showAddBlockTop, showAddBlockBottom } = t0;
 	const previewSource = useSelector(previewStore, _temp3);
@@ -295,9 +295,9 @@ const PageContent = () => {
 };
 function useHydrateDraftCache() {
 	const $ = c(7);
-	if ($[0] !== "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d") {
+	if ($[0] !== "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a") {
 		for (let $i = 0; $i < 7; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d";
+		$[0] = "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a";
 	}
 	const isAuthenticated = useIsAuthenticated();
 	const queryClient = useQueryClient();
@@ -347,16 +347,17 @@ function useHydrateDraftCache() {
 }
 function _temp4() {}
 const CamoxPreview = (t0) => {
-	const $ = c(39);
-	if ($[0] !== "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d") {
-		for (let $i = 0; $i < 39; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d";
+	const $ = c(40);
+	if ($[0] !== "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a") {
+		for (let $i = 0; $i < 40; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a";
 	}
 	const { children } = t0;
 	const isAuthenticated = useIsAuthenticated();
 	const isEditMode = useSelector(previewStore, _temp5);
 	const isToolbarHidden = useSelector(previewStore, _temp6);
-	const previewSource = useSelector(previewStore, _temp7);
+	const isAddBlockSidebarOpen = useSelector(previewStore, _temp7);
+	const previewSource = useSelector(previewStore, _temp8);
 	const pageData = usePreviewedPage();
 	useHydrateDraftCache();
 	const hasLiveCheckpoint = pageData.page.livePublishedCheckpointId != null;
@@ -376,7 +377,7 @@ const CamoxPreview = (t0) => {
 					],
 					groupLabel: "Preview",
 					checkIfAvailable: () => isAuthenticated && isEditMode,
-					execute: _temp8,
+					execute: _temp9,
 					shortcut: {
 						key: "Enter",
 						withMeta: true
@@ -392,7 +393,7 @@ const CamoxPreview = (t0) => {
 					],
 					groupLabel: "Preview",
 					checkIfAvailable: () => isAuthenticated && !isEditMode,
-					execute: _temp9,
+					execute: _temp0,
 					shortcut: {
 						key: "Enter",
 						withMeta: true
@@ -408,7 +409,7 @@ const CamoxPreview = (t0) => {
 					],
 					groupLabel: "Preview",
 					checkIfAvailable: () => isAuthenticated && previewSource === "draft" && hasLiveCheckpoint,
-					execute: _temp0,
+					execute: _temp1,
 					shortcut: {
 						key: "d",
 						withAlt: true
@@ -424,7 +425,7 @@ const CamoxPreview = (t0) => {
 					],
 					groupLabel: "Preview",
 					checkIfAvailable: () => isAuthenticated && previewSource === "live",
-					execute: _temp1,
+					execute: _temp10,
 					shortcut: {
 						key: "d",
 						withAlt: true
@@ -435,8 +436,8 @@ const CamoxPreview = (t0) => {
 					label: "Clear selection",
 					aliases: ["Deselect", "Unselect"],
 					groupLabel: "Preview",
-					checkIfAvailable: _temp10,
-					execute: _temp11,
+					checkIfAvailable: _temp11,
+					execute: _temp12,
 					shortcut: { key: "Escape" }
 				}
 			];
@@ -447,7 +448,7 @@ const CamoxPreview = (t0) => {
 			return () => {
 				actionsStore.send({
 					type: "unregisterManyActions",
-					ids: actions.map(_temp12)
+					ids: actions.map(_temp13)
 				});
 			};
 		};
@@ -485,57 +486,65 @@ const CamoxPreview = (t0) => {
 		$[10] = t4;
 	} else t4 = $[10];
 	let t5;
-	if ($[11] !== isToolbarHidden) {
-		t5 = !isToolbarHidden && /* @__PURE__ */ jsx(Navbar, {});
-		$[11] = isToolbarHidden;
-		$[12] = t5;
-	} else t5 = $[12];
+	if ($[11] !== isAddBlockSidebarOpen || $[12] !== isToolbarHidden) {
+		t5 = !isToolbarHidden && /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [/* @__PURE__ */ jsx(Navbar, {}), isAddBlockSidebarOpen && /* @__PURE__ */ jsx("div", {
+				className: "absolute inset-0 z-20",
+				style: { background: "rgba(0, 0, 0, 0.66)" },
+				onClick: _temp14
+			})]
+		});
+		$[11] = isAddBlockSidebarOpen;
+		$[12] = isToolbarHidden;
+		$[13] = t5;
+	} else t5 = $[13];
 	let t6;
-	if ($[13] !== isEditMode || $[14] !== pageData.page) {
+	if ($[14] !== isEditMode || $[15] !== pageData.page) {
 		t6 = isEditMode && /* @__PURE__ */ jsx(LeftSidebar, { page: pageData.page });
-		$[13] = isEditMode;
-		$[14] = pageData.page;
-		$[15] = t6;
-	} else t6 = $[15];
+		$[14] = isEditMode;
+		$[15] = pageData.page;
+		$[16] = t6;
+	} else t6 = $[16];
 	let t7;
-	if ($[16] !== hasLiveCheckpoint || $[17] !== pageData.page.status) {
+	if ($[17] !== hasLiveCheckpoint || $[18] !== pageData.page.status) {
 		t7 = {
 			pageStatus: pageData.page.status,
 			hasLiveVersion: hasLiveCheckpoint
 		};
-		$[16] = hasLiveCheckpoint;
-		$[17] = pageData.page.status;
-		$[18] = t7;
-	} else t7 = $[18];
+		$[17] = hasLiveCheckpoint;
+		$[18] = pageData.page.status;
+		$[19] = t7;
+	} else t7 = $[19];
 	let t8;
-	if ($[19] !== isEditMode) {
+	if ($[20] !== isEditMode) {
 		t8 = isEditMode && /* @__PURE__ */ jsx("div", { style: {
 			height: "80px",
 			background: "transparent"
 		} });
-		$[19] = isEditMode;
-		$[20] = t8;
-	} else t8 = $[20];
+		$[20] = isEditMode;
+		$[21] = t8;
+	} else t8 = $[21];
 	let t9;
-	if ($[21] !== children || $[22] !== t7 || $[23] !== t8) {
+	if ($[22] !== children || $[23] !== t7 || $[24] !== t8) {
 		t9 = /* @__PURE__ */ jsxs(PreviewPanel, {
 			toolbarProps: t7,
 			children: [children, t8]
 		});
-		$[21] = children;
-		$[22] = t7;
-		$[23] = t8;
-		$[24] = t9;
-	} else t9 = $[24];
+		$[22] = children;
+		$[23] = t7;
+		$[24] = t8;
+		$[25] = t9;
+	} else t9 = $[25];
 	let t10;
-	if ($[25] !== isEditMode || $[26] !== pageData.page.id) {
+	if ($[26] !== isEditMode || $[27] !== pageData.page.id) {
 		t10 = isEditMode && /* @__PURE__ */ jsx(RightSidebar, { pageId: pageData.page.id });
-		$[25] = isEditMode;
-		$[26] = pageData.page.id;
-		$[27] = t10;
-	} else t10 = $[27];
+		$[26] = isEditMode;
+		$[27] = pageData.page.id;
+		$[28] = t10;
+	} else t10 = $[28];
 	let t11;
-	if ($[28] !== t10 || $[29] !== t6 || $[30] !== t9) {
+	if ($[29] !== t10 || $[30] !== t6 || $[31] !== t9) {
 		t11 = /* @__PURE__ */ jsxs("div", {
 			className: "flex h-full flex-row items-stretch",
 			children: [
@@ -544,19 +553,19 @@ const CamoxPreview = (t0) => {
 				t10
 			]
 		});
-		$[28] = t10;
-		$[29] = t6;
-		$[30] = t9;
-		$[31] = t11;
-	} else t11 = $[31];
+		$[29] = t10;
+		$[30] = t6;
+		$[31] = t9;
+		$[32] = t11;
+	} else t11 = $[32];
 	let t12;
-	if ($[32] !== isEditMode) {
+	if ($[33] !== isEditMode) {
 		t12 = isEditMode && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(CreatePageModal, {}), /* @__PURE__ */ jsx(DraftSwitchDialog, {})] });
-		$[32] = isEditMode;
-		$[33] = t12;
-	} else t12 = $[33];
+		$[33] = isEditMode;
+		$[34] = t12;
+	} else t12 = $[34];
 	let t13;
-	if ($[34] !== t11 || $[35] !== t12 || $[36] !== t4 || $[37] !== t5) {
+	if ($[35] !== t11 || $[36] !== t12 || $[37] !== t4 || $[38] !== t5) {
 		t13 = /* @__PURE__ */ jsxs("div", {
 			className: t4,
 			children: [
@@ -565,19 +574,19 @@ const CamoxPreview = (t0) => {
 				t12
 			]
 		});
-		$[34] = t11;
-		$[35] = t12;
-		$[36] = t4;
-		$[37] = t5;
-		$[38] = t13;
-	} else t13 = $[38];
+		$[35] = t11;
+		$[36] = t12;
+		$[37] = t4;
+		$[38] = t5;
+		$[39] = t13;
+	} else t13 = $[39];
 	return t13;
 };
 function usePreviewPagesActions() {
 	const $ = c(13);
-	if ($[0] !== "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d") {
+	if ($[0] !== "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a") {
 		for (let $i = 0; $i < 13; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "a8aadbae83f448aedc99fd8344f3c11935e775ce61e901362c961f0c7099892d";
+		$[0] = "08efc24964e6f71a0b75d26676e04d8253640e7adc88fa9c6e2293e86440c27a";
 	}
 	const navigate = useNavigate();
 	const { pathname } = useLocation();
@@ -618,8 +627,8 @@ function usePreviewPagesActions() {
 					label: "Create page",
 					aliases: ["New page", "Add page"],
 					groupLabel: "Preview",
-					checkIfAvailable: _temp13,
-					execute: _temp14
+					checkIfAvailable: _temp15,
+					execute: _temp16
 				},
 				{
 					id: "edit-current-page",
@@ -650,14 +659,14 @@ function usePreviewPagesActions() {
 					groupLabel: "Preview",
 					checkIfAvailable: () => !!pages,
 					hasChildren: true,
-					execute: _temp15
+					execute: _temp17
 				},
 				...pages ? pages.map((page) => ({
 					id: `go-to-page-${page.id}`,
 					parentActionId: "go-to-page",
 					label: `Go to "${page.nickname}"`,
 					groupLabel: "Preview",
-					checkIfAvailable: _temp16,
+					checkIfAvailable: _temp18,
 					execute: () => navigate({ to: page.fullPath })
 				})) : []
 			];
@@ -668,7 +677,7 @@ function usePreviewPagesActions() {
 			return () => {
 				actionsStore.send({
 					type: "unregisterManyActions",
-					ids: actions.map(_temp17)
+					ids: actions.map(_temp19)
 				});
 			};
 		};
@@ -688,17 +697,17 @@ function usePreviewPagesActions() {
 	}
 	React.useEffect(t4, t5);
 }
-function _temp17(a) {
+function _temp19(a) {
 	return a.id;
 }
-function _temp16() {
+function _temp18() {
 	return true;
 }
-function _temp15() {}
-function _temp14() {
+function _temp17() {}
+function _temp16() {
 	return previewStore.send({ type: "openCreatePageModal" });
 }
-function _temp13() {
+function _temp15() {
 	return true;
 }
 function _temp3(state) {
@@ -711,35 +720,41 @@ function _temp6(state_0) {
 	return state_0.context.isToolbarHidden;
 }
 function _temp7(state_1) {
-	return state_1.context.previewSource;
+	return state_1.context.isAddBlockSidebarOpen;
 }
-function _temp8() {
-	return previewStore.send({ type: "exitEditMode" });
+function _temp8(state_2) {
+	return state_2.context.previewSource;
 }
 function _temp9() {
-	return previewStore.send({ type: "enterEditMode" });
+	return previewStore.send({ type: "exitEditMode" });
 }
 function _temp0() {
+	return previewStore.send({ type: "enterEditMode" });
+}
+function _temp1() {
 	return previewStore.send({
 		type: "setPreviewSource",
 		source: "live"
 	});
 }
-function _temp1() {
+function _temp10() {
 	return previewStore.send({
 		type: "setPreviewSource",
 		source: "draft"
 	});
 }
-function _temp10() {
+function _temp11() {
 	return true;
 }
-function _temp11() {
+function _temp12() {
 	previewStore.send({ type: "clearSelection" });
 }
-function _temp12(a) {
+function _temp13(a) {
 	return a.id;
 }
+function _temp14() {
+	return previewStore.send({ type: "closeAddBlockSidebar" });
+}
 
 //#endregion
 export { CamoxPreview, PageContent, usePreviewPagesActions, usePreviewedPage };

package/dist/features/preview/components/PreviewToolbar.js

@@ -16,17 +16,18 @@ import { Toggle } from "@camox/ui/toggle";
 //#region src/features/preview/components/PreviewToolbar.tsx
 const PreviewToolbar = (t0) => {
 	const $ = c(74);
-	if ($[0] !== "f9ff999569a69264033e31a270ebbb7097b2072aec97a7129d1758e95b5b6407") {
+	if ($[0] !== "88648f3760cc744b4acae6ce6f9f000de00b69d7e7f65268463e98389ba90d90") {
 		for (let $i = 0; $i < 74; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "f9ff999569a69264033e31a270ebbb7097b2072aec97a7129d1758e95b5b6407";
+		$[0] = "88648f3760cc744b4acae6ce6f9f000de00b69d7e7f65268463e98389ba90d90";
 	}
 	const { onEditModeChange, pageStatus, hasLiveVersion } = t0;
 	const isEditMode = useSelector(previewStore, _temp);
 	const isToolbarHidden = useSelector(previewStore, _temp2);
-	const actions = useSelector(actionsStore, _temp3);
-	const viewportMode = useSelector(previewStore, _temp4);
+	const peekedBlock = useSelector(previewStore, _temp3);
+	const actions = useSelector(actionsStore, _temp4);
+	const viewportMode = useSelector(previewStore, _temp5);
 	const editModeActionId = isEditMode ? "exit-edit-mode" : "enter-edit-mode";
-	if (isToolbarHidden) return null;
+	if (isToolbarHidden || peekedBlock) return null;
 	let t1;
 	if ($[1] !== onEditModeChange) {
 		t1 = (checked) => {
@@ -251,7 +252,7 @@ const PreviewToolbar = (t0) => {
 			type: "button",
 			variant: "outline",
 			disabled: pageStatus === "published" || !hasLiveVersion,
-			onClick: _temp5,
+			onClick: _temp6,
 			children: "View live site"
 		});
 		$[54] = hasLiveVersion;
@@ -265,7 +266,7 @@ const PreviewToolbar = (t0) => {
 			variant: "ghost",
 			size: "icon",
 			disabled: isEditMode,
-			onClick: _temp6,
+			onClick: _temp7,
 			"aria-label": "Hide toolbar",
 			className: "text-muted-foreground"
 		});
@@ -336,15 +337,18 @@ function _temp2(state_0) {
 	return state_0.context.isToolbarHidden;
 }
 function _temp3(state_1) {
-	return state_1.context.actions;
+	return state_1.context.peekedBlock;
 }
 function _temp4(state_2) {
-	return state_2.context.viewportMode;
+	return state_2.context.actions;
 }
-function _temp5() {
-	return previewStore.send({ type: "viewLivePage" });
+function _temp5(state_3) {
+	return state_3.context.viewportMode;
 }
 function _temp6() {
+	return previewStore.send({ type: "viewLivePage" });
+}
+function _temp7() {
 	return previewStore.send({ type: "hideToolbar" });
 }
 

package/dist/features/routes/pageRuntime.js

@@ -1,6 +1,244 @@
-import "../../lib/telemetry.js";
+import { trackEvent } from "../../lib/telemetry.js";
 import { queryKeys } from "@camox/api-contract/query-keys";
 import { createORPCClient } from "@orpc/client";
 import { RPCLink } from "@orpc/client/fetch";
 
-export {  };
+//#region src/features/routes/pageRuntime.ts
+function parseQuality(part) {
+	const match = part.match(/;\s*q=([0-9.]+)/);
+	return match ? parseFloat(match[1]) : 1;
+}
+function prefersMarkdown(accept) {
+	let markdownQ = -1;
+	let htmlQ = -1;
+	for (const part of accept.split(",")) {
+		const trimmed = part.trim();
+		if (trimmed.startsWith("text/markdown")) markdownQ = parseQuality(trimmed);
+		else if (trimmed.startsWith("text/html")) htmlQ = parseQuality(trimmed);
+	}
+	return markdownQ > 0 && markdownQ >= htmlQ;
+}
+function createServerApiClient(apiUrl, environmentName, options) {
+	const headers = {};
+	if (environmentName) headers["x-environment-name"] = environmentName;
+	return createORPCClient(new RPCLink({
+		url: `${apiUrl}/rpc`,
+		headers,
+		fetch: (request, init) => {
+			if (options?.authCookieHeader && request instanceof Request) request.headers.set("Better-Auth-Cookie", options.authCookieHeader);
+			return fetch(request, init);
+		}
+	}));
+}
+function getErrorDetails(error) {
+	if (!error || typeof error !== "object") return { message: String(error) };
+	const errorRecord = error;
+	return {
+		code: typeof errorRecord.code === "string" ? errorRecord.code : void 0,
+		status: typeof errorRecord.status === "number" ? errorRecord.status : void 0,
+		message: error instanceof Error ? error.message : typeof errorRecord.message === "string" ? errorRecord.message : ""
+	};
+}
+function isAuthSessionError(error) {
+	const { code, status, message } = getErrorDetails(error);
+	if (code === "UNAUTHORIZED" || code === "FORBIDDEN") return true;
+	if (status === 401 || status === 403) return true;
+	const lowerMessage = message.toLowerCase();
+	return lowerMessage.includes("unauthorized") || lowerMessage.includes("forbidden") || lowerMessage.includes("invalid session") || lowerMessage.includes("session expired") || lowerMessage.includes("expired session");
+}
+function isNotFoundError(error) {
+	const { code, status } = getErrorDetails(error);
+	return code === "NOT_FOUND" || status === 404;
+}
+function visitForFileIds(value, ids) {
+	if (value == null || typeof value !== "object") return;
+	if ("_fileId" in value && typeof value._fileId === "number") {
+		ids.add(value._fileId);
+		return;
+	}
+	if (Array.isArray(value)) {
+		for (const item of value) visitForFileIds(item, ids);
+		return;
+	}
+	for (const child of Object.values(value)) visitForFileIds(child, ids);
+}
+function collectFileIdsFromContent(content, ids) {
+	for (const value of Object.values(content)) visitForFileIds(value, ids);
+}
+function seedBlockCaches(queryClient, pageData, source = "draft") {
+	const filesById = new Map(pageData.files.map((f) => [f.id, f]));
+	for (const block of pageData.blocks) {
+		const blockItems = pageData.repeatableItems.filter((i) => i.blockId === block.id);
+		const fileIds = /* @__PURE__ */ new Set();
+		collectFileIdsFromContent(block.content, fileIds);
+		for (const item of blockItems) collectFileIdsFromContent(item.content, fileIds);
+		const blockFiles = [...fileIds].map((id) => filesById.get(id)).filter((f) => f != null);
+		queryClient.setQueryData(queryKeys.blocks.get(block.id, source), {
+			block,
+			repeatableItems: blockItems,
+			files: blockFiles
+		});
+		for (const file of blockFiles) queryClient.setQueryData(queryKeys.files.get(file.id), file);
+	}
+}
+async function loadCamoxPage({ apiUrl, authCookieHeader, environmentName, pathname, projectSlug, queryClient, source }) {
+	const serverApi = createServerApiClient(apiUrl, environmentName, { authCookieHeader });
+	return queryClient.ensureQueryData({
+		queryKey: queryKeys.pages.getByPath(pathname, source),
+		queryFn: async () => {
+			const [data, pagesList] = await Promise.all([serverApi.pages.getByPath({
+				path: pathname,
+				projectSlug,
+				source
+			}), serverApi.pages.listBySlug({ projectSlug }).catch(() => null)]);
+			seedBlockCaches(queryClient, data, source);
+			queryClient.setQueryData(queryKeys.pages.getByPath(pathname, source), {
+				page: data.page,
+				layout: data.layout,
+				projectName: data.projectName,
+				project: data.project
+			});
+			if (source === "live") {
+				seedBlockCaches(queryClient, data, "draft");
+				queryClient.setQueryData(queryKeys.pages.getByPath(pathname, "draft"), {
+					page: data.page,
+					layout: data.layout,
+					projectName: data.projectName,
+					project: data.project
+				});
+			}
+			if (pagesList) queryClient.setQueryData(queryKeys.pages.list, pagesList);
+			return {
+				page: data.page,
+				layout: data.layout,
+				projectName: data.projectName,
+				project: data.project
+			};
+		},
+		staleTime: Infinity
+	});
+}
+async function loadLivePage(options) {
+	return loadCamoxPage({
+		...options,
+		source: "live"
+	});
+}
+function buildCamoxPageLoaderData(apiUrl, page, origin) {
+	return {
+		page,
+		origin,
+		faviconUrl: `${apiUrl}/favicons/${page.project.id}?v=${page.project.updatedAt}`
+	};
+}
+async function loadCamoxPageForRequest({ apiUrl, authCookieHeader, environmentName, origin, pathname, projectSlug, queryClient }) {
+	const loadOptions = {
+		apiUrl,
+		environmentName,
+		pathname,
+		projectSlug,
+		queryClient
+	};
+	if (!authCookieHeader) return {
+		data: buildCamoxPageLoaderData(apiUrl, await loadLivePage(loadOptions), origin),
+		shouldClearAuthCookie: false,
+		source: "live"
+	};
+	try {
+		return {
+			data: buildCamoxPageLoaderData(apiUrl, await loadCamoxPage({
+				...loadOptions,
+				authCookieHeader,
+				source: "draft"
+			}), origin),
+			shouldClearAuthCookie: false,
+			source: "draft"
+		};
+	} catch (error) {
+		if (!isAuthSessionError(error)) throw error;
+		console.warn("[camox] Ignoring stale camox_auth_cookie and retrying published page load.");
+		return {
+			data: buildCamoxPageLoaderData(apiUrl, await loadLivePage(loadOptions), origin),
+			shouldClearAuthCookie: true,
+			source: "live"
+		};
+	}
+}
+async function createMarkdownResponse({ apiUrl, environmentName, pathname, projectSlug, request }) {
+	if (!prefersMarkdown(request.headers.get("Accept") ?? "")) return null;
+	const api = createServerApiClient(apiUrl, environmentName);
+	const requestPathname = pathname ?? new URL(request.url).pathname;
+	try {
+		const page = await api.pages.getByPath({
+			path: requestPathname,
+			projectSlug,
+			source: "live"
+		});
+		const { markdown } = await api.blocks.getPageMarkdown({ pageId: page.page.id });
+		if (!markdown) return null;
+		trackEvent("markdown_served", {
+			pathname: requestPathname,
+			projectId: page.page.projectId,
+			projectName: page.projectName
+		});
+		return new Response(markdown, { headers: { "Content-Type": "text/markdown; charset=utf-8" } });
+	} catch {
+		return null;
+	}
+}
+function buildCamoxPageHead(camoxApp, loaderData) {
+	if (!loaderData) return {};
+	const { page, origin, faviconUrl } = loaderData;
+	const pageMetaTitle = page.page.metaTitle ?? page.page.pathSegment;
+	const meta = [];
+	let title = pageMetaTitle;
+	if (page.layout) {
+		const layout = camoxApp.getLayoutById(page.layout.layoutId);
+		if (layout) {
+			title = layout._internal.buildMetaTitle({
+				pageMetaTitle,
+				projectName: page.projectName,
+				pageFullPath: page.page.fullPath
+			});
+			meta.push({ title });
+		}
+	}
+	if (page.page.metaDescription) meta.push({
+		name: "description",
+		content: page.page.metaDescription
+	});
+	const ogImageParams = new URLSearchParams({
+		...page.layout && { layoutId: page.layout.layoutId },
+		title: pageMetaTitle,
+		...page.page.metaDescription && { description: page.page.metaDescription },
+		...page.projectName && { projectName: page.projectName }
+	});
+	const ogImageUrl = page.page.customOgImageUrl ?? `${origin}/og?${ogImageParams.toString()}`;
+	meta.push({
+		property: "og:title",
+		content: title
+	}, {
+		property: "og:image",
+		content: ogImageUrl
+	}, {
+		property: "og:image:width",
+		content: "1200"
+	}, {
+		property: "og:image:height",
+		content: "630"
+	});
+	if (page.page.metaDescription) meta.push({
+		property: "og:description",
+		content: page.page.metaDescription
+	});
+	return {
+		meta,
+		links: [{
+			rel: "icon",
+			href: faviconUrl
+		}]
+	};
+}
+
+//#endregion
+export { buildCamoxPageHead, createMarkdownResponse, createServerApiClient, isNotFoundError, loadCamoxPageForRequest };

package/dist/features/runtime/runtime.d.ts

@@ -1,6 +1,14 @@
+import { CamoxApp } from "../../core/createApp.js";
+import { CamoxDocument } from "../../core/defineDocument.js";
+import { StudioRenderInput } from "./studioApp.js";
 import { UseHeadInput } from "unhead/types";
 
 //#region src/features/runtime/runtime.d.ts
+type RuntimeRouteKind = "data" | "health" | "og" | "page" | "registry" | "sitemap" | "studio" | "studio-content" | "studio-nested";
+interface RuntimeRouteMatch {
+  kind: RuntimeRouteKind;
+  pathname: string;
+}
 interface LayoutIdentity {
   blockIds: number[];
   id: number;
@@ -21,5 +29,26 @@ interface PageRenderInput {
   runtimeBasePath: string;
   source: "live" | "draft";
 }
+interface RuntimeOptions {
+  apiUrl?: string;
+  authenticationUrl?: string;
+  environmentName?: string;
+  pageClientEntryUrl?: string;
+  studioClientEntryUrl?: string;
+  getCamoxApp?: () => Promise<CamoxApp>;
+  getDocument?: () => Promise<CamoxDocument>;
+  projectSlug?: string;
+  renderPage?: (input: PageRenderInput) => Promise<string>;
+  renderStudio?: (input: StudioRenderInput) => Promise<string>;
+  runtimeBasePath?: string;
+  stylesheetUrl?: string;
+}
+declare function getRuntimePathname(url: string, runtimeBasePath?: string): string | null;
+declare function matchRuntimeRoute(pathname: string): RuntimeRouteMatch;
+declare function createPageHeadInput(head: {
+  meta?: Array<Record<string, string>>;
+  links?: Array<Record<string, string>>;
+}): UseHeadInput;
+declare function handleCamoxRequest(request: Request, options?: RuntimeOptions): Promise<Response | null>;
 //#endregion
-export { PageRenderInput };
+export { LayoutIdentity, PageRenderInput, RuntimeOptions, RuntimeRouteKind, RuntimeRouteMatch, createPageHeadInput, getRuntimePathname, handleCamoxRequest, matchRuntimeRoute };

package/dist/features/runtime/runtime.js

@@ -1,8 +1,142 @@
-import "../routes/pageRuntime.js";
-import { QueryClient } from "@tanstack/react-query";
-import "@unhead/react/server";
+import { buildCamoxPageHead, createMarkdownResponse, createServerApiClient, isNotFoundError, loadCamoxPageForRequest } from "../routes/pageRuntime.js";
+import { QueryClient, dehydrate } from "@tanstack/react-query";
+import { createHead, renderSSRHead } from "@unhead/react/server";
 
 //#region src/features/runtime/runtime.ts
+const DEFAULT_RUNTIME_BASE_PATH = "";
+const RUNTIME_HEALTH_PATH = "/_camox/health";
+const RUNTIME_REGISTRY_PATH = "/_camox/registry";
+const SERVER_AUTH_COOKIE_NAME = "camox_auth_cookie";
+function buildClearServerAuthCookieHeader() {
+	return `${SERVER_AUTH_COOKIE_NAME}=; Path=/; SameSite=Lax; Max-Age=0`;
+}
+function getServerAuthCookieHeader(headers) {
+	const authCookie = (headers.get("Cookie") ?? headers.get("cookie") ?? "").split(";").map((part) => part.trim()).find((part) => part.startsWith(`${SERVER_AUTH_COOKIE_NAME}=`));
+	if (!authCookie) return "";
+	const value = authCookie.slice(18);
+	try {
+		return decodeURIComponent(value);
+	} catch {
+		return "";
+	}
+}
+function normalizeRuntimeBasePath(basePath) {
+	if (basePath === void 0) return DEFAULT_RUNTIME_BASE_PATH;
+	if (!basePath || basePath === "/") return "";
+	return basePath.startsWith("/") ? basePath.replace(/\/+$/, "") : `/${basePath.replace(/\/+$/, "")}`;
+}
+function getRuntimePathname(url, runtimeBasePath = DEFAULT_RUNTIME_BASE_PATH) {
+	const { pathname } = new URL(url);
+	const basePath = normalizeRuntimeBasePath(runtimeBasePath);
+	if (!basePath) return pathname || "/";
+	if (pathname === basePath) return "/";
+	if (!pathname.startsWith(`${basePath}/`)) return null;
+	return pathname.slice(basePath.length) || "/";
+}
+function escapeXml(value) {
+	return value.replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll("\"", "&quot;").replaceAll("'", "&apos;");
+}
+function normalizePagePath(path) {
+	if (!path) return "/";
+	return path.startsWith("/") ? path : `/${path}`;
+}
+function getLayoutIdentity(data, source) {
+	const layout = data.page.layout;
+	if (!layout) return null;
+	const version = source === "live" ? String(layout.livePublishedCheckpointId ?? "none") : String(layout.contentUpdatedAt ?? layout.updatedAt);
+	return {
+		blockIds: [...layout.beforeBlockIds, ...layout.afterBlockIds],
+		id: layout.id,
+		layoutId: layout.layoutId,
+		version
+	};
+}
+function matchRuntimeRoute(pathname) {
+	if (pathname === RUNTIME_HEALTH_PATH) return {
+		kind: "health",
+		pathname
+	};
+	if (pathname === RUNTIME_REGISTRY_PATH) return {
+		kind: "registry",
+		pathname
+	};
+	if (pathname === "/_camox/data") return {
+		kind: "data",
+		pathname
+	};
+	if (pathname === "/camox") return {
+		kind: "studio",
+		pathname
+	};
+	if (pathname === "/camox/content") return {
+		kind: "studio-content",
+		pathname
+	};
+	if (pathname.startsWith("/camox/")) return {
+		kind: "studio-nested",
+		pathname
+	};
+	if (pathname === "/og") return {
+		kind: "og",
+		pathname
+	};
+	if (pathname === "/sitemap.xml") return {
+		kind: "sitemap",
+		pathname
+	};
+	return {
+		kind: "page",
+		pathname
+	};
+}
+function withRuntimeBasePath(pathname, runtimeBasePath) {
+	const basePath = normalizeRuntimeBasePath(runtimeBasePath);
+	if (!basePath) return pathname;
+	if (pathname === "/") return `${basePath}/`;
+	return `${basePath}${pathname}`;
+}
+async function createSitemapResponse(request, options) {
+	if (!options.apiUrl || !options.projectSlug) return Response.json({ message: "Camox sitemap is not configured." }, { status: 500 });
+	const api = createServerApiClient(options.apiUrl, options.environmentName);
+	const origin = new URL(request.url).origin;
+	const entries = (await api.pages.listBySlug({ projectSlug: options.projectSlug })).map((page) => `  <url>
+    <loc>${escapeXml(`${origin}${withRuntimeBasePath(page.fullPath, options.runtimeBasePath)}`)}</loc>
+    <lastmod>${escapeXml(new Date(page.updatedAt).toISOString())}</lastmod>
+  </url>`).join("\n");
+	return new Response(`<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+${entries}
+</urlset>`, { headers: { "Content-Type": "application/xml; charset=utf-8" } });
+}
+async function createOgResponse(request, options) {
+	const camoxApp = await options.getCamoxApp?.();
+	if (!camoxApp) return Response.json({ message: "Camox app registry is not available." }, { status: 500 });
+	const url = new URL(request.url);
+	const layoutId = url.searchParams.get("layoutId") || "";
+	const title = url.searchParams.get("title") || "";
+	const description = url.searchParams.get("description") || "";
+	const projectName = url.searchParams.get("projectName") || "";
+	const layout = camoxApp.getLayoutById(layoutId);
+	if (!layout?._internal.buildOgImage) return new Response("Not found", { status: 404 });
+	return layout._internal.buildOgImage({
+		title,
+		description,
+		projectName
+	});
+}
+function createDefaultHeadInput(stylesheetUrl) {
+	return {
+		htmlAttrs: { lang: "en" },
+		meta: [{ charset: "utf-8" }, {
+			name: "viewport",
+			content: "width=device-width, initial-scale=1"
+		}],
+		link: stylesheetUrl ? [{
+			rel: "stylesheet",
+			href: stylesheetUrl
+		}] : []
+	};
+}
 function createPageHeadInput(head) {
 	const meta = head.meta ?? [];
 	const links = head.links ?? [];
@@ -39,6 +173,211 @@ function createPageHeadInput(head) {
 		link: pageLinks
 	};
 }
+function renderHead(document, pageHead, stylesheetUrl) {
+	const head = createHead();
+	head.push(createDefaultHeadInput(stylesheetUrl));
+	head.push(document);
+	head.push(pageHead);
+	return renderSSRHead(head);
+}
+function serializeJsonForHtml(value) {
+	return JSON.stringify(value).replaceAll("<", "\\u003c");
+}
+function renderClientEntryScript(src) {
+	if (!src) return "";
+	return `<script type="module" src="${escapeXml(src)}"><\/script>`;
+}
+async function createPageHtmlResponse({ options, pathname, request }) {
+	if (!options.apiUrl || !options.authenticationUrl || !options.projectSlug || !options.renderPage) return createPageDataResponse({
+		options,
+		pathname,
+		request
+	});
+	const queryClient = new QueryClient();
+	try {
+		const result = await loadCamoxPageForRequest({
+			apiUrl: options.apiUrl,
+			authCookieHeader: getServerAuthCookieHeader(request.headers),
+			environmentName: options.environmentName,
+			origin: new URL(request.url).origin,
+			pathname,
+			projectSlug: options.projectSlug,
+			queryClient
+		});
+		const headers = new Headers({ "Content-Type": "text/html; charset=utf-8" });
+		if (result.shouldClearAuthCookie) headers.append("Set-Cookie", buildClearServerAuthCookieHeader());
+		const camoxApp = await options.getCamoxApp?.();
+		const document = await options.getDocument?.() ?? {};
+		const head = camoxApp ? buildCamoxPageHead(camoxApp, result.data) : {};
+		const dehydratedState = dehydrate(queryClient);
+		const pageRenderInput = {
+			apiUrl: options.apiUrl,
+			authenticationUrl: options.authenticationUrl,
+			dehydratedState,
+			environmentName: options.environmentName,
+			head,
+			href: new URL(request.url).href,
+			layoutIdentity: getLayoutIdentity(result.data, result.source),
+			loaderData: result.data,
+			pathname,
+			projectSlug: options.projectSlug,
+			runtimeBasePath: normalizeRuntimeBasePath(options.runtimeBasePath),
+			source: result.source
+		};
+		const appHtml = await options.renderPage(pageRenderInput);
+		const renderedHead = renderHead(document, createPageHeadInput(head), options.stylesheetUrl);
+		return new Response(`<!doctype html>
+<html${renderedHead.htmlAttrs}>
+<head>
+${renderedHead.headTags}
+<script id="__CAMOX_DATA__" type="application/json">${serializeJsonForHtml(pageRenderInput)}<\/script>
+</head>
+<body${renderedHead.bodyAttrs}>
+${renderedHead.bodyTagsOpen}
+<div id="root">${appHtml}</div>
+${renderedHead.bodyTags}
+${renderClientEntryScript(options.pageClientEntryUrl)}
+</body>
+</html>`, { headers });
+	} catch (error) {
+		if (isNotFoundError(error)) return new Response("No Camox page on this path", { status: 404 });
+		throw error;
+	}
+}
+async function createStudioHtmlResponse({ match, options, request }) {
+	if (!options.apiUrl || !options.authenticationUrl || !options.projectSlug || !options.renderStudio) return Response.json({
+		message: "Camox Studio renderer is not configured.",
+		...match
+	}, { status: 500 });
+	const queryClient = new QueryClient();
+	const document = await options.getDocument?.() ?? {};
+	const studioRenderInput = {
+		apiUrl: options.apiUrl,
+		authenticationUrl: options.authenticationUrl,
+		dehydratedState: dehydrate(queryClient),
+		environmentName: options.environmentName,
+		href: new URL(request.url).href,
+		pathname: match.pathname,
+		projectSlug: options.projectSlug,
+		routeKind: match.kind,
+		runtimeBasePath: normalizeRuntimeBasePath(options.runtimeBasePath)
+	};
+	const appHtml = await options.renderStudio(studioRenderInput);
+	const renderedHead = renderHead(document, {}, options.stylesheetUrl);
+	return new Response(`<!doctype html>
+<html${renderedHead.htmlAttrs}>
+<head>
+${renderedHead.headTags}
+<script id="__CAMOX_DATA__" type="application/json">${serializeJsonForHtml(studioRenderInput)}<\/script>
+</head>
+<body${renderedHead.bodyAttrs}>
+${renderedHead.bodyTagsOpen}
+<div id="root">${appHtml}</div>
+${renderedHead.bodyTags}
+${renderClientEntryScript(options.studioClientEntryUrl)}
+</body>
+</html>`, { headers: { "Content-Type": "text/html; charset=utf-8" } });
+}
+async function createPageDataResponse({ options, pathname, request }) {
+	if (!options.apiUrl || !options.projectSlug) return Response.json({ message: "Camox page loader is not configured." }, { status: 500 });
+	const queryClient = new QueryClient();
+	try {
+		const result = await loadCamoxPageForRequest({
+			apiUrl: options.apiUrl,
+			authCookieHeader: getServerAuthCookieHeader(request.headers),
+			environmentName: options.environmentName,
+			origin: new URL(request.url).origin,
+			pathname,
+			projectSlug: options.projectSlug,
+			queryClient
+		});
+		const headers = new Headers({ "Content-Type": "application/json; charset=utf-8" });
+		if (result.shouldClearAuthCookie) headers.append("Set-Cookie", buildClearServerAuthCookieHeader());
+		const camoxApp = await options.getCamoxApp?.();
+		const head = camoxApp ? buildCamoxPageHead(camoxApp, result.data) : null;
+		const dehydratedState = dehydrate(queryClient);
+		const { page, layout, projectName, project } = result.data.page;
+		return new Response(`${JSON.stringify({
+			kind: "page",
+			pathname,
+			page: {
+				id: page.id,
+				fullPath: page.fullPath,
+				metaTitle: page.metaTitle,
+				metaDescription: page.metaDescription
+			},
+			layout: layout ? {
+				id: layout.id,
+				layoutId: layout.layoutId
+			} : null,
+			layoutIdentity: getLayoutIdentity(result.data, result.source),
+			project: {
+				id: project.id,
+				name: projectName
+			},
+			loaderData: {
+				faviconUrl: result.data.faviconUrl,
+				origin: result.data.origin
+			},
+			head,
+			dehydratedState
+		}, null, 2)}\n`, { headers });
+	} catch (error) {
+		if (isNotFoundError(error)) return Response.json({
+			kind: "page",
+			message: "No Camox page on this path",
+			pathname
+		}, { status: 404 });
+		throw error;
+	}
+}
+async function handleCamoxRequest(request, options = {}) {
+	const pathname = getRuntimePathname(request.url, options.runtimeBasePath);
+	if (!pathname) return null;
+	const match = matchRuntimeRoute(pathname);
+	if (match.kind === "health") return new Response("ok\n", { headers: { "Content-Type": "text/plain; charset=utf-8" } });
+	if (match.kind === "registry") {
+		const camoxApp = await options.getCamoxApp?.();
+		if (!camoxApp) return Response.json({ message: "Camox app registry is not available." }, { status: 500 });
+		return Response.json({
+			blocks: camoxApp.getBlocks().map((block) => block._internal.id),
+			layouts: camoxApp.getLayouts().map((layout) => layout._internal.id)
+		});
+	}
+	if (match.kind === "og") return createOgResponse(request, options);
+	if (match.kind === "sitemap") return createSitemapResponse(request, options);
+	if (match.kind === "data") return createPageDataResponse({
+		options,
+		pathname: normalizePagePath(new URL(request.url).searchParams.get("path")),
+		request
+	});
+	if (match.kind === "studio" || match.kind === "studio-content" || match.kind === "studio-nested") return createStudioHtmlResponse({
+		match,
+		options,
+		request
+	});
+	if (match.kind === "page") {
+		if (options.apiUrl && options.projectSlug) {
+			const markdownResponse = await createMarkdownResponse({
+				apiUrl: options.apiUrl,
+				environmentName: options.environmentName,
+				pathname: match.pathname,
+				projectSlug: options.projectSlug,
+				request
+			});
+			if (markdownResponse) return markdownResponse;
+		}
+		return createPageHtmlResponse({
+			options,
+			pathname: match.pathname,
+			request
+		});
+	}
+	return Response.json({
+		message: "Camox runtime route matched.",
+		...match
+	}, { status: 501 });
+}
 
 //#endregion
-export { createPageHeadInput };
+export { createPageHeadInput, getRuntimePathname, handleCamoxRequest, matchRuntimeRoute };

package/dist/lib/telemetry.js

@@ -1,3 +1,26 @@
 import { POSTHOG_PUBLIC_KEY } from "@camox/api-contract";
 
-export {  };
+//#region src/lib/telemetry.ts
+let client = null;
+async function getClient() {
+	if (__CAMOX_TELEMETRY_DISABLED__) return null;
+	if (!client) {
+		const { PostHog } = await import("posthog-node");
+		client = new PostHog(POSTHOG_PUBLIC_KEY, { host: "https://us.i.posthog.com" });
+	}
+	return client;
+}
+/** Server-side tracking for page views (used in pageRoute.tsx) */
+async function trackEvent(event, properties) {
+	const posthog = await getClient();
+	if (!posthog) return;
+	const distinctId = properties.projectId ?? "unknown";
+	posthog.capture({
+		distinctId,
+		event,
+		properties
+	});
+}
+
+//#endregion
+export { trackEvent };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "camox",
-  "version": "0.36.0",
+  "version": "0.36.1",
   "license": "MIT",
   "bin": {
     "camox": "./bin/camox.mjs"
@@ -157,9 +157,9 @@
     "streamdown": "^2.5.0",
     "unhead": "^3.1.7",
     "zod": "^4.4.3",
-    "@camox/api-contract": "0.36.0",
-    "@camox/cli": "0.36.0",
-    "@camox/ui": "0.36.0"
+    "@camox/cli": "0.36.1",
+    "@camox/api-contract": "0.36.1",
+    "@camox/ui": "0.36.1"
   },
   "devDependencies": {
     "@babel/core": "^7.29.0",