camox 0.32.0 → 0.33.1

package/dist/core/lib/fieldTypes.js

@@ -1,224 +1,15 @@
-import { previewStore } from "../../features/preview/previewStore.js";
-import { jsx } from "react/jsx-runtime";
-import { ChevronDown, FileIcon, FrameIcon, ImageIcon, Images, Link2, List, ToggleLeft, Type } from "lucide-react";
-
 //#region src/core/lib/fieldTypes.tsx
 const fieldTypesDictionary = {
-	String: {
-		label: "String",
-		isScalar: true,
-		isContentEditable: true,
-		hasOwnView: false,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(Type, { ...props }),
-		getLabel: (value) => {
-			if (typeof value !== "string") return "";
-			return value.replace(/\*{1,3}(.+?)\*{1,3}/g, "$1");
-		},
-		onTreeDoubleClick: ({ blockId, fieldName }) => {
-			previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName,
-				fieldType: "String"
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	},
-	Repeater: {
-		label: "Repeater",
-		isScalar: false,
-		isContentEditable: false,
-		hasOwnView: false,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(List, { ...props }),
-		getLabel: (_value, { schemaTitle, fieldName }) => schemaTitle ?? fieldName,
-		onTreeDoubleClick: ({ blockId }) => {
-			previewStore.send({
-				type: "setFocusedBlock",
-				blockId
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	},
-	Enum: {
-		label: "Enum",
-		isScalar: true,
-		isContentEditable: false,
-		hasOwnView: false,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(ChevronDown, { ...props }),
-		getLabel: (value) => value,
-		onTreeDoubleClick: ({ blockId, fieldName }) => {
-			previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName,
-				fieldType: "Enum"
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	},
-	Boolean: {
-		label: "Boolean",
-		isScalar: true,
-		isContentEditable: false,
-		hasOwnView: false,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(ToggleLeft, { ...props }),
-		getLabel: (value) => JSON.stringify(value),
-		onTreeDoubleClick: ({ blockId, fieldName }) => {
-			previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName,
-				fieldType: "Boolean"
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	},
-	Embed: {
-		label: "Embed",
-		isScalar: true,
-		isContentEditable: false,
-		hasOwnView: false,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(FrameIcon, { ...props }),
-		getLabel: (value, { schemaTitle, fieldName, fetchedTitle }) => {
-			let domain = null;
-			try {
-				domain = new URL(value).hostname.replace(/^www\./, "");
-			} catch {}
-			return fetchedTitle ?? schemaTitle ?? domain ?? fieldName;
-		},
-		onTreeDoubleClick: ({ blockId, fieldName }) => {
-			previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName,
-				fieldType: "Embed"
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	},
-	Link: {
-		label: "Link",
-		isScalar: false,
-		isContentEditable: false,
-		hasOwnView: true,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(Link2, { ...props }),
-		getLabel: (value) => value?.text ?? "",
-		onTreeDoubleClick: ({ blockId, fieldName }) => {
-			previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName,
-				fieldType: "Link"
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	},
-	Image: {
-		label: "Image",
-		isScalar: false,
-		isContentEditable: false,
-		hasOwnView: true,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(ImageIcon, { ...props }),
-		getLabel: (value, { schemaTitle, fieldName }) => {
-			const filename = value?.filename;
-			if (!filename) return `Missing ${schemaTitle ?? fieldName}`;
-			return filename;
-		},
-		onTreeDoubleClick: ({ blockId, fieldName }) => {
-			previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName,
-				fieldType: "Image"
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	},
-	File: {
-		label: "File",
-		isScalar: false,
-		isContentEditable: false,
-		hasOwnView: true,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(FileIcon, { ...props }),
-		getLabel: (value, { schemaTitle, fieldName }) => {
-			const filename = value?.filename;
-			if (!filename) return `Missing ${schemaTitle ?? fieldName}`;
-			return filename;
-		},
-		onTreeDoubleClick: ({ blockId, fieldName }) => {
-			previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName,
-				fieldType: "File"
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	},
-	ImageList: {
-		label: "Image list",
-		isScalar: false,
-		isContentEditable: false,
-		hasOwnView: true,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(Images, { ...props }),
-		getLabel: (_value, { schemaTitle, fieldName }) => schemaTitle ?? fieldName,
-		onTreeDoubleClick: ({ blockId, fieldName }) => {
-			previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName,
-				fieldType: "Image"
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	},
-	FileList: {
-		label: "File list",
-		isScalar: false,
-		isContentEditable: false,
-		hasOwnView: true,
-		getIcon: () => (props) => /* @__PURE__ */ jsx(FileIcon, { ...props }),
-		getLabel: (_value, { schemaTitle, fieldName }) => schemaTitle ?? fieldName,
-		onTreeDoubleClick: ({ blockId, fieldName }) => {
-			previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName,
-				fieldType: "File"
-			});
-			previewStore.send({
-				type: "openBlockContentSheet",
-				blockId
-			});
-		}
-	}
+	String: { hasOwnView: false },
+	Repeater: { hasOwnView: false },
+	Enum: { hasOwnView: false },
+	Boolean: { hasOwnView: false },
+	Embed: { hasOwnView: false },
+	Link: { hasOwnView: true },
+	Image: { hasOwnView: true },
+	File: { hasOwnView: true },
+	ImageList: { hasOwnView: true },
+	FileList: { hasOwnView: true }
 };
 
 //#endregion

package/dist/features/agent-chat/components/AgentChatSidebar.js

@@ -0,0 +1,172 @@
+import { useProjectSlug } from "../../../lib/auth.js";
+import { projectQueries } from "../../../lib/queries.js";
+import { previewStore } from "../../preview/previewStore.js";
+import { AgentChatThread } from "./AgentChatThread.js";
+import { c } from "react/compiler-runtime";
+import { useQuery } from "@tanstack/react-query";
+import { useLocation } from "@tanstack/react-router";
+import { useSelector } from "@xstate/store-react";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@camox/ui/button";
+import { Lock, Plus, X } from "lucide-react";
+import { Alert, AlertDescription, AlertTitle } from "@camox/ui/alert";
+
+//#region src/features/agent-chat/components/AgentChatSidebar.tsx
+const AgentChatSidebar = () => {
+	const $ = c(20);
+	if ($[0] !== "fa80c907e2ec181da4f3cb91fbf7d8dc7f1330b0892397f5d2dd7e7058b18f66") {
+		for (let $i = 0; $i < 20; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "fa80c907e2ec181da4f3cb91fbf7d8dc7f1330b0892397f5d2dd7e7058b18f66";
+	}
+	const previewSource = useSelector(previewStore, _temp);
+	const pageScaffoldContext = useSelector(previewStore, _temp2);
+	const [agentChatKey, setAgentChatKey] = React.useState(0);
+	const [composerFocusKey, setComposerFocusKey] = React.useState(0);
+	const { pathname } = useLocation();
+	const projectSlug = useProjectSlug();
+	let t0;
+	if ($[1] !== projectSlug) {
+		t0 = projectQueries.getBySlug(projectSlug);
+		$[1] = projectSlug;
+		$[2] = t0;
+	} else t0 = $[2];
+	const { data: project } = useQuery(t0);
+	const isLiveSource = previewSource === "live";
+	let t1;
+	let t2;
+	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = () => {
+			setComposerFocusKey(_temp3);
+		};
+		t2 = [];
+		$[3] = t1;
+		$[4] = t2;
+	} else {
+		t1 = $[3];
+		t2 = $[4];
+	}
+	React.useEffect(t1, t2);
+	let t3;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = /* @__PURE__ */ jsx("p", {
+			className: "flex-1 text-base font-semibold",
+			children: "Agent Chat"
+		});
+		$[5] = t3;
+	} else t3 = $[5];
+	let t4;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx(Button, {
+			type: "button",
+			variant: "ghost",
+			size: "icon-sm",
+			"aria-label": "Start a new Agent Chat",
+			onClick: () => {
+				previewStore.send({ type: "clearAgentChatPageScaffoldContext" });
+				setAgentChatKey(_temp4);
+				setComposerFocusKey(_temp5);
+			},
+			children: /* @__PURE__ */ jsx(Plus, { className: "size-4" })
+		});
+		$[6] = t4;
+	} else t4 = $[6];
+	let t5;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-1 p-2",
+			children: [
+				t3,
+				t4,
+				/* @__PURE__ */ jsx(Button, {
+					type: "button",
+					variant: "ghost",
+					size: "icon-sm",
+					"aria-label": "Close",
+					onClick: _temp6,
+					children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+				})
+			]
+		});
+		$[7] = t5;
+	} else t5 = $[7];
+	let t6;
+	if ($[8] !== isLiveSource) {
+		t6 = isLiveSource && /* @__PURE__ */ jsx("div", {
+			className: "p-2 pb-0",
+			children: /* @__PURE__ */ jsxs(Alert, { children: [
+				/* @__PURE__ */ jsx(Lock, { className: "size-4" }),
+				/* @__PURE__ */ jsx(AlertTitle, { children: "Live Source is read-only" }),
+				/* @__PURE__ */ jsxs(AlertDescription, {
+					className: "space-y-3",
+					children: [/* @__PURE__ */ jsx("p", { children: "Agent Chat can inspect live content, but edits require switching to Draft Source." }), /* @__PURE__ */ jsx(Button, {
+						type: "button",
+						size: "sm",
+						onClick: _temp7,
+						children: "Switch to draft"
+					})]
+				})
+			] })
+		});
+		$[8] = isLiveSource;
+		$[9] = t6;
+	} else t6 = $[9];
+	let t7;
+	if ($[10] !== agentChatKey || $[11] !== composerFocusKey || $[12] !== pageScaffoldContext || $[13] !== pathname || $[14] !== previewSource || $[15] !== project) {
+		t7 = project ? /* @__PURE__ */ jsx(AgentChatThread, {
+			projectId: project.id,
+			currentPath: pathname,
+			source: previewSource,
+			focusKey: composerFocusKey,
+			pageScaffoldContext: pageScaffoldContext ?? void 0
+		}, `${agentChatKey}:${pageScaffoldContext?.id ?? 0}`) : /* @__PURE__ */ jsx("div", {
+			className: "text-muted-foreground flex flex-1 items-center justify-center p-6 text-sm",
+			children: "Loading project…"
+		});
+		$[10] = agentChatKey;
+		$[11] = composerFocusKey;
+		$[12] = pageScaffoldContext;
+		$[13] = pathname;
+		$[14] = previewSource;
+		$[15] = project;
+		$[16] = t7;
+	} else t7 = $[16];
+	let t8;
+	if ($[17] !== t6 || $[18] !== t7) {
+		t8 = /* @__PURE__ */ jsxs(Fragment, { children: [t5, /* @__PURE__ */ jsxs("div", {
+			className: "flex min-h-0 flex-1 flex-col",
+			children: [t6, t7]
+		})] });
+		$[17] = t6;
+		$[18] = t7;
+		$[19] = t8;
+	} else t8 = $[19];
+	return t8;
+};
+function _temp(state) {
+	return state.context.previewSource;
+}
+function _temp2(state_0) {
+	return state_0.context.agentChatPageScaffoldContext;
+}
+function _temp3(key) {
+	return key + 1;
+}
+function _temp4(key_0) {
+	return key_0 + 1;
+}
+function _temp5(key_1) {
+	return key_1 + 1;
+}
+function _temp6() {
+	return previewStore.send({ type: "closeAgentChatSidebar" });
+}
+function _temp7() {
+	return previewStore.send({
+		type: "setPreviewSource",
+		source: "draft"
+	});
+}
+
+//#endregion
+export { AgentChatSidebar };

package/dist/features/agent-chat/components/AgentChatThread.js

@@ -1,7 +1,7 @@
-import { previewStore } from "../../preview/previewStore.js";
-import { getAuthCookieHeader } from "../../../lib/auth.js";
+import { getAuthCookieHeader, getAuthRequestCredentials } from "../../../lib/auth.js";
 import { getApiClient, getApiUrl, getEnvironmentName } from "../../../lib/api-client.js";
 import { cn } from "../../../lib/utils.js";
+import { previewStore } from "../../preview/previewStore.js";
 import { buildAgentChatToolLabelContext, getToolCallLabel } from "../agent-chat-labels.js";
 import { AgentToolCallCard } from "./AgentToolCallCard.js";
 import { c } from "react/compiler-runtime";
@@ -106,9 +106,9 @@ const markdownComponents = {
 };
 const MessageBubble = (t0) => {
 	const $ = c(34);
-	if ($[0] !== "ac29c5bab5ba745d35d55b8522bbfdd5d2f187fdcb71b67d53addf6539f9af82") {
+	if ($[0] !== "72801e2c76f8ef7f0ac3d1552518592bffad57042b24f366613bc1344cfe95d3") {
 		for (let $i = 0; $i < 34; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "ac29c5bab5ba745d35d55b8522bbfdd5d2f187fdcb71b67d53addf6539f9af82";
+		$[0] = "72801e2c76f8ef7f0ac3d1552518592bffad57042b24f366613bc1344cfe95d3";
 	}
 	const { message, source, isThinkingActive, activeThinkingDurationKeys, thinkingDurations, toolLabelContext, onApprovalResponse } = t0;
 	const isUser = message.role === "user";
@@ -158,7 +158,7 @@ const MessageBubble = (t0) => {
 			if (text != null) {
 				if (text.trim().length === 0) return null;
 				return /* @__PURE__ */ jsx(Streamdown, {
-					className: cn("wrap-break-words space-y-2", !isUser && "pl-6"),
+					className: "wrap-break-words space-y-2",
 					components: markdownComponents,
 					controls: false,
 					isAnimating: !isUser,
@@ -226,9 +226,9 @@ const MessageBubble = (t0) => {
 };
 const AgentThinkingIndicator = (t0) => {
 	const $ = c(7);
-	if ($[0] !== "ac29c5bab5ba745d35d55b8522bbfdd5d2f187fdcb71b67d53addf6539f9af82") {
+	if ($[0] !== "72801e2c76f8ef7f0ac3d1552518592bffad57042b24f366613bc1344cfe95d3") {
 		for (let $i = 0; $i < 7; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "ac29c5bab5ba745d35d55b8522bbfdd5d2f187fdcb71b67d53addf6539f9af82";
+		$[0] = "72801e2c76f8ef7f0ac3d1552518592bffad57042b24f366613bc1344cfe95d3";
 	}
 	const { durationSeconds } = t0;
 	if (durationSeconds !== void 0) {
@@ -283,16 +283,15 @@ const AgentChatThread = ({ projectId, currentPath, source, disabled, focusKey =
 		return createPageScaffoldMessages(pageScaffoldContext);
 	}, [pageScaffoldContext]);
 	const connection = React.useMemo(() => fetchServerSentEvents(`${getApiUrl()}/agent/chat`, () => {
-		const headers = {
-			"Better-Auth-Cookie": getAuthCookieHeader(),
-			"x-camox-client": "studio"
-		};
+		const authCookieHeader = getAuthCookieHeader();
+		const headers = { "x-camox-client": "studio" };
+		if (authCookieHeader) headers["Better-Auth-Cookie"] = authCookieHeader;
 		const environmentName = getEnvironmentName();
 		if (environmentName) headers["x-environment-name"] = environmentName;
 		if (__CAMOX_TELEMETRY_DISABLED__) headers["x-camox-telemetry-disabled"] = "1";
 		return {
 			headers,
-			credentials: "omit",
+			credentials: getAuthRequestCredentials(authCookieHeader),
 			body: {
 				projectId,
 				currentPath,
@@ -517,7 +516,7 @@ const AgentChatThread = ({ projectId, currentPath, source, disabled, focusKey =
 		className: "flex min-h-0 flex-1 flex-col",
 		children: [/* @__PURE__ */ jsx("div", {
 			ref: messagesScrollRef,
-			className: "min-h-0 flex-1 overflow-y-auto border-t p-4",
+			className: "min-h-0 flex-1 overflow-y-auto border-t px-2 py-4",
 			children: /* @__PURE__ */ jsxs("div", {
 				className: "flex min-h-full flex-col justify-end",
 				children: [
@@ -552,7 +551,7 @@ const AgentChatThread = ({ projectId, currentPath, source, disabled, focusKey =
 			})
 		}), /* @__PURE__ */ jsx("form", {
 			onSubmit: handleSubmit,
-			className: "border-border border-t p-4",
+			className: "border-border border-t px-2 py-4",
 			children: /* @__PURE__ */ jsxs("div", {
 				className: "border-input focus-within:border-ring focus-within:ring-ring/50 flex items-center gap-2 rounded-2xl border px-3 transition-colors focus-within:ring-[3px]",
 				children: [/* @__PURE__ */ jsx(Textarea, {
@@ -566,7 +565,7 @@ const AgentChatThread = ({ projectId, currentPath, source, disabled, focusKey =
 						}
 					},
 					disabled,
-					placeholder: disabled ? "Switch to draft to chat" : "Ask for changes or inspect this page…",
+					placeholder: disabled ? "Switch to draft to chat" : "Ask for anything",
 					className: "max-h-32 min-h-10 resize-none border-0 bg-inherit! px-0 py-4 leading-6 shadow-none focus-visible:ring-0"
 				}), isLoading ? /* @__PURE__ */ jsx(Button, {
 					type: "button",