camox 0.40.0 → 0.41.1

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

@@ -1,7 +1,7 @@
+import { FORMAT_FLAGS } from "../../../core/lib/modifierFormats.js";
 import { cn } from "../../../lib/utils.js";
 import { previewStore } from "../previewStore.js";
 import { TextLinkPopover } from "../../../core/components/lexical/TextLinkPopover.js";
-import { FORMAT_FLAGS } from "../../../core/lib/modifierFormats.js";
 import { isOverlayMessage } from "../overlayMessages.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
@@ -9,31 +9,48 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useSelector } from "@xstate/store-react";
 import { Kbd } from "@camox/ui/kbd";
 import { Button } from "@camox/ui/button";
-import { Bold, Italic } from "lucide-react";
-import { ButtonGroup } from "@camox/ui/button-group";
+import { Blend, Bold, Italic, Underline } from "lucide-react";
 import * as Tooltip$1 from "@camox/ui/tooltip";
+import { ButtonGroup } from "@camox/ui/button-group";
 import { FloatingToolbar } from "@camox/ui/floating-toolbar";
 import { Toggle } from "@camox/ui/toggle";
 
 //#region src/features/preview/components/FieldToolbar.tsx
-const FORMAT_BUTTONS = [{
-	key: "bold",
-	flag: FORMAT_FLAGS.bold,
-	icon: Bold,
-	label: "Bold",
-	shortcut: "⌘ B"
-}, {
-	key: "italic",
-	flag: FORMAT_FLAGS.italic,
-	icon: Italic,
-	label: "Italic",
-	shortcut: "⌘ I"
-}];
+const FORMAT_BUTTONS = [
+	{
+		key: "bold",
+		flag: FORMAT_FLAGS.bold,
+		icon: Bold,
+		label: "Bold",
+		shortcut: "⌘ B"
+	},
+	{
+		key: "italic",
+		flag: FORMAT_FLAGS.italic,
+		icon: Italic,
+		label: "Italic",
+		shortcut: "⌘ I"
+	},
+	{
+		key: "underline",
+		flag: FORMAT_FLAGS.underline,
+		icon: Underline,
+		label: "Underline",
+		shortcut: "⌘ U"
+	},
+	{
+		key: "gradient",
+		flag: FORMAT_FLAGS.gradient,
+		icon: Blend,
+		label: "Gradient",
+		shortcut: null
+	}
+];
 const FieldToolbar = () => {
 	const $ = c(28);
-	if ($[0] !== "bee72c888eb7fec22d667ab73801a7ed4c0292a3149ebb46febb13e2bf2d9bc3") {
+	if ($[0] !== "62fc88dbf76bce176e1b9d35a550f78886d467e61d1692885683da9874bf34dd") {
 		for (let $i = 0; $i < 28; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "bee72c888eb7fec22d667ab73801a7ed4c0292a3149ebb46febb13e2bf2d9bc3";
+		$[0] = "62fc88dbf76bce176e1b9d35a550f78886d467e61d1692885683da9874bf34dd";
 	}
 	const iframeElement = useSelector(previewStore, _temp);
 	const [hasSelection, setHasSelection] = React.useState(false);
@@ -41,6 +58,7 @@ const FieldToolbar = () => {
 	const [linkTarget, setLinkTarget] = React.useState(null);
 	const [selectedText, setSelectedText] = React.useState("");
 	const [linkPopoverOpen, setLinkPopoverOpen] = React.useState(false);
+	const linkPopoverOpenRef = React.useRef(false);
 	let t0;
 	let t1;
 	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
@@ -51,11 +69,13 @@ const FieldToolbar = () => {
 				if (data.type === "CAMOX_TEXT_SELECTION_STATE") {
 					setHasSelection(data.hasSelection);
 					setActiveFormats(data.activeFormats);
+					if (linkPopoverOpenRef.current) return;
 					setLinkTarget(data.linkTarget);
 					setSelectedText(data.selectedText);
 					return;
 				}
 				if (data.type === "CAMOX_OPEN_TEXT_LINK_POPOVER") {
+					linkPopoverOpenRef.current = true;
 					setHasSelection(true);
 					setLinkTarget(data.target);
 					setSelectedText(data.text);
@@ -88,6 +108,7 @@ const FieldToolbar = () => {
 	let t3;
 	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
 		t3 = (open) => {
+			linkPopoverOpenRef.current = open;
 			setLinkPopoverOpen(open);
 		};
 		$[5] = t3;
@@ -101,7 +122,7 @@ const FieldToolbar = () => {
 				target,
 				text
 			}, "*");
-			setLinkPopoverOpen(false);
+			handleLinkPopoverOpenChange(false);
 		};
 		$[6] = iframeElement?.contentWindow;
 		$[7] = t4;
@@ -135,13 +156,14 @@ const FieldToolbar = () => {
 					"data-state": isActive ? "on" : "off",
 					pressed: isActive,
 					variant: "outline",
+					"aria-label": label,
 					onPressedChange: () => sendFormat(key)
 				}),
 				children: /* @__PURE__ */ jsx(Icon, {})
 			}), /* @__PURE__ */ jsxs(Tooltip$1.TooltipContent, { children: [
 				label,
 				" ",
-				/* @__PURE__ */ jsx(Kbd, { children: shortcut })
+				shortcut && /* @__PURE__ */ jsx(Kbd, { children: shortcut })
 			] })] }, key);
 		});
 		$[12] = activeFormats;

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

