camox 0.24.1 → 0.26.0

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

@@ -5,6 +5,7 @@ import { useProjectSlug } from "../../../lib/auth.js";
 import { blockMutations, blockQueries, projectQueries } from "../../../lib/queries.js";
 import { usePageBlocks } from "../../../lib/normalized-data.js";
 import { useCamoxApp } from "../../provider/components/CamoxAppContext.js";
+import { useRequireDraftSource } from "../../../core/hooks/useRequireDraftSource.js";
 import { usePreviewedPage } from "../CamoxPreview.js";
 import { c } from "react/compiler-runtime";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
@@ -18,15 +19,16 @@ import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, Command
 
 //#region src/features/preview/components/AddBlockSheet.tsx
 const AddBlockSheet = () => {
-	const $ = c(60);
-	if ($[0] !== "eaa0318b13b193e792904949c4da8d4db94d4d7cfdb3255f0c3d4b505c4a3f1f") {
-		for (let $i = 0; $i < 60; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "eaa0318b13b193e792904949c4da8d4db94d4d7cfdb3255f0c3d4b505c4a3f1f";
+	const $ = c(61);
+	if ($[0] !== "0320621570f40e4a7e82d65adec2727cd3960491c9729ac51b93474f1e682d5a") {
+		for (let $i = 0; $i < 61; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "0320621570f40e4a7e82d65adec2727cd3960491c9729ac51b93474f1e682d5a";
 	}
 	const [highlightedValue, setHighlightedValue] = React.useState("");
 	const queryClient = useQueryClient();
 	const { pathname } = useLocation();
 	const pagePathname = useSelector(previewStore, _temp) ?? pathname;
+	const requireDraft = useRequireDraftSource();
 	let t0;
 	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t0 = blockMutations.create();
@@ -37,11 +39,11 @@ const AddBlockSheet = () => {
 		t1 = {
 			...t0,
 			onMutate: (variables) => {
-				const pageQueryKey = queryKeys.pages.getByPath(pagePathname);
+				const pageQueryKey = queryKeys.pages.getByPath(pagePathname, "draft");
 				const previousPage = queryClient.getQueryData(pageQueryKey);
 				if (!previousPage) return {};
 				const blockIds = previousPage.page.blockIds;
-				const pageBlocks = blockIds.map((id) => queryClient.getQueryData(queryKeys.blocks.get(id))?.block).filter(_temp2);
+				const pageBlocks = blockIds.map((id) => queryClient.getQueryData(queryKeys.blocks.get(id, "draft"))?.block).filter(_temp2);
 				const { afterPosition } = variables;
 				let position;
 				if (afterPosition == null) {
@@ -74,7 +76,7 @@ const AddBlockSheet = () => {
 					createdAt: now,
 					updatedAt: now
 				};
-				queryClient.setQueryData(queryKeys.blocks.get(optimisticId), {
+				queryClient.setQueryData(queryKeys.blocks.get(optimisticId, "draft"), {
 					block: optimisticBlock,
 					repeatableItems: [],
 					files: []
@@ -97,11 +99,11 @@ const AddBlockSheet = () => {
 				};
 			},
 			onError: (_error, _variables, context) => {
-				if (context?.previousPage) queryClient.setQueryData(queryKeys.pages.getByPath(pagePathname), context.previousPage);
-				if (context?.optimisticId) queryClient.removeQueries({ queryKey: queryKeys.blocks.get(context.optimisticId) });
+				if (context?.previousPage) queryClient.setQueryData(queryKeys.pages.getByPath(pagePathname, "draft"), context.previousPage);
+				if (context?.optimisticId) queryClient.removeQueries({ queryKey: queryKeys.blocks.get(context.optimisticId, "draft") });
 			},
 			onSettled: () => {
-				queryClient.invalidateQueries({ queryKey: queryKeys.pages.getByPath(pagePathname) });
+				queryClient.invalidateQueries({ queryKey: queryKeys.pages.getByPath(pagePathname, "draft") });
 			}
 		};
 		$[2] = pagePathname;
@@ -165,9 +167,10 @@ const AddBlockSheet = () => {
 	const peekedBlockPosition = useSelector(previewStore, _temp5);
 	const addBlockSource = useSelector(previewStore, _temp6);
 	let t9;
-	if ($[17] !== addBlockSource || $[18] !== createBlock || $[19] !== page || $[20] !== pageBlocks_0 || $[21] !== peekedBlockPosition) {
+	if ($[17] !== addBlockSource || $[18] !== createBlock || $[19] !== page || $[20] !== pageBlocks_0 || $[21] !== peekedBlockPosition || $[22] !== requireDraft) {
 		t9 = async (block_0) => {
 			if (!page) return;
+			if (!requireDraft()) return;
 			const afterPosition_0 = peekedBlockPosition === "" ? "" : peekedBlockPosition ?? pageBlocks_0[pageBlocks_0.length - 1]?.position;
 			const bundle = block_0._internal.getInitialBundle();
 			const { id: blockId } = await createBlock.mutateAsync({
@@ -193,11 +196,12 @@ const AddBlockSheet = () => {
 		$[19] = page;
 		$[20] = pageBlocks_0;
 		$[21] = peekedBlockPosition;
-		$[22] = t9;
-	} else t9 = $[22];
+		$[22] = requireDraft;
+		$[23] = t9;
+	} else t9 = $[23];
 	const handleAddBlock = t9;
 	let t10;
-	if ($[23] !== pageBlocks_0 || $[24] !== peekedBlockPosition) {
+	if ($[24] !== pageBlocks_0 || $[25] !== peekedBlockPosition) {
 		t10 = (block_1) => {
 			const afterPosition_1 = peekedBlockPosition === "" ? "" : peekedBlockPosition ?? pageBlocks_0[pageBlocks_0.length - 1]?.position;
 			previewStore.send({
@@ -206,10 +210,10 @@ const AddBlockSheet = () => {
 				afterPosition: afterPosition_1
 			});
 		};
-		$[23] = pageBlocks_0;
-		$[24] = peekedBlockPosition;
-		$[25] = t10;
-	} else t10 = $[25];
+		$[24] = pageBlocks_0;
+		$[25] = peekedBlockPosition;
+		$[26] = t10;
+	} else t10 = $[26];
 	const handlePreviewBlock = t10;
 	const handleValueChange = (value) => {
 		setHighlightedValue(value);
@@ -220,70 +224,70 @@ const AddBlockSheet = () => {
 	const handleOpenChange = _temp7;
 	let t11;
 	let t12;
-	if ($[26] !== isOpen) {
+	if ($[27] !== isOpen) {
 		t11 = () => {
 			if (isOpen) setHighlightedValue("");
 		};
 		t12 = [isOpen];
-		$[26] = isOpen;
-		$[27] = t11;
-		$[28] = t12;
+		$[27] = isOpen;
+		$[28] = t11;
+		$[29] = t12;
 	} else {
-		t11 = $[27];
-		t12 = $[28];
+		t11 = $[28];
+		t12 = $[29];
 	}
 	React.useEffect(t11, t12);
 	let t13;
-	if ($[29] !== pageCounts || $[30] !== totalCounts) {
+	if ($[30] !== pageCounts || $[31] !== totalCounts) {
 		t13 = (blockId_0) => {
 			const total = totalCounts[blockId_0] ?? 0;
 			if (total === 0) return "Never used";
 			const page_0 = pageCounts[blockId_0] ?? "none";
 			return `${total} use${total > 1 ? "s" : ""} (${page_0} here)`;
 		};
-		$[29] = pageCounts;
-		$[30] = totalCounts;
-		$[31] = t13;
-	} else t13 = $[31];
+		$[30] = pageCounts;
+		$[31] = totalCounts;
+		$[32] = t13;
+	} else t13 = $[32];
 	const displayCount = t13;
 	const T0 = PreviewSideSheet;
 	const t14 = "flex flex-col gap-0";
 	let t15;
-	if ($[32] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
 		t15 = /* @__PURE__ */ jsxs(Sheet.SheetHeader, {
 			className: "border-border border-b",
 			children: [/* @__PURE__ */ jsx(Sheet.SheetTitle, { children: "Add new block" }), /* @__PURE__ */ jsx(Sheet.SheetDescription, { children: "Search and select a block to add to the page." })]
 		});
-		$[32] = t15;
-	} else t15 = $[32];
+		$[33] = t15;
+	} else t15 = $[33];
 	const t16 = "flex-1 overflow-auto p-2";
 	const T1 = Command;
 	const t17 = "overflow-visible";
 	const t18 = _temp8;
 	let t19;
-	if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
 		t19 = /* @__PURE__ */ jsx(CommandInput, {
 			placeholder: "Search blocks...",
 			autoFocus: true
 		});
-		$[33] = t19;
-	} else t19 = $[33];
+		$[34] = t19;
+	} else t19 = $[34];
 	const T2 = CommandList;
 	const t20 = "mt-1 max-h-full";
 	let t21;
-	if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[35] === Symbol.for("react.memo_cache_sentinel")) {
 		t21 = /* @__PURE__ */ jsx(CommandEmpty, { children: "No blocks found." });
-		$[34] = t21;
-	} else t21 = $[34];
+		$[35] = t21;
+	} else t21 = $[35];
 	const T3 = CommandGroup;
 	let t22;
-	if ($[35] !== totalCounts) {
+	if ($[36] !== totalCounts) {
 		t22 = (a, b_3) => (totalCounts[b_3._internal.id] ?? 0) - (totalCounts[a._internal.id] ?? 0);
-		$[35] = totalCounts;
-		$[36] = t22;
-	} else t22 = $[36];
+		$[36] = totalCounts;
+		$[37] = t22;
+	} else t22 = $[37];
 	let t23;
-	if ($[37] !== displayCount || $[38] !== handleAddBlock) {
+	if ($[38] !== displayCount || $[39] !== handleAddBlock) {
 		t23 = (block_3) => /* @__PURE__ */ jsx(CommandItem, {
 			value: block_3._internal.title,
 			onSelect: () => {
@@ -298,31 +302,31 @@ const AddBlockSheet = () => {
 				})]
 			})
 		}, block_3._internal.id);
-		$[37] = displayCount;
-		$[38] = handleAddBlock;
-		$[39] = t23;
-	} else t23 = $[39];
+		$[38] = displayCount;
+		$[39] = handleAddBlock;
+		$[40] = t23;
+	} else t23 = $[40];
 	const t24 = availableBlocks.sort(t22).map(t23);
 	let t25;
-	if ($[40] !== T3 || $[41] !== t24) {
+	if ($[41] !== T3 || $[42] !== t24) {
 		t25 = /* @__PURE__ */ jsx(T3, { children: t24 });
-		$[40] = T3;
-		$[41] = t24;
-		$[42] = t25;
-	} else t25 = $[42];
+		$[41] = T3;
+		$[42] = t24;
+		$[43] = t25;
+	} else t25 = $[43];
 	let t26;
-	if ($[43] !== T2 || $[44] !== t21 || $[45] !== t25) {
+	if ($[44] !== T2 || $[45] !== t21 || $[46] !== t25) {
 		t26 = /* @__PURE__ */ jsxs(T2, {
 			className: t20,
 			children: [t21, t25]
 		});
-		$[43] = T2;
-		$[44] = t21;
-		$[45] = t25;
-		$[46] = t26;
-	} else t26 = $[46];
+		$[44] = T2;
+		$[45] = t21;
+		$[46] = t25;
+		$[47] = t26;
+	} else t26 = $[47];
 	let t27;
-	if ($[47] !== T1 || $[48] !== handleValueChange || $[49] !== highlightedValue || $[50] !== t18 || $[51] !== t19 || $[52] !== t26) {
+	if ($[48] !== T1 || $[49] !== handleValueChange || $[50] !== highlightedValue || $[51] !== t18 || $[52] !== t19 || $[53] !== t26) {
 		t27 = /* @__PURE__ */ jsx("div", {
 			className: t16,
 			children: /* @__PURE__ */ jsxs(T1, {
@@ -333,29 +337,29 @@ const AddBlockSheet = () => {
 				children: [t19, t26]
 			})
 		});
-		$[47] = T1;
-		$[48] = handleValueChange;
-		$[49] = highlightedValue;
-		$[50] = t18;
-		$[51] = t19;
-		$[52] = t26;
-		$[53] = t27;
-	} else t27 = $[53];
+		$[48] = T1;
+		$[49] = handleValueChange;
+		$[50] = highlightedValue;
+		$[51] = t18;
+		$[52] = t19;
+		$[53] = t26;
+		$[54] = t27;
+	} else t27 = $[54];
 	let t28;
-	if ($[54] !== T0 || $[55] !== handleOpenChange || $[56] !== isOpen || $[57] !== t15 || $[58] !== t27) {
+	if ($[55] !== T0 || $[56] !== handleOpenChange || $[57] !== isOpen || $[58] !== t15 || $[59] !== t27) {
 		t28 = /* @__PURE__ */ jsxs(T0, {
 			open: isOpen,
 			onOpenChange: handleOpenChange,
 			className: t14,
 			children: [t15, t27]
 		});
-		$[54] = T0;
-		$[55] = handleOpenChange;
-		$[56] = isOpen;
-		$[57] = t15;
-		$[58] = t27;
-		$[59] = t28;
-	} else t28 = $[59];
+		$[55] = T0;
+		$[56] = handleOpenChange;
+		$[57] = isOpen;
+		$[58] = t15;
+		$[59] = t27;
+		$[60] = t28;
+	} else t28 = $[60];
 	return t28;
 };
 function _temp(state) {

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

@@ -12,10 +12,10 @@ import { useMutation, useQuery } from "@tanstack/react-query";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@camox/ui/button";
+import { Switch } from "@camox/ui/switch";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@camox/ui/tooltip";
 import { Check, Download, FileIcon, Info, Link, Loader2, Trash2, X } from "lucide-react";
 import { Dialog, DialogContent, DialogTitle } from "@camox/ui/dialog";
-import { Switch } from "@camox/ui/switch";
 import { ButtonGroup } from "@camox/ui/button-group";
 
 //#region src/features/preview/components/AssetLightbox.tsx

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

@@ -5,6 +5,7 @@ import { blockMutations, repeatableItemMutations } from "../../../lib/queries.js
 import { formatShortcut } from "../../../lib/utils.js";
 import { usePageBlocks } from "../../../lib/normalized-data.js";
 import { useCamoxApp } from "../../provider/components/CamoxAppContext.js";
+import { useRequireDraftSource } from "../../../core/hooks/useRequireDraftSource.js";
 import { useUpdateBlockPosition } from "./useUpdateBlockPosition.js";
 import { usePreviewedPage } from "../CamoxPreview.js";
 import { c } from "react/compiler-runtime";
@@ -277,15 +278,16 @@ function isLayoutBlockId(page, blockId) {
 	return new Set([...page.layout.beforeBlockIds, ...page.layout.afterBlockIds]).has(blockId);
 }
 function useBlockActionsShortcuts() {
-	const $ = c(18);
-	if ($[0] !== "0da04562301d59bc2d765af3fb0de3a8d133aacfaa39cfb8bfd25dbd31bf0320") {
-		for (let $i = 0; $i < 18; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "0da04562301d59bc2d765af3fb0de3a8d133aacfaa39cfb8bfd25dbd31bf0320";
+	const $ = c(20);
+	if ($[0] !== "040883a85a53eb481b8e8bc8c871b7bd284c1089502a38f1dfd9b09fbc6d8c28") {
+		for (let $i = 0; $i < 20; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "040883a85a53eb481b8e8bc8c871b7bd284c1089502a38f1dfd9b09fbc6d8c28";
 	}
 	const camoxApp = useCamoxApp();
 	const page = usePreviewedPage();
 	const { pageBlocks } = usePageBlocks(page);
 	const selection = useSelector(previewStore, _temp);
+	const requireDraft = useRequireDraftSource();
 	let t0;
 	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t0 = blockMutations.delete();
@@ -312,7 +314,7 @@ function useBlockActionsShortcuts() {
 	} else t3 = $[4];
 	const duplicateRepeatableItem = useMutation(t3);
 	let t4;
-	if ($[5] !== deleteBlockMutation || $[6] !== deleteRepeatableItem || $[7] !== duplicateBlockMutation || $[8] !== duplicateRepeatableItem || $[9] !== page || $[10] !== pageBlocks || $[11] !== updatePositionMutation) {
+	if ($[5] !== deleteBlockMutation || $[6] !== deleteRepeatableItem || $[7] !== duplicateBlockMutation || $[8] !== duplicateRepeatableItem || $[9] !== page || $[10] !== pageBlocks || $[11] !== requireDraft || $[12] !== updatePositionMutation) {
 		t4 = () => {
 			const actions = [
 				{
@@ -325,7 +327,8 @@ function useBlockActionsShortcuts() {
 					},
 					checkIfAvailable: () => {
 						const ctx = previewStore.getSnapshot().context;
-						if (ctx.isContentLocked || ctx.isPresentationMode) return false;
+						if (ctx.isContentLocked && ctx.previewSource === "draft") return false;
+						if (ctx.isPresentationMode) return false;
 						const sel = ctx.selection;
 						if (!sel) return false;
 						if (isLayoutBlockId(page, sel.blockId)) return false;
@@ -343,6 +346,7 @@ function useBlockActionsShortcuts() {
 						return pageBlocks.length > 1;
 					},
 					execute: () => {
+						if (!requireDraft()) return;
 						const sel_0 = previewStore.getSnapshot().context.selection;
 						if (!sel_0) return;
 						const itemId_0 = selectionItemId(sel_0);
@@ -366,13 +370,15 @@ function useBlockActionsShortcuts() {
 					},
 					checkIfAvailable: () => {
 						const ctx_0 = previewStore.getSnapshot().context;
-						if (ctx_0.isContentLocked || ctx_0.isPresentationMode) return false;
+						if (ctx_0.isContentLocked && ctx_0.previewSource === "draft") return false;
+						if (ctx_0.isPresentationMode) return false;
 						const sel_1 = ctx_0.selection;
 						if (!sel_1) return false;
 						if (isLayoutBlockId(page, sel_1.blockId)) return false;
 						return true;
 					},
 					execute: () => {
+						if (!requireDraft()) return;
 						const sel_2 = previewStore.getSnapshot().context.selection;
 						if (!sel_2) return;
 						const itemId_1 = selectionItemId(sel_2);
@@ -394,13 +400,15 @@ function useBlockActionsShortcuts() {
 					},
 					checkIfAvailable: () => {
 						const ctx_1 = previewStore.getSnapshot().context;
-						if (ctx_1.isContentLocked || ctx_1.isPresentationMode) return false;
+						if (ctx_1.isContentLocked && ctx_1.previewSource === "draft") return false;
+						if (ctx_1.isPresentationMode) return false;
 						const sel_3 = ctx_1.selection;
 						if (!sel_3 || !page) return false;
 						if (isLayoutBlockId(page, sel_3.blockId)) return false;
 						return pageBlocks.findIndex((b_2) => b_2.id === sel_3.blockId) > 0;
 					},
 					execute: () => {
+						if (!requireDraft()) return;
 						const sel_4 = previewStore.getSnapshot().context.selection;
 						if (!sel_4 || !page) return;
 						const index_0 = pageBlocks.findIndex((b_3) => b_3.id === sel_4.blockId);
@@ -424,7 +432,8 @@ function useBlockActionsShortcuts() {
 					},
 					checkIfAvailable: () => {
 						const ctx_2 = previewStore.getSnapshot().context;
-						if (ctx_2.isContentLocked || ctx_2.isPresentationMode) return false;
+						if (ctx_2.isContentLocked && ctx_2.previewSource === "draft") return false;
+						if (ctx_2.isPresentationMode) return false;
 						const sel_5 = ctx_2.selection;
 						if (!sel_5 || !page) return false;
 						if (isLayoutBlockId(page, sel_5.blockId)) return false;
@@ -432,6 +441,7 @@ function useBlockActionsShortcuts() {
 						return index_1 !== -1 && index_1 < pageBlocks.length - 1;
 					},
 					execute: () => {
+						if (!requireDraft()) return;
 						const sel_6 = previewStore.getSnapshot().context.selection;
 						if (!sel_6 || !page) return;
 						const index_2 = pageBlocks.findIndex((b_5) => b_5.id === sel_6.blockId);
@@ -452,6 +462,7 @@ function useBlockActionsShortcuts() {
 					shortcut: { key: "o" },
 					checkIfAvailable: _temp10,
 					execute: () => {
+						if (!requireDraft()) return;
 						const sel_7 = previewStore.getSnapshot().context.selection;
 						if (!sel_7 || !page) return;
 						const block_2 = pageBlocks.find((b_6) => b_6.id === sel_7.blockId);
@@ -473,6 +484,7 @@ function useBlockActionsShortcuts() {
 					},
 					checkIfAvailable: _temp11,
 					execute: () => {
+						if (!requireDraft()) return;
 						const sel_8 = previewStore.getSnapshot().context.selection;
 						if (!sel_8 || !page) return;
 						const blockIndex = pageBlocks.findIndex((b_7) => b_7.id === sel_8.blockId);
@@ -503,23 +515,26 @@ function useBlockActionsShortcuts() {
 		$[8] = duplicateRepeatableItem;
 		$[9] = page;
 		$[10] = pageBlocks;
-		$[11] = updatePositionMutation;
-		$[12] = t4;
-	} else t4 = $[12];
+		$[11] = requireDraft;
+		$[12] = updatePositionMutation;
+		$[13] = t4;
+	} else t4 = $[13];
 	let t5;
-	if ($[13] !== camoxApp || $[14] !== page || $[15] !== pageBlocks || $[16] !== selection) {
+	if ($[14] !== camoxApp || $[15] !== page || $[16] !== pageBlocks || $[17] !== requireDraft || $[18] !== selection) {
 		t5 = [
 			selection,
 			page,
 			pageBlocks,
-			camoxApp
+			camoxApp,
+			requireDraft
 		];
-		$[13] = camoxApp;
-		$[14] = page;
-		$[15] = pageBlocks;
-		$[16] = selection;
-		$[17] = t5;
-	} else t5 = $[17];
+		$[14] = camoxApp;
+		$[15] = page;
+		$[16] = pageBlocks;
+		$[17] = requireDraft;
+		$[18] = selection;
+		$[19] = t5;
+	} else t5 = $[19];
 	React.useEffect(t4, t5);
 }
 function _temp12(a) {
@@ -527,12 +542,14 @@ function _temp12(a) {
 }
 function _temp11() {
 	const ctx_4 = previewStore.getSnapshot().context;
-	if (ctx_4.isContentLocked || ctx_4.isPresentationMode) return false;
+	if (ctx_4.isContentLocked && ctx_4.previewSource === "draft") return false;
+	if (ctx_4.isPresentationMode) return false;
 	return ctx_4.selection !== null;
 }
 function _temp10() {
 	const ctx_3 = previewStore.getSnapshot().context;
-	if (ctx_3.isContentLocked || ctx_3.isPresentationMode) return false;
+	if (ctx_3.isContentLocked && ctx_3.previewSource === "draft") return false;
+	if (ctx_3.isPresentationMode) return false;
 	return ctx_3.selection !== null;
 }
 function _temp1() {

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

@@ -0,0 +1,66 @@
+import { previewStore } from "../previewStore.js";
+import { c } from "react/compiler-runtime";
+import { useSelector } from "@xstate/store-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "@camox/ui/alert-dialog";
+
+//#region src/features/preview/components/DraftSwitchDialog.tsx
+/**
+* Global confirmation that the user wants to leave a non-draft preview
+* before editing. The CTA only flips `previewSource` to `'draft'` — the
+* original edit attempt is intentionally NOT replayed; the user re-issues it
+* once back on draft. This keeps the action explicit and avoids "magical"
+* delayed edits the user might no longer want.
+*/
+function DraftSwitchDialog() {
+	const $ = c(5);
+	if ($[0] !== "3be875184f6abab2ae16a64fbececa2389b1e6a2f4ea614823966b8277e4826b") {
+		for (let $i = 0; $i < 5; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "3be875184f6abab2ae16a64fbececa2389b1e6a2f4ea614823966b8277e4826b";
+	}
+	const open = useSelector(previewStore, _temp);
+	let t0;
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [/* @__PURE__ */ jsx(AlertDialogTitle, { children: "Switch to draft to edit?" }), /* @__PURE__ */ jsx(AlertDialogDescription, { children: "You're previewing the live version. Switch to the draft to make changes." })] });
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = /* @__PURE__ */ jsxs(AlertDialogContent, { children: [t0, /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [/* @__PURE__ */ jsx(AlertDialogCancel, {
+			variant: "outline",
+			size: "default",
+			children: "Cancel"
+		}), /* @__PURE__ */ jsx(AlertDialogAction, {
+			onClick: _temp3,
+			children: "Switch to draft"
+		})] })] });
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] !== open) {
+		t2 = /* @__PURE__ */ jsx(AlertDialog, {
+			open,
+			onOpenChange: _temp2,
+			children: t1
+		});
+		$[3] = open;
+		$[4] = t2;
+	} else t2 = $[4];
+	return t2;
+}
+function _temp3() {
+	previewStore.send({
+		type: "setPreviewSource",
+		source: "draft"
+	});
+	previewStore.send({ type: "dismissDraftSwitch" });
+}
+function _temp2(next) {
+	if (!next) previewStore.send({ type: "dismissDraftSwitch" });
+}
+function _temp(state) {
+	return state.context.isDraftSwitchDialogOpen;
+}
+
+//#endregion
+export { DraftSwitchDialog };

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

@@ -17,6 +17,7 @@ import { useSelector } from "@xstate/store-react";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@camox/ui/button";
+import { Switch } from "@camox/ui/switch";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@camox/ui/tooltip";
 import { Globe, Info, Trash2, Upload } from "lucide-react";
 import { Spinner } from "@camox/ui/spinner";
@@ -24,14 +25,13 @@ import { Alert, AlertDescription, AlertTitle } from "@camox/ui/alert";
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@camox/ui/dialog";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@camox/ui/select";
 import { useForm } from "@tanstack/react-form";
-import { Switch } from "@camox/ui/switch";
 
 //#region src/features/preview/components/EditPageModal.tsx
 const EditPageModal = () => {
 	const $ = c(3);
-	if ($[0] !== "4cfb98531a98e3bc48da0686012d88a786d8b22d52089109158bebc149d3d37c") {
+	if ($[0] !== "dfed49772fc493ebb158f0892caae2776e9f3903bcc54115d8f549c2a9beee89") {
 		for (let $i = 0; $i < 3; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "4cfb98531a98e3bc48da0686012d88a786d8b22d52089109158bebc149d3d37c";
+		$[0] = "dfed49772fc493ebb158f0892caae2776e9f3903bcc54115d8f549c2a9beee89";
 	}
 	const editingPageId = useSelector(previewStore, _temp);
 	let t0;
@@ -303,9 +303,9 @@ function truncateText(text, maxLen) {
 }
 const SearchEnginePreview = (t0) => {
 	const $ = c(17);
-	if ($[0] !== "4cfb98531a98e3bc48da0686012d88a786d8b22d52089109158bebc149d3d37c") {
+	if ($[0] !== "dfed49772fc493ebb158f0892caae2776e9f3903bcc54115d8f549c2a9beee89") {
 		for (let $i = 0; $i < 17; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "4cfb98531a98e3bc48da0686012d88a786d8b22d52089109158bebc149d3d37c";
+		$[0] = "dfed49772fc493ebb158f0892caae2776e9f3903bcc54115d8f549c2a9beee89";
 	}
 	const { page, metaTitle, metaDescription } = t0;
 	const url = `${typeof window !== "undefined" ? window.location.origin : ""}${page.fullPath}`;
@@ -388,9 +388,9 @@ const SearchEnginePreview = (t0) => {
 };
 const SocialPreviewSection = (t0) => {
 	const $ = c(60);
-	if ($[0] !== "4cfb98531a98e3bc48da0686012d88a786d8b22d52089109158bebc149d3d37c") {
+	if ($[0] !== "dfed49772fc493ebb158f0892caae2776e9f3903bcc54115d8f549c2a9beee89") {
 		for (let $i = 0; $i < 60; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "4cfb98531a98e3bc48da0686012d88a786d8b22d52089109158bebc149d3d37c";
+		$[0] = "dfed49772fc493ebb158f0892caae2776e9f3903bcc54115d8f549c2a9beee89";
 	}
 	const { page, metaTitle, metaDescription, layoutId, projectName } = t0;
 	const pageMetaTitle = page.metaTitle ?? page.pathSegment;
@@ -664,9 +664,9 @@ const SocialPreviewSection = (t0) => {
 };
 const PageMarkdownPreview = (t0) => {
 	const $ = c(9);
-	if ($[0] !== "4cfb98531a98e3bc48da0686012d88a786d8b22d52089109158bebc149d3d37c") {
+	if ($[0] !== "dfed49772fc493ebb158f0892caae2776e9f3903bcc54115d8f549c2a9beee89") {
 		for (let $i = 0; $i < 9; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "4cfb98531a98e3bc48da0686012d88a786d8b22d52089109158bebc149d3d37c";
+		$[0] = "dfed49772fc493ebb158f0892caae2776e9f3903bcc54115d8f549c2a9beee89";
 	}
 	const { pageId, metaTitle, metaDescription } = t0;
 	let t1;

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

@@ -10,9 +10,9 @@ import { useQuery } from "@tanstack/react-query";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@camox/ui/button";
+import { Switch } from "@camox/ui/switch";
 import { Check, ChevronsUpDown } from "lucide-react";
 import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "@camox/ui/command";
-import { Switch } from "@camox/ui/switch";
 import { Tabs, TabsList, TabsTrigger } from "@camox/ui/tabs";
 
 //#region src/features/preview/components/LinkFieldEditor.tsx

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

@@ -9,9 +9,9 @@ import * as React from "react";
 //#region src/features/preview/components/Overlays.tsx
 const Overlays = (t0) => {
 	const $ = c(15);
-	if ($[0] !== "1bd993485c8b6ef80e5869cbd59723cb7bd4d85cf57877fd5be25c69a7427872") {
+	if ($[0] !== "6b8884e7d682d7edd8d7ea97e0dfb6a690c2fd0b3e00f8e55354ffd5d743702c") {
 		for (let $i = 0; $i < 15; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "1bd993485c8b6ef80e5869cbd59723cb7bd4d85cf57877fd5be25c69a7427872";
+		$[0] = "6b8884e7d682d7edd8d7ea97e0dfb6a690c2fd0b3e00f8e55354ffd5d743702c";
 	}
 	const { iframeElement } = t0;
 	const isPageContentSheetOpen = useSelector(previewStore, _temp);
@@ -26,6 +26,10 @@ const Overlays = (t0) => {
 				if (!isOverlayMessage(event.data)) return;
 				const message = event.data;
 				if (message.type === "CAMOX_ADD_BLOCK_REQUEST") {
+					if (previewStore.getSnapshot().context.previewSource !== "draft") {
+						previewStore.send({ type: "requestDraftSwitch" });
+						return;
+					}
 					const { blockPosition, insertPosition } = message;
 					let afterPosition = null;
 					if (message.afterPosition !== void 0) afterPosition = message.afterPosition;