camox 0.47.0 → 0.51.0

package/dist/features/page/SharedLayoutContent.js

@@ -6,8 +6,8 @@ import { jsx } from "react/jsx-runtime";
 //#region src/features/page/SharedLayoutContent.tsx
 /** Shared before/after rendering for both curated and data-derived pages. */
 function SharedLayoutContent(t0) {
-	const $ = c(15);
-	const { layout, blocks, files, repeatableItems, result, children } = t0;
+	const $ = c(16);
+	const { layout, context, blocks, files, repeatableItems, result, children } = t0;
 	let result_0;
 	if ($[0] !== blocks) {
 		result_0 = {};
@@ -22,41 +22,45 @@ function SharedLayoutContent(t0) {
 		$[1] = result_0;
 	} else result_0 = $[1];
 	const layoutBlocks = result_0;
-	const Component = layout._internal.component;
+	const ToReact = layout._internal.toReact;
 	let t1;
-	if ($[2] !== Component || $[3] !== children) {
-		t1 = /* @__PURE__ */ jsx(Component, { children });
-		$[2] = Component;
+	if ($[2] !== ToReact || $[3] !== children || $[4] !== context) {
+		t1 = /* @__PURE__ */ jsx(ToReact, {
+			...context,
+			children
+		});
+		$[2] = ToReact;
 		$[3] = children;
-		$[4] = t1;
-	} else t1 = $[4];
+		$[4] = context;
+		$[5] = t1;
+	} else t1 = $[5];
 	let t2;
-	if ($[5] !== layout._internal.Provider || $[6] !== layoutBlocks || $[7] !== result || $[8] !== t1) {
+	if ($[6] !== layout._internal.Provider || $[7] !== layoutBlocks || $[8] !== result || $[9] !== t1) {
 		t2 = /* @__PURE__ */ jsx(layout._internal.Provider, {
 			layoutBlocks,
 			result,
 			children: t1
 		});
-		$[5] = layout._internal.Provider;
-		$[6] = layoutBlocks;
-		$[7] = result;
-		$[8] = t1;
-		$[9] = t2;
-	} else t2 = $[9];
+		$[6] = layout._internal.Provider;
+		$[7] = layoutBlocks;
+		$[8] = result;
+		$[9] = t1;
+		$[10] = t2;
+	} else t2 = $[10];
 	let t3;
-	if ($[10] !== blocks || $[11] !== files || $[12] !== repeatableItems || $[13] !== t2) {
+	if ($[11] !== blocks || $[12] !== files || $[13] !== repeatableItems || $[14] !== t2) {
 		t3 = /* @__PURE__ */ jsx(NormalizedDataProvider, {
 			files,
 			repeatableItems,
 			blocks,
 			children: t2
 		});
-		$[10] = blocks;
-		$[11] = files;
-		$[12] = repeatableItems;
-		$[13] = t2;
-		$[14] = t3;
-	} else t3 = $[14];
+		$[11] = blocks;
+		$[12] = files;
+		$[13] = repeatableItems;
+		$[14] = t2;
+		$[15] = t3;
+	} else t3 = $[15];
 	return t3;
 }
 

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";
@@ -164,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;
@@ -228,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];
@@ -236,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;
 };
 /**
@@ -735,7 +749,7 @@ const PreviewShell = (t0) => {
 					groupLabel: "Website",
 					checkIfAvailable: _temp6,
 					execute: _temp7,
-					shortcut: { key: "Escape" }
+					shortcut: "Escape"
 				}
 			];
 			actionsStore.send({

package/dist/features/preview/EditablePageExperience.js

@@ -4,16 +4,23 @@ import { AuthenticatedCamoxProvider } from "../provider/AuthenticatedCamoxProvid
 import { CamoxStudio } from "../studio/CamoxStudio.js";
 import "./EditablePageContent.js";
 import { CompleteBlockEditingRuntimeProvider } from "../../core/editing/CompleteBlockEditingRuntime.js";
+import { CamoxSettings } from "../settings/CamoxSettings.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/features/preview/EditablePageExperience.tsx
+/** The studio section each studio route shows. */
+const STUDIO_SECTIONS = {
+	"studio-content": CamoxContent,
+	"studio-settings": CamoxSettings
+};
 function EditablePageExperience(t0) {
-	const $ = c(5);
+	const $ = c(6);
 	const { input } = t0;
+	const StudioSection = input.routeKind && STUDIO_SECTIONS[input.routeKind];
 	let t1;
-	if ($[0] !== input.canvasOnly || $[1] !== input.derived || $[2] !== input.routeKind || $[3] !== input.runtimeBasePath) {
-		t1 = /* @__PURE__ */ jsx(AuthenticatedCamoxProvider, { children: /* @__PURE__ */ jsx(CompleteBlockEditingRuntimeProvider, { children: input.routeKind ? /* @__PURE__ */ jsx(CamoxStudio, { children: input.routeKind === "studio-content" ? /* @__PURE__ */ jsx(CamoxContent, {}) : /* @__PURE__ */ jsx("div", {
+	if ($[0] !== StudioSection || $[1] !== input.canvasOnly || $[2] !== input.derived || $[3] !== input.routeKind || $[4] !== input.runtimeBasePath) {
+		t1 = /* @__PURE__ */ jsx(AuthenticatedCamoxProvider, { children: /* @__PURE__ */ jsx(CompleteBlockEditingRuntimeProvider, { children: input.routeKind ? /* @__PURE__ */ jsx(CamoxStudio, { children: StudioSection ? /* @__PURE__ */ jsx(StudioSection, {}) : /* @__PURE__ */ jsx("div", {
 			className: "text-muted-foreground p-6 text-sm",
 			children: "Studio page not found"
 		}) }) : /* @__PURE__ */ jsx(CamoxPreview, {
@@ -22,12 +29,13 @@ function EditablePageExperience(t0) {
 			runtimeBasePath: input.runtimeBasePath,
 			children: /* @__PURE__ */ jsx(PageContent, {})
 		}) }) });
-		$[0] = input.canvasOnly;
-		$[1] = input.derived;
-		$[2] = input.routeKind;
-		$[3] = input.runtimeBasePath;
-		$[4] = t1;
-	} else t1 = $[4];
+		$[0] = StudioSection;
+		$[1] = input.canvasOnly;
+		$[2] = input.derived;
+		$[3] = input.routeKind;
+		$[4] = input.runtimeBasePath;
+		$[5] = t1;
+	} else t1 = $[5];
 	return t1;
 }
 

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

@@ -1,9 +1,10 @@
 import { actionsStore } from "../../provider/actionsStore.js";
 import { useCamoxApp } from "../../provider/components/CamoxAppContext.js";
 import { usePageBlocks } from "../../../lib/normalized-data.js";
-import { formatShortcut } from "../../../lib/utils.js";
 import { blockMutations, repeatableItemMutations } from "../../../lib/queries.js";
+import { formatShortcut } from "../../../lib/shortcuts.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");
@@ -138,7 +139,7 @@ const BlockActionsPopover = ({ block, children, open, onOpenChange, align = "sta
 							children: [/* @__PURE__ */ jsxs("div", {
 								className: "flex items-center gap-2",
 								children: [/* @__PURE__ */ jsx("span", { className: "w-4" }), "Add block below"]
-							}), /* @__PURE__ */ jsx(CommandShortcut, { children: formatShortcut({ key: "o" }) })]
+							}), /* @__PURE__ */ jsx(CommandShortcut, { children: formatShortcut("O") })]
 						}), /* @__PURE__ */ jsxs(CommandItem, {
 							className: "justify-between",
 							onSelect: () => {
@@ -148,10 +149,7 @@ const BlockActionsPopover = ({ block, children, open, onOpenChange, align = "sta
 							children: [/* @__PURE__ */ jsxs("div", {
 								className: "flex items-center gap-2",
 								children: [/* @__PURE__ */ jsx("span", { className: "w-4" }), "Add block above"]
-							}), /* @__PURE__ */ jsx(CommandShortcut, { children: formatShortcut({
-								key: "o",
-								withShift: true
-							}) })]
+							}), /* @__PURE__ */ jsx(CommandShortcut, { children: formatShortcut("Shift+O") })]
 						})] }),
 						/* @__PURE__ */ jsx(CommandSeparator, {}),
 						/* @__PURE__ */ jsx(CommandGroup, { children: /* @__PURE__ */ jsxs(CommandItem, {
@@ -163,10 +161,7 @@ const BlockActionsPopover = ({ block, children, open, onOpenChange, align = "sta
 							children: [/* @__PURE__ */ jsxs("div", {
 								className: "flex items-center gap-2",
 								children: [/* @__PURE__ */ jsx(Copy, { className: "h-4 w-4" }), "Duplicate block"]
-							}), /* @__PURE__ */ jsx(CommandShortcut, { children: formatShortcut({
-								key: "d",
-								withMeta: true
-							}) })]
+							}), /* @__PURE__ */ jsx(CommandShortcut, { children: formatShortcut("Mod+D") })]
 						}) }),
 						/* @__PURE__ */ jsx(CommandSeparator, {}),
 						/* @__PURE__ */ jsxs(CommandGroup, { children: [
@@ -195,10 +190,7 @@ const BlockActionsPopover = ({ block, children, open, onOpenChange, align = "sta
 								children: [/* @__PURE__ */ jsxs("div", {
 									className: "flex items-center gap-2",
 									children: [/* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" }), "Delete block"]
-								}), /* @__PURE__ */ jsx(CommandShortcut, { children: formatShortcut({
-									key: "Backspace",
-									withMeta: true
-								}) })]
+								}), /* @__PURE__ */ jsx(CommandShortcut, { children: formatShortcut("Mod+Backspace") })]
 							})
 						] })
 					] })