@@ -1,7 +1,11 @@
+import { useLocation, useNavigate } from "../../navigation/navigation.js";
 import { cn } from "../../../lib/utils.js";
+import { PreviewDocumentContext } from "../../runtime/PreviewDocumentContext.js";
+import { PreviewActivationContext } from "./PreviewActivation.js";
+import { EMPTY_PREVIEW_DOCUMENT, isSiteStyle } from "./previewStyles.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createPortal } from "react-dom";
 
 //#region src/features/preview/components/Frame.tsx
@@ -14,155 +18,144 @@ function useFrame() {
 	if (!context) throw new Error("useFrame must be used within a Frame");
 	return context;
 }
-const Frame = (t0) => {
-	const $ = c(26);
-	if ($[0] !== "d86eac45c10b92a7f69f3cd224c85551755f967726be09bb5f6e2728732531a8") {
-		for (let $i = 0; $i < 26; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "d86eac45c10b92a7f69f3cd224c85551755f967726be09bb5f6e2728732531a8";
+function ClearServerMarkup(t0) {
+	const $ = c(5);
+	if ($[0] !== "46ee340e26c292b1d34ac0ef6952dfd17e06dacaf64fa1db1faae4faca07737a") {
+		for (let $i = 0; $i < 5; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "46ee340e26c292b1d34ac0ef6952dfd17e06dacaf64fa1db1faae4faca07737a";
 	}
-	const { children, className, style, copyStyles: t1, onIframeReady } = t0;
-	const copyStyles = t1 === void 0 ? true : t1;
+	const { nodes } = t0;
+	const activate = React.useContext(PreviewActivationContext);
+	let t1;
+	let t2;
+	if ($[1] !== activate || $[2] !== nodes) {
+		t1 = () => {
+			nodes.forEach(_temp);
+			activate?.();
+		};
+		t2 = [nodes, activate];
+		$[1] = activate;
+		$[2] = nodes;
+		$[3] = t1;
+		$[4] = t2;
+	} else {
+		t1 = $[3];
+		t2 = $[4];
+	}
+	React.useLayoutEffect(t1, t2);
+	return null;
+}
+function _temp(node) {
+	return node.remove();
+}
+const Frame = ({ children, className, style, copyStyles = true, serverOnly = false, onIframeReady }) => {
+	const navigate = useNavigate();
+	const { pathname, hash, href } = useLocation();
+	const previewDocument = React.useContext(PreviewDocumentContext);
+	const [srcDoc] = React.useState(previewDocument ?? "<!doctype html><html><head></head><body><div id=\"root\" data-camox-preview-root></div></body></html>");
+	const [serverNodes, setServerNodes] = React.useState([]);
+	const initializedDocument = React.useRef(null);
+	const navigateRef = React.useRef(navigate);
+	navigateRef.current = navigate;
 	const iframeRef = React.useRef(null);
 	const [iframeWindow, setIframeWindow] = React.useState(null);
 	const [iframeElement, setIframeElement] = React.useState(null);
 	const [mountNode, setMountNode] = React.useState(null);
 	const [hasOpenPopup, setHasOpenPopup] = React.useState(false);
-	let t2;
-	let t3;
-	if ($[1] !== copyStyles || $[2] !== onIframeReady) {
-		t2 = () => {
-			const iframe = iframeRef.current;
-			if (!iframe) return;
-			const handleLoad = () => {
-				const iframeDoc = iframe.contentDocument;
-				const iframeWin = iframe.contentWindow;
-				if (!iframeDoc || !iframeWin) return;
-				iframeDoc.open();
-				iframeDoc.write("<!DOCTYPE html><html><head></head><body style='background: transparent;'></body></html>");
-				iframeDoc.close();
-				iframeWin.addEventListener("click", _temp);
-				if (copyStyles) Array.from(document.head.querySelectorAll("style, link[rel=\"stylesheet\"]")).forEach((style_0) => {
-					const clonedStyle = style_0.cloneNode(true);
-					iframeDoc.head.appendChild(clonedStyle);
-				});
-				setMountNode(iframeDoc.body);
-				setIframeWindow(iframeWin);
-				setIframeElement(iframe);
-				onIframeReady?.(iframe);
-			};
-			iframe.addEventListener("load", handleLoad);
-			if (iframe.contentDocument?.readyState === "complete") handleLoad();
-			return () => {
-				iframe.removeEventListener("load", handleLoad);
-			};
-		};
-		t3 = [copyStyles, onIframeReady];
-		$[1] = copyStyles;
-		$[2] = onIframeReady;
-		$[3] = t2;
-		$[4] = t3;
-	} else {
-		t2 = $[3];
-		t3 = $[4];
-	}
-	React.useEffect(t2, t3);
-	let t4;
-	let t5;
-	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
-		t4 = () => {
-			const checkForOpenPopup = () => {
-				setHasOpenPopup(document.body.querySelector("[data-base-ui-portal] [data-open]") !== null);
-			};
-			checkForOpenPopup();
-			const observer = new MutationObserver(checkForOpenPopup);
-			observer.observe(document.body, {
-				childList: true,
-				subtree: true,
-				attributes: true,
-				attributeFilter: ["data-open", "data-closed"]
+	React.useEffect(() => {
+		const iframe = iframeRef.current;
+		if (!iframe) return;
+		const handleLoad = () => {
+			const iframeDoc = iframe.contentDocument;
+			const iframeWin = iframe.contentWindow;
+			const root = iframeDoc?.querySelector("[data-camox-preview-root]");
+			if (!iframeDoc || !iframeWin || !root || initializedDocument.current === iframeDoc) return;
+			initializedDocument.current = iframeDoc;
+			iframeWin.addEventListener("click", (e) => {
+				if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.altKey || e.shiftKey) return;
+				const anchor = e.target.closest("a");
+				if (!anchor?.href || anchor.hasAttribute("download")) return;
+				if (anchor.target && anchor.target !== "_self") return;
+				e.preventDefault();
+				navigateRef.current({ to: new URL(anchor.getAttribute("href"), window.location.href).href });
+			});
+			if (copyStyles && srcDoc === "<!doctype html><html><head></head><body><div id=\"root\" data-camox-preview-root></div></body></html>") Array.from(document.head.querySelectorAll("style, link[rel=\"stylesheet\"]")).filter(isSiteStyle).forEach((style_0) => {
+				const clonedStyle = style_0.cloneNode(true);
+				iframeDoc.head.appendChild(clonedStyle);
 			});
-			return () => {
-				observer.disconnect();
-			};
+			if (serverOnly) return;
+			setServerNodes(Array.from(root.childNodes));
+			setMountNode(root);
+			setIframeWindow(iframeWin);
+			setIframeElement(iframe);
+			onIframeReady?.(iframe);
 		};
-		t5 = [];
-		$[5] = t4;
-		$[6] = t5;
-	} else {
-		t4 = $[5];
-		t5 = $[6];
-	}
-	React.useEffect(t4, t5);
-	let t6;
-	if ($[7] !== className) {
-		t6 = cn("relative w-full h-full", className);
-		$[7] = className;
-		$[8] = t6;
-	} else t6 = $[8];
-	let t7;
-	if ($[9] !== hasOpenPopup) {
-		t7 = hasOpenPopup && /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 h-full w-full" });
-		$[9] = hasOpenPopup;
-		$[10] = t7;
-	} else t7 = $[10];
-	let t8;
-	if ($[11] !== iframeElement || $[12] !== iframeWindow) {
-		t8 = {
-			window: iframeWindow,
-			iframeElement
+		iframe.addEventListener("load", handleLoad);
+		if (iframe.contentDocument?.readyState === "complete") handleLoad();
+		return () => {
+			iframe.removeEventListener("load", handleLoad);
 		};
-		$[11] = iframeElement;
-		$[12] = iframeWindow;
-		$[13] = t8;
-	} else t8 = $[13];
-	let t9;
-	if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
-		t9 = /* @__PURE__ */ jsx("iframe", {
-			ref: iframeRef,
-			className: cn("w-full h-full")
-		});
-		$[14] = t9;
-	} else t9 = $[14];
-	let t10;
-	if ($[15] !== children || $[16] !== mountNode) {
-		t10 = mountNode && createPortal(children, mountNode);
-		$[15] = children;
-		$[16] = mountNode;
-		$[17] = t10;
-	} else t10 = $[17];
-	let t11;
-	if ($[18] !== t10 || $[19] !== t8) {
-		t11 = /* @__PURE__ */ jsxs(FrameContext.Provider, {
-			value: t8,
-			children: [t9, t10]
-		});
-		$[18] = t10;
-		$[19] = t8;
-		$[20] = t11;
-	} else t11 = $[20];
-	let t12;
-	if ($[21] !== style || $[22] !== t11 || $[23] !== t6 || $[24] !== t7) {
-		t12 = /* @__PURE__ */ jsxs("div", {
-			className: t6,
-			style,
-			children: [t7, t11]
+	}, [
+		copyStyles,
+		onIframeReady,
+		srcDoc,
+		serverOnly
+	]);
+	React.useEffect(() => {
+		if (!iframeWindow || !mountNode) return;
+		let base = iframeWindow.document.querySelector("base");
+		if (!base) {
+			base = iframeWindow.document.createElement("base");
+			iframeWindow.document.head.insertBefore(base, iframeWindow.document.head.firstChild);
+		}
+		base.href = href;
+		if (!hash) {
+			iframeWindow.scrollTo({ top: 0 });
+			return;
+		}
+		try {
+			iframeWindow.document.getElementById(decodeURIComponent(hash.slice(1)))?.scrollIntoView();
+		} catch {}
+	}, [
+		pathname,
+		hash,
+		href,
+		iframeWindow,
+		mountNode
+	]);
+	React.useEffect(() => {
+		const checkForOpenPopup = () => {
+			setHasOpenPopup(document.body.querySelector("[data-base-ui-portal] [data-open]") !== null);
+		};
+		checkForOpenPopup();
+		const observer = new MutationObserver(checkForOpenPopup);
+		observer.observe(document.body, {
+			childList: true,
+			subtree: true,
+			attributes: true,
+			attributeFilter: ["data-open", "data-closed"]
 		});
-		$[21] = style;
-		$[22] = t11;
-		$[23] = t6;
-		$[24] = t7;
-		$[25] = t12;
-	} else t12 = $[25];
-	return t12;
+		return () => {
+			observer.disconnect();
+		};
+	}, []);
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("relative w-full h-full", className),
+		style,
+		children: [hasOpenPopup && /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 h-full w-full" }), /* @__PURE__ */ jsxs(FrameContext.Provider, {
+			value: {
+				window: iframeWindow,
+				iframeElement
+			},
+			children: [/* @__PURE__ */ jsx("iframe", {
+				ref: iframeRef,
+				title: "Page preview",
+				srcDoc,
+				className: cn("w-full h-full")
+			}), mountNode && createPortal(/* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(ClearServerMarkup, { nodes: serverNodes }), children] }), mountNode)]
+		})]
+	});
 };
-function _temp(e) {
-	if (e.defaultPrevented) return;
-	const anchor = e.target.closest("a");
-	if (!anchor?.href) return;
-	if (anchor.target === "_blank") return;
-	e.preventDefault();
-	window.top?.location.assign(anchor.href);
-}
 
 //#endregion
-export { Frame, useFrame };
+export { Frame, FrameContext, useFrame };

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

@@ -1,59 +1,63 @@
 import { previewStore } from "../previewStore.js";
-import { AddBlockSidebar } from "./AddBlockSidebar.js";
+import { DerivedLayoutSidebar } from "./DerivedLayoutSidebar.js";
 import { PageNavigatorSidebar } from "./PageNavigatorSidebar.js";
 import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useSelector } from "@xstate/store-react";
 
 //#region src/features/preview/components/LeftSidebar.tsx
-const getLeftSidebarRoute = ({ isAddBlockSidebarOpen }) => {
-	if (isAddBlockSidebarOpen) return { type: "add-block" };
-	return { type: "page-navigator" };
-};
 const LeftSidebar = (t0) => {
-	const $ = c(12);
-	if ($[0] !== "f683caf1e19043e2a8ec108ed89c22771f4e771637dbf0249087f015011f6726") {
-		for (let $i = 0; $i < 12; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "f683caf1e19043e2a8ec108ed89c22771f4e771637dbf0249087f015011f6726";
+	const $ = c(13);
+	if ($[0] !== "c0b8051f9d03df681e369c0b2954359f21e672e526188e45d0de7a395154e9cc") {
+		for (let $i = 0; $i < 13; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "c0b8051f9d03df681e369c0b2954359f21e672e526188e45d0de7a395154e9cc";
 	}
-	const { page } = t0;
+	const { page, derivedLayout } = t0;
 	const isAddBlockSidebarOpen = useSelector(previewStore, _temp);
 	let t1;
-	if ($[1] !== isAddBlockSidebarOpen) {
-		t1 = getLeftSidebarRoute({ isAddBlockSidebarOpen });
-		$[1] = isAddBlockSidebarOpen;
-		$[2] = t1;
-	} else t1 = $[2];
-	const route = t1;
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = { width: 250 };
+		$[1] = t1;
+	} else t1 = $[1];
 	let t2;
-	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-		t2 = { width: 250 };
-		$[3] = t2;
-	} else t2 = $[3];
+	if ($[2] !== derivedLayout || $[3] !== page) {
+		t2 = derivedLayout ? /* @__PURE__ */ jsx(DerivedLayoutSidebar, { layout: derivedLayout }) : /* @__PURE__ */ jsx(PageNavigatorSidebar, { page });
+		$[2] = derivedLayout;
+		$[3] = page;
+		$[4] = t2;
+	} else t2 = $[4];
 	let t3;
-	if ($[4] !== route.type) {
-		t3 = route.type === "add-block" && /* @__PURE__ */ jsx(AddBlockSidebar, {});
-		$[4] = route.type;
-		$[5] = t3;
-	} else t3 = $[5];
+	if ($[5] !== isAddBlockSidebarOpen || $[6] !== t2) {
+		t3 = /* @__PURE__ */ jsx("div", {
+			className: "contents",
+			inert: isAddBlockSidebarOpen,
+			children: t2
+		});
+		$[5] = isAddBlockSidebarOpen;
+		$[6] = t2;
+		$[7] = t3;
+	} else t3 = $[7];
 	let t4;
-	if ($[6] !== page || $[7] !== route.type) {
-		t4 = route.type === "page-navigator" && /* @__PURE__ */ jsx(PageNavigatorSidebar, { page });
-		$[6] = page;
-		$[7] = route.type;
-		$[8] = t4;
-	} else t4 = $[8];
+	if ($[8] !== isAddBlockSidebarOpen) {
+		t4 = isAddBlockSidebarOpen && /* @__PURE__ */ jsx("div", {
+			className: "absolute inset-0 z-20 cursor-not-allowed",
+			style: { background: "rgba(0, 0, 0, 0.5)" },
+			"aria-hidden": "true"
+		});
+		$[8] = isAddBlockSidebarOpen;
+		$[9] = t4;
+	} else t4 = $[9];
 	let t5;
-	if ($[9] !== t3 || $[10] !== t4) {
+	if ($[10] !== t3 || $[11] !== t4) {
 		t5 = /* @__PURE__ */ jsxs("aside", {
-			className: "flex shrink-0 flex-col border-r-2",
-			style: t2,
+			className: "relative flex shrink-0 flex-col border-r-2",
+			style: t1,
 			children: [t3, t4]
 		});
-		$[9] = t3;
-		$[10] = t4;
-		$[11] = t5;
-	} else t5 = $[11];
+		$[10] = t3;
+		$[11] = t4;
+		$[12] = t5;
+	} else t5 = $[12];
 	return t5;
 };
 function _temp(state) {

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

@@ -26,9 +26,9 @@ const normalizeLinkValue = (value) => {
 };
 const LinkFieldEditor = (t0) => {
 	const $ = c(74);
-	if ($[0] !== "d6e76ca161ece5e3c3ab2fca39477fdbca4669ce2a59cab1e307374e6d56bc57") {
+	if ($[0] !== "cdb2f56fb4805e0de235a068b1342c61e1eade64737868f8170208f1ecf497ab") {
 		for (let $i = 0; $i < 74; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "d6e76ca161ece5e3c3ab2fca39477fdbca4669ce2a59cab1e307374e6d56bc57";
+		$[0] = "cdb2f56fb4805e0de235a068b1342c61e1eade64737868f8170208f1ecf497ab";
 	}
 	const { fieldName, linkValue: rawLinkValue, onSave } = t0;
 	let t1;
@@ -173,8 +173,7 @@ const LinkFieldEditor = (t0) => {
 			value: textField.value,
 			onChange: t16,
 			onFocus: textField.onFocus,
-			onBlur: textField.onBlur,
-			autoFocus: true
+			onBlur: textField.onBlur
 		});
 		$[33] = t15;
 		$[34] = t16;

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

@@ -3,9 +3,9 @@ import { projectQueries } from "../../../lib/queries.js";
 import { cn } from "../../../lib/utils.js";
 import { previewStore, selectionBlockId } from "../previewStore.js";
 import { UserButton } from "../../studio/components/UserButton.js";
-import { AddBlockSidebar } from "./AddBlockSidebar.js";
 import { PageTree } from "./PageTree.js";
 import { PageNavigatorHeader } from "./PageNavigatorSidebar.js";
+import { AddBlockSidebar } from "./AddBlockSidebar.js";
 import { PageEditorSidebar } from "./PageEditorSidebar.js";
 import { PageInfoSidebar, PageMarkdownContent, PageSeoContent } from "./PageInfoSidebar.js";
 import { c } from "react/compiler-runtime";
@@ -184,7 +184,7 @@ function MobilePreviewDrawer({ page, projectName }) {
 									className: "w-full",
 									disabled: page.status === "published" || page.livePublishedCheckpointId == null,
 									onClick: () => previewStore.send({ type: "viewLivePage" }),
-									children: "View live site"
+									children: "View live page"
 								})
 							}),
 							/* @__PURE__ */ jsxs("div", {
@@ -251,9 +251,9 @@ function MobilePreviewDrawer({ page, projectName }) {
 }
 function DrawerTile(t0) {
 	const $ = c(13);
-	if ($[0] !== "a15836a2c406a6e26e3450f2952542d7c3ef6e1f52eed0eca720954850f751a5") {
+	if ($[0] !== "621776a19ae594038e7ff74376eaee55067cbd45ac5f2b72eb73e9a66d3c4ae0") {
 		for (let $i = 0; $i < 13; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "a15836a2c406a6e26e3450f2952542d7c3ef6e1f52eed0eca720954850f751a5";
+		$[0] = "621776a19ae594038e7ff74376eaee55067cbd45ac5f2b72eb73e9a66d3c4ae0";
 	}
 	const { title, icon: Icon, onClick, fullWidth: t1, disabled: t2 } = t0;
 	const fullWidth = t1 === void 0 ? false : t1;