camox 0.46.0 → 0.48.0

package/dist/features/preview/CamoxPreview.js

@@ -8,6 +8,7 @@ import { useCamoxApp } from "../provider/components/CamoxAppContext.js";
 import { NormalizedDataProvider, usePageBlocks } from "../../lib/normalized-data.js";
 import { reads, useRead, useStudioCache } from "../../lib/studio-reads.js";
 import { BlockErrorBoundary } from "./components/BlockErrorBoundary.js";
+import { curatedLayoutContext } from "../../core/layoutContext.js";
 import { CollectionItemSheetProvider } from "../content/CollectionItemSheetContext.js";
 import { cn } from "../../lib/utils.js";
 import { ContentCollectionItemSheet } from "../content/ContentCollection.js";
@@ -17,6 +18,7 @@ import { canvasStore } from "../canvas/canvasStore.js";
 import { SHOW_WHOLE_CANVAS_SHORTCUT, TOGGLE_CANVAS_SHORTCUT } from "./previewConstants.js";
 import { CanvasSidebarSkeleton } from "../canvas/sidebar/CanvasSidebarSkeleton.js";
 import { DerivedPageContent } from "../page/DerivedPageContent.js";
+import { takeShowCanvasRequest } from "../provider/signInShortcut.js";
 import { STUDIO_CANVAS_PATH } from "../studio/routes.js";
 import { studioStore } from "../studio/studioStore.js";
 import { previewStore, selectIsCanvasShown } from "./previewStore.js";
