camox 0.45.0 → 0.46.0

package/dist/features/canvas/CamoxCanvas.js

@@ -7,8 +7,8 @@ import { useCamoxApp } from "../provider/components/CamoxAppContext.js";
 import { reads, useReadQuery, useStudioCache } from "../../lib/studio-reads.js";
 import { pageMutations } from "../../lib/queries.js";
 import { useLocalizedPath } from "../../lib/view-locale.js";
-import { canvasStore, setShelfCollapsed, useCollapsedShelves } from "./canvasStore.js";
-import { STUDIO_CANVAS_PATH, blockCatalogPath, matchBlockCatalogPath } from "../studio/routes.js";
+import { canvasStore } from "./canvasStore.js";
+import { STUDIO_CANVAS_PATH } from "../studio/routes.js";
 import { previewStore } from "../preview/previewStore.js";
 import { PREVIEW_PAGE_SLOT_ATTRIBUTE, PreviewPageFrameContext } from "../preview/previewPageFrame.js";
 import { PreviewPreparationContext } from "../preview/previewPreparation.js";
@@ -18,11 +18,8 @@ import { PageRecordContext, getPageRecord } from "../preview/pageRecord.js";
 import { CuratedBlockShortcuts } from "../preview/components/PreviewPanel.js";
 import { FollowAgentContext } from "../studio/followAgentContext.js";
 import { useCanvasFrameMode } from "./canvasFrameMode.js";
-import { useCanvasNearness } from "./useCanvasNearness.js";
-import { CanvasBlockFrame } from "./CanvasBlockFrame.js";
-import { CanvasBlockHeader } from "./CanvasBlockHeader.js";
 import { CANVAS_DEVICES, canvasLayoutId, canvasPageId, derivedLayoutIdOf, getCanvasPages } from "./canvasPages.js";
-import { CANVAS_SLOT_WIDTH, canvasBlockKey, canvasSnapTargets, getBlockCatalog, getCanvasShelves, getDefaultCollapsedShelves, isCanvasBlock, isCanvasShelfShown, positionCanvasShelves } from "./canvasItems.js";
+import { CANVAS_SLOT_WIDTH, canvasSnapTargets, positionCanvasPages } from "./canvasItems.js";
 import { CanvasOverlaysShownContext } from "./CanvasOverlays.js";
 import { CanvasPageEdge } from "./CanvasPageEdge.js";
 import { CANVAS_THUMBNAIL_MAX_ZOOM, CanvasThumbnailsContext, canvasThumbnailsSupported, createCanvasThumbnails, useCanvasThumbnail } from "./canvasThumbnails.js";
@@ -31,9 +28,9 @@ import { CanvasPageHeader } from "./CanvasPageHeader.js";
 import { CanvasPreviewPageSlot } from "./CanvasPreviewPageSlot.js";
 import { CANVAS_WORLD_TRANSFORM, canvasScreenAbove, canvasScreenLength, canvasScreenX } from "./canvasScreenSpace.js";
 import { selectedCanvasPage } from "./canvasSelection.js";
-import { CanvasShelfMarkers } from "./CanvasShelfMarker.js";
 import { CanvasSidebar } from "./sidebar/CanvasSidebar.js";
 import { useCanvasCamera } from "./useCanvasCamera.js";
+import { useCanvasNearness } from "./useCanvasNearness.js";
 import { useDiscoveredPreviewPaths } from "./useDiscoveredPreviewPaths.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
