camox 0.3.0 → 0.4.0

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

@@ -6,6 +6,7 @@ import { fieldTypesDictionary } from "../../../core/lib/fieldTypes.js";
 import { useUpdateBlockPosition } from "./useUpdateBlockPosition.js";
 import { BlockActionsPopover } from "./BlockActionsPopover.js";
 import { usePreviewedPage } from "../CamoxPreview.js";
+import { c } from "react/compiler-runtime";
 import { useSelector } from "@xstate/store/react";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -19,44 +20,127 @@ import { CSS } from "@dnd-kit/utilities";
 import * as Accordion from "@radix-ui/react-accordion";
 //#region src/features/preview/components/PageTree.tsx
 function useEmbedTitle(url) {
+	const $ = c(3);
 	const [title, setTitle] = React.useState(null);
-	React.useEffect(() => {
-		if (!url) return;
-		setTitle(null);
-		const controller = new AbortController();
-		fetch(url, { signal: controller.signal }).then((res) => res.text()).then((html) => {
-			const match = html.match(/<title[^>]*>([^<]*)<\/title>/i);
-			if (match?.[1]) setTitle(match[1].trim());
-		}).catch(() => {});
-		return () => controller.abort();
-	}, [url]);
+	let t0;
+	let t1;
+	if ($[0] !== url) {
+		t0 = () => {
+			if (!url) return;
+			setTitle(null);
+			const controller = new AbortController();
+			fetch(url, { signal: controller.signal }).then(_temp).then((html) => {
+				const match = html.match(/<title[^>]*>([^<]*)<\/title>/i);
+				if (match?.[1]) setTitle(match[1].trim());
+			}).catch(_temp2);
+			return () => controller.abort();
+		};
+		t1 = [url];
+		$[0] = url;
+		$[1] = t0;
+		$[2] = t1;
+	} else {
+		t0 = $[1];
+		t1 = $[2];
+	}
+	React.useEffect(t0, t1);
 	return title;
 }
