camox 0.11.0 → 0.13.0

package/dist/core/components/lexical/InlineLexicalEditor.js

@@ -10,7 +10,7 @@ import { LexicalComposer } from "@lexical/react/LexicalComposer";
 import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
 import { OnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
 import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
-import { COMMAND_PRIORITY_LOW, KEY_ESCAPE_COMMAND } from "lexical";
+import { COMMAND_PRIORITY_LOW, INSERT_LINE_BREAK_COMMAND, KEY_ENTER_COMMAND, KEY_ESCAPE_COMMAND } from "lexical";
 
 //#region src/core/components/lexical/InlineLexicalEditor.tsx
 function ExternalStateSync(t0) {
@@ -89,6 +89,28 @@ function EscapeHandler() {
 	React.useEffect(t0, t1);
 	return null;
 }
+function EnterAsLineBreakHandler() {
+	const $ = c(3);
+	const [editor] = useLexicalComposerContext();
+	let t0;
+	let t1;
+	if ($[0] !== editor) {
+		t0 = () => editor.registerCommand(KEY_ENTER_COMMAND, (event) => {
+			event?.preventDefault();
+			editor.dispatchCommand(INSERT_LINE_BREAK_COMMAND, false);
+			return true;
+		}, COMMAND_PRIORITY_LOW);
+		t1 = [editor];
+		$[0] = editor;
+		$[1] = t0;
+		$[2] = t1;
+	} else {
+		t0 = $[1];
+		t1 = $[2];
+	}
+	React.useEffect(t0, t1);
+	return null;
+}
 function FocusBlurHandler(t0) {
 	const $ = c(5);
 	const { onFocus, onBlur } = t0;
@@ -157,6 +179,7 @@ function InlineLexicalEditor({ initialState, externalState, onChange, onFocus, o
 			/* @__PURE__ */ jsx(OnChangePlugin, { onChange: handleChange }),
 			/* @__PURE__ */ jsx(ExternalStateSync, { externalState }),
 			/* @__PURE__ */ jsx(EscapeHandler, {}),
+			/* @__PURE__ */ jsx(EnterAsLineBreakHandler, {}),
 			/* @__PURE__ */ jsx(FocusBlurHandler, {
 				onFocus: handleFocus,
 				onBlur: handleBlur

package/dist/core/components/lexical/SidebarLexicalEditor.js

@@ -8,9 +8,32 @@ import { LexicalComposer } from "@lexical/react/LexicalComposer";
 import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
 import { OnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
 import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
+import { COMMAND_PRIORITY_LOW, INSERT_LINE_BREAK_COMMAND, KEY_ENTER_COMMAND } from "lexical";
 import { ContentEditable } from "@lexical/react/LexicalContentEditable";
 
 //#region src/core/components/lexical/SidebarLexicalEditor.tsx
+function EnterAsLineBreakHandler() {
+	const $ = c(3);
+	const [editor] = useLexicalComposerContext();
+	let t0;
+	let t1;
+	if ($[0] !== editor) {
+		t0 = () => editor.registerCommand(KEY_ENTER_COMMAND, (event) => {
+			event?.preventDefault();
+			editor.dispatchCommand(INSERT_LINE_BREAK_COMMAND, false);
+			return true;
+		}, COMMAND_PRIORITY_LOW);
+		t1 = [editor];
+		$[0] = editor;
+		$[1] = t0;
+		$[2] = t1;
+	} else {
+		t0 = $[1];
+		t1 = $[2];
+	}
+	React.useEffect(t0, t1);
+	return null;
+}
 function ExternalStateSync(t0) {
 	const $ = c(5);
 	const { value, isSyncingRef } = t0;
@@ -82,7 +105,8 @@ function SidebarLexicalEditor({ id, value, onChange, onFocus, onBlur }) {
 			/* @__PURE__ */ jsx(ExternalStateSync, {
 				value,
 				isSyncingRef
-			})
+			}),
+			/* @__PURE__ */ jsx(EnterAsLineBreakHandler, {})
 		]
 	});
 }

package/dist/core/createBlock.d.ts

@@ -26,8 +26,11 @@ interface CreateBlockOptions<TSchemaShape extends Record<string, TSchema> = Reco
    * content: {
    *   title: Type.String({ default: 'Hello' }),
    *   items: Type.RepeatableItem({
-   *     name: Type.String({ default: 'Item' })
-   *   }, { minItems: 1, maxItems: 10 })
+   *     content: { name: Type.String({ default: 'Item' }) },
+   *     minItems: 1,
+   *     maxItems: 10,
+   *     toMarkdown: (c) => [c.name],
+   *   })
    * }
    */
   content: TSchemaShape;

package/dist/core/lib/contentType.d.ts

@@ -93,15 +93,18 @@ declare const Type$1: {
    *
    * @example
    * Type.RepeatableItem({
-   *   title: Type.String({ default: 'Item' }),
-   *   description: Type.String({ default: 'Description' })
-   * }, {
+   *   content: {
+   *     title: Type.String({ default: 'Item' }),
+   *     description: Type.String({ default: 'Description' }),
+   *   },
    *   minItems: 1,
    *   maxItems: 10,
-   *   title: 'Items'
+   *   title: 'Items',
+   *   toMarkdown: (c) => [`### ${c.title}`, c.description],
    * })
    */
-  RepeatableItem: <T extends Record<string, TSchema>>(shape: T, options: {
+  RepeatableItem: <T extends Record<string, TSchema>>(options: {
+    content: T;
     minItems: number;
     maxItems: number;
     title?: string;

package/dist/core/lib/contentType.js

@@ -96,9 +96,9 @@ const Type$1 = {
 			fieldType: "String"
 		});
 	},
-	RepeatableItem: (shape, options) => {
+	RepeatableItem: (options) => {
 		if (options.minItems < 1) throw new Error("RepeatableItem requires minItems to be at least 1");
-		const objectSchema = Type.Object(shape);
+		const objectSchema = Type.Object(options.content);
 		const defaultItem = {};
 		for (const [key, prop] of Object.entries(objectSchema.properties)) if ("default" in prop) defaultItem[key] = prop.default;
 		const defaultArray = Array(options.minItems).fill(null).map(() => ({ ...defaultItem }));

package/dist/core/lib/lexicalReact.js

@@ -14,8 +14,14 @@ function markdownToReactNodes(value) {
 	let lastIndex = 0;
 	let match;
 	let key = 0;
+	const pushWithLineBreaks = (text) => {
+		text.split("\n").forEach((line, i) => {
+			if (i > 0) parts.push(/* @__PURE__ */ jsx("br", {}, key++));
+			if (line) parts.push(line);
+		});
+	};
 	while ((match = regex.exec(value)) !== null) {
-		if (match.index > lastIndex) parts.push(value.slice(lastIndex, match.index));
+		if (match.index > lastIndex) pushWithLineBreaks(value.slice(lastIndex, match.index));
 		const stars = match[1].length;
 		const content = match[2];
 		if (stars === 3) parts.push(/* @__PURE__ */ jsx("strong", { children: /* @__PURE__ */ jsx("em", { children: content }) }, key++));
@@ -23,7 +29,7 @@ function markdownToReactNodes(value) {
 		else parts.push(/* @__PURE__ */ jsx("em", { children: content }, key++));
 		lastIndex = match.index + match[0].length;
 	}
-	if (lastIndex < value.length) parts.push(value.slice(lastIndex));
+	if (lastIndex < value.length) pushWithLineBreaks(value.slice(lastIndex));
 	if (parts.length === 0) return value;
 	return /* @__PURE__ */ jsx(Fragment, { children: parts });
 }

package/dist/core/lib/lexicalState.js

@@ -38,7 +38,7 @@ function extractMarkdown(node) {
 function markdownToLexicalState(markdown) {
 	return { root: {
 		children: markdown.split(/\n\n+/).map((para) => ({
-			children: parseInlineMarkdown(para),
+			children: parseParagraphWithLineBreaks(para),
 			direction: "ltr",
 			format: "",
 			indent: 0,
@@ -54,6 +54,18 @@ function markdownToLexicalState(markdown) {
 		version: 1
 	} };
 }
+function parseParagraphWithLineBreaks(para) {
+	const lines = para.split("\n");
+	const nodes = [];
+	lines.forEach((line, index) => {
+		if (index > 0) nodes.push({
+			type: "linebreak",
+			version: 1
+		});
+		nodes.push(...parseInlineMarkdown(line));
+	});
+	return nodes;
+}
 function parseInlineMarkdown(text) {
 	const segments = [];
 	const regex = /(\*{1,3})((?:(?!\1).)+)\1/g;

package/dist/features/preview/CamoxPreview.js

@@ -306,7 +306,7 @@ const CamoxPreview = (t0) => {
 			const actions = [
 				{
 					id: "enter-presentation-mode",
-					label: "Enter presentation mode",
+					label: "Hide Camox Studio",
 					groupLabel: "Preview",
 					checkIfAvailable: () => isAuthenticated && !isPresentationMode,
 					execute: _temp4,
@@ -317,12 +317,12 @@ const CamoxPreview = (t0) => {
 				},
 				{
 					id: "exit-presentation-mode",
-					label: "Exit presentation mode",
+					label: "",
 					groupLabel: "Preview",
 					checkIfAvailable: () => isAuthenticated && isPresentationMode,
 					execute: _temp5,
 					shortcut: {
-						key: "Escape",
+						key: "Enter",
 						withMeta: true
 					}
 				},

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

@@ -305,7 +305,7 @@ const SearchEnginePreview = (t0) => {
 			children: [t1, /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
 				delay: 50,
 				render: /* @__PURE__ */ jsx(Info, { className: "text-muted-foreground size-3.5" })
-			}), /* @__PURE__ */ jsx(TooltipContent, { children: "Titles are cropped after 60 characters and descriptions after 155, like Google typically does." })] })]
+			}), /* @__PURE__ */ jsx(TooltipContent, { children: "Titles are cropped after 60 characters and descriptions after 155, like on Google Search results." })] })]
 		});
 		$[1] = t2;
 	} else t2 = $[1];

package/dist/features/preview/components/{TextFormatToolbar.js → FieldToolbar.js}

@@ -1,6 +1,6 @@
 import { previewStore } from "../previewStore.js";
 import { useIsPreviewSheetOpen } from "./PreviewSideSheet.js";
-import { cn } from "../../../lib/utils.js";
+import { cn, formatShortcut } from "../../../lib/utils.js";
 import { isOverlayMessage } from "../overlayMessages.js";
 import { FORMAT_FLAGS } from "../../../core/lib/modifierFormats.js";
 import { c } from "react/compiler-runtime";
@@ -8,13 +8,14 @@ import { Kbd } from "@camox/ui/kbd";
 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 * as Tooltip$1 from "@camox/ui/tooltip";
 import { Bold, Italic } from "lucide-react";
 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/TextFormatToolbar.tsx
+//#region src/features/preview/components/FieldToolbar.tsx
 const FORMAT_BUTTONS = [{
 	key: "bold",
 	flag: FORMAT_FLAGS.bold,
@@ -28,9 +29,10 @@ const FORMAT_BUTTONS = [{
 	label: "Italic",
 	shortcut: "⌘ I"
 }];
-const TextFormatToolbar = () => {
-	const $ = c(15);
+const FieldToolbar = () => {
+	const $ = c(19);
 	const iframeElement = useSelector(previewStore, _temp);
+	const selection = useSelector(previewStore, _temp2);
 	const isAnySideSheetOpen = useIsPreviewSheetOpen();
 	const [hasSelection, setHasSelection] = React.useState(false);
 	const [activeFormats, setActiveFormats] = React.useState(0);
@@ -67,25 +69,53 @@ const TextFormatToolbar = () => {
 		$[3] = t2;
 	} else t2 = $[3];
 	const sendFormat = t2;
-	const t3 = hasSelection && !isAnySideSheetOpen ? "opacity-100 translate-y-0" : "opacity-0 pointer-events-none translate-y-2";
-	let t4;
-	if ($[4] !== t3) {
-		t4 = cn("bottom-17 gap-2", t3);
-		$[4] = t3;
-		$[5] = t4;
-	} else t4 = $[5];
+	const isVisible = (selection?.type === "block-field" || selection?.type === "item-field") && !isAnySideSheetOpen;
+	let t3;
+	if ($[4] !== selection) {
+		t3 = () => {
+			if (!selection) return;
+			previewStore.send({
+				type: "openBlockContentSheet",
+				blockId: selection.blockId
+			});
+		};
+		$[4] = selection;
+		$[5] = t3;
+	} else t3 = $[5];
+	const handleEditInForm = t3;
+	const t4 = isVisible ? "opacity-100 translate-y-0" : "opacity-0 pointer-events-none translate-y-2";
 	let t5;
-	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
-		t5 = /* @__PURE__ */ jsx("span", {
-			className: "text-muted-foreground text-sm",
-			children: "Selected text"
-		});
-		$[6] = t5;
-	} else t5 = $[6];
+	if ($[6] !== t4) {
+		t5 = cn("bottom-17 gap-2", t4);
+		$[6] = t4;
+		$[7] = t5;
+	} else t5 = $[7];
 	let t6;
-	if ($[7] !== activeFormats || $[8] !== sendFormat) {
-		t6 = FORMAT_BUTTONS.map((t7) => {
-			const { key, flag, icon: Icon, label, shortcut } = t7;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = /* @__PURE__ */ jsx(Kbd, {
+			className: "ml-2",
+			children: formatShortcut({
+				key: "j",
+				withAlt: true
+			})
+		});
+		$[8] = t6;
+	} else t6 = $[8];
+	let t7;
+	if ($[9] !== handleEditInForm) {
+		t7 = /* @__PURE__ */ jsxs(Button, {
+			variant: "ghost",
+			size: "sm",
+			onClick: handleEditInForm,
+			children: ["Edit in form ", t6]
+		});
+		$[9] = handleEditInForm;
+		$[10] = t7;
+	} else t7 = $[10];
+	let t8;
+	if ($[11] !== activeFormats || $[12] !== hasSelection || $[13] !== sendFormat) {
+		t8 = hasSelection && /* @__PURE__ */ jsx(ButtonGroup, { children: FORMAT_BUTTONS.map((t9) => {
+			const { key, flag, icon: Icon, label, shortcut } = t9;
 			const isActive = !!(activeFormats & flag);
 			return /* @__PURE__ */ jsxs(Tooltip$1.Tooltip, { children: [/* @__PURE__ */ jsx(Tooltip$1.TooltipTrigger, {
 				render: /* @__PURE__ */ jsx(Toggle, {
@@ -100,36 +130,35 @@ const TextFormatToolbar = () => {
 				" ",
 				/* @__PURE__ */ jsx(Kbd, { children: shortcut })
 			] })] }, key);
-		});
-		$[7] = activeFormats;
-		$[8] = sendFormat;
-		$[9] = t6;
-	} else t6 = $[9];
-	let t7;
-	if ($[10] !== t6) {
-		t7 = /* @__PURE__ */ jsx(ButtonGroup, { children: t6 });
-		$[10] = t6;
-		$[11] = t7;
-	} else t7 = $[11];
-	let t8;
-	if ($[12] !== t4 || $[13] !== t7) {
-		t8 = /* @__PURE__ */ jsxs(FloatingToolbar, {
-			onMouseDown: _temp2,
-			className: t4,
-			children: [t5, t7]
-		});
-		$[12] = t4;
-		$[13] = t7;
+		}) });
+		$[11] = activeFormats;
+		$[12] = hasSelection;
+		$[13] = sendFormat;
 		$[14] = t8;
 	} else t8 = $[14];
-	return t8;
+	let t9;
+	if ($[15] !== t5 || $[16] !== t7 || $[17] !== t8) {
+		t9 = /* @__PURE__ */ jsxs(FloatingToolbar, {
+			onMouseDown: _temp3,
+			className: t5,
+			children: [t7, t8]
+		});
+		$[15] = t5;
+		$[16] = t7;
+		$[17] = t8;
+		$[18] = t9;
+	} else t9 = $[18];
+	return t9;
 };
 function _temp(state) {
 	return state.context.iframeElement;
 }
-function _temp2(e) {
+function _temp2(state_0) {
+	return state_0.context.selection;
+}
+function _temp3(e) {
 	return e.preventDefault();
 }
 
 //#endregion
-export { TextFormatToolbar };
+export { FieldToolbar };

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

@@ -196,16 +196,15 @@ const PageContentSheet = () => {
 	}, [autoFocusFieldName, fieldIdPrefix]);
 	React.useEffect(() => {
 		const action = {
-			id: "open-content-sheet",
-			label: isOpen ? "Close content sheet" : "Open content sheet",
+			id: "toggle-content-sheet",
+			label: isOpen ? "Close form" : "Open in form",
 			groupLabel: "Preview",
 			shortcut: {
 				key: "j",
-				withMeta: true
+				withAlt: true
 			},
-			checkIfAvailable: () => isOpen || !!blockId,
+			checkIfAvailable: () => blockId != null,
 			execute: () => {
-				if (!blockId) return;
 				previewStore.send({ type: "toggleContentSheet" });
 			}
 		};
@@ -325,47 +324,8 @@ const PageContentSheet = () => {
 		}), /* @__PURE__ */ jsxs("div", {
 			className: "flex-1 overflow-auto",
 			children: [
-				isViewingAsset && assetFieldName && isMultipleAsset && /* @__PURE__ */ jsx(MultipleAssetFieldEditor, {
-					fieldName: assetFieldName,
-					assetType,
-					currentData,
-					onFieldChange: activeFieldChangeHandler
-				}),
-				isViewingAsset && assetFieldName && !isMultipleAsset && /* @__PURE__ */ jsx(SingleAssetFieldEditor, {
-					fieldName: assetFieldName,
-					assetType,
-					currentData,
-					onFieldChange: activeFieldChangeHandler
-				}),
-				!isViewingAsset && isViewingLink && linkFieldName && /* @__PURE__ */ jsx("div", {
-					className: "px-4 py-4",
-					children: /* @__PURE__ */ jsx(LinkFieldEditor, {
-						fieldName: linkFieldName,
-						linkValue: currentData[linkFieldName] ?? {
-							type: "external",
-							text: "",
-							href: "",
-							newTab: false
-						},
-						onSave: (fieldName_1, value_3) => {
-							activeFieldChangeHandler(fieldName_1, value_3);
-						}
-					})
-				}),
-				!isViewingAsset && !isViewingLink && /* @__PURE__ */ jsx(ItemFieldsEditor, {
-					schema: currentSchema,
-					data: currentData,
-					blockId: block.id,
-					itemId: currentItemId ?? void 0,
-					onFieldChange: activeFieldChangeHandler,
-					postToIframe,
-					filesMap,
-					itemsMap,
-					fieldIdPrefix,
-					autoFocusFieldName
-				}, currentItemId ?? `block-${block.id}`),
 				currentItemId == null && !fieldHasOwnView && settingsFields.length > 0 && /* @__PURE__ */ jsxs("div", {
-					className: "border-border space-y-4 border-t px-4 py-4",
+					className: "border-border space-y-4 border-b px-4 py-4",
 					children: [/* @__PURE__ */ jsx(Label, {
 						className: "text-muted-foreground",
 						children: "Settings"
@@ -373,14 +333,14 @@ const PageContentSheet = () => {
 						const label = field.label ?? formatFieldName(field.name);
 						const settingsValues = block.settings ?? {};
 						if (field.fieldType === "Enum") {
-							const value_4 = settingsValues[field.name] ?? (blockDef._internal.settingsSchema?.properties?.[field.name])?.default ?? "";
+							const value_3 = settingsValues[field.name] ?? (blockDef._internal.settingsSchema?.properties?.[field.name])?.default ?? "";
 							return /* @__PURE__ */ jsxs("div", {
 								className: "space-y-2",
 								children: [/* @__PURE__ */ jsx(Label, {
 									htmlFor: `setting-${field.name}`,
 									children: label
 								}), /* @__PURE__ */ jsxs(Select, {
-									value: value_4,
+									value: value_3,
 									onValueChange: (newValue) => {
 										updateSettings.mutate({
 											id: block.id,
@@ -418,7 +378,46 @@ const PageContentSheet = () => {
 						}
 						return null;
 					})]
-				})
+				}),
+				isViewingAsset && assetFieldName && isMultipleAsset && /* @__PURE__ */ jsx(MultipleAssetFieldEditor, {
+					fieldName: assetFieldName,
+					assetType,
+					currentData,
+					onFieldChange: activeFieldChangeHandler
+				}),
+				isViewingAsset && assetFieldName && !isMultipleAsset && /* @__PURE__ */ jsx(SingleAssetFieldEditor, {
+					fieldName: assetFieldName,
+					assetType,
+					currentData,
+					onFieldChange: activeFieldChangeHandler
+				}),
+				!isViewingAsset && isViewingLink && linkFieldName && /* @__PURE__ */ jsx("div", {
+					className: "px-4 py-4",
+					children: /* @__PURE__ */ jsx(LinkFieldEditor, {
+						fieldName: linkFieldName,
+						linkValue: currentData[linkFieldName] ?? {
+							type: "external",
+							text: "",
+							href: "",
+							newTab: false
+						},
+						onSave: (fieldName_1, value_4) => {
+							activeFieldChangeHandler(fieldName_1, value_4);
+						}
+					})
+				}),
+				!isViewingAsset && !isViewingLink && /* @__PURE__ */ jsx(ItemFieldsEditor, {
+					schema: currentSchema,
+					data: currentData,
+					blockId: block.id,
+					itemId: currentItemId ?? void 0,
+					onFieldChange: activeFieldChangeHandler,
+					postToIframe,
+					filesMap,
+					itemsMap,
+					fieldIdPrefix,
+					autoFocusFieldName
+				}, currentItemId ?? `block-${block.id}`)
 			]
 		})]
 	});

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

@@ -88,7 +88,7 @@ const PeekedBlock = (t0) => {
 			if (e.propertyName !== "grid-template-rows" || e.target !== e.currentTarget) return;
 			if (isExpanded) {
 				peekedBlockRef.current?.scrollIntoView({
-					behavior: "instant",
+					behavior: "smooth",
 					block: "start"
 				});
 				return;

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

@@ -5,10 +5,10 @@ import { checkIfInputFocused } from "../../../lib/utils.js";
 import { Frame, useFrame } from "./Frame.js";
 import { useBlockActionsShortcuts } from "./BlockActionsPopover.js";
 import { FieldOverlayStyles } from "./FieldOverlayStyles.js";
+import { FieldToolbar } from "./FieldToolbar.js";
 import { Overlays } from "./Overlays.js";
 import { OverlayTracker } from "./OverlayTracker.js";
 import { PreviewToolbar } from "./PreviewToolbar.js";
-import { TextFormatToolbar } from "./TextFormatToolbar.js";
 import { c } from "react/compiler-runtime";
 import { useSelector } from "@xstate/store/react";
 import * as React from "react";
@@ -245,7 +245,7 @@ const PreviewPanel = (t0) => {
 						children
 					}), /* @__PURE__ */ jsx(Overlays, { iframeElement })]
 				}),
-				/* @__PURE__ */ jsx(TextFormatToolbar, {}),
+				/* @__PURE__ */ jsx(FieldToolbar, {}),
 				/* @__PURE__ */ jsx(PreviewToolbar, {})
 			]
 		}) : /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -255,7 +255,7 @@ const PreviewPanel = (t0) => {
 				children
 			}),
 			/* @__PURE__ */ jsx(Overlays, { iframeElement }),
-			/* @__PURE__ */ jsx(TextFormatToolbar, {}),
+			/* @__PURE__ */ jsx(FieldToolbar, {}),
 			/* @__PURE__ */ jsx(PreviewToolbar, {})
 		] });
 		$[8] = children;

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

@@ -197,7 +197,7 @@ const PreviewToolbar = () => {
 	} else t27 = $[44];
 	let t28;
 	if ($[45] !== t27) {
-		t28 = /* @__PURE__ */ jsxs(Tooltip$1.TooltipContent, { children: ["Hide all Camox UI ", t27] });
+		t28 = /* @__PURE__ */ jsxs(Tooltip$1.TooltipContent, { children: ["Hide Camox Studio ", t27] });
 		$[45] = t27;
 		$[46] = t28;
 	} else t28 = $[46];

package/dist/features/preview/previewStore.js

@@ -43,18 +43,15 @@ const previewStore = createStore({
 		enterPresentationMode: (context, _, enqueue) => {
 			if (context.isPresentationMode) return context;
 			enqueue.effect(() => {
-				toast("Entering presentation mode. Press ⌘ + Escape to restore admin interface", { duration: 4e3 });
+				toast("Press ⌘ + Enter to restore Camox Studio", { duration: 2500 });
 			});
 			return {
 				...context,
 				isPresentationMode: true
 			};
 		},
-		exitPresentationMode: (context, _, enqueue) => {
+		exitPresentationMode: (context) => {
 			if (!context.isPresentationMode) return context;
-			enqueue.effect(() => {
-				toast("Leaving presentation mode");
-			});
 			return {
 				...context,
 				isPresentationMode: false

package/dist/features/provider/CamoxProvider.js

@@ -62,7 +62,7 @@ const AuthenticatedCamoxProvider = (t0) => {
 	return t4;
 };
 const UnauthenticatedCamoxProvider = (t0) => {
-	const $ = c(11);
+	const $ = c(16);
 	const { children } = t0;
 	const signInRedirect = useSignInRedirect();
 	const { authenticationUrl } = useAuthContext();
@@ -70,7 +70,7 @@ const UnauthenticatedCamoxProvider = (t0) => {
 	if ($[0] !== signInRedirect) {
 		t1 = () => {
 			const handleKeyDown = (event) => {
-				if ((event.metaKey || event.ctrlKey) && event.key === "Escape") {
+				if ((event.metaKey || event.ctrlKey) && event.key === "Enter") {
 					event.preventDefault();
 					signInRedirect();
 				}
@@ -112,25 +112,39 @@ const UnauthenticatedCamoxProvider = (t0) => {
 		t4 = $[7];
 	}
 	React.useEffect(t3, t4);
+	const { theme } = useTheme();
 	let t5;
 	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
-		t5 = /* @__PURE__ */ jsx(Toaster, {
-			theme: "light",
-			position: "bottom-right",
-			offset: { bottom: "1rem" }
-		});
+		t5 = { bottom: "1rem" };
 		$[8] = t5;
 	} else t5 = $[8];
 	let t6;
-	if ($[9] !== children) {
-		t6 = /* @__PURE__ */ jsxs(Fragment, { children: [t5, /* @__PURE__ */ jsx("div", {
-			className: "bg-background min-h-screen",
-			children
-		})] });
-		$[9] = children;
+	if ($[9] !== theme) {
+		t6 = /* @__PURE__ */ jsx(Toaster, {
+			theme,
+			position: "bottom-right",
+			offset: t5
+		});
+		$[9] = theme;
 		$[10] = t6;
 	} else t6 = $[10];
-	return t6;
+	let t7;
+	if ($[11] !== children) {
+		t7 = /* @__PURE__ */ jsx("div", {
+			className: "bg-background min-h-screen",
+			children
+		});
+		$[11] = children;
+		$[12] = t7;
+	} else t7 = $[12];
+	let t8;
+	if ($[13] !== t6 || $[14] !== t7) {
+		t8 = /* @__PURE__ */ jsxs(Fragment, { children: [t6, t7] });
+		$[13] = t6;
+		$[14] = t7;
+		$[15] = t8;
+	} else t8 = $[15];
+	return t8;
 };
 function CamoxProvider({ children, camoxApp, authenticationUrl, apiUrl, projectSlug, environmentName }) {
 	const authClient = React.useMemo(() => createCamoxAuthClient(apiUrl), [apiUrl]);