camox 0.40.0 → 0.41.0

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

@@ -0,0 +1,78 @@
+import { c } from "react/compiler-runtime";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/features/preview/components/PreviewActivation.tsx
+/** A replacement preview must load its document and commit before we reveal it. */
+const PreviewActivationContext = React.createContext(void 0);
+function PreviewActivation(t0) {
+	const $ = c(16);
+	if ($[0] !== "7173efcb0430a426f5e87095e95173285c836e918e936cfcdfbdaa6d172fdb6a") {
+		for (let $i = 0; $i < 16; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "7173efcb0430a426f5e87095e95173285c836e918e936cfcdfbdaa6d172fdb6a";
+	}
+	const { fallback, children } = t0;
+	const [ready, setReady] = React.useState(false);
+	let t1;
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = () => setReady(true);
+		$[1] = t1;
+	} else t1 = $[1];
+	const activate = t1;
+	const t2 = ready ? void 0 : "hidden";
+	let t3;
+	if ($[2] !== t2) {
+		t3 = { visibility: t2 };
+		$[2] = t2;
+		$[3] = t3;
+	} else t3 = $[3];
+	const t4 = ready ? fallback : null;
+	let t5;
+	if ($[4] !== children || $[5] !== t4) {
+		t5 = /* @__PURE__ */ jsx(PreviewActivationContext.Provider, {
+			value: activate,
+			children: /* @__PURE__ */ jsx(React.Suspense, {
+				fallback: t4,
+				children
+			})
+		});
+		$[4] = children;
+		$[5] = t4;
+		$[6] = t5;
+	} else t5 = $[6];
+	let t6;
+	if ($[7] !== t3 || $[8] !== t5) {
+		t6 = /* @__PURE__ */ jsx("div", {
+			className: "flex min-h-0 flex-1 flex-col",
+			style: t3,
+			children: t5
+		});
+		$[7] = t3;
+		$[8] = t5;
+		$[9] = t6;
+	} else t6 = $[9];
+	let t7;
+	if ($[10] !== fallback || $[11] !== ready) {
+		t7 = !ready && /* @__PURE__ */ jsx("div", {
+			className: "absolute inset-0",
+			children: fallback
+		});
+		$[10] = fallback;
+		$[11] = ready;
+		$[12] = t7;
+	} else t7 = $[12];
+	let t8;
+	if ($[13] !== t6 || $[14] !== t7) {
+		t8 = /* @__PURE__ */ jsxs("div", {
+			className: "relative flex min-h-0 flex-1 flex-col",
+			children: [t6, t7]
+		});
+		$[13] = t6;
+		$[14] = t7;
+		$[15] = t8;
+	} else t8 = $[15];
+	return t8;
+}
+
+//#endregion
+export { PreviewActivation, PreviewActivationContext };

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

@@ -1,5 +1,6 @@
 import { actionsStore } from "../../provider/actionsStore.js";
 import { checkIfInputFocused, cn } from "../../../lib/utils.js";
+import { SharedChromeContext } from "../../runtime/SharedChromeContext.js";
 import { previewStore } from "../previewStore.js";
 import { useBlockActionsShortcuts } from "./BlockActionsPopover.js";
 import { FieldOverlayStyles } from "./FieldOverlayStyles.js";