-var FieldItem = ({ fieldName, value, fieldType, schemaTitle, arrayItemType, isSelected, onFieldClick, onFieldDoubleClick, onMouseEnter, onMouseLeave }) => {
+function _temp2() {}
+function _temp(res) {
+	return res.text();
+}
+var FieldItem = (t0) => {
+	const $ = c(29);
+	const { fieldName, value, fieldType, schemaTitle, arrayItemType, isSelected, onFieldClick, onFieldDoubleClick, onMouseEnter, onMouseLeave } = t0;
 	const fetchedEmbedTitle = useEmbedTitle(fieldType === "Embed" ? value : null);
 	const fieldDef = fieldType != null ? fieldTypesDictionary[fieldType] : null;
-	const displayValue = fieldDef ? fieldDef.getLabel(value, {
-		schemaTitle,
-		fieldName,
-		fetchedTitle: fetchedEmbedTitle
-	}) : JSON.stringify(value);
-	const FieldIcon = fieldDef?.getIcon({ arrayItemType }) ?? Type;
-	return /* @__PURE__ */ jsxs("li", {
-		className: cn("flex items-center gap-1.5 rounded-lg pl-2 pr-1 py-2 cursor-default group/field", isSelected ? "bg-accent" : "hover:bg-accent/75"),
-		onClick: () => fieldType && onFieldClick(),
-		onDoubleClick: () => fieldType && onFieldDoubleClick(),
-		onMouseEnter,
-		onMouseLeave,
-		children: [/* @__PURE__ */ jsx(FieldIcon, { className: "size-4 shrink-0" }), /* @__PURE__ */ jsx("span", {
+	let t1;
+	if ($[0] !== fetchedEmbedTitle || $[1] !== fieldDef || $[2] !== fieldName || $[3] !== schemaTitle || $[4] !== value) {
+		t1 = fieldDef ? fieldDef.getLabel(value, {
+			schemaTitle,
+			fieldName,
+			fetchedTitle: fetchedEmbedTitle
+		}) : JSON.stringify(value);
+		$[0] = fetchedEmbedTitle;
+		$[1] = fieldDef;
+		$[2] = fieldName;
+		$[3] = schemaTitle;
+		$[4] = value;
+		$[5] = t1;
+	} else t1 = $[5];
+	const displayValue = t1;
+	let t2;
+	if ($[6] !== arrayItemType || $[7] !== fieldDef) {
+		t2 = fieldDef?.getIcon({ arrayItemType }) ?? Type;
+		$[6] = arrayItemType;
+		$[7] = fieldDef;
+		$[8] = t2;
+	} else t2 = $[8];
+	const FieldIcon = t2;
+	const t3 = isSelected ? "bg-accent" : "hover:bg-accent/75";
+	let t4;
+	if ($[9] !== t3) {
+		t4 = cn("flex items-center gap-1.5 rounded-lg pl-2 pr-1 py-2 cursor-default group/field", t3);
+		$[9] = t3;
+		$[10] = t4;
+	} else t4 = $[10];
+	let t5;
+	if ($[11] !== fieldType || $[12] !== onFieldClick) {
+		t5 = () => fieldType && onFieldClick();
+		$[11] = fieldType;
+		$[12] = onFieldClick;
+		$[13] = t5;
+	} else t5 = $[13];
+	let t6;
+	if ($[14] !== fieldType || $[15] !== onFieldDoubleClick) {
+		t6 = () => fieldType && onFieldDoubleClick();
+		$[14] = fieldType;
+		$[15] = onFieldDoubleClick;
+		$[16] = t6;
+	} else t6 = $[16];
+	let t7;
+	if ($[17] !== FieldIcon) {
+		t7 = /* @__PURE__ */ jsx(FieldIcon, { className: "size-4 shrink-0" });
+		$[17] = FieldIcon;
+		$[18] = t7;
+	} else t7 = $[18];
+	let t8;
+	if ($[19] !== displayValue) {
+		t8 = /* @__PURE__ */ jsx("span", {
 			className: "text-accent-foreground truncate select-none",
 			children: displayValue
-		})]
-	});
+		});
+		$[19] = displayValue;
+		$[20] = t8;
+	} else t8 = $[20];
+	let t9;
+	if ($[21] !== onMouseEnter || $[22] !== onMouseLeave || $[23] !== t4 || $[24] !== t5 || $[25] !== t6 || $[26] !== t7 || $[27] !== t8) {
+		t9 = /* @__PURE__ */ jsxs("li", {
+			className: t4,
+			onClick: t5,
+			onDoubleClick: t6,
+			onMouseEnter,
+			onMouseLeave,
+			children: [t7, t8]
+		});
+		$[21] = onMouseEnter;
+		$[22] = onMouseLeave;
+		$[23] = t4;
+		$[24] = t5;
+		$[25] = t6;
+		$[26] = t7;
+		$[27] = t8;
+		$[28] = t9;
+	} else t9 = $[28];
+	return t9;
 };
-var BlockFields = ({ block }) => {
+var BlockFields = (t0) => {
+	const $ = c(2);
+	const { block } = t0;
 	const schemaProperties = useCamoxApp().getBlockById(block.type)?.contentSchema.properties;
-	const selection = useSelector(previewStore, (state) => state.context.selection);
-	const iframeElement = useSelector(previewStore, (state) => state.context.iframeElement);
+	const selection = useSelector(previewStore, _temp3);
+	const iframeElement = useSelector(previewStore, _temp4);
 	const selectedFieldName = selection?.type === "block-field" && selection.blockId === String(block.id) ? selection.fieldName : null;
 	const handleFieldClick = (fieldName, fieldType) => {
 		previewStore.send({
@@ -66,359 +150,877 @@ var BlockFields = ({ block }) => {
 			fieldType
 		});
 	};
-	const handleFieldDoubleClick = (fieldName, fieldType) => {
-		fieldTypesDictionary[fieldType].onTreeDoubleClick({
+	const handleFieldDoubleClick = (fieldName_0, fieldType_0) => {
+		fieldTypesDictionary[fieldType_0].onTreeDoubleClick({
 			blockId: String(block.id),
-			fieldName
+			fieldName: fieldName_0
 		});
 	};
-	const handleFieldMouseEnter = (fieldName, isRepeatable) => {
+	const handleFieldMouseEnter = (fieldName_1, isRepeatable) => {
 		if (!iframeElement?.contentWindow) return;
 		if (isRepeatable) {
 			const message = {
 				type: "CAMOX_HOVER_REPEATER",
 				blockId: String(block.id),
-				fieldName
+				fieldName: fieldName_1
 			};
 			iframeElement.contentWindow.postMessage(message, "*");
 		} else {
-			const message = {
+			const message_0 = {
 				type: "CAMOX_HOVER_FIELD",
-				fieldId: `${String(block.id)}__${fieldName}`
+				fieldId: `${String(block.id)}__${fieldName_1}`
 			};
-			iframeElement.contentWindow.postMessage(message, "*");
+			iframeElement.contentWindow.postMessage(message_0, "*");
 		}
 	};
-	const handleFieldMouseLeave = (fieldName, isRepeatable) => {
+	const handleFieldMouseLeave = (fieldName_2, isRepeatable_0) => {
 		if (!iframeElement?.contentWindow) return;
-		if (isRepeatable) {
-			const message = {
+		if (isRepeatable_0) {
+			const message_1 = {
 				type: "CAMOX_HOVER_REPEATER_END",
 				blockId: String(block.id),
-				fieldName
+				fieldName: fieldName_2
 			};
-			iframeElement.contentWindow.postMessage(message, "*");
+			iframeElement.contentWindow.postMessage(message_1, "*");
 		} else {
-			const message = {
+			const message_2 = {
 				type: "CAMOX_HOVER_FIELD_END",
-				fieldId: `${String(block.id)}__${fieldName}`
+				fieldId: `${String(block.id)}__${fieldName_2}`
 			};
-			iframeElement.contentWindow.postMessage(message, "*");
+			iframeElement.contentWindow.postMessage(message_2, "*");
 		}
 	};
-	return /* @__PURE__ */ jsx("ul", {
-		className: "my-1 space-y-1 pr-1 pl-7",
-		children: Object.keys(schemaProperties ?? {}).map((fieldName) => {
-			const value = block.content[fieldName];
-			const fieldSchema = schemaProperties?.[fieldName];
-			if (!fieldSchema) return null;
-			const fieldType = fieldSchema.fieldType;
-			const isRepeatable = fieldType === "RepeatableItem";
-			return /* @__PURE__ */ jsx(FieldItem, {
-				fieldName,
-				value,
-				fieldType,
-				schemaTitle: fieldSchema?.title,
-				arrayItemType: fieldSchema?.arrayItemType,
-				isSelected: selectedFieldName === fieldName,
-				onFieldClick: () => handleFieldClick(fieldName, fieldType),
-				onFieldDoubleClick: () => handleFieldDoubleClick(fieldName, fieldType),
-				onMouseEnter: () => handleFieldMouseEnter(fieldName, isRepeatable),
-				onMouseLeave: () => handleFieldMouseLeave(fieldName, isRepeatable)
-			}, fieldName);
-		})
+	const t1 = "my-1 space-y-1 pr-1 pl-7";
+	const t2 = Object.keys(schemaProperties ?? {}).map((fieldName_3) => {
+		const value = block.content[fieldName_3];
+		const fieldSchema = schemaProperties?.[fieldName_3];
+		if (!fieldSchema) return null;
+		const fieldType_1 = fieldSchema.fieldType;
+		const isRepeatable_1 = fieldType_1 === "RepeatableItem";
+		return /* @__PURE__ */ jsx(FieldItem, {
+			fieldName: fieldName_3,
+			value,
+			fieldType: fieldType_1,
+			schemaTitle: fieldSchema?.title,
+			arrayItemType: fieldSchema?.arrayItemType,
+			isSelected: selectedFieldName === fieldName_3,
+			onFieldClick: () => handleFieldClick(fieldName_3, fieldType_1),
+			onFieldDoubleClick: () => handleFieldDoubleClick(fieldName_3, fieldType_1),
+			onMouseEnter: () => handleFieldMouseEnter(fieldName_3, isRepeatable_1),
+			onMouseLeave: () => handleFieldMouseLeave(fieldName_3, isRepeatable_1)
+		}, fieldName_3);
 	});
+	let t3;
+	if ($[0] !== t2) {
+		t3 = /* @__PURE__ */ jsx("ul", {
+			className: t1,
+			children: t2
+		});
+		$[0] = t2;
+		$[1] = t3;
+	} else t3 = $[1];
+	return t3;
 };
-function useBlockTreeItem(block, isSelected, isDragging = false) {
+function useBlockTreeItem(block, isSelected, t0) {
+	const $ = c(17);
+	const isDragging = t0 === void 0 ? false : t0;
 	const [ellipsisPopoverOpen, setEllipsisPopoverOpen] = React.useState(false);
-	const selection = useSelector(previewStore, (state) => state.context.selection);
-	const iframeElement = useSelector(previewStore, (state) => state.context.iframeElement);
+	const selection = useSelector(previewStore, _temp5);
+	const iframeElement = useSelector(previewStore, _temp6);
 	const isParentOfSelection = isSelected && selection != null && selection.type !== "block";
 	const shouldShowHover = !isDragging && !isSelected;
 	const shouldShowActive = isDragging || isSelected && !isParentOfSelection;
-	const handleBlockMouseEnter = () => {
-		if (!iframeElement?.contentWindow) return;
-		const message = {
-			type: "CAMOX_HOVER_BLOCK",
-			blockId: String(block.id)
+	let t1;
+	if ($[0] !== block || $[1] !== iframeElement) {
+		t1 = () => {
+			if (!iframeElement?.contentWindow) return;
+			const message = {
+				type: "CAMOX_HOVER_BLOCK",
+				blockId: String(block.id)
+			};
+			iframeElement.contentWindow.postMessage(message, "*");
 		};
-		iframeElement.contentWindow.postMessage(message, "*");
-	};
-	const handleBlockMouseLeave = () => {
-		if (!iframeElement?.contentWindow) return;
-		const message = {
-			type: "CAMOX_HOVER_BLOCK_END",
-			blockId: String(block.id)
+		$[0] = block;
+		$[1] = iframeElement;
+		$[2] = t1;
+	} else t1 = $[2];
+	const handleBlockMouseEnter = t1;
+	let t2;
+	if ($[3] !== block || $[4] !== iframeElement) {
+		t2 = () => {
+			if (!iframeElement?.contentWindow) return;
+			const message_0 = {
+				type: "CAMOX_HOVER_BLOCK_END",
+				blockId: String(block.id)
+			};
+			iframeElement.contentWindow.postMessage(message_0, "*");
 		};
-		iframeElement.contentWindow.postMessage(message, "*");
-	};
-	const toggleSelection = () => {
-		if (isSelected) previewStore.send({ type: "clearSelection" });
-		else previewStore.send({
-			type: "setFocusedBlock",
-			blockId: String(block.id)
-		});
-	};
-	return {
-		ellipsisPopoverOpen,
-		setEllipsisPopoverOpen,
-		isParentOfSelection,
-		shouldShowHover,
-		shouldShowActive,
-		handleBlockMouseEnter,
-		handleBlockMouseLeave,
-		toggleSelection
-	};
+		$[3] = block;
+		$[4] = iframeElement;
+		$[5] = t2;
+	} else t2 = $[5];
+	const handleBlockMouseLeave = t2;
+	let t3;
+	if ($[6] !== block || $[7] !== isSelected) {
+		t3 = () => {
+			if (isSelected) previewStore.send({ type: "clearSelection" });
+			else previewStore.send({
+				type: "setFocusedBlock",
+				blockId: String(block.id)
+			});
+		};
+		$[6] = block;
+		$[7] = isSelected;
+		$[8] = t3;
+	} else t3 = $[8];
+	const toggleSelection = t3;
+	let t4;
+	if ($[9] !== ellipsisPopoverOpen || $[10] !== handleBlockMouseEnter || $[11] !== handleBlockMouseLeave || $[12] !== isParentOfSelection || $[13] !== shouldShowActive || $[14] !== shouldShowHover || $[15] !== toggleSelection) {
+		t4 = {
+			ellipsisPopoverOpen,
+			setEllipsisPopoverOpen,
+			isParentOfSelection,
+			shouldShowHover,
+			shouldShowActive,
+			handleBlockMouseEnter,
+			handleBlockMouseLeave,
+			toggleSelection
+		};
+		$[9] = ellipsisPopoverOpen;
+		$[10] = handleBlockMouseEnter;
+		$[11] = handleBlockMouseLeave;
+		$[12] = isParentOfSelection;
+		$[13] = shouldShowActive;
+		$[14] = shouldShowHover;
+		$[15] = toggleSelection;
+		$[16] = t4;
+	} else t4 = $[16];
+	return t4;
+}
+function _temp6(state_0) {
+	return state_0.context.iframeElement;
 }
-var BlockTreeItemHeader = ({ children, shouldShowHover, shouldShowActive, isParentOfSelection, className, ref, ...props }) => /* @__PURE__ */ jsx("div", {
-	ref,
-	className: cn("flex flex-row justify-between items-center gap-1 px-1 max-w-full rounded-lg text-foreground transition-all hover:transition-none", shouldShowHover && "hover:bg-accent/75", shouldShowActive && "bg-accent text-accent-foreground", isParentOfSelection && "bg-accent/25", "data-[state=open]:rounded-b-none", className),
-	...props,
-	children
-});
-var BlockTreeItemTrigger = ({ displayText, onClick }) => /* @__PURE__ */ jsx("div", {
-	className: "flex flex-1 items-center gap-1 overflow-x-hidden",
-	children: /* @__PURE__ */ jsx(Accordion.Trigger, {
-		asChild: true,
-		children: /* @__PURE__ */ jsx("button", {
-			className: cn("cursor-default flex-1 truncate py-2 text-sm text-left rounded-sm", "focus-visible:underline outline-none focus-visible:decoration-ring/50 focus-visible:decoration-4"),
-			title: displayText,
-			onClick,
-			children: displayText
-		})
-	})
-});
-var BlockTreeItemEllipsis = ({ open, className, ...props }) => /* @__PURE__ */ jsx(Button, {
-	variant: "ghost",
-	size: "icon-sm",
-	className: cn("text-muted-foreground hover:text-foreground", open ? "flex" : "hidden group-hover:flex group-focus-within:flex", className),
-	...props,
-	children: /* @__PURE__ */ jsx(Ellipsis, { className: "size-4" })
-});
-var BlockTreeItemContent = ({ block }) => /* @__PURE__ */ jsx(Accordion.Content, {
-	className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down text-muted-foreground data-[state=open]:bg-accent/25 overflow-hidden rounded-b-lg text-sm",
-	children: /* @__PURE__ */ jsx(BlockFields, { block })
-});
+function _temp5(state) {
+	return state.context.selection;
+}
+var BlockTreeItemHeader = (t0) => {
+	const $ = c(18);
+	let children;
+	let className;
+	let isParentOfSelection;
+	let props;
+	let ref;
+	let shouldShowActive;
+	let shouldShowHover;
+	if ($[0] !== t0) {
+		({children, shouldShowHover, shouldShowActive, isParentOfSelection, className, ref, ...props} = t0);
+		$[0] = t0;
+		$[1] = children;
+		$[2] = className;
+		$[3] = isParentOfSelection;
+		$[4] = props;
+		$[5] = ref;
+		$[6] = shouldShowActive;
+		$[7] = shouldShowHover;
+	} else {
+		children = $[1];
+		className = $[2];
+		isParentOfSelection = $[3];
+		props = $[4];
+		ref = $[5];
+		shouldShowActive = $[6];
+		shouldShowHover = $[7];
+	}
+	const t1 = shouldShowHover && "hover:bg-accent/75";
+	const t2 = shouldShowActive && "bg-accent text-accent-foreground";
+	const t3 = isParentOfSelection && "bg-accent/25";
+	let t4;
+	if ($[8] !== className || $[9] !== t1 || $[10] !== t2 || $[11] !== t3) {
+		t4 = cn("flex flex-row justify-between items-center gap-1 px-1 max-w-full rounded-lg text-foreground transition-all hover:transition-none", t1, t2, t3, "data-[state=open]:rounded-b-none", className);
+		$[8] = className;
+		$[9] = t1;
+		$[10] = t2;
+		$[11] = t3;
+		$[12] = t4;
+	} else t4 = $[12];
+	let t5;
+	if ($[13] !== children || $[14] !== props || $[15] !== ref || $[16] !== t4) {
+		t5 = /* @__PURE__ */ jsx("div", {
+			ref,
+			className: t4,
+			...props,
+			children
+		});
+		$[13] = children;
+		$[14] = props;
+		$[15] = ref;
+		$[16] = t4;
+		$[17] = t5;
+	} else t5 = $[17];
+	return t5;
+};
+var BlockTreeItemTrigger = (t0) => {
+	const $ = c(4);
+	const { displayText, onClick } = t0;
+	let t1;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = cn("cursor-default flex-1 truncate py-2 text-sm text-left rounded-sm", "focus-visible:underline outline-none focus-visible:decoration-ring/50 focus-visible:decoration-4");
+		$[0] = t1;
+	} else t1 = $[0];
+	let t2;
+	if ($[1] !== displayText || $[2] !== onClick) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			className: "flex flex-1 items-center gap-1 overflow-x-hidden",
+			children: /* @__PURE__ */ jsx(Accordion.Trigger, {
+				asChild: true,
+				children: /* @__PURE__ */ jsx("button", {
+					className: t1,
+					title: displayText,
+					onClick,
+					children: displayText
+				})
+			})
+		});
+		$[1] = displayText;
+		$[2] = onClick;
+		$[3] = t2;
+	} else t2 = $[3];
+	return t2;
+};
+var BlockTreeItemEllipsis = (t0) => {
+	const $ = c(11);
+	let className;
+	let open;
+	let props;
+	if ($[0] !== t0) {
+		({open, className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = open;
+		$[3] = props;
+	} else {
+		className = $[1];
+		open = $[2];
+		props = $[3];
+	}
+	const t1 = open ? "flex" : "hidden group-hover:flex group-focus-within:flex";
+	let t2;
+	if ($[4] !== className || $[5] !== t1) {
+		t2 = cn("text-muted-foreground hover:text-foreground", t1, className);
+		$[4] = className;
+		$[5] = t1;
+		$[6] = t2;
+	} else t2 = $[6];
+	let t3;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = /* @__PURE__ */ jsx(Ellipsis, { className: "size-4" });
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] !== props || $[9] !== t2) {
+		t4 = /* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			size: "icon-sm",
+			className: t2,
+			...props,
+			children: t3
+		});
+		$[8] = props;
+		$[9] = t2;
+		$[10] = t4;
+	} else t4 = $[10];
+	return t4;
+};
+var BlockTreeItemContent = (t0) => {
+	const $ = c(2);
+	const { block } = t0;
+	let t1;
+	if ($[0] !== block) {
+		t1 = /* @__PURE__ */ jsx(Accordion.Content, {
+			className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down text-muted-foreground data-[state=open]:bg-accent/25 overflow-hidden rounded-b-lg text-sm",
+			children: /* @__PURE__ */ jsx(BlockFields, { block })
+		});
+		$[0] = block;
+		$[1] = t1;
+	} else t1 = $[1];
+	return t1;
+};
 var animateLayoutChanges = (args) => {
 	const { isSorting, wasDragging } = args;
 	if (isSorting || wasDragging) return false;
 	return defaultAnimateLayoutChanges(args);
 };
-var SortableBlock = ({ block, isSelected }) => {
+var SortableBlock = (t0) => {
+	const $ = c(47);
+	const { block, isSelected } = t0;
 	const [gripPopoverOpen, setGripPopoverOpen] = React.useState(false);
-	const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
-		id: String(block.id),
-		animateLayoutChanges
-	});
-	const style = {
-		transform: CSS.Transform.toString(transform),
-		transition,
-		opacity: isDragging ? 0 : 1
-	};
+	const t1 = String(block.id);
+	let t2;
+	if ($[0] !== t1) {
+		t2 = {
+			id: t1,
+			animateLayoutChanges
+		};
+		$[0] = t1;
+		$[1] = t2;
+	} else t2 = $[1];
+	const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable(t2);
+	let t3;
+	if ($[2] !== transform) {
+		t3 = CSS.Transform.toString(transform);
+		$[2] = transform;
+		$[3] = t3;
+	} else t3 = $[3];
+	const t4 = isDragging ? 0 : 1;
+	let t5;
+	if ($[4] !== t3 || $[5] !== t4 || $[6] !== transition) {
+		t5 = {
+			transform: t3,
+			transition,
+			opacity: t4
+		};
+		$[4] = t3;
+		$[5] = t4;
+		$[6] = transition;
+		$[7] = t5;
+	} else t5 = $[7];
+	const style = t5;
 	const ctx = useBlockTreeItem(block, isSelected, isDragging);
-	return /* @__PURE__ */ jsx(Accordion.Root, {
-		type: "single",
-		collapsible: true,
-		value: isSelected ? String(block.id) : "",
-		children: /* @__PURE__ */ jsxs(Accordion.Item, {
-			value: String(block.id),
+	const t6 = isSelected ? String(block.id) : "";
+	const t7 = String(block.id);
+	let t8;
+	let t9;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: "Click and use arrow keys to reorder"
+		});
+		t9 = /* @__PURE__ */ jsx(GripVertical, { className: "h-4 w-4" });
+		$[8] = t8;
+		$[9] = t9;
+	} else {
+		t8 = $[8];
+		t9 = $[9];
+	}
+	let t10;
+	if ($[10] !== attributes || $[11] !== listeners) {
+		t10 = /* @__PURE__ */ jsxs(Button, {
+			variant: "ghost",
+			size: "icon-sm",
+			className: "text-muted-foreground hover:text-foreground flex cursor-grab active:cursor-grabbing",
+			...attributes,
+			...listeners,
+			children: [t8, t9]
+		});
+		$[10] = attributes;
+		$[11] = listeners;
+		$[12] = t10;
+	} else t10 = $[12];
+	let t11;
+	if ($[13] !== block || $[14] !== gripPopoverOpen || $[15] !== t10) {
+		t11 = /* @__PURE__ */ jsx(BlockActionsPopover, {
+			block,
+			open: gripPopoverOpen,
+			onOpenChange: setGripPopoverOpen,
+			children: t10
+		});
+		$[13] = block;
+		$[14] = gripPopoverOpen;
+		$[15] = t10;
+		$[16] = t11;
+	} else t11 = $[16];
+	const t12 = block.summary || block.type;
+	let t13;
+	if ($[17] !== ctx.toggleSelection || $[18] !== t12) {
+		t13 = /* @__PURE__ */ jsx(BlockTreeItemTrigger, {
+			displayText: t12,
+			onClick: ctx.toggleSelection
+		});
+		$[17] = ctx.toggleSelection;
+		$[18] = t12;
+		$[19] = t13;
+	} else t13 = $[19];
+	let t14;
+	if ($[20] !== ctx.ellipsisPopoverOpen) {
+		t14 = /* @__PURE__ */ jsx(BlockTreeItemEllipsis, { open: ctx.ellipsisPopoverOpen });
+		$[20] = ctx.ellipsisPopoverOpen;
+		$[21] = t14;
+	} else t14 = $[21];
+	let t15;
+	if ($[22] !== block || $[23] !== ctx.ellipsisPopoverOpen || $[24] !== ctx.setEllipsisPopoverOpen || $[25] !== t14) {
+		t15 = /* @__PURE__ */ jsx(BlockActionsPopover, {
+			block,
+			open: ctx.ellipsisPopoverOpen,
+			onOpenChange: ctx.setEllipsisPopoverOpen,
+			children: t14
+		});
+		$[22] = block;
+		$[23] = ctx.ellipsisPopoverOpen;
+		$[24] = ctx.setEllipsisPopoverOpen;
+		$[25] = t14;
+		$[26] = t15;
+	} else t15 = $[26];
+	let t16;
+	if ($[27] !== ctx.isParentOfSelection || $[28] !== ctx.shouldShowActive || $[29] !== ctx.shouldShowHover || $[30] !== t11 || $[31] !== t13 || $[32] !== t15) {
+		t16 = /* @__PURE__ */ jsx(Accordion.Header, {
+			asChild: true,
+			children: /* @__PURE__ */ jsxs(BlockTreeItemHeader, {
+				shouldShowHover: ctx.shouldShowHover,
+				shouldShowActive: ctx.shouldShowActive,
+				isParentOfSelection: ctx.isParentOfSelection,
+				children: [
+					t11,
+					t13,
+					t15
+				]
+			})
+		});
+		$[27] = ctx.isParentOfSelection;
+		$[28] = ctx.shouldShowActive;
+		$[29] = ctx.shouldShowHover;
+		$[30] = t11;
+		$[31] = t13;
+		$[32] = t15;
+		$[33] = t16;
+	} else t16 = $[33];
+	let t17;
+	if ($[34] !== block) {
+		t17 = /* @__PURE__ */ jsx(BlockTreeItemContent, { block });
+		$[34] = block;
+		$[35] = t17;
+	} else t17 = $[35];
+	let t18;
+	if ($[36] !== ctx.handleBlockMouseEnter || $[37] !== ctx.handleBlockMouseLeave || $[38] !== setNodeRef || $[39] !== style || $[40] !== t16 || $[41] !== t17 || $[42] !== t7) {
+		t18 = /* @__PURE__ */ jsxs(Accordion.Item, {
+			value: t7,
 			ref: setNodeRef,
 			style,
 			className: "group",
 			onMouseEnter: ctx.handleBlockMouseEnter,
 			onMouseLeave: ctx.handleBlockMouseLeave,
-			children: [/* @__PURE__ */ jsx(Accordion.Header, {
-				asChild: true,
-				children: /* @__PURE__ */ jsxs(BlockTreeItemHeader, {
-					shouldShowHover: ctx.shouldShowHover,
-					shouldShowActive: ctx.shouldShowActive,
-					isParentOfSelection: ctx.isParentOfSelection,
-					children: [
-						/* @__PURE__ */ jsx(BlockActionsPopover, {
-							block,
-							open: gripPopoverOpen,
-							onOpenChange: setGripPopoverOpen,
-							children: /* @__PURE__ */ jsxs(Button, {
-								variant: "ghost",
-								size: "icon-sm",
-								className: "text-muted-foreground hover:text-foreground flex cursor-grab active:cursor-grabbing",
-								...attributes,
-								...listeners,
-								children: [/* @__PURE__ */ jsx("span", {
-									className: "sr-only",
-									children: "Click and use arrow keys to reorder"
-								}), /* @__PURE__ */ jsx(GripVertical, { className: "h-4 w-4" })]
-							})
-						}),
-						/* @__PURE__ */ jsx(BlockTreeItemTrigger, {
-							displayText: block.summary || block.type,
-							onClick: ctx.toggleSelection
-						}),
-						/* @__PURE__ */ jsx(BlockActionsPopover, {
-							block,
-							open: ctx.ellipsisPopoverOpen,
-							onOpenChange: ctx.setEllipsisPopoverOpen,
-							children: /* @__PURE__ */ jsx(BlockTreeItemEllipsis, { open: ctx.ellipsisPopoverOpen })
-						})
-					]
-				})
-			}), /* @__PURE__ */ jsx(BlockTreeItemContent, { block })]
-		})
-	});
+			children: [t16, t17]
+		});
+		$[36] = ctx.handleBlockMouseEnter;
+		$[37] = ctx.handleBlockMouseLeave;
+		$[38] = setNodeRef;
+		$[39] = style;
+		$[40] = t16;
+		$[41] = t17;
+		$[42] = t7;
+		$[43] = t18;
+	} else t18 = $[43];
+	let t19;
+	if ($[44] !== t18 || $[45] !== t6) {
+		t19 = /* @__PURE__ */ jsx(Accordion.Root, {
+			type: "single",
+			collapsible: true,
+			value: t6,
+			children: t18
+		});
+		$[44] = t18;
+		$[45] = t6;
+		$[46] = t19;
+	} else t19 = $[46];
+	return t19;
 };
-var LayoutBlockItem = ({ block, isSelected, layoutName }) => {
-	const blockDef = useCamoxApp().getBlockById(block.type);
+var LayoutBlockItem = (t0) => {
+	const $ = c(38);
+	const { block, isSelected, layoutName } = t0;
+	const camoxApp = useCamoxApp();
+	let t1;
+	if ($[0] !== block.type || $[1] !== camoxApp) {
+		t1 = camoxApp.getBlockById(block.type);
+		$[0] = block.type;
+		$[1] = camoxApp;
+		$[2] = t1;
+	} else t1 = $[2];
+	const blockDef = t1;
 	const ctx = useBlockTreeItem(block, isSelected);
 	const displayText = blockDef?.title ?? block.type;
-	return /* @__PURE__ */ jsx(Accordion.Root, {
-		type: "single",
-		collapsible: true,
-		value: isSelected ? String(block.id) : "",
-		children: /* @__PURE__ */ jsxs(Accordion.Item, {
-			value: String(block.id),
+	const t2 = isSelected ? String(block.id) : "";
+	const t3 = String(block.id);
+	let t4;
+	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx(TooltipTrigger, { children: /* @__PURE__ */ jsx(LayoutTemplate, { className: "h-4 w-4" }) });
+		$[3] = t4;
+	} else t4 = $[3];
+	let t5;
+	if ($[4] !== layoutName) {
+		t5 = /* @__PURE__ */ jsx("span", {
+			className: "font-semibold",
+			children: layoutName
+		});
+		$[4] = layoutName;
+		$[5] = t5;
+	} else t5 = $[5];
+	let t6;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = /* @__PURE__ */ jsx("br", {});
+		$[6] = t6;
+	} else t6 = $[6];
+	let t7;
+	if ($[7] !== t5) {
+		t7 = /* @__PURE__ */ jsx("div", {
+			className: "text-muted-foreground flex size-7 shrink-0 items-center justify-center",
+			children: /* @__PURE__ */ jsxs(Tooltip, {
+				delayDuration: 500,
+				children: [t4, /* @__PURE__ */ jsxs(TooltipContent, { children: [
+					"From ",
+					t5,
+					" layout.",
+					t6,
+					"Changing the content may affect other pages"
+				] })]
+			})
+		});
+		$[7] = t5;
+		$[8] = t7;
+	} else t7 = $[8];
+	let t8;
+	if ($[9] !== ctx.toggleSelection || $[10] !== displayText) {
+		t8 = /* @__PURE__ */ jsx(BlockTreeItemTrigger, {
+			displayText,
+			onClick: ctx.toggleSelection
+		});
+		$[9] = ctx.toggleSelection;
+		$[10] = displayText;
+		$[11] = t8;
+	} else t8 = $[11];
+	const t9 = block.placement;
+	let t10;
+	if ($[12] !== ctx.ellipsisPopoverOpen) {
+		t10 = /* @__PURE__ */ jsx(BlockTreeItemEllipsis, { open: ctx.ellipsisPopoverOpen });
+		$[12] = ctx.ellipsisPopoverOpen;
+		$[13] = t10;
+	} else t10 = $[13];
+	let t11;
+	if ($[14] !== block || $[15] !== ctx.ellipsisPopoverOpen || $[16] !== ctx.setEllipsisPopoverOpen || $[17] !== t10 || $[18] !== t9) {
+		t11 = /* @__PURE__ */ jsx(BlockActionsPopover, {
+			block,
+			open: ctx.ellipsisPopoverOpen,
+			onOpenChange: ctx.setEllipsisPopoverOpen,
+			isLayoutBlock: true,
+			layoutPlacement: t9,
+			children: t10
+		});
+		$[14] = block;
+		$[15] = ctx.ellipsisPopoverOpen;
+		$[16] = ctx.setEllipsisPopoverOpen;
+		$[17] = t10;
+		$[18] = t9;
+		$[19] = t11;
+	} else t11 = $[19];
+	let t12;
+	if ($[20] !== ctx.isParentOfSelection || $[21] !== ctx.shouldShowActive || $[22] !== ctx.shouldShowHover || $[23] !== t11 || $[24] !== t7 || $[25] !== t8) {
+		t12 = /* @__PURE__ */ jsx(Accordion.Header, {
+			asChild: true,
+			children: /* @__PURE__ */ jsxs(BlockTreeItemHeader, {
+				shouldShowHover: ctx.shouldShowHover,
+				shouldShowActive: ctx.shouldShowActive,
+				isParentOfSelection: ctx.isParentOfSelection,
+				children: [
+					t7,
+					t8,
+					t11
+				]
+			})
+		});
+		$[20] = ctx.isParentOfSelection;
+		$[21] = ctx.shouldShowActive;
+		$[22] = ctx.shouldShowHover;
+		$[23] = t11;
+		$[24] = t7;
+		$[25] = t8;
+		$[26] = t12;
+	} else t12 = $[26];
+	let t13;
+	if ($[27] !== block) {
+		t13 = /* @__PURE__ */ jsx(BlockTreeItemContent, { block });
+		$[27] = block;
+		$[28] = t13;
+	} else t13 = $[28];
+	let t14;
+	if ($[29] !== ctx.handleBlockMouseEnter || $[30] !== ctx.handleBlockMouseLeave || $[31] !== t12 || $[32] !== t13 || $[33] !== t3) {
+		t14 = /* @__PURE__ */ jsxs(Accordion.Item, {
+			value: t3,
 			className: "group",
 			onMouseEnter: ctx.handleBlockMouseEnter,
 			onMouseLeave: ctx.handleBlockMouseLeave,
-			children: [/* @__PURE__ */ jsx(Accordion.Header, {
-				asChild: true,
-				children: /* @__PURE__ */ jsxs(BlockTreeItemHeader, {
-					shouldShowHover: ctx.shouldShowHover,
-					shouldShowActive: ctx.shouldShowActive,
-					isParentOfSelection: ctx.isParentOfSelection,
-					children: [
-						/* @__PURE__ */ jsx("div", {
-							className: "text-muted-foreground flex size-7 shrink-0 items-center justify-center",
-							children: /* @__PURE__ */ jsxs(Tooltip, {
-								delayDuration: 500,
-								children: [/* @__PURE__ */ jsx(TooltipTrigger, { children: /* @__PURE__ */ jsx(LayoutTemplate, { className: "h-4 w-4" }) }), /* @__PURE__ */ jsxs(TooltipContent, { children: [
-									"From ",
-									/* @__PURE__ */ jsx("span", {
-										className: "font-semibold",
-										children: layoutName
-									}),
-									" layout.",
-									/* @__PURE__ */ jsx("br", {}),
-									"Changing the content may affect other pages"
-								] })]
-							})
-						}),
-						/* @__PURE__ */ jsx(BlockTreeItemTrigger, {
-							displayText,
-							onClick: ctx.toggleSelection
-						}),
-						/* @__PURE__ */ jsx(BlockActionsPopover, {
-							block,
-							open: ctx.ellipsisPopoverOpen,
-							onOpenChange: ctx.setEllipsisPopoverOpen,
-							isLayoutBlock: true,
-							layoutPlacement: block.placement,
-							children: /* @__PURE__ */ jsx(BlockTreeItemEllipsis, { open: ctx.ellipsisPopoverOpen })
-						})
-					]
-				})
-			}), /* @__PURE__ */ jsx(BlockTreeItemContent, { block })]
-		})
-	});
+			children: [t12, t13]
+		});
+		$[29] = ctx.handleBlockMouseEnter;
+		$[30] = ctx.handleBlockMouseLeave;
+		$[31] = t12;
+		$[32] = t13;
+		$[33] = t3;
+		$[34] = t14;
+	} else t14 = $[34];
+	let t15;
+	if ($[35] !== t14 || $[36] !== t2) {
+		t15 = /* @__PURE__ */ jsx(Accordion.Root, {
+			type: "single",
+			collapsible: true,
+			value: t2,
+			children: t14
+		});
+		$[35] = t14;
+		$[36] = t2;
+		$[37] = t15;
+	} else t15 = $[37];
+	return t15;
 };
 var PageTree = () => {
-	const focusedBlockId = useSelector(previewStore, (state) => state.context.selection)?.blockId ?? null;
+	const $ = c(53);
+	const focusedBlockId = useSelector(previewStore, _temp7)?.blockId ?? null;
 	const page = usePreviewedPage();
 	const { pageBlocks, beforeBlocks: layoutBeforeBlocks, afterBlocks: layoutAfterBlocks } = usePageBlocks(page);
 	const camoxApp = useCamoxApp();
 	const updatePosition = useUpdateBlockPosition();
 	const [activeId, setActiveId] = React.useState(null);
-	const sensors = useSensors(useSensor(PointerSensor, { activationConstraint: {
-		distance: 8,
-		delay: 150,
-		tolerance: 5
-	} }), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
-	const handleDragStart = (event) => {
-		setActiveId(String(event.active.id));
-	};
-	const handleDragEnd = (event) => {
-		const { active, over } = event;
-		if (!over || active.id === over.id || !page) {
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = { activationConstraint: {
+			distance: 8,
+			delay: 150,
+			tolerance: 5
+		} };
+		$[0] = t0;
+	} else t0 = $[0];
+	let t1;
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = { coordinateGetter: sortableKeyboardCoordinates };
+		$[1] = t1;
+	} else t1 = $[1];
+	const sensors = useSensors(useSensor(PointerSensor, t0), useSensor(KeyboardSensor, t1));
+	let t2;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = (event) => {
+			setActiveId(String(event.active.id));
+		};
+		$[2] = t2;
+	} else t2 = $[2];
+	const handleDragStart = t2;
+	let t3;
+	if ($[3] !== page || $[4] !== pageBlocks || $[5] !== updatePosition) {
+		t3 = (event_0) => {
+			const { active, over } = event_0;
+			if (!over || active.id === over.id || !page) {
+				setActiveId(null);
+				return;
+			}
+			const oldIndex = pageBlocks.findIndex((block) => String(block.id) === active.id);
+			const newIndex = pageBlocks.findIndex((block_0) => String(block_0.id) === over.id);
+			if (oldIndex === -1 || newIndex === -1) {
+				setActiveId(null);
+				return;
+			}
+			let afterPosition;
+			let beforePosition;
+			if (oldIndex < newIndex) {
+				afterPosition = pageBlocks[newIndex].position;
+				beforePosition = newIndex < pageBlocks.length - 1 ? pageBlocks[newIndex + 1].position : void 0;
+			} else {
+				afterPosition = newIndex > 0 ? pageBlocks[newIndex - 1].position : void 0;
+				beforePosition = pageBlocks[newIndex].position;
+			}
+			updatePosition.mutate({
+				id: Number(active.id),
+				afterPosition,
+				beforePosition
+			});
 			setActiveId(null);
-			return;
-		}
-		const oldIndex = pageBlocks.findIndex((block) => String(block.id) === active.id);
-		const newIndex = pageBlocks.findIndex((block) => String(block.id) === over.id);
-		if (oldIndex === -1 || newIndex === -1) {
+		};
+		$[3] = page;
+		$[4] = pageBlocks;
+		$[5] = updatePosition;
+		$[6] = t3;
+	} else t3 = $[6];
+	const handleDragEnd = t3;
+	let t4;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = () => {
 			setActiveId(null);
-			return;
-		}
-		let afterPosition;
-		let beforePosition;
-		if (oldIndex < newIndex) {
-			afterPosition = pageBlocks[newIndex].position;
-			beforePosition = newIndex < pageBlocks.length - 1 ? pageBlocks[newIndex + 1].position : void 0;
-		} else {
-			afterPosition = newIndex > 0 ? pageBlocks[newIndex - 1].position : void 0;
-			beforePosition = pageBlocks[newIndex].position;
-		}
-		updatePosition.mutate({
-			id: Number(active.id),
-			afterPosition,
-			beforePosition
-		});
-		setActiveId(null);
-	};
-	const handleDragCancel = () => {
-		setActiveId(null);
-	};
+		};
+		$[7] = t4;
+	} else t4 = $[7];
+	const handleDragCancel = t4;
 	if (!page) return null;
-	const layout = page.layout ? camoxApp.getLayoutById(page.layout.layoutId) : void 0;
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-0.5",
-		children: [
-			layoutBeforeBlocks.map((block) => /* @__PURE__ */ jsx(LayoutBlockItem, {
-				block,
-				isSelected: focusedBlockId === String(block.id),
+	let t5;
+	if ($[8] !== camoxApp || $[9] !== page.layout) {
+		t5 = page.layout ? camoxApp.getLayoutById(page.layout.layoutId) : void 0;
+		$[8] = camoxApp;
+		$[9] = page.layout;
+		$[10] = t5;
+	} else t5 = $[10];
+	const layout = t5;
+	let t6;
+	if ($[11] !== focusedBlockId || $[12] !== layout?.title || $[13] !== layoutBeforeBlocks) {
+		let t7;
+		if ($[15] !== focusedBlockId || $[16] !== layout?.title) {
+			t7 = (block_1) => /* @__PURE__ */ jsx(LayoutBlockItem, {
+				block: block_1,
+				isSelected: focusedBlockId === String(block_1.id),
 				layoutName: layout?.title ?? "Unknown"
-			}, String(block.id))),
-			/* @__PURE__ */ jsxs(DndContext, {
-				sensors,
-				collisionDetection: closestCenter,
-				onDragStart: handleDragStart,
-				onDragEnd: handleDragEnd,
-				onDragCancel: handleDragCancel,
-				modifiers: [restrictToVerticalAxis],
-				children: [/* @__PURE__ */ jsx(SortableContext, {
-					items: pageBlocks.map((block) => String(block.id)),
-					strategy: verticalListSortingStrategy,
-					children: pageBlocks.map((block) => /* @__PURE__ */ jsx(SortableBlock, {
-						block,
-						isSelected: focusedBlockId === String(block.id)
-					}, String(block.id)))
-				}), /* @__PURE__ */ jsx(DragOverlay, {
-					dropAnimation: null,
-					children: activeId ? (() => {
-						const activeBlock = pageBlocks.find((b) => String(b.id) === activeId);
-						if (!activeBlock) return null;
-						return /* @__PURE__ */ jsx("div", {
-							className: "bg-accent text-accent-foreground rounded-lg shadow-md",
-							children: /* @__PURE__ */ jsxs("div", {
-								className: "flex items-center gap-1 px-1 py-2 text-sm",
-								children: [/* @__PURE__ */ jsx(GripVertical, { className: "text-muted-foreground mx-1.5 h-4 w-4" }), /* @__PURE__ */ jsx("span", {
-									className: "truncate",
-									children: activeBlock.summary
-								})]
-							})
-						});
-					})() : null
-				})]
-			}),
-			layoutAfterBlocks.map((block) => /* @__PURE__ */ jsx(LayoutBlockItem, {
-				block,
-				isSelected: focusedBlockId === String(block.id),
+			}, String(block_1.id));
+			$[15] = focusedBlockId;
+			$[16] = layout?.title;
+			$[17] = t7;
+		} else t7 = $[17];
+		t6 = layoutBeforeBlocks.map(t7);
+		$[11] = focusedBlockId;
+		$[12] = layout?.title;
+		$[13] = layoutBeforeBlocks;
+		$[14] = t6;
+	} else t6 = $[14];
+	let t7;
+	if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = [restrictToVerticalAxis];
+		$[18] = t7;
+	} else t7 = $[18];
+	let t8;
+	if ($[19] !== pageBlocks) {
+		t8 = pageBlocks.map(_temp8);
+		$[19] = pageBlocks;
+		$[20] = t8;
+	} else t8 = $[20];
+	let t9;
+	if ($[21] !== focusedBlockId || $[22] !== pageBlocks) {
+		let t10;
+		if ($[24] !== focusedBlockId) {
+			t10 = (block_3) => /* @__PURE__ */ jsx(SortableBlock, {
+				block: block_3,
+				isSelected: focusedBlockId === String(block_3.id)
+			}, String(block_3.id));
+			$[24] = focusedBlockId;
+			$[25] = t10;
+		} else t10 = $[25];
+		t9 = pageBlocks.map(t10);
+		$[21] = focusedBlockId;
+		$[22] = pageBlocks;
+		$[23] = t9;
+	} else t9 = $[23];
+	let t10;
+	if ($[26] !== t8 || $[27] !== t9) {
+		t10 = /* @__PURE__ */ jsx(SortableContext, {
+			items: t8,
+			strategy: verticalListSortingStrategy,
+			children: t9
+		});
+		$[26] = t8;
+		$[27] = t9;
+		$[28] = t10;
+	} else t10 = $[28];
+	let t11;
+	if ($[29] !== activeId || $[30] !== pageBlocks) {
+		t11 = activeId ? (() => {
+			const activeBlock = pageBlocks.find((b) => String(b.id) === activeId);
+			if (!activeBlock) return null;
+			return /* @__PURE__ */ jsx("div", {
+				className: "bg-accent text-accent-foreground rounded-lg shadow-md",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-1 px-1 py-2 text-sm",
+					children: [/* @__PURE__ */ jsx(GripVertical, { className: "text-muted-foreground mx-1.5 h-4 w-4" }), /* @__PURE__ */ jsx("span", {
+						className: "truncate",
+						children: activeBlock.summary
+					})]
+				})
+			});
+		})() : null;
+		$[29] = activeId;
+		$[30] = pageBlocks;
+		$[31] = t11;
+	} else t11 = $[31];
+	let t12;
+	if ($[32] !== t11) {
+		t12 = /* @__PURE__ */ jsx(DragOverlay, {
+			dropAnimation: null,
+			children: t11
+		});
+		$[32] = t11;
+		$[33] = t12;
+	} else t12 = $[33];
+	let t13;
+	if ($[34] !== handleDragEnd || $[35] !== sensors || $[36] !== t10 || $[37] !== t12) {
+		t13 = /* @__PURE__ */ jsxs(DndContext, {
+			sensors,
+			collisionDetection: closestCenter,
+			onDragStart: handleDragStart,
+			onDragEnd: handleDragEnd,
+			onDragCancel: handleDragCancel,
+			modifiers: t7,
+			children: [t10, t12]
+		});
+		$[34] = handleDragEnd;
+		$[35] = sensors;
+		$[36] = t10;
+		$[37] = t12;
+		$[38] = t13;
+	} else t13 = $[38];
+	let t14;
+	if ($[39] !== focusedBlockId || $[40] !== layout?.title || $[41] !== layoutAfterBlocks) {
+		let t15;
+		if ($[43] !== focusedBlockId || $[44] !== layout?.title) {
+			t15 = (block_4) => /* @__PURE__ */ jsx(LayoutBlockItem, {
+				block: block_4,
+				isSelected: focusedBlockId === String(block_4.id),
 				layoutName: layout?.title ?? "Unknown"
-			}, String(block.id)))
-		]
-	}), /* @__PURE__ */ jsxs(Button, {
-		variant: "secondary",
-		onClick: () => previewStore.send({ type: "openAddBlockSheet" }),
-		children: [/* @__PURE__ */ jsx(Plus, {}), "Add block"]
-	})] });
+			}, String(block_4.id));
+			$[43] = focusedBlockId;
+			$[44] = layout?.title;
+			$[45] = t15;
+		} else t15 = $[45];
+		t14 = layoutAfterBlocks.map(t15);
+		$[39] = focusedBlockId;
+		$[40] = layout?.title;
+		$[41] = layoutAfterBlocks;
+		$[42] = t14;
+	} else t14 = $[42];
+	let t15;
+	if ($[46] !== t13 || $[47] !== t14 || $[48] !== t6) {
+		t15 = /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-0.5",
+			children: [
+				t6,
+				t13,
+				t14
+			]
+		});
+		$[46] = t13;
+		$[47] = t14;
+		$[48] = t6;
+		$[49] = t15;
+	} else t15 = $[49];
+	let t16;
+	if ($[50] === Symbol.for("react.memo_cache_sentinel")) {
+		t16 = /* @__PURE__ */ jsxs(Button, {
+			variant: "secondary",
+			onClick: _temp9,
+			children: [/* @__PURE__ */ jsx(Plus, {}), "Add block"]
+		});
+		$[50] = t16;
+	} else t16 = $[50];
+	let t17;
+	if ($[51] !== t15) {
+		t17 = /* @__PURE__ */ jsxs(Fragment, { children: [t15, t16] });
+		$[51] = t15;
+		$[52] = t17;
+	} else t17 = $[52];
+	return t17;
 };
+function _temp3(state) {
+	return state.context.selection;
+}
+function _temp4(state_0) {
+	return state_0.context.iframeElement;
+}
+function _temp7(state) {
+	return state.context.selection;
+}
+function _temp8(block_2) {
+	return String(block_2.id);
+}
+function _temp9() {
+	return previewStore.send({ type: "openAddBlockSheet" });
+}
 //#endregion
 export { PageTree };