@@ -209,8 +201,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",
@@ -277,10 +270,7 @@ function useBlockActionsShortcuts() {
 					id: "delete-selected",
 					label: "Delete selected",
 					groupLabel: "Website",
-					shortcut: {
-						key: "Backspace",
-						withMeta: true
-					},
+					shortcut: "Mod+Backspace",
 					checkIfAvailable: () => {
 						const ctx = previewStore.getSnapshot().context;
 						if (ctx.view !== "canvas") return false;
@@ -310,7 +300,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" });
 					}
 				},
@@ -318,10 +308,7 @@ function useBlockActionsShortcuts() {
 					id: "duplicate-selected",
 					label: "Duplicate selected",
 					groupLabel: "Website",
-					shortcut: {
-						key: "d",
-						withMeta: true
-					},
+					shortcut: "Mod+D",
 					checkIfAvailable: () => {
 						const ctx_0 = previewStore.getSnapshot().context;
 						if (ctx_0.view !== "canvas") return false;
@@ -339,17 +326,14 @@ 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);
 					}
 				},
 				{
 					id: "move-block-up",
 					label: "Move block up",
 					groupLabel: "Website",
-					shortcut: {
-						key: "ArrowUp",
-						withAlt: true
-					},
+					shortcut: "Alt+ArrowUp",
 					checkIfAvailable: () => {
 						const ctx_1 = previewStore.getSnapshot().context;
 						if (ctx_1.view !== "canvas") return false;
@@ -376,10 +360,7 @@ function useBlockActionsShortcuts() {
 					id: "move-block-down",
 					label: "Move block down",
 					groupLabel: "Website",
-					shortcut: {
-						key: "ArrowDown",
-						withAlt: true
-					},
+					shortcut: "Alt+ArrowDown",
 					checkIfAvailable: () => {
 						const ctx_2 = previewStore.getSnapshot().context;
 						if (ctx_2.view !== "canvas") return false;
@@ -407,7 +388,7 @@ function useBlockActionsShortcuts() {
 					id: "add-block-below",
 					label: "Add block below",
 					groupLabel: "Website",
-					shortcut: { key: "o" },
+					shortcut: "O",
 					checkIfAvailable: () => {
 						const ctx_3 = previewStore.getSnapshot().context;
 						if (ctx_3.view !== "canvas") return false;
@@ -428,10 +409,7 @@ function useBlockActionsShortcuts() {
 					id: "add-block-above",
 					label: "Add block above",
 					groupLabel: "Website",
-					shortcut: {
-						key: "o",
-						withShift: true
-					},
+					shortcut: "Shift+O",
 					checkIfAvailable: () => {
 						const ctx_4 = previewStore.getSnapshot().context;
 						if (ctx_4.view !== "canvas") return false;

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

@@ -7,9 +7,9 @@ import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@camox/ui/button";
 import { Bold, Highlighter, Italic, Strikethrough } from "lucide-react";
-import { Kbd } from "@camox/ui/kbd";
 import { ButtonGroup } from "@camox/ui/button-group";
 import * as Tooltip$1 from "@camox/ui/tooltip";
+import { Kbd } from "@camox/ui/kbd";
 import { FloatingToolbar } from "@camox/ui/floating-toolbar";
 import { Toggle } from "@camox/ui/toggle";
 

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

@@ -1,6 +1,7 @@
-import { useAuthContext } from "../../../lib/auth.js";
-import { reads, useReadQuery } from "../../../lib/studio-reads.js";
+import { useNavigate } from "../../navigation/navigation.js";
 import { cn } from "../../../lib/utils.js";
+import { useLocalizedPath } from "../../../lib/view-locale.js";
+import { STUDIO_SETTINGS_PATH } from "../../studio/routes.js";
 import { previewStore, selectionBlockId, selectionForPage } from "../previewStore.js";
 import { UserButton } from "../../studio/components/UserButton.js";
 import { PageInfo, PageMarkdownContent, PageSeoContent } from "./PageInfo.js";
@@ -28,8 +29,8 @@ function MobilePreviewDrawer({ page, projectName }) {
 	const [isExpanded, setIsExpanded] = React.useState(false);
 	const [isDragging, setIsDragging] = React.useState(false);
 	const [screen, setScreen] = React.useState("root");
-	const authCtx = useAuthContext();
-	const { data: project } = useReadQuery(reads.project({ projectUuid: authCtx.projectUuid }));
+	const navigate = useNavigate();
+	const localized = useLocalizedPath();
 	const dragStartRef = React.useRef({
 		y: 0,
 		height: COLLAPSED_HEIGHT
@@ -200,11 +201,7 @@ function MobilePreviewDrawer({ page, projectName }) {
 								/* @__PURE__ */ jsx(DrawerTile, {
 									title: "Project settings",
 									icon: Settings,
-									onClick: () => {
-										if (!project) return;
-										window.open(`${authCtx.authenticationUrl}/${project.organizationSlug}/${project.slug}/overview`, "_blank", "noopener,noreferrer");
-									},
-									disabled: !project
+									onClick: () => void navigate({ to: localized("/camox/settings") })
 								})
 							]
 						})]