@@ -18,9 +19,9 @@ import { PanelContent } from "@camox/ui/panel";
 //#region src/features/preview/components/PreviewPanel.tsx
 const PreviewFrame = (t0) => {
 	const $ = c(9);
-	if ($[0] !== "e11c3b34ca0f5fb034c9be15c118c7ca06abc87dbf81a94c0e4b32239a67ad26") {
+	if ($[0] !== "d1fef758f47859e4d6ac1a8436e009a46839990f032b83d1c6b20b946ff84297") {
 		for (let $i = 0; $i < 9; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "e11c3b34ca0f5fb034c9be15c118c7ca06abc87dbf81a94c0e4b32239a67ad26";
+		$[0] = "d1fef758f47859e4d6ac1a8436e009a46839990f032b83d1c6b20b946ff84297";
 	}
 	const { children, style, className, onIframeReady } = t0;
 	let t1;
@@ -61,9 +62,9 @@ const PreviewFrame = (t0) => {
 };
 const KeyDownForwarder = () => {
 	const $ = c(5);
-	if ($[0] !== "e11c3b34ca0f5fb034c9be15c118c7ca06abc87dbf81a94c0e4b32239a67ad26") {
+	if ($[0] !== "d1fef758f47859e4d6ac1a8436e009a46839990f032b83d1c6b20b946ff84297") {
 		for (let $i = 0; $i < 5; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "e11c3b34ca0f5fb034c9be15c118c7ca06abc87dbf81a94c0e4b32239a67ad26";
+		$[0] = "d1fef758f47859e4d6ac1a8436e009a46839990f032b83d1c6b20b946ff84297";
 	}
 	const { window: iframeWindow } = useFrame();
 	const actions = useSelector(actionsStore, _temp);
@@ -112,16 +113,25 @@ const viewportClassName = {
 	tablet: "h-[1024px] w-[768px] max-h-full max-w-full",
 	mobile: "h-175 w-[393px] max-h-full max-w-full"
 };
+function CuratedBlockShortcuts() {
+	const $ = c(1);
+	if ($[0] !== "d1fef758f47859e4d6ac1a8436e009a46839990f032b83d1c6b20b946ff84297") {
+		for (let $i = 0; $i < 1; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "d1fef758f47859e4d6ac1a8436e009a46839990f032b83d1c6b20b946ff84297";
+	}
+	useBlockActionsShortcuts();
+	return null;
+}
 const PreviewPanel = (t0) => {
-	const $ = c(17);
-	if ($[0] !== "e11c3b34ca0f5fb034c9be15c118c7ca06abc87dbf81a94c0e4b32239a67ad26") {
-		for (let $i = 0; $i < 17; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "e11c3b34ca0f5fb034c9be15c118c7ca06abc87dbf81a94c0e4b32239a67ad26";
+	const $ = c(26);
+	if ($[0] !== "d1fef758f47859e4d6ac1a8436e009a46839990f032b83d1c6b20b946ff84297") {
+		for (let $i = 0; $i < 26; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "d1fef758f47859e4d6ac1a8436e009a46839990f032b83d1c6b20b946ff84297";
 	}
 	const { children, isMobileExperience: t1, page, projectName: t2, toolbarProps } = t0;
 	const isMobileExperience = t1 === void 0 ? false : t1;
 	const projectName = t2 === void 0 ? "Project" : t2;
-	useBlockActionsShortcuts();
+	const sharedChrome = React.useContext(SharedChromeContext);
 	const iframeElement = useSelector(previewStore, _temp2);
 	const handleIframeReady = _temp3;
 	const viewportMode = useSelector(previewStore, _temp4);
@@ -134,7 +144,6 @@ const PreviewPanel = (t0) => {
 	} else t3 = $[1];
 	React.useEffect(_temp16, t3);
 	if (isMobileExperience) {
-		if (!page) return null;
 		let t4;
 		if ($[2] !== children) {
 			t4 = /* @__PURE__ */ jsx("div", {
@@ -149,31 +158,39 @@ const PreviewPanel = (t0) => {
 			$[3] = t4;
 		} else t4 = $[3];
 		let t5;
-		if ($[4] !== isToolbarHidden || $[5] !== page || $[6] !== projectName) {
-			t5 = !isToolbarHidden && /* @__PURE__ */ jsx(MobilePreviewDrawer, {
+		if ($[4] !== isToolbarHidden || $[5] !== page || $[6] !== projectName || $[7] !== sharedChrome || $[8] !== toolbarProps) {
+			t5 = !isToolbarHidden && (page ? /* @__PURE__ */ jsx(MobilePreviewDrawer, {
 				page,
 				projectName
-			});
+			}) : !sharedChrome && /* @__PURE__ */ jsx(PreviewToolbar, { ...toolbarProps }));
 			$[4] = isToolbarHidden;
 			$[5] = page;
 			$[6] = projectName;
-			$[7] = t5;
-		} else t5 = $[7];
+			$[7] = sharedChrome;
+			$[8] = toolbarProps;
+			$[9] = t5;
+		} else t5 = $[9];
 		let t6;
-		if ($[8] !== t4 || $[9] !== t5) {
+		if ($[10] !== t4 || $[11] !== t5) {
 			t6 = /* @__PURE__ */ jsxs(PanelContent, {
 				className: "flex min-h-0 flex-col overflow-hidden bg-black",
 				children: [t4, t5]
 			});
-			$[8] = t4;
-			$[9] = t5;
-			$[10] = t6;
-		} else t6 = $[10];
+			$[10] = t4;
+			$[11] = t5;
+			$[12] = t6;
+		} else t6 = $[12];
 		return t6;
 	}
 	let t4;
-	if ($[11] !== children || $[12] !== iframeElement || $[13] !== isEditMode || $[14] !== toolbarProps || $[15] !== viewportMode) {
-		t4 = /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(PanelContent, {
+	if ($[13] !== page) {
+		t4 = page && /* @__PURE__ */ jsx(CuratedBlockShortcuts, {});
+		$[13] = page;
+		$[14] = t4;
+	} else t4 = $[14];
+	let t5;
+	if ($[15] !== children || $[16] !== iframeElement || $[17] !== isEditMode || $[18] !== page || $[19] !== sharedChrome || $[20] !== toolbarProps || $[21] !== viewportMode) {
+		t5 = /* @__PURE__ */ jsx(PanelContent, {
 			className: "relative overflow-hidden bg-black",
 			children: /* @__PURE__ */ jsx("div", {
 				className: "absolute inset-0",
@@ -183,9 +200,12 @@ const PreviewPanel = (t0) => {
 						onIframeReady: handleIframeReady,
 						children
 					}),
-					isEditMode && /* @__PURE__ */ jsx(Overlays, { iframeElement }),
+					isEditMode && /* @__PURE__ */ jsx(Overlays, {
+						iframeElement,
+						canAddBlocks: !!page
+					}),
 					isEditMode && /* @__PURE__ */ jsx(FieldToolbar, {}),
-					/* @__PURE__ */ jsx(PreviewToolbar, { ...toolbarProps })
+					!sharedChrome && /* @__PURE__ */ jsx(PreviewToolbar, { ...toolbarProps })
 				] }) : /* @__PURE__ */ jsxs("div", {
 					className: cn("checkered flex h-full justify-center", isEditMode ? "items-start" : "items-center"),
 					children: [
@@ -195,22 +215,34 @@ const PreviewPanel = (t0) => {
 								className: "overflow-auto",
 								onIframeReady: handleIframeReady,
 								children
-							}), isEditMode && /* @__PURE__ */ jsx(Overlays, { iframeElement })]
+							}), isEditMode && /* @__PURE__ */ jsx(Overlays, {
+								iframeElement,
+								canAddBlocks: !!page
+							})]
 						}),
 						isEditMode && /* @__PURE__ */ jsx(FieldToolbar, {}),
-						/* @__PURE__ */ jsx(PreviewToolbar, { ...toolbarProps })
+						!sharedChrome && /* @__PURE__ */ jsx(PreviewToolbar, { ...toolbarProps })
 					]
 				})
 			})
-		}) });
-		$[11] = children;
-		$[12] = iframeElement;
-		$[13] = isEditMode;
-		$[14] = toolbarProps;
-		$[15] = viewportMode;
-		$[16] = t4;
-	} else t4 = $[16];
-	return t4;
+		});
+		$[15] = children;
+		$[16] = iframeElement;
+		$[17] = isEditMode;
+		$[18] = page;
+		$[19] = sharedChrome;
+		$[20] = toolbarProps;
+		$[21] = viewportMode;
+		$[22] = t5;
+	} else t5 = $[22];
+	let t6;
+	if ($[23] !== t4 || $[24] !== t5) {
+		t6 = /* @__PURE__ */ jsxs(Fragment, { children: [t4, t5] });
+		$[23] = t4;
+		$[24] = t5;
+		$[25] = t6;
+	} else t6 = $[25];
+	return t6;
 };
 function _temp(state) {
 	return state.context.actions;