@@ -98,15 +95,11 @@ var CanvasFrameBoundary = class extends React.Component {
 		if (!this.state.error) return this.props.children;
 		return /* @__PURE__ */ jsxs(CanvasMessage, { children: [/* @__PURE__ */ jsx(PreparationFailure, {
 			error: this.state.error,
-			selected: this.props.selected ?? false
+			selected: this.props.selected
 		}), /* @__PURE__ */ jsxs("div", {
 			role: "alert",
 			children: [
-				/* @__PURE__ */ jsxs("p", { children: [
-					"This ",
-					this.props.subject,
-					" could not be rendered."
-				] }),
+				/* @__PURE__ */ jsx("p", { children: "This page could not be rendered." }),
 				/* @__PURE__ */ jsx("p", {
 					className: "mt-2",
 					children: this.state.error.message
@@ -562,84 +555,10 @@ function createCanvasHover() {
 		on: { set: (context, event) => context.pageKey === event.pageKey ? context : { pageKey: event.pageKey } }
 	});
 }
-/** A Block Catalog block's area in the Canvas row, with its frame. */
-function CanvasBlockItem(t0) {
-	const $ = c(24);
-	const { itemKey, block, projectId, runtimeBasePath, viewport, framed, selected, selectBlock } = t0;
-	let t1;
-	if ($[0] !== viewport.width) {
-		t1 = { width: viewport.width };
-		$[0] = viewport.width;
-		$[1] = t1;
-	} else t1 = $[1];
-	let t2;
-	if ($[2] !== block || $[3] !== selectBlock) {
-		t2 = () => selectBlock(block);
-		$[2] = block;
-		$[3] = selectBlock;
-		$[4] = t2;
-	} else t2 = $[4];
-	let t3;
-	if ($[5] !== block || $[6] !== projectId || $[7] !== runtimeBasePath || $[8] !== selected || $[9] !== t2 || $[10] !== viewport.height || $[11] !== viewport.width) {
-		t3 = /* @__PURE__ */ jsx(CanvasFrameBoundary, {
-			subject: "block",
-			children: /* @__PURE__ */ jsx(CanvasBlockFrame, {
-				block,
-				projectId,
-				runtimeBasePath,
-				width: viewport.width,
-				viewportHeight: viewport.height,
-				selected,
-				onSelect: t2
-			})
-		});
-		$[5] = block;
-		$[6] = projectId;
-		$[7] = runtimeBasePath;
-		$[8] = selected;
-		$[9] = t2;
-		$[10] = viewport.height;
-		$[11] = viewport.width;
-		$[12] = t3;
-	} else t3 = $[12];
-	let t4;
-	if ($[13] !== framed) {
-		t4 = /* @__PURE__ */ jsx(CanvasPageEdge, { shaded: framed });
-		$[13] = framed;
-		$[14] = t4;
-	} else t4 = $[14];
-	let t5;
-	if ($[15] !== block._internal.id || $[16] !== t1 || $[17] !== t3 || $[18] !== t4) {
-		t5 = /* @__PURE__ */ jsxs("div", {
-			"data-canvas-block": block._internal.id,
-			className: "bg-background relative shrink-0 shadow-xl ring-1 ring-black/10",
-			style: t1,
-			children: [t3, t4]
-		});
-		$[15] = block._internal.id;
-		$[16] = t1;
-		$[17] = t3;
-		$[18] = t4;
-		$[19] = t5;
-	} else t5 = $[19];
-	let t6;
-	if ($[20] !== framed || $[21] !== itemKey || $[22] !== t5) {
-		t6 = /* @__PURE__ */ jsx(CanvasSlot, {
-			itemKey,
-			framed,
-			children: t5
-		});
-		$[20] = framed;
-		$[21] = itemKey;
-		$[22] = t5;
-		$[23] = t6;
-	} else t6 = $[23];
-	return t6;
-}
 /** A Page's area in the Canvas row, with its frame. */
 function CanvasPageItem(t0) {
-	const $ = c(40);
-	const { page, pathname, selected, previewed, collapsed, framed, viewport, runtimeBasePath, onActivate, selectPage, hover } = t0;
+	const $ = c(39);
+	const { page, pathname, selected, previewed, framed, viewport, runtimeBasePath, onActivate, selectPage, hover } = t0;
 	let t1;
 	if ($[0] !== page.key) {
 		t1 = (state) => state.context.pageKey === page.key;
@@ -677,7 +596,7 @@ function CanvasPageItem(t0) {
 		$[10] = t4;
 	} else t4 = $[10];
 	let t5;
-	if ($[11] !== collapsed || $[12] !== framed || $[13] !== hovered || $[14] !== onPageActivate || $[15] !== page || $[16] !== pathname || $[17] !== previewed || $[18] !== runtimeBasePath || $[19] !== selectPage || $[20] !== selected || $[21] !== viewport) {
+	if ($[11] !== framed || $[12] !== hovered || $[13] !== onPageActivate || $[14] !== page || $[15] !== pathname || $[16] !== previewed || $[17] !== runtimeBasePath || $[18] !== selectPage || $[19] !== selected || $[20] !== viewport) {
 		t5 = previewed ? /* @__PURE__ */ jsx(CanvasPreviewPageSlot, {
 			pageId: canvasPageId(page),
 			layoutId: canvasLayoutId(page),
@@ -685,7 +604,6 @@ function CanvasPageItem(t0) {
 			viewportHeight: viewport.height,
 			selected,
 			hovered,
-			hidden: collapsed,
 			shaded: framed,
 			onActivate: onPageActivate
 		}) : pathname ? /* @__PURE__ */ jsx(CanvasPagePreview, {
@@ -699,39 +617,37 @@ function CanvasPageItem(t0) {
 			onActivate: onPageActivate,
 			onSelect: () => selectPage(pathname)
 		}) : /* @__PURE__ */ jsx(CanvasMessage, { children: "Choose a page path above to preview this layout." });
-		$[11] = collapsed;
-		$[12] = framed;
-		$[13] = hovered;
-		$[14] = onPageActivate;
-		$[15] = page;
-		$[16] = pathname;
-		$[17] = previewed;
-		$[18] = runtimeBasePath;
-		$[19] = selectPage;
-		$[20] = selected;
-		$[21] = viewport;
-		$[22] = t5;
-	} else t5 = $[22];
+		$[11] = framed;
+		$[12] = hovered;
+		$[13] = onPageActivate;
+		$[14] = page;
+		$[15] = pathname;
+		$[16] = previewed;
+		$[17] = runtimeBasePath;
+		$[18] = selectPage;
+		$[19] = selected;
+		$[20] = viewport;
+		$[21] = t5;
+	} else t5 = $[21];
 	let t6;
-	if ($[23] !== pathname || $[24] !== selected || $[25] !== t5) {
+	if ($[22] !== pathname || $[23] !== selected || $[24] !== t5) {
 		t6 = /* @__PURE__ */ jsx(CanvasFrameBoundary, {
-			subject: "page",
 			selected,
 			children: t5
 		}, pathname);
-		$[23] = pathname;
-		$[24] = selected;
-		$[25] = t5;
-		$[26] = t6;
-	} else t6 = $[26];
+		$[22] = pathname;
+		$[23] = selected;
+		$[24] = t5;
+		$[25] = t6;
+	} else t6 = $[25];
 	let t7;
-	if ($[27] !== framed) {
+	if ($[26] !== framed) {
 		t7 = /* @__PURE__ */ jsx(CanvasPageEdge, { shaded: framed });
-		$[27] = framed;
-		$[28] = t7;
-	} else t7 = $[28];
+		$[26] = framed;
+		$[27] = t7;
+	} else t7 = $[27];
 	let t8;
-	if ($[29] !== page.key || $[30] !== pathname || $[31] !== t3 || $[32] !== t4 || $[33] !== t6 || $[34] !== t7) {
+	if ($[28] !== page.key || $[29] !== pathname || $[30] !== t3 || $[31] !== t4 || $[32] !== t6 || $[33] !== t7) {
 		t8 = /* @__PURE__ */ jsxs("div", {
 			"data-canvas-page": page.key,
 			"data-canvas-pathname": pathname,
@@ -740,57 +656,28 @@ function CanvasPageItem(t0) {
 			style: t4,
 			children: [t6, t7]
 		});
-		$[29] = page.key;
-		$[30] = pathname;
-		$[31] = t3;
-		$[32] = t4;
-		$[33] = t6;
-		$[34] = t7;
-		$[35] = t8;
-	} else t8 = $[35];
+		$[28] = page.key;
+		$[29] = pathname;
+		$[30] = t3;
+		$[31] = t4;
+		$[32] = t6;
+		$[33] = t7;
+		$[34] = t8;
+	} else t8 = $[34];
 	let t9;
-	if ($[36] !== framed || $[37] !== page.key || $[38] !== t8) {
+	if ($[35] !== framed || $[36] !== page.key || $[37] !== t8) {
 		t9 = /* @__PURE__ */ jsx(CanvasSlot, {
 			itemKey: page.key,
 			framed,
 			children: t8
 		});
-		$[36] = framed;
-		$[37] = page.key;
-		$[38] = t8;
-		$[39] = t9;
-	} else t9 = $[39];
+		$[35] = framed;
+		$[36] = page.key;
+		$[37] = t8;
+		$[38] = t9;
+	} else t9 = $[38];
 	return t9;
 }
-/** A block header with the number of Pages placing the block. */
-function CanvasBlockUsageHeader(t0) {
-	const $ = c(7);
-	const { projectId, block, onSelect } = t0;
-	let t1;
-	if ($[0] !== block._internal.id || $[1] !== projectId) {
-		t1 = reads.pagesUsingBlock({
-			projectId,
-			type: block._internal.id
-		});
-		$[0] = block._internal.id;
-		$[1] = projectId;
-		$[2] = t1;
-	} else t1 = $[2];
-	const t2 = useReadQuery(t1).data?.length;
-	let t3;
-	if ($[3] !== block || $[4] !== onSelect || $[5] !== t2) {
-		t3 = /* @__PURE__ */ jsx(CanvasBlockHeader, {
-			block,
-			pageCount: t2,
-			onSelect
-		});
-		$[3] = block;
-		$[4] = onSelect;
-		$[5] = t2;
-		$[6] = t3;
-	} else t3 = $[6];
-	return t3;
-}
 /** Gives a Page a new nickname, keeping its path. */
 function useRenamePage() {
 	const $ = c(4);
@@ -888,8 +775,8 @@ function useWorkspaceThumbnails(workspaceKey) {
 	return thumbnails;
 }
 function CanvasWorkspace(t0) {
-	const $ = c(89);
-	const { ref, projectId, pages, blocks, selectedPage, selectedBlock, previewedPage, intendedItemKey, runtimeBasePath, viewport, onActivate, onSelectionIntent } = t0;
+	const $ = c(44);
+	const { ref, pages, selectedPage, previewedPage, intendedPageKey, runtimeBasePath, viewport, onActivate, onSelectionIntent } = t0;
 	const { apiUrl, projectUuid } = useAuthContext();
 	const renamePage = useRenamePage();
 	const location = useLocation();
@@ -915,515 +802,292 @@ function CanvasWorkspace(t0) {
 		$[3] = onSelectionIntent;
 		$[4] = t1;
 	} else t1 = $[4];
-	const goToItem = t1;
+	const goTo = t1;
 	let t2;
-	if ($[5] !== follow || $[6] !== goToItem) {
+	if ($[5] !== follow || $[6] !== goTo) {
 		t2 = (pathname_0) => {
 			follow?.takeOver();
-			goToItem(pathname_0);
+			goTo(pathname_0);
 		};
 		$[5] = follow;
-		$[6] = goToItem;
+		$[6] = goTo;
 		$[7] = t2;
 	} else t2 = $[7];
 	const selectPage = t2;
+	const latestSelectPage = React.useRef(selectPage);
 	let t3;
-	if ($[8] !== localized || $[9] !== selectPage) {
-		t3 = (block) => selectPage(localized(blockCatalogPath(block._internal.id)));
-		$[8] = localized;
-		$[9] = selectPage;
-		$[10] = t3;
-	} else t3 = $[10];
-	const selectBlock = t3;
-	let t4;
-	if ($[11] !== selectBlock || $[12] !== selectPage) {
-		t4 = {
-			selectPage,
-			selectBlock
-		};
-		$[11] = selectBlock;
-		$[12] = selectPage;
-		$[13] = t4;
-	} else t4 = $[13];
-	const latestSelect = React.useRef(t4);
-	let t5;
-	if ($[14] !== selectBlock || $[15] !== selectPage) {
-		t5 = () => {
-			latestSelect.current = {
-				selectPage,
-				selectBlock
-			};
+	if ($[8] !== selectPage) {
+		t3 = () => {
+			latestSelectPage.current = selectPage;
 		};
-		$[14] = selectBlock;
-		$[15] = selectPage;
-		$[16] = t5;
-	} else t5 = $[16];
-	React.useLayoutEffect(t5);
-	let t6;
-	if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
-		t6 = (pathname_1) => latestSelect.current.selectPage(pathname_1);
-		$[17] = t6;
-	} else t6 = $[17];
-	const selectFramePage = t6;
-	let t7;
-	if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
-		t7 = (block_0) => latestSelect.current.selectBlock(block_0);
-		$[18] = t7;
-	} else t7 = $[18];
-	const selectFrameBlock = t7;
-	let t8;
-	if ($[19] !== apiUrl || $[20] !== projectUuid || $[21] !== runtimeBasePath) {
-		t8 = JSON.stringify([
+		$[8] = selectPage;
+		$[9] = t3;
+	} else t3 = $[9];
+	React.useLayoutEffect(t3);
+	const selectFramePage = (pathname_1) => latestSelectPage.current(pathname_1);
+	let t4;
+	if ($[10] !== apiUrl || $[11] !== projectUuid || $[12] !== runtimeBasePath) {
+		t4 = JSON.stringify([
 			apiUrl,
 			projectUuid,
 			runtimeBasePath
 		]);
-		$[19] = apiUrl;
-		$[20] = projectUuid;
-		$[21] = runtimeBasePath;
-		$[22] = t8;
-	} else t8 = $[22];
-	const workspaceKey = t8;
-	let t9;
-	if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
-		t9 = {};
-		$[23] = t9;
-	} else t9 = $[23];
-	const [previewPathnames, setPreviewPathnames] = React.useState(t9);
-	const shelves = getCanvasShelves(pages, blocks);
-	let t10;
-	if ($[24] !== selectedBlock || $[25] !== selectedPage?.key) {
-		t10 = selectedPage?.key ?? (selectedBlock && canvasBlockKey(selectedBlock._internal.id));
-		$[24] = selectedBlock;
-		$[25] = selectedPage?.key;
-		$[26] = t10;
-	} else t10 = $[26];
-	const selectedItemKey = t10;
-	const collapsedShelves = useCollapsedShelves(workspaceKey, getDefaultCollapsedShelves(shelves), shelves.find((shelf) => shelf.items.some((t11) => {
-		const { key } = t11;
-		return key === selectedItemKey;
-	}))?.key);
-	let t12;
-	if ($[27] !== collapsedShelves || $[28] !== workspaceKey) {
-		t12 = (shelfKey) => setShelfCollapsed(workspaceKey, shelfKey, !collapsedShelves.has(shelfKey));
-		$[27] = collapsedShelves;
-		$[28] = workspaceKey;
-		$[29] = t12;
-	} else t12 = $[29];
-	const toggleShelf = t12;
-	const { items, markers, width } = positionCanvasShelves(shelves, collapsedShelves);
-	const positions = new Map(items.map(_temp3));
-	const blocksByKey = new Map(items.filter(isCanvasBlock).map(_temp4));
-	const pageSlots = new Map(pages.map((page) => [page.key, {
-		page,
-		left: positions.get(page.key),
-		pathname: page.key === selectedPage?.key ? selectedPath : previewedPath && page.key === previewedPage?.key ? previewedPath : previewPathnames[page.key] ?? page.pathname
-	}]));
-	const selectedKey = selectedItemKey && positions.has(selectedItemKey) ? selectedItemKey : null;
-	const hiddenSelectedShelf = shelves.find((shelf_0) => collapsedShelves.has(shelf_0.key) && shelf_0.items.some((t13) => {
-		const { key: key_0 } = t13;
-		return key_0 === selectedItemKey;
-	}))?.key;
+		$[10] = apiUrl;
+		$[11] = projectUuid;
+		$[12] = runtimeBasePath;
+		$[13] = t4;
+	} else t4 = $[13];
+	const workspaceKey = t4;
+	let t5;
+	if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = {};
+		$[14] = t5;
+	} else t5 = $[14];
+	const [previewPathnames, setPreviewPathnames] = React.useState(t5);
+	const { items, width } = positionCanvasPages(pages);
+	let t6;
+	if ($[15] !== previewPathnames || $[16] !== previewedPage?.key || $[17] !== previewedPath || $[18] !== selectedPage?.key || $[19] !== selectedPath) {
+		t6 = (t7) => {
+			const { key, page, left } = t7;
+			return [key, {
+				page,
+				left,
+				pathname: key === selectedPage?.key ? selectedPath : previewedPath && key === previewedPage?.key ? previewedPath : previewPathnames[key] ?? page.pathname
+			}];
+		};
+		$[15] = previewPathnames;
+		$[16] = previewedPage?.key;
+		$[17] = previewedPath;
+		$[18] = selectedPage?.key;
+		$[19] = selectedPath;
+		$[20] = t6;
+	} else t6 = $[20];
+	const pageSlots = new Map(items.map(t6));
 	const framed = viewport.width < CANVAS_SLOT_WIDTH;
 	const snapTargets = canvasSnapTargets(items);
 	const snapRingRef = React.useRef(null);
 	const snapFlash = React.useRef(null);
-	let t14;
-	if ($[30] !== selectedKey) {
-		t14 = (t15) => {
-			const { key: key_1 } = t15;
-			return key_1 === selectedKey;
+	let t7;
+	if ($[21] !== selectedPage?.key) {
+		t7 = (t8) => {
+			const { key: key_0 } = t8;
+			return key_0 === selectedPage?.key;
 		};
-		$[30] = selectedKey;
-		$[31] = t14;
-	} else t14 = $[31];
-	let t15;
-	if ($[32] !== goToItem || $[33] !== localized) {
-		t15 = () => goToItem(localized(STUDIO_CANVAS_PATH));
-		$[32] = goToItem;
-		$[33] = localized;
-		$[34] = t15;
-	} else t15 = $[34];
-	let t16;
-	if ($[35] !== follow) {
-		t16 = () => follow?.takeOver();
-		$[35] = follow;
-		$[36] = t16;
-	} else t16 = $[36];
-	const { viewportRef, contentRef, flyTo, mirrorCamera, keepInView, reveal, fitAll } = useCanvasCamera(workspaceKey, snapTargets.find(t14), {
+		$[21] = selectedPage?.key;
+		$[22] = t7;
+	} else t7 = $[22];
+	let t8;
+	if ($[23] !== goTo || $[24] !== localized) {
+		t8 = () => goTo(localized(STUDIO_CANVAS_PATH));
+		$[23] = goTo;
+		$[24] = localized;
+		$[25] = t8;
+	} else t8 = $[25];
+	let t9;
+	if ($[26] !== follow) {
+		t9 = () => follow?.takeOver();
+		$[26] = follow;
+		$[27] = t9;
+	} else t9 = $[27];
+	const { viewportRef, contentRef, flyTo, mirrorCamera, reveal, fitAll } = useCanvasCamera(workspaceKey, snapTargets.find(t7), {
 		targets: snapTargets,
 		width,
-		onSelect: (key_2) => {
-			const block_1 = blocksByKey.get(key_2);
-			if (block_1) return selectBlock(block_1);
-			const pathname_2 = pageSlots.get(key_2)?.pathname;
+		onSelect: (key_1) => {
+			const pathname_2 = pageSlots.get(key_1)?.pathname;
 			if (pathname_2) selectPage(pathname_2);
 		},
-		selected: intendedItemKey && positions.has(intendedItemKey) ? intendedItemKey : null,
-		onDeselect: t15,
+		selected: intendedPageKey && pageSlots.has(intendedPageKey) ? intendedPageKey : null,
+		onDeselect: t8,
 		onSnap: () => {
 			snapFlash.current = snapRingRef.current?.animate(SNAP_FLASH_KEYFRAMES, SNAP_FLASH_TIMING) ?? null;
 		},
 		onSnapStretched: () => snapFlash.current?.cancel(),
-		onEditorMove: t16
+		onEditorMove: t9
 	});
-	let t17;
-	if ($[37] !== mirrorCamera || $[38] !== reveal || $[39] !== workspaceKey) {
-		t17 = {
+	let t10;
+	if ($[28] !== mirrorCamera || $[29] !== reveal || $[30] !== workspaceKey) {
+		t10 = {
 			workspaceKey,
 			mirrorCamera,
 			reveal
 		};
-		$[37] = mirrorCamera;
-		$[38] = reveal;
-		$[39] = workspaceKey;
-		$[40] = t17;
-	} else t17 = $[40];
-	const workspace = t17;
+		$[28] = mirrorCamera;
+		$[29] = reveal;
+		$[30] = workspaceKey;
+		$[31] = t10;
+	} else t10 = $[31];
+	const workspace = t10;
 	const thumbnails = useWorkspaceThumbnails(workspaceKey);
-	const collapsingShelf = React.useRef(null);
-	React.useLayoutEffect(() => {
-		const marker = markers.find((t18) => {
-			const { key: key_3 } = t18;
-			return key_3 === collapsingShelf.current;
-		});
-		collapsingShelf.current = null;
-		if (marker) keepInView(marker.start, 12);
-	});
 	const instructionsId = React.useId();
-	const previousPath = React.useRef(selectedPath);
-	React.useEffect(() => {
-		if (previousPath.current === selectedPath) return;
-		if (location.source !== "canvas" && hiddenSelectedShelf) {
-			setShelfCollapsed(workspaceKey, hiddenSelectedShelf, false);
-			return;
-		}
-		if (location.source !== "canvas" && !selectedKey) return;
-		previousPath.current = selectedPath;
-	}, [
-		selectedPath,
-		location.source,
-		selectedKey,
-		hiddenSelectedShelf,
-		workspaceKey
-	]);
-	const [pendingFlight, setPendingFlight] = React.useState(null);
-	const pendingFlightPlaced = !!pendingFlight && positions.has(pendingFlight);
-	let t19;
-	let t20;
-	if ($[41] !== flyTo || $[42] !== pendingFlight || $[43] !== pendingFlightPlaced) {
-		t19 = () => {
-			if (!pendingFlight || !pendingFlightPlaced) return;
-			setPendingFlight(null);
-			flyTo(pendingFlight);
-		};
-		t20 = [
-			pendingFlight,
-			pendingFlightPlaced,
-			flyTo
-		];
-		$[41] = flyTo;
-		$[42] = pendingFlight;
-		$[43] = pendingFlightPlaced;
-		$[44] = t19;
-		$[45] = t20;
-	} else {
-		t19 = $[44];
-		t20 = $[45];
-	}
-	React.useEffect(t19, t20);
-	let t21;
-	let t22;
-	if ($[46] !== fitAll) {
-		t21 = () => {
+	let t11;
+	let t12;
+	if ($[32] !== fitAll) {
+		t11 = () => {
 			let answered = canvasStore.getSnapshot().context.overviewRequests;
-			const subscription = canvasStore.subscribe((t23) => {
-				const { context } = t23;
+			const subscription = canvasStore.subscribe((t13) => {
+				const { context } = t13;
 				if (context.overviewRequests === answered) return;
 				answered = context.overviewRequests;
 				fitAll();
 			});
 			return () => subscription.unsubscribe();
 		};
-		t22 = [fitAll];
-		$[46] = fitAll;
-		$[47] = t21;
-		$[48] = t22;
+		t12 = [fitAll];
+		$[32] = fitAll;
+		$[33] = t11;
+		$[34] = t12;
 	} else {
-		t21 = $[47];
-		t22 = $[48];
+		t11 = $[33];
+		t12 = $[34];
 	}
-	React.useEffect(t21, t22);
+	React.useEffect(t11, t12);
 	React.useImperativeHandle(ref, () => ({
-		showItem(key_4) {
-			const shelf_1 = shelves.find((candidate) => candidate.items.some((item_1) => item_1.key === key_4));
-			const item_2 = shelf_1?.items.find((candidate_0) => candidate_0.key === key_4);
-			if (!shelf_1 || !item_2) return;
-			const pathname_3 = item_2.kind === "block" ? localized(blockCatalogPath(item_2.block._internal.id)) : pageSlots.get(key_4)?.pathname;
-			if (pathname_3 && pathname_3 !== selectedPath) {
-				navigate({ to: `${pathname_3}${location.search}${location.hash}` });
+		showPage(key_2) {
+			const slot = pageSlots.get(key_2);
+			if (!slot) return;
+			if (slot.pathname && slot.pathname !== selectedPath) {
+				navigate({ to: `${slot.pathname}${location.search}${location.hash}` });
 				return;
 			}
-			if (collapsedShelves.has(shelf_1.key)) toggleShelf(shelf_1.key);
-			setPendingFlight(key_4);
+			flyTo(key_2);
 		},
 		showWholeCanvas() {
 			selectPage(localized(STUDIO_CANVAS_PATH));
 			fitAll();
 		}
 	}));
-	const t23 = "region";
-	const t24 = "Page canvas";
-	const t25 = 0;
-	const t26 = true;
-	const t27 = "bg-muted relative min-h-0 min-w-0 flex-1 touch-none overflow-clip outline-none *:*:[--canvas-x:initial] *:*:[--canvas-y:initial] data-[canvas-pan]:cursor-grab data-[canvas-pan]:**:cursor-[inherit]! data-[canvas-pan=dragging]:cursor-grabbing data-[canvas-pan]:[&_iframe]:pointer-events-none";
-	let t28;
-	if ($[49] === Symbol.for("react.memo_cache_sentinel")) {
-		t28 = {
+	let t13;
+	if ($[35] === Symbol.for("react.memo_cache_sentinel")) {
+		t13 = {
 			userSelect: "none",
 			overscrollBehavior: "none"
 		};
-		$[49] = t28;
-	} else t28 = $[49];
-	const t29 = !!intendedItemKey;
-	let t30;
-	if ($[50] === Symbol.for("react.memo_cache_sentinel")) {
-		t30 = {
-			gap: 480,
+		$[35] = t13;
+	} else t13 = $[35];
+	let t14;
+	if ($[36] === Symbol.for("react.memo_cache_sentinel")) {
+		t14 = {
+			gap: 240,
 			transform: CANVAS_WORLD_TRANSFORM,
 			transformOrigin: "0 0"
 		};
-		$[50] = t30;
-	} else t30 = $[50];
-	const t31 = shelves.map((shelf_2) => {
-		if (!isCanvasShelfShown(shelf_2)) return null;
-		const collapsed = collapsedShelves.has(shelf_2.key) || shelf_2.items.length === 0;
-		return /* @__PURE__ */ jsx("div", {
-			"data-canvas-shelf": shelf_2.key,
-			inert: collapsed,
-			className: `flex shrink-0 items-start ${collapsed ? "invisible w-0" : ""}`,
-			style: { gap: 240 },
-			children: (collapsed && shelf_2.unmountedWhenCollapsed ? [] : shelf_2.items).map((item_3) => {
-				if (item_3.kind === "block") return /* @__PURE__ */ jsx(CanvasBlockItem, {
-					itemKey: item_3.key,
-					block: item_3.block,
-					projectId,
-					runtimeBasePath,
-					viewport,
-					framed,
-					selected: item_3.block._internal.id === selectedBlock?._internal.id,
-					selectBlock: selectFrameBlock
-				}, item_3.key);
-				const slot = pageSlots.get(item_3.key);
-				if (!slot) return null;
-				const { page: page_0, pathname: pathname_4 } = slot;
-				return /* @__PURE__ */ jsx(CanvasPageItem, {
-					page: page_0,
-					pathname: pathname_4,
-					selected: page_0.key === selectedPage?.key,
-					hover,
-					previewed: !!previewPageFrame && page_0.key === previewedPage?.key && pathname_4 === previewedPath,
-					collapsed,
-					framed,
-					viewport,
-					runtimeBasePath,
-					onActivate,
-					selectPage: selectFramePage
-				}, page_0.key);
-			})
-		}, shelf_2.key);
-	});
-	let t32;
-	if ($[51] !== contentRef || $[52] !== t31) {
-		t32 = /* @__PURE__ */ jsx("div", {
-			ref: contentRef,
-			"data-canvas-items": true,
-			className: "absolute top-0 left-0 flex w-max items-start in-data-[canvas-promoted]:will-change-transform",
-			style: t30,
-			children: t31
-		});
-		$[51] = contentRef;
-		$[52] = t31;
-		$[53] = t32;
-	} else t32 = $[53];
-	let t33;
-	if ($[54] !== t29 || $[55] !== t32) {
-		t33 = /* @__PURE__ */ jsx(CanvasOverlaysShownContext, {
-			value: t29,
-			children: t32
-		});
-		$[54] = t29;
-		$[55] = t32;
-		$[56] = t33;
-	} else t33 = $[56];
-	let t34;
-	if ($[57] !== t33 || $[58] !== thumbnails) {
-		t34 = /* @__PURE__ */ jsx(CanvasThumbnailsContext, {
-			value: thumbnails,
-			children: t33
-		});
-		$[57] = t33;
-		$[58] = thumbnails;
-		$[59] = t34;
-	} else t34 = $[59];
-	let t35;
-	if ($[60] !== t34 || $[61] !== workspace) {
-		t35 = /* @__PURE__ */ jsx(CanvasWorkspaceContext, {
-			value: workspace,
-			children: t34
-		});
-		$[60] = t34;
-		$[61] = workspace;
-		$[62] = t35;
-	} else t35 = $[62];
-	let t36;
-	if ($[63] !== toggleShelf) {
-		t36 = (marker_0) => {
-			if (!marker_0.collapsed) collapsingShelf.current = marker_0.key;
-			toggleShelf(marker_0.key);
-		};
-		$[63] = toggleShelf;
-		$[64] = t36;
-	} else t36 = $[64];
-	let t37;
-	if ($[65] !== markers || $[66] !== t36) {
-		t37 = /* @__PURE__ */ jsx(CanvasShelfMarkers, {
-			markers,
-			onToggle: t36
-		});
-		$[65] = markers;
-		$[66] = t36;
-		$[67] = t37;
-	} else t37 = $[67];
-	const t39 = [...pageSlots.values()].map((t38) => {
-		const { page: page_1, pathname: pathname_5, left } = t38;
-		return left === void 0 ? null : /* @__PURE__ */ jsx(CanvasHeaderSlot, {
-			itemKey: page_1.key,
-			left,
-			children: /* @__PURE__ */ jsx(CanvasPageHeader, {
-				page: page_1,
-				pathname: pathname_5,
-				onRename: page_1.kind === "curated" ? (nickname) => renamePage(page_1.pageId, nickname) : void 0,
-				selected: page_1.key === selectedPage?.key,
-				onHoverChange: (hovered) => hover.send({
-					type: "set",
-					pageKey: hovered ? page_1.key : null
-				}),
-				onSelect: () => {
-					if (!pathname_5) return;
-					selectPage(pathname_5);
-				},
-				onChange: (path) => {
-					const inLocale = localized(path);
-					setPreviewPathnames((current) => ({
-						...current,
-						[page_1.key]: inLocale
-					}));
-					selectPage(inLocale);
-				}
-			})
-		}, page_1.key);
-	});
-	let t40;
-	if ($[68] !== projectId || $[69] !== selectBlock) {
-		t40 = (t41) => {
-			const { key: key_5, left: left_0, block: block_2 } = t41;
-			return /* @__PURE__ */ jsx(CanvasHeaderSlot, {
-				itemKey: key_5,
-				left: left_0,
-				children: /* @__PURE__ */ jsx(CanvasBlockUsageHeader, {
-					projectId,
-					block: block_2,
-					onSelect: () => selectBlock(block_2)
-				})
-			}, key_5);
-		};
-		$[68] = projectId;
-		$[69] = selectBlock;
-		$[70] = t40;
-	} else t40 = $[70];
-	const t41 = items.filter(isCanvasBlock).map(t40);
-	let t42;
-	if ($[71] !== pages.length) {
-		t42 = !pages.length && /* @__PURE__ */ jsx(CanvasMessage, { children: "No pages to preview yet." });
-		$[71] = pages.length;
-		$[72] = t42;
-	} else t42 = $[72];
-	let t43;
-	if ($[73] !== instructionsId) {
-		t43 = /* @__PURE__ */ jsx("p", {
+		$[36] = t14;
+	} else t14 = $[36];
+	let t17;
+	if ($[37] !== pages.length) {
+		t17 = !pages.length && /* @__PURE__ */ jsx(CanvasMessage, { children: "No pages to preview yet." });
+		$[37] = pages.length;
+		$[38] = t17;
+	} else t17 = $[38];
+	let t18;
+	if ($[39] !== instructionsId) {
+		t18 = /* @__PURE__ */ jsx("p", {
 			id: instructionsId,
 			className: "sr-only",
 			children: "Scroll, or hold Space and drag, to pan. Pinch or Ctrl/⌘ + scroll to zoom. Click a page to edit it. Focus the canvas and use plus or minus to zoom, arrow keys to pan, 0 for 100%, or Home / Shift+1 to fit all pages."
 		});
-		$[73] = instructionsId;
-		$[74] = t43;
-	} else t43 = $[74];
-	let t44;
-	if ($[75] === Symbol.for("react.memo_cache_sentinel")) {
-		t44 = { zIndex: 2 };
-		$[75] = t44;
-	} else t44 = $[75];
-	let t45;
-	if ($[76] !== snapRingRef) {
-		t45 = /* @__PURE__ */ jsx("div", {
+		$[39] = instructionsId;
+		$[40] = t18;
+	} else t18 = $[40];
+	let t19;
+	if ($[41] === Symbol.for("react.memo_cache_sentinel")) {
+		t19 = { zIndex: 2 };
+		$[41] = t19;
+	} else t19 = $[41];
+	let t20;
+	if ($[42] !== snapRingRef) {
+		t20 = /* @__PURE__ */ jsx("div", {
 			ref: snapRingRef,
 			"aria-hidden": true,
 			"data-canvas-snap-ring": true,
 			className: "ring-primary pointer-events-none absolute inset-0 opacity-0 ring-3 ring-inset",
-			style: t44
-		});
-		$[76] = snapRingRef;
-		$[77] = t45;
-	} else t45 = $[77];
-	let t46;
-	if ($[78] !== instructionsId || $[79] !== t28 || $[80] !== t35 || $[81] !== t37 || $[82] !== t39 || $[83] !== t41 || $[84] !== t42 || $[85] !== t43 || $[86] !== t45 || $[87] !== viewportRef) {
-		t46 = /* @__PURE__ */ jsxs("div", {
-			ref: viewportRef,
-			role: t23,
-			"aria-label": t24,
-			"aria-describedby": instructionsId,
-			tabIndex: t25,
-			"data-camox-canvas": t26,
-			className: t27,
-			style: t28,
-			children: [
-				t35,
-				t37,
-				t39,
-				t41,
-				t42,
-				t43,
-				t45
-			]
+			style: t19
 		});
-		$[78] = instructionsId;
-		$[79] = t28;
-		$[80] = t35;
-		$[81] = t37;
-		$[82] = t39;
-		$[83] = t41;
-		$[84] = t42;
-		$[85] = t43;
-		$[86] = t45;
-		$[87] = viewportRef;
-		$[88] = t46;
-	} else t46 = $[88];
-	return t46;
-}
-function _temp4(item_0) {
-	return [item_0.key, item_0.block];
-}
-function _temp3(item) {
-	return [item.key, item.left];
+		$[42] = snapRingRef;
+		$[43] = t20;
+	} else t20 = $[43];
+	return /* @__PURE__ */ jsxs("div", {
+		ref: viewportRef,
+		role: "region",
+		"aria-label": "Page canvas",
+		"aria-describedby": instructionsId,
+		tabIndex: 0,
+		"data-camox-canvas": true,
+		className: "bg-muted relative min-h-0 min-w-0 flex-1 touch-none overflow-clip outline-none *:*:[--canvas-x:initial] *:*:[--canvas-y:initial] data-[canvas-pan]:cursor-grab data-[canvas-pan]:**:cursor-[inherit]! data-[canvas-pan=dragging]:cursor-grabbing data-[canvas-pan]:[&_iframe]:pointer-events-none",
+		style: t13,
+		children: [
+			/* @__PURE__ */ jsx(CanvasWorkspaceContext, {
+				value: workspace,
+				children: /* @__PURE__ */ jsx(CanvasThumbnailsContext, {
+					value: thumbnails,
+					children: /* @__PURE__ */ jsx(CanvasOverlaysShownContext, {
+						value: !!intendedPageKey,
+						children: /* @__PURE__ */ jsx("div", {
+							ref: contentRef,
+							"data-canvas-items": true,
+							className: "absolute top-0 left-0 flex w-max items-start in-data-[canvas-promoted]:will-change-transform",
+							style: t14,
+							children: [...pageSlots.values()].map((t15) => {
+								const { page: page_0, pathname: pathname_3 } = t15;
+								return /* @__PURE__ */ jsx(CanvasPageItem, {
+									page: page_0,
+									pathname: pathname_3,
+									selected: page_0.key === selectedPage?.key,
+									hover,
+									previewed: !!previewPageFrame && page_0.key === previewedPage?.key && pathname_3 === previewedPath,
+									framed,
+									viewport,
+									runtimeBasePath,
+									onActivate,
+									selectPage: selectFramePage
+								}, page_0.key);
+							})
+						})
+					})
+				})
+			}),
+			[...pageSlots.values()].map((t16) => {
+				const { page: page_1, pathname: pathname_4, left: left_0 } = t16;
+				return /* @__PURE__ */ jsx(CanvasHeaderSlot, {
+					itemKey: page_1.key,
+					left: left_0,
+					children: /* @__PURE__ */ jsx(CanvasPageHeader, {
+						page: page_1,
+						pathname: pathname_4,
+						onRename: page_1.kind === "curated" ? (nickname) => renamePage(page_1.pageId, nickname) : void 0,
+						selected: page_1.key === selectedPage?.key,
+						onHoverChange: (hovered) => hover.send({
+							type: "set",
+							pageKey: hovered ? page_1.key : null
+						}),
+						onSelect: () => {
+							if (!pathname_4) return;
+							selectPage(pathname_4);
+						},
+						onChange: (path) => {
+							const inLocale = localized(path);
+							setPreviewPathnames((current) => ({
+								...current,
+								[page_1.key]: inLocale
+							}));
+							selectPage(inLocale);
+						}
+					})
+				}, page_1.key);
+			}),
+			t17,
+			t18,
+			t20
+		]
+	});
 }
 function CamoxCanvas(t0) {
-	const $ = c(60);
+	const $ = c(68);
 	const { runtimeBasePath } = t0;
 	const app = useCamoxApp();
 	const renamePage = useRenamePage();
 	const location = useLocation();
-	const viewportMode = useSelector(previewStore, _temp5);
+	const viewportMode = useSelector(previewStore, _temp3);
 	const viewport = CANVAS_DEVICES[viewportMode === "full" ? "desktop" : viewportMode];
 	const [activeFrame, setActiveFrame] = React.useState(null);
 	const selectedPath = location.pathname;
@@ -1453,7 +1117,7 @@ function CamoxCanvas(t0) {
 		t3 = [];
 		$[4] = t3;
 	} else t3 = $[4];
-	React.useEffect(_temp7, t3);
+	React.useEffect(_temp5, t3);
 	const projectUuid = useProjectUuid();
 	let t4;
 	if ($[5] !== projectUuid) {
@@ -1479,74 +1143,92 @@ function CamoxCanvas(t0) {
 	const discoveredPaths = useDiscoveredPreviewPaths(runtimeBasePath);
 	const viewLocale = useViewLocale();
 	const canvasPages = pages.data ? getCanvasPages(pages.data, app.getLayouts(), discoveredPaths, viewLocale.locale) : [];
-	const selectionAt = (runtimePath) => {
-		const pathname = parseLocalePath(runtimePath, viewLocale.locales).path;
-		if (pathname === "/camox/canvas") return {};
-		const blockId = matchBlockCatalogPath(pathname);
-		if (!blockId) return { page: selectedCanvasPage(canvasPages, app.getLayouts(), runtimePath, viewLocale.locales) };
-		const block = app.getBlockById(blockId);
-		return { block: block && !block._internal.layoutOnly ? block : void 0 };
-	};
-	const { page: selectedPage, block: selectedBlock } = selectionAt(location.pathname);
+	let t8;
+	if ($[11] !== viewLocale.locales) {
+		t8 = (runtimePath) => parseLocalePath(runtimePath, viewLocale.locales).path === STUDIO_CANVAS_PATH;
+		$[11] = viewLocale.locales;
+		$[12] = t8;
+	} else t8 = $[12];
+	const isCanvasPath = t8;
+	const pageAt = (runtimePath_0) => isCanvasPath(runtimePath_0) ? void 0 : selectedCanvasPage(canvasPages, app.getLayouts(), runtimePath_0, viewLocale.locales);
+	const selectedPage = pageAt(location.pathname);
 	const previewedPath = React.use(PreviewPageFrameContext)?.pathname;
-	const previewedPage = previewedPath ? selectionAt(previewedPath).page : void 0;
+	const previewedPage = previewedPath ? pageAt(previewedPath) : void 0;
 	const [intent, setIntent] = React.useState(null);
 	if (intent && intent.from !== location.pathname) setIntent(null);
 	const intended = intent?.from === location.pathname ? intent.to : location;
-	const intendedSelection = selectionAt(intended.pathname);
+	const intendedPage = pageAt(intended.pathname);
 	const navigate = useNavigate();
 	const workspace = React.useRef(null);
-	let t8;
-	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
-		t8 = { enabled: false };
-		$[11] = t8;
-	} else t8 = $[11];
+	let t9;
+	if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
+		t9 = { enabled: false };
+		$[13] = t9;
+	} else t9 = $[13];
 	const { data: intendedFrameInput } = useReadQuery(reads.canvasFrame({
 		projectUuid,
 		runtimeBasePath,
 		pathname: intended.pathname,
-		derivedLayoutId: derivedLayoutIdOf(intendedSelection.page)
-	}), t8);
-	const recordResult = derivedLayoutIdOf(intendedSelection.page) ? intendedFrameInput?.derived?.result : void 0;
-	let t9;
-	if ($[12] !== recordResult) {
-		t9 = getPageRecord(recordResult);
-		$[12] = recordResult;
-		$[13] = t9;
-	} else t9 = $[13];
-	const pageRecord = t9;
+		derivedLayoutId: derivedLayoutIdOf(intendedPage)
+	}), t9);
+	const recordResult = derivedLayoutIdOf(intendedPage) ? intendedFrameInput?.derived?.result : void 0;
+	let t10;
+	if ($[14] !== recordResult) {
+		t10 = getPageRecord(recordResult);
+		$[14] = recordResult;
+		$[15] = t10;
+	} else t10 = $[15];
+	const pageRecord = t10;
 	usePreparationFailure((!project.isFetching ? project.error : null) ?? (!pages.isFetching ? pages.error : null));
 	const preparation = React.useContext(PreviewPreparationContext);
-	React.useEffect(() => {
-		if (project.isPending || pages.isPending || project.error || pages.error) return;
-		if (selectedBlock || parseLocalePath(location.pathname, viewLocale.locales).path === "/camox/canvas") {
-			preparation?.ready();
-			return;
-		}
-		if (selectedPage) return;
-		preparation?.fail(/* @__PURE__ */ new Error(`No canvas page matches ${location.pathname}.`));
-	}, [
-		project.isPending,
-		pages.isPending,
-		project.error,
-		pages.error,
-		selectedPage,
-		selectedBlock,
-		location.pathname,
-		viewLocale.locales,
-		preparation
-	]);
+	let t11;
+	let t12;
+	if ($[16] !== location.pathname || $[17] !== pages.error || $[18] !== pages.isPending || $[19] !== preparation || $[20] !== project.error || $[21] !== project.isPending || $[22] !== selectedPage || $[23] !== viewLocale.locales) {
+		t11 = () => {
+			if (project.isPending || pages.isPending || project.error || pages.error) return;
+			if (parseLocalePath(location.pathname, viewLocale.locales).path === "/camox/canvas") {
+				preparation?.ready();
+				return;
+			}
+			if (selectedPage) return;
+			preparation?.fail(/* @__PURE__ */ new Error(`No canvas page matches ${location.pathname}.`));
+		};
+		t12 = [
+			project.isPending,
+			pages.isPending,
+			project.error,
+			pages.error,
+			selectedPage,
+			location.pathname,
+			viewLocale.locales,
+			preparation
+		];
+		$[16] = location.pathname;
+		$[17] = pages.error;
+		$[18] = pages.isPending;
+		$[19] = preparation;
+		$[20] = project.error;
+		$[21] = project.isPending;
+		$[22] = selectedPage;
+		$[23] = viewLocale.locales;
+		$[24] = t11;
+		$[25] = t12;
+	} else {
+		t11 = $[24];
+		t12 = $[25];
+	}
+	React.useEffect(t11, t12);
 	if (project.error || pages.error) {
-		let t10;
-		if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
-			t10 = /* @__PURE__ */ jsx("p", { children: "Could not load the site’s pages." });
-			$[14] = t10;
-		} else t10 = $[14];
-		let t11;
-		if ($[15] !== pages || $[16] !== project) {
-			t11 = /* @__PURE__ */ jsx(CanvasMessage, { children: /* @__PURE__ */ jsxs("div", {
+		let t13;
+		if ($[26] === Symbol.for("react.memo_cache_sentinel")) {
+			t13 = /* @__PURE__ */ jsx("p", { children: "Could not load the site’s pages." });
+			$[26] = t13;
+		} else t13 = $[26];
+		let t14;
+		if ($[27] !== pages || $[28] !== project) {
+			t14 = /* @__PURE__ */ jsx(CanvasMessage, { children: /* @__PURE__ */ jsxs("div", {
 				role: "alert",
-				children: [t10, /* @__PURE__ */ jsx("button", {
+				children: [t13, /* @__PURE__ */ jsx("button", {
 					className: "mt-4 underline",
 					onClick: () => {
 						if (project.error) project.refetch();
@@ -1555,178 +1237,163 @@ function CamoxCanvas(t0) {
 					children: "Try again"
 				})]
 			}) });
-			$[15] = pages;
-			$[16] = project;
-			$[17] = t11;
-		} else t11 = $[17];
-		return t11;
+			$[27] = pages;
+			$[28] = project;
+			$[29] = t14;
+		} else t14 = $[29];
+		return t14;
 	}
 	if (project.isPending || pages.isPending) {
-		let t10;
-		if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
-			t10 = /* @__PURE__ */ jsx(CanvasMessage, { children: /* @__PURE__ */ jsx("span", {
+		let t13;
+		if ($[30] === Symbol.for("react.memo_cache_sentinel")) {
+			t13 = /* @__PURE__ */ jsx(CanvasMessage, { children: /* @__PURE__ */ jsx("span", {
 				role: "status",
 				children: "Loading canvas…"
 			}) });
-			$[18] = t10;
-		} else t10 = $[18];
-		return t10;
+			$[30] = t13;
+		} else t13 = $[30];
+		return t13;
 	}
 	const editingOwner = activeFrame?.pathname === intended.pathname ? activeFrame.owner : null;
-	const blockCatalog = getBlockCatalog(app.getBlocks());
-	const intendedItemKey = intendedSelection.page?.key ?? (intendedSelection.block && canvasBlockKey(intendedSelection.block._internal.id));
-	const t10 = "flex min-h-0 flex-1 overflow-hidden";
-	const t11 = selectedPage?.kind === "curated" && /* @__PURE__ */ jsx(CuratedBlockShortcuts, {});
-	const T0 = NavigationProvider;
-	const T1 = PageRecordContext;
-	const T2 = CanvasSidebar;
-	const t12 = intendedSelection.page;
-	const t13 = intendedSelection.block && {
-		block: intendedSelection.block,
-		projectId: project.data.id
-	};
-	const t14 = getCanvasShelves(canvasPages, blockCatalog);
+	let t13;
+	if ($[31] !== selectedPage?.kind) {
+		t13 = selectedPage?.kind === "curated" && /* @__PURE__ */ jsx(CuratedBlockShortcuts, {});
+		$[31] = selectedPage?.kind;
+		$[32] = t13;
+	} else t13 = $[32];
+	const t14 = intendedPage?.key;
 	let t15;
-	if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
-		t15 = (key) => workspace.current?.showItem(key);
-		$[19] = t15;
-	} else t15 = $[19];
+	if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
+		t15 = (key) => workspace.current?.showPage(key);
+		$[33] = t15;
+	} else t15 = $[33];
 	let t16;
-	if ($[20] !== intendedItemKey || $[21] !== t14) {
+	if ($[34] !== canvasPages || $[35] !== t14) {
 		t16 = {
-			shelves: t14,
-			selectedKey: intendedItemKey,
-			onShowItem: t15
+			pages: canvasPages,
+			selectedKey: t14,
+			onShowPage: t15
 		};
-		$[20] = intendedItemKey;
-		$[21] = t14;
-		$[22] = t16;
-	} else t16 = $[22];
+		$[34] = canvasPages;
+		$[35] = t14;
+		$[36] = t16;
+	} else t16 = $[36];
 	let t17;
-	if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[37] === Symbol.for("react.memo_cache_sentinel")) {
 		t17 = () => workspace.current?.showWholeCanvas();
-		$[23] = t17;
-	} else t17 = $[23];
+		$[37] = t17;
+	} else t17 = $[37];
 	let t18;
-	if ($[24] !== T2 || $[25] !== editingOwner || $[26] !== intendedSelection || $[27] !== pageRecord || $[28] !== renamePage || $[29] !== t13 || $[30] !== t16) {
-		t18 = /* @__PURE__ */ jsx(T2, {
-			page: t12,
-			catalog: t13,
+	if ($[38] !== editingOwner || $[39] !== intendedPage || $[40] !== pageRecord || $[41] !== renamePage || $[42] !== t16) {
+		t18 = /* @__PURE__ */ jsx(CanvasSidebar, {
+			page: intendedPage,
 			navigator: t16,
 			onShowWholeCanvas: t17,
 			onRenamePage: renamePage,
 			owner: editingOwner,
 			pageRecord
 		});
-		$[24] = T2;
-		$[25] = editingOwner;
-		$[26] = intendedSelection;
-		$[27] = pageRecord;
-		$[28] = renamePage;
-		$[29] = t13;
-		$[30] = t16;
-		$[31] = t18;
-	} else t18 = $[31];
+		$[38] = editingOwner;
+		$[39] = intendedPage;
+		$[40] = pageRecord;
+		$[41] = renamePage;
+		$[42] = t16;
+		$[43] = t18;
+	} else t18 = $[43];
 	let t19;
-	if ($[32] !== T1 || $[33] !== recordResult || $[34] !== t18) {
-		t19 = /* @__PURE__ */ jsx(T1, {
+	if ($[44] !== recordResult || $[45] !== t18) {
+		t19 = /* @__PURE__ */ jsx(PageRecordContext, {
 			value: recordResult,
 			children: t18
 		});
-		$[32] = T1;
-		$[33] = recordResult;
-		$[34] = t18;
-		$[35] = t19;
-	} else t19 = $[35];
+		$[44] = recordResult;
+		$[45] = t18;
+		$[46] = t19;
+	} else t19 = $[46];
 	let t20;
-	if ($[36] !== T0 || $[37] !== intended || $[38] !== navigate || $[39] !== t19) {
-		t20 = /* @__PURE__ */ jsx(T0, {
+	if ($[47] !== intended || $[48] !== navigate || $[49] !== t19) {
+		t20 = /* @__PURE__ */ jsx(NavigationProvider, {
 			location: intended,
 			navigate,
 			children: t19
 		});
-		$[36] = T0;
-		$[37] = intended;
-		$[38] = navigate;
-		$[39] = t19;
-		$[40] = t20;
-	} else t20 = $[40];
-	let t21;
-	if ($[41] === Symbol.for("react.memo_cache_sentinel")) {
-		t21 = (pathname_0, owner, release) => setActiveFrame({
-			pathname: pathname_0,
+		$[47] = intended;
+		$[48] = navigate;
+		$[49] = t19;
+		$[50] = t20;
+	} else t20 = $[50];
+	const t21 = intendedPage?.key;
+	let t22;
+	if ($[51] === Symbol.for("react.memo_cache_sentinel")) {
+		t22 = (pathname, owner, release) => setActiveFrame({
+			pathname,
 			owner,
 			release
 		});
-		$[41] = t21;
-	} else t21 = $[41];
-	let t22;
-	if ($[42] !== location || $[43] !== setIntent) {
-		t22 = (pathname_1) => setIntent({
+		$[51] = t22;
+	} else t22 = $[51];
+	let t23;
+	if ($[52] !== location || $[53] !== setIntent) {
+		t23 = (pathname_0) => setIntent({
 			from: location.pathname,
 			to: {
 				...location,
-				pathname: pathname_1,
-				href: new URL(`${pathname_1}${location.search}${location.hash}`, window.location.href).href
+				pathname: pathname_0,
+				href: new URL(`${pathname_0}${location.search}${location.hash}`, window.location.href).href
 			}
 		});
-		$[42] = location;
-		$[43] = setIntent;
-		$[44] = t22;
-	} else t22 = $[44];
-	let t23;
-	if ($[45] !== blockCatalog || $[46] !== canvasPages || $[47] !== intendedItemKey || $[48] !== previewedPage || $[49] !== project.data.id || $[50] !== runtimeBasePath || $[51] !== selectedBlock || $[52] !== selectedPage || $[53] !== t22 || $[54] !== viewport) {
-		t23 = /* @__PURE__ */ jsx(CanvasWorkspace, {
+		$[52] = location;
+		$[53] = setIntent;
+		$[54] = t23;
+	} else t23 = $[54];
+	let t24;
+	if ($[55] !== canvasPages || $[56] !== previewedPage || $[57] !== project.data.id || $[58] !== runtimeBasePath || $[59] !== selectedPage || $[60] !== t21 || $[61] !== t23 || $[62] !== viewport) {
+		t24 = /* @__PURE__ */ jsx(CanvasWorkspace, {
 			ref: workspace,
-			projectId: project.data.id,
 			pages: canvasPages,
-			blocks: blockCatalog,
 			selectedPage,
-			selectedBlock,
 			previewedPage,
-			intendedItemKey,
+			intendedPageKey: t21,
 			runtimeBasePath,
 			viewport,
-			onActivate: t21,
-			onSelectionIntent: t22
+			onActivate: t22,
+			onSelectionIntent: t23
 		}, project.data.id);
-		$[45] = blockCatalog;
-		$[46] = canvasPages;
-		$[47] = intendedItemKey;
-		$[48] = previewedPage;
-		$[49] = project.data.id;
-		$[50] = runtimeBasePath;
-		$[51] = selectedBlock;
-		$[52] = selectedPage;
-		$[53] = t22;
-		$[54] = viewport;
-		$[55] = t23;
-	} else t23 = $[55];
-	let t24;
-	if ($[56] !== t11 || $[57] !== t20 || $[58] !== t23) {
-		t24 = /* @__PURE__ */ jsxs("div", {
-			className: t10,
+		$[55] = canvasPages;
+		$[56] = previewedPage;
+		$[57] = project.data.id;
+		$[58] = runtimeBasePath;
+		$[59] = selectedPage;
+		$[60] = t21;
+		$[61] = t23;
+		$[62] = viewport;
+		$[63] = t24;
+	} else t24 = $[63];
+	let t25;
+	if ($[64] !== t13 || $[65] !== t20 || $[66] !== t24) {
+		t25 = /* @__PURE__ */ jsxs("div", {
+			className: "flex min-h-0 flex-1 overflow-hidden",
 			children: [
-				t11,
+				t13,
 				t20,
-				t23
+				t24
 			]
 		});
-		$[56] = t11;
-		$[57] = t20;
-		$[58] = t23;
-		$[59] = t24;
-	} else t24 = $[59];
-	return t24;
+		$[64] = t13;
+		$[65] = t20;
+		$[66] = t24;
+		$[67] = t25;
+	} else t25 = $[67];
+	return t25;
 }
-function _temp7() {
+function _temp5() {
 	previewStore.send({ type: "clearSelection" });
-	return _temp6;
+	return _temp4;
 }
-function _temp6() {
+function _temp4() {
 	previewStore.send({ type: "clearSelection" });
 }
-function _temp5(state) {
+function _temp3(state) {
 	return state.context.viewportMode;
 }