@@ -163,10 +165,11 @@ const BlockRenderer = (t0) => {
 	return t13;
 };
 const PageContent = () => {
-	const $ = c(30);
+	const $ = c(34);
 	const pageData = usePreviewedPage();
 	const { pageBlocks, beforeBlocks, afterBlocks, layoutFiles, layoutItems } = usePageBlocks(pageData);
 	const camoxApp = useCamoxApp();
+	const { locale } = useViewLocale();
 	let layout;
 	let layoutBlocksMap;
 	let t0;
@@ -227,7 +230,7 @@ const PageContent = () => {
 	} else t1 = $[12];
 	const pageBlocksContent = t1;
 	if (layout && layoutBlocksMap) {
-		const LayoutComponent = layout._internal.component;
+		const ToReact = layout._internal.toReact;
 		let t2;
 		if ($[13] !== afterBlocks || $[14] !== beforeBlocks) {
 			t2 = [...beforeBlocks, ...afterBlocks];
@@ -235,49 +238,61 @@ const PageContent = () => {
 			$[14] = beforeBlocks;
 			$[15] = t2;
 		} else t2 = $[15];
+		const T0 = layout._internal.Provider;
 		let t3;
-		if ($[16] !== LayoutComponent || $[17] !== pageBlocksContent) {
-			t3 = /* @__PURE__ */ jsx(LayoutComponent, { children: pageBlocksContent });
-			$[16] = LayoutComponent;
-			$[17] = pageBlocksContent;
+		if ($[16] !== locale || $[17] !== pageData) {
+			t3 = curatedLayoutContext(pageData, locale);
+			$[16] = locale;
+			$[17] = pageData;
 			$[18] = t3;
 		} else t3 = $[18];
 		let t4;
-		if ($[19] !== layout._internal.Provider || $[20] !== layoutBlocksMap || $[21] !== t3) {
-			t4 = /* @__PURE__ */ jsx(layout._internal.Provider, {
-				layoutBlocks: layoutBlocksMap,
-				children: t3
+		if ($[19] !== ToReact || $[20] !== pageBlocksContent || $[21] !== t3) {
+			t4 = /* @__PURE__ */ jsx(ToReact, {
+				...t3,
+				children: pageBlocksContent
 			});
-			$[19] = layout._internal.Provider;
-			$[20] = layoutBlocksMap;
+			$[19] = ToReact;
+			$[20] = pageBlocksContent;
 			$[21] = t3;
 			$[22] = t4;
 		} else t4 = $[22];
 		let t5;
-		if ($[23] !== layoutFiles || $[24] !== layoutItems || $[25] !== t2 || $[26] !== t4) {
-			t5 = /* @__PURE__ */ jsx(NormalizedDataProvider, {
+		if ($[23] !== layout._internal.Provider || $[24] !== layoutBlocksMap || $[25] !== t4) {
+			t5 = /* @__PURE__ */ jsx(T0, {
+				layoutBlocks: layoutBlocksMap,
+				children: t4
+			});
+			$[23] = layout._internal.Provider;
+			$[24] = layoutBlocksMap;
+			$[25] = t4;
+			$[26] = t5;
+		} else t5 = $[26];
+		let t6;
+		if ($[27] !== layoutFiles || $[28] !== layoutItems || $[29] !== t2 || $[30] !== t5) {
+			t6 = /* @__PURE__ */ jsx(NormalizedDataProvider, {
 				files: layoutFiles,
 				repeatableItems: layoutItems,
 				blocks: t2,
-				children: t4
+				children: t5
 			});
-			$[23] = layoutFiles;
-			$[24] = layoutItems;
-			$[25] = t2;
-			$[26] = t4;
-			$[27] = t5;
-		} else t5 = $[27];
-		return t5;
+			$[27] = layoutFiles;
+			$[28] = layoutItems;
+			$[29] = t2;
+			$[30] = t5;
+			$[31] = t6;
+		} else t6 = $[31];
+		return t6;
 	}
 	let t2;
-	if ($[28] !== pageBlocksContent) {
+	if ($[32] !== pageBlocksContent) {
 		t2 = /* @__PURE__ */ jsx("main", {
 			className: "flex min-h-screen flex-col",
 			children: pageBlocksContent
 		});
-		$[28] = pageBlocksContent;
-		$[29] = t2;
-	} else t2 = $[29];
+		$[32] = pageBlocksContent;
+		$[33] = t2;
+	} else t2 = $[33];
 	return t2;
 };
 /**
@@ -617,7 +632,7 @@ function usePrefetchCanvas(enabled, projectUuid) {
 }
 /** Studio chrome is shared; only curated previews require a Camox page record. */
 const PreviewShell = (t0) => {
-	const $ = c(49);
+	const $ = c(53);
 	const { children, pageData, derivedLayout, pageLocation, canvasOnly, runtimeBasePath: t1 } = t0;
 	const runtimeBasePath = t1 === void 0 ? "" : t1;
 	const isAuthenticated = useIsAuthenticated();
@@ -663,26 +678,42 @@ const PreviewShell = (t0) => {
 	const editingOwner = t2;
 	let t3;
 	let t4;
-	if ($[4] !== isMobileStudio) {
+	if ($[4] !== isAuthenticated || $[5] !== isMobileStudio) {
 		t3 = () => {
-			if (!isMobileStudio) return;
-			previewStore.send({ type: "hideCanvas" });
-			previewStore.send({ type: "closeAddBlockSheet" });
+			if (isAuthenticated && takeShowCanvasRequest() && !isMobileStudio) previewStore.send({ type: "showCanvas" });
 		};
-		t4 = [isMobileStudio];
-		$[4] = isMobileStudio;
-		$[5] = t3;
-		$[6] = t4;
+		t4 = [isAuthenticated, isMobileStudio];
+		$[4] = isAuthenticated;
+		$[5] = isMobileStudio;
+		$[6] = t3;
+		$[7] = t4;
 	} else {
-		t3 = $[5];
-		t4 = $[6];
+		t3 = $[6];
+		t4 = $[7];
 	}
 	React.useEffect(t3, t4);
-	useCanvasOnlyLocation(!!canvasOnly && isAuthenticated, isCanvasShown, isMobileStudio, pageLocation);
 	let t5;
 	let t6;
-	if ($[7] !== isAuthenticated || $[8] !== isCanvasShown || $[9] !== isMobileStudio) {
+	if ($[8] !== isMobileStudio) {
 		t5 = () => {
+			if (!isMobileStudio) return;
+			previewStore.send({ type: "hideCanvas" });
+			previewStore.send({ type: "closeAddBlockSheet" });
+		};
+		t6 = [isMobileStudio];
+		$[8] = isMobileStudio;
+		$[9] = t5;
+		$[10] = t6;
+	} else {
+		t5 = $[9];
+		t6 = $[10];
+	}
+	React.useEffect(t5, t6);
+	useCanvasOnlyLocation(!!canvasOnly && isAuthenticated, isCanvasShown, isMobileStudio, pageLocation);
+	let t7;
+	let t8;
+	if ($[11] !== isAuthenticated || $[12] !== isCanvasShown || $[13] !== isMobileStudio) {
+		t7 = () => {
 			const actions = [
 				{
 					id: "hide-canvas",
@@ -732,140 +763,140 @@ const PreviewShell = (t0) => {
 				});
 			};
 		};
-		t6 = [
+		t8 = [
 			isCanvasShown,
 			isAuthenticated,
 			isMobileStudio
 		];
-		$[7] = isAuthenticated;
-		$[8] = isCanvasShown;
-		$[9] = isMobileStudio;
-		$[10] = t5;
-		$[11] = t6;
+		$[11] = isAuthenticated;
+		$[12] = isCanvasShown;
+		$[13] = isMobileStudio;
+		$[14] = t7;
+		$[15] = t8;
 	} else {
-		t5 = $[10];
-		t6 = $[11];
+		t7 = $[14];
+		t8 = $[15];
 	}
-	React.useEffect(t5, t6);
+	React.useEffect(t7, t8);
 	if (!isAuthenticated) {
-		let t7;
-		if ($[12] !== children) {
-			t7 = /* @__PURE__ */ jsx(Fragment, { children });
-			$[12] = children;
-			$[13] = t7;
-		} else t7 = $[13];
-		return t7;
+		let t9;
+		if ($[16] !== children) {
+			t9 = /* @__PURE__ */ jsx(Fragment, { children });
+			$[16] = children;
+			$[17] = t9;
+		} else t9 = $[17];
+		return t9;
 	}
-	const t7 = !isCanvasShown && "bg-black";
-	let t8;
-	if ($[14] !== t7) {
-		t8 = cn("bg-background relative flex h-full min-h-0 flex-1 flex-col overflow-hidden", t7);
-		$[14] = t7;
-		$[15] = t8;
-	} else t8 = $[15];
-	const t9 = pageLocation?.pathname;
-	const t10 = !canvasOnly;
-	const t11 = !!derivedLayout;
-	let t12;
-	if ($[16] !== t10 || $[17] !== t11) {
-		t12 = /* @__PURE__ */ jsx(CanvasSidebarSkeleton, {
-			page: t10,
-			layoutPage: t11
+	const t9 = !isCanvasShown && "bg-black";
+	let t10;
+	if ($[18] !== t9) {
+		t10 = cn("bg-background relative flex h-full min-h-0 flex-1 flex-col overflow-hidden", t9);
+		$[18] = t9;
+		$[19] = t10;
+	} else t10 = $[19];
+	const t11 = pageLocation?.pathname;
+	const t12 = !canvasOnly;
+	const t13 = !!derivedLayout;
+	let t14;
+	if ($[20] !== t12 || $[21] !== t13) {
+		t14 = /* @__PURE__ */ jsx(CanvasSidebarSkeleton, {
+			page: t12,
+			layoutPage: t13
 		});
-		$[16] = t10;
-		$[17] = t11;
-		$[18] = t12;
-	} else t12 = $[18];
-	const t13 = !isCanvasEnabled;
-	const t14 = pageData?.page;
-	const t15 = derivedLayout?.layoutId;
-	const t16 = pageData?.projectName;
-	let t17;
-	if ($[19] !== children || $[20] !== isMobileStudio || $[21] !== pageLocation || $[22] !== t13 || $[23] !== t14 || $[24] !== t15 || $[25] !== t16) {
-		t17 = /* @__PURE__ */ jsx("div", {
+		$[20] = t12;
+		$[21] = t13;
+		$[22] = t14;
+	} else t14 = $[22];
+	const t15 = !isCanvasEnabled;
+	const t16 = pageData?.page;
+	const t17 = derivedLayout?.layoutId;
+	const t18 = pageData?.projectName;
+	let t19;
+	if ($[23] !== children || $[24] !== isMobileStudio || $[25] !== pageLocation || $[26] !== t15 || $[27] !== t16 || $[28] !== t17 || $[29] !== t18) {
+		t19 = /* @__PURE__ */ jsx("div", {
 			className: "flex min-h-0 flex-1 flex-row items-stretch",
 			children: /* @__PURE__ */ jsx(PreviewPanel, {
-				active: t13,
+				active: t15,
 				isMobileExperience: isMobileStudio,
-				page: t14,
-				layoutId: t15,
+				page: t16,
+				layoutId: t17,
 				pageLocation,
-				projectName: t16,
+				projectName: t18,
 				children
 			})
 		});
-		$[19] = children;
-		$[20] = isMobileStudio;
-		$[21] = pageLocation;
-		$[22] = t13;
-		$[23] = t14;
-		$[24] = t15;
-		$[25] = t16;
-		$[26] = t17;
-	} else t17 = $[26];
-	let t18;
-	if ($[27] !== isCanvasEnabled || $[28] !== pathname || $[29] !== runtimeBasePath || $[30] !== t12 || $[31] !== t17 || $[32] !== t9) {
-		t18 = /* @__PURE__ */ jsx(CanvasPreview, {
+		$[23] = children;
+		$[24] = isMobileStudio;
+		$[25] = pageLocation;
+		$[26] = t15;
+		$[27] = t16;
+		$[28] = t17;
+		$[29] = t18;
+		$[30] = t19;
+	} else t19 = $[30];
+	let t20;
+	if ($[31] !== isCanvasEnabled || $[32] !== pathname || $[33] !== runtimeBasePath || $[34] !== t11 || $[35] !== t14 || $[36] !== t19) {
+		t20 = /* @__PURE__ */ jsx(CanvasPreview, {
 			enabled: isCanvasEnabled,
 			pathname,
-			pagePathname: t9,
+			pagePathname: t11,
 			runtimeBasePath,
-			placeholder: t12,
-			children: t17
+			placeholder: t14,
+			children: t19
 		});
-		$[27] = isCanvasEnabled;
-		$[28] = pathname;
-		$[29] = runtimeBasePath;
-		$[30] = t12;
-		$[31] = t17;
-		$[32] = t9;
-		$[33] = t18;
-	} else t18 = $[33];
-	let t19;
-	if ($[34] !== isCanvasEnabled || $[35] !== pageId) {
-		t19 = !isCanvasEnabled && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(CreatePageModal, {}), pageId != null && /* @__PURE__ */ jsx(AddBlockSheet, {})] });
-		$[34] = isCanvasEnabled;
-		$[35] = pageId;
+		$[31] = isCanvasEnabled;
+		$[32] = pathname;
+		$[33] = runtimeBasePath;
+		$[34] = t11;
+		$[35] = t14;
 		$[36] = t19;
-	} else t19 = $[36];
-	let t20;
-	if ($[37] !== t18 || $[38] !== t19 || $[39] !== t8) {
-		t20 = /* @__PURE__ */ jsxs("div", {
-			className: t8,
-			children: [t18, t19]
-		});
-		$[37] = t18;
-		$[38] = t19;
-		$[39] = t8;
-		$[40] = t20;
-	} else t20 = $[40];
+		$[37] = t20;
+	} else t20 = $[37];
 	let t21;
-	if ($[41] !== editingOwner || $[42] !== t20) {
-		t21 = /* @__PURE__ */ jsx(PreviewEditingOwnerContext, {
-			value: editingOwner,
-			children: t20
+	if ($[38] !== isCanvasEnabled || $[39] !== pageId) {
+		t21 = !isCanvasEnabled && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(CreatePageModal, {}), pageId != null && /* @__PURE__ */ jsx(AddBlockSheet, {})] });
+		$[38] = isCanvasEnabled;
+		$[39] = pageId;
+		$[40] = t21;
+	} else t21 = $[40];
+	let t22;
+	if ($[41] !== t10 || $[42] !== t20 || $[43] !== t21) {
+		t22 = /* @__PURE__ */ jsxs("div", {
+			className: t10,
+			children: [t20, t21]
 		});
-		$[41] = editingOwner;
+		$[41] = t10;
 		$[42] = t20;
 		$[43] = t21;
-	} else t21 = $[43];
-	let t22;
-	if ($[44] !== projectUuid) {
-		t22 = /* @__PURE__ */ jsx(ContentCollectionItemSheet, { projectUuid });
-		$[44] = projectUuid;
-		$[45] = t22;
-	} else t22 = $[45];
+		$[44] = t22;
+	} else t22 = $[44];
 	let t23;
-	if ($[46] !== t21 || $[47] !== t22) {
-		t23 = /* @__PURE__ */ jsxs(CollectionItemSheetProvider, {
+	if ($[45] !== editingOwner || $[46] !== t22) {
+		t23 = /* @__PURE__ */ jsx(PreviewEditingOwnerContext, {
+			value: editingOwner,
+			children: t22
+		});
+		$[45] = editingOwner;
+		$[46] = t22;
+		$[47] = t23;
+	} else t23 = $[47];
+	let t24;
+	if ($[48] !== projectUuid) {
+		t24 = /* @__PURE__ */ jsx(ContentCollectionItemSheet, { projectUuid });
+		$[48] = projectUuid;
+		$[49] = t24;
+	} else t24 = $[49];
+	let t25;
+	if ($[50] !== t23 || $[51] !== t24) {
+		t25 = /* @__PURE__ */ jsxs(CollectionItemSheetProvider, {
 			onRouteTargetClose: _temp9,
-			children: [t21, t22]
+			children: [t23, t24]
 		});
-		$[46] = t21;
-		$[47] = t22;
-		$[48] = t23;
-	} else t23 = $[48];
-	return t23;
+		$[50] = t23;
+		$[51] = t24;
+		$[52] = t25;
+	} else t25 = $[52];
+	return t25;
 };
 /** Zooms out to the whole Canvas, from anywhere in the site or the Studio. */
 function useShowCanvasAction() {

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

@@ -76,6 +76,7 @@ const AddBlockSheet = ({ focusCreatedBlock = true }) => {
 				settings: variables.settings ?? null,
 				slot: null,
 				summary: "",
+				title: "",
 				position,
 				createdAt: now,
 				updatedAt: now

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

@@ -4,6 +4,7 @@ import { usePageBlocks } from "../../../lib/normalized-data.js";
 import { formatShortcut } from "../../../lib/utils.js";
 import { blockMutations, repeatableItemMutations } from "../../../lib/queries.js";
 import { isBlockSelection, previewStore, selectionForPage, selectionItemId } from "../previewStore.js";
+import { entityName } from "../entityName.js";
 import { useUpdateBlockPosition } from "./useUpdateBlockPosition.js";
 import { usePreviewedPage } from "../CamoxPreview.js";
 import { c } from "react/compiler-runtime";
@@ -28,7 +29,7 @@ const BlockActionsPopover = ({ block, children, open, onOpenChange, align = "sta
 	const handleDeleteBlock = async (block) => {
 		try {
 			await deleteBlock.mutateAsync({ id: block.id });
-			toast.success(`Deleted "${block.summary || block.type}" block`);
+			toast.success(`Deleted "${entityName(block, block.type)}" block`);
 		} catch (error) {
 			console.error("Failed to delete block:", error);
 			toast.error("Could not delete block");
@@ -39,7 +40,7 @@ const BlockActionsPopover = ({ block, children, open, onOpenChange, align = "sta
 	const handleDuplicateBlock = async (block) => {
 		try {
 			await duplicateBlock.mutateAsync({ id: block.id });
-			toast.success(`Duplicated "${block.summary}" block`);
+			toast.success(`Duplicated "${entityName(block, block.type)}" block`);
 		} catch (error) {
 			console.error("Failed to duplicate block:", error);
 			toast.error("Could not duplicate block");
@@ -209,8 +210,9 @@ const BlockActionsPopover = ({ block, children, open, onOpenChange, align = "sta
 		open: !!blockToDelete,
 		onOpenChange: (open) => !open && setBlockToDelete(null),
 		children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [/* @__PURE__ */ jsxs(AlertDialogHeader, { children: [/* @__PURE__ */ jsx(AlertDialogTitle, { children: "Delete block" }), /* @__PURE__ */ jsxs(AlertDialogDescription, { children: [
-			"Are you sure you want to delete ",
-			/* @__PURE__ */ jsx("strong", { children: blockToDelete?.summary }),
+			"Are you sure you want to delete",
+			" ",
+			/* @__PURE__ */ jsx("strong", { children: blockToDelete && entityName(blockToDelete, blockToDelete.type) }),
 			"? This action cannot be undone."
 		] })] }), /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [/* @__PURE__ */ jsx(AlertDialogCancel, {
 			variant: "outline",
@@ -310,7 +312,7 @@ function useBlockActionsShortcuts() {
 							return;
 						}
 						const block_0 = pageBlocks.find((b_0) => b_0.id === sel_0.blockId);
-						deleteBlock({ id: sel_0.blockId }).then(() => toast.success(`Deleted "${block_0?.summary || block_0?.type}" block`), _temp6);
+						deleteBlock({ id: sel_0.blockId }).then(() => toast.success(`Deleted "${block_0 ? entityName(block_0, block_0.type) : ""}" block`), _temp6);
 						previewStore.send({ type: "clearSelection" });
 					}
 				},
@@ -339,7 +341,7 @@ function useBlockActionsShortcuts() {
 							return;
 						}
 						const block_1 = pageBlocks.find((b_1) => b_1.id === sel_2.blockId);
-						duplicateBlock({ id: sel_2.blockId }).then(() => toast.success(`Duplicated "${block_1?.summary}" block`), _temp9);
+						duplicateBlock({ id: sel_2.blockId }).then(() => toast.success(`Duplicated "${block_1 ? entityName(block_1, block_1.type) : ""}" block`), _temp9);
 					}
 				},
 				{