camox 0.34.0 → 0.36.0

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

@@ -1,22 +1,22 @@
 import { actionsStore } from "../../provider/actionsStore.js";
+import { usePageBlocks } from "../../../lib/normalized-data.js";
 import { blockMutations, repeatableItemMutations } from "../../../lib/queries.js";
-import { trackClientEvent } from "../../../lib/telemetry-client.js";
 import { formatShortcut } from "../../../lib/utils.js";
-import { previewStore, selectionItemId } from "../previewStore.js";
-import { usePageBlocks } from "../../../lib/normalized-data.js";
 import { useCamoxApp } from "../../provider/components/CamoxAppContext.js";
+import { trackClientEvent } from "../../../lib/telemetry-client.js";
+import { previewStore, selectionItemId } from "../previewStore.js";
 import { useRequireDraftSource } from "../../../core/hooks/useRequireDraftSource.js";
 import { useUpdateBlockPosition } from "./useUpdateBlockPosition.js";
 import { usePreviewedPage } from "../CamoxPreview.js";
 import { c } from "react/compiler-runtime";
-import { Popover, PopoverContent, PopoverTrigger } from "@camox/ui/popover";
 import { useMutation } from "@tanstack/react-query";
-import { useSelector } from "@xstate/store-react";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { toast } from "@camox/ui/toaster";
+import { useSelector } from "@xstate/store-react";
 import { Copy, Pen, Settings, Trash2 } from "lucide-react";
 import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "@camox/ui/alert-dialog";
+import { Popover, PopoverContent, PopoverTrigger } from "@camox/ui/popover";
+import { toast } from "@camox/ui/toaster";
 import { Command, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut } from "@camox/ui/command";
 
 //#region src/features/preview/components/BlockActionsPopover.tsx

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

@@ -1,21 +1,21 @@
 import { useNavigate } from "../../navigation/navigation.js";
 import { useProjectSlug } from "../../../lib/auth.js";
 import { layoutQueries, pageMutations, pageQueries, projectQueries } from "../../../lib/queries.js";
+import { useCamoxApp } from "../../provider/components/CamoxAppContext.js";
 import { trackClientEvent } from "../../../lib/telemetry-client.js";
 import { previewStore } from "../previewStore.js";
-import { useCamoxApp } from "../../provider/components/CamoxAppContext.js";
 import { PageLocationFieldset } from "./PageLocationFieldset.js";
 import { PageNicknameField } from "./PageNicknameField.js";
 import { c } from "react/compiler-runtime";
-import { Label } from "@camox/ui/label";
 import { useMutation, useQuery } from "@tanstack/react-query";
-import { useSelector } from "@xstate/store-react";
 import { useEffect } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { toast } from "@camox/ui/toaster";
+import { useSelector } from "@xstate/store-react";
 import { Button } from "@camox/ui/button";
 import { Spinner } from "@camox/ui/spinner";
+import { toast } from "@camox/ui/toaster";
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@camox/ui/dialog";
+import { Label } from "@camox/ui/label";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@camox/ui/select";
 import { useForm } from "@tanstack/react-form";
 

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

@@ -1,9 +1,9 @@
 import { useDebouncedField } from "../../../hooks/use-debounced-field.js";
 import { c } from "react/compiler-runtime";
-import { Input } from "@camox/ui/input";
-import { Label } from "@camox/ui/label";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { Label } from "@camox/ui/label";
+import { Input } from "@camox/ui/input";
 import { Textarea } from "@camox/ui/textarea";
 
 //#region src/features/preview/components/DebouncedFieldEditor.tsx

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

@@ -1,7 +1,7 @@
 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 { useSelector } from "@xstate/store-react";
 import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "@camox/ui/alert-dialog";
 
 //#region src/features/preview/components/DraftSwitchDialog.tsx

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

@@ -1,12 +1,12 @@
 import { cn } from "../../../lib/utils.js";
-import { isOverlayMessage } from "../overlayMessages.js";
 import { previewStore } from "../previewStore.js";
-import { FORMAT_FLAGS } from "../../../core/lib/modifierFormats.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 { useSelector } from "@xstate/store-react";
 import * as React from "react";
 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";

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

@@ -1,8 +1,8 @@
 import { cn } from "../../../lib/utils.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
-import { createPortal } from "react-dom";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { createPortal } from "react-dom";
 
 //#region src/features/preview/components/Frame.tsx
 const FrameContext = React.createContext({

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

@@ -1,14 +1,14 @@
-import { previewStore } from "../previewStore.js";
 import { isFileMarker, isItemMarker, resolveFileMarker } from "../../../lib/normalized-data.js";
+import { previewStore } from "../previewStore.js";
 import { SidebarLexicalEditor } from "../../../core/components/lexical/SidebarLexicalEditor.js";
 import { RepeatableItemsList } from "./RepeatableItemsList.js";
 import { c } from "react/compiler-runtime";
-import { Input } from "@camox/ui/input";
-import { Label } from "@camox/ui/label";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { FileIcon, ImageIcon, Images, Link2 } from "lucide-react";
+import { Label } from "@camox/ui/label";
 import { useForm } from "@tanstack/react-form";
+import { Input } from "@camox/ui/input";
 
 //#region src/features/preview/components/ItemFieldsEditor.tsx
 const formatFieldName = (fieldName) => {

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

@@ -2,8 +2,8 @@ import { previewStore } from "../previewStore.js";
 import { AddBlockSidebar } from "./AddBlockSidebar.js";
 import { PageNavigatorSidebar } from "./PageNavigatorSidebar.js";
 import { c } from "react/compiler-runtime";
-import { useSelector } from "@xstate/store-react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { useSelector } from "@xstate/store-react";
 
 //#region src/features/preview/components/LeftSidebar.tsx
 const getLeftSidebarRoute = ({ isAddBlockSidebarOpen }) => {

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

@@ -3,14 +3,14 @@ import { pageQueries, projectQueries } from "../../../lib/queries.js";
 import { cn } from "../../../lib/utils.js";
 import { useDebouncedField } from "../../../hooks/use-debounced-field.js";
 import { c } from "react/compiler-runtime";
-import { Input } from "@camox/ui/input";
-import { Label } from "@camox/ui/label";
-import { Popover, PopoverContent, PopoverTrigger } from "@camox/ui/popover";
 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 { Check, ChevronsUpDown } from "lucide-react";
+import { Popover, PopoverContent, PopoverTrigger } from "@camox/ui/popover";
+import { Label } from "@camox/ui/label";
+import { Input } from "@camox/ui/input";
 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";

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

@@ -0,0 +1,87 @@
+import { c } from "react/compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/features/preview/components/Metadata.tsx
+function Metadata(t0) {
+	const $ = c(3);
+	if ($[0] !== "0cab1dfcfdb2036df169f46d25dd9f41685cc99f911ce3094b6e2273b2fb83fa") {
+		for (let $i = 0; $i < 3; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "0cab1dfcfdb2036df169f46d25dd9f41685cc99f911ce3094b6e2273b2fb83fa";
+	}
+	const { children } = t0;
+	let t1;
+	if ($[1] !== children) {
+		t1 = /* @__PURE__ */ jsx("div", {
+			className: "text-muted-foreground space-y-1 text-sm",
+			children
+		});
+		$[1] = children;
+		$[2] = t1;
+	} else t1 = $[2];
+	return t1;
+}
+function MetadataRow(t0) {
+	const $ = c(9);
+	if ($[0] !== "0cab1dfcfdb2036df169f46d25dd9f41685cc99f911ce3094b6e2273b2fb83fa") {
+		for (let $i = 0; $i < 9; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "0cab1dfcfdb2036df169f46d25dd9f41685cc99f911ce3094b6e2273b2fb83fa";
+	}
+	const { label, children } = t0;
+	let t1;
+	if ($[1] !== label) {
+		t1 = /* @__PURE__ */ jsx("span", {
+			className: "shrink-0",
+			children: label
+		});
+		$[1] = label;
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx("span", { className: "border-border min-w-0 flex-1 border-b" });
+		$[3] = t2;
+	} else t2 = $[3];
+	let t3;
+	if ($[4] !== children) {
+		t3 = /* @__PURE__ */ jsx("span", {
+			className: "text-foreground min-w-0 truncate",
+			children
+		});
+		$[4] = children;
+		$[5] = t3;
+	} else t3 = $[5];
+	let t4;
+	if ($[6] !== t1 || $[7] !== t3) {
+		t4 = /* @__PURE__ */ jsxs("div", {
+			className: "flex items-baseline gap-2",
+			children: [
+				t1,
+				t2,
+				t3
+			]
+		});
+		$[6] = t1;
+		$[7] = t3;
+		$[8] = t4;
+	} else t4 = $[8];
+	return t4;
+}
+function formatRelativeTime(epochMs) {
+	const now = Temporal.Now.instant();
+	const then = Temporal.Instant.fromEpochMilliseconds(epochMs);
+	const totalSeconds = now.since(then).total("seconds");
+	const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" });
+	if (totalSeconds < 60) return rtf.format(-Math.floor(totalSeconds), "second");
+	const totalMinutes = Math.floor(totalSeconds / 60);
+	if (totalMinutes < 60) return rtf.format(-totalMinutes, "minute");
+	const totalHours = Math.floor(totalMinutes / 60);
+	if (totalHours < 24) return rtf.format(-totalHours, "hour");
+	const totalDays = Math.floor(totalHours / 24);
+	if (totalDays < 30) return rtf.format(-totalDays, "day");
+	const totalMonths = Math.floor(totalDays / 30);
+	if (totalMonths < 12) return rtf.format(-totalMonths, "month");
+	return rtf.format(-Math.floor(totalDays / 365), "year");
+}
+
+//#endregion
+export { Metadata, MetadataRow, formatRelativeTime };

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

@@ -1,7 +1,7 @@
 import { useProjectSlug } from "../../../lib/auth.js";
+import { transformImageUrl } from "../../../core/lib/imageTransform.js";
 import { projectQueries } from "../../../lib/queries.js";
 import { cn } from "../../../lib/utils.js";
-import { transformImageUrl } from "../../../core/lib/imageTransform.js";
 import { UploadDropZone } from "../../content/components/UploadDropZone.js";
 import { useFileUpload } from "../../../hooks/use-file-upload.js";
 import { AssetLightbox } from "./AssetLightbox.js";

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

@@ -1,9 +1,9 @@
-import { useFrame } from "./Frame.js";
-import { isOverlayMessage } from "../overlayMessages.js";
 import { previewStore } from "../previewStore.js";
+import { isOverlayMessage } from "../overlayMessages.js";
+import { useFrame } from "./Frame.js";
 import { c } from "react/compiler-runtime";
-import { useSelector } from "@xstate/store-react";
 import * as React from "react";
+import { useSelector } from "@xstate/store-react";
 
 //#region src/features/preview/components/OverlayTracker.tsx
 /**

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

@@ -1,10 +1,10 @@
-import { isOverlayMessage } from "../overlayMessages.js";
-import { previewStore } from "../previewStore.js";
 import { usePageBlocks } from "../../../lib/normalized-data.js";
+import { previewStore } from "../previewStore.js";
+import { isOverlayMessage } from "../overlayMessages.js";
 import { usePreviewedPage } from "../CamoxPreview.js";
 import { c } from "react/compiler-runtime";
-import { useSelector } from "@xstate/store-react";
 import * as React from "react";
+import { useSelector } from "@xstate/store-react";
 
 //#region src/features/preview/components/Overlays.tsx
 const Overlays = (t0) => {

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

@@ -1,9 +1,9 @@
+import { isFileMarker } from "../../../lib/normalized-data.js";
 import { blockMutations, blockQueries, fileQueries, repeatableItemMutations } from "../../../lib/queries.js";
-import { trackClientEvent } from "../../../lib/telemetry-client.js";
 import { cn } from "../../../lib/utils.js";
-import { previewStore, selectionBlockId, selectionField, selectionItemId } from "../previewStore.js";
-import { isFileMarker } from "../../../lib/normalized-data.js";
 import { useCamoxApp } from "../../provider/components/CamoxAppContext.js";
+import { trackClientEvent } from "../../../lib/telemetry-client.js";
+import { previewStore, selectionBlockId, selectionField, selectionItemId } from "../previewStore.js";
 import { useRequireDraftSource } from "../../../core/hooks/useRequireDraftSource.js";
 import { fieldTypesDictionary } from "../../../core/lib/fieldTypes.js";
 import { SingleAssetFieldEditor } from "./AssetFieldEditor.js";
@@ -11,14 +11,14 @@ import { useRepeatableItemActions } from "./useRepeatableItemActions.js";
 import { ItemFieldsEditor, formatFieldName } from "./ItemFieldsEditor.js";
 import { LinkFieldEditor } from "./LinkFieldEditor.js";
 import { MultipleAssetFieldEditor } from "./MultipleAssetFieldEditor.js";
-import { Label } from "@camox/ui/label";
 import { useMutation, useQueries, useQuery } from "@tanstack/react-query";
-import { useSelector } from "@xstate/store-react";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useSelector } from "@xstate/store-react";
 import { Button } from "@camox/ui/button";
 import { CircleMinus, CirclePlus, CornerLeftUp } from "lucide-react";
 import { Spinner } from "@camox/ui/spinner";
+import { Label } from "@camox/ui/label";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@camox/ui/select";
 import { Switch } from "@camox/ui/switch";
 
@@ -272,7 +272,7 @@ const PageEditorSidebar = () => {
 		children: [/* @__PURE__ */ jsx(Spinner, { className: "mr-2 size-3.5" }), " Loading block..."]
 	});
 	const fieldHasOwnView = fieldInfo ? fieldTypesDictionary[fieldInfo.fieldType].hasOwnView : false;
-	const [pageNavigationItem, ...contentNavigationItems] = [
+	const navigationItems = [
 		{
 			key: "page",
 			label: "Page",
@@ -307,47 +307,57 @@ const PageEditorSidebar = () => {
 	];
 	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
 		className: "border-border flex flex-col gap-1.5 border-b px-2 py-4",
-		children: /* @__PURE__ */ jsxs("nav", {
+		children: /* @__PURE__ */ jsx("nav", {
 			"aria-label": "Selection path",
 			className: "text-muted-foreground text-sm",
-			children: [pageNavigationItem?.onClick ? /* @__PURE__ */ jsx("button", {
-				type: "button",
-				className: "hover:text-foreground block min-w-0 cursor-pointer truncate py-0.5 text-left transition-colors",
-				onClick: pageNavigationItem.onClick,
-				children: pageNavigationItem.label
-			}) : /* @__PURE__ */ jsx("span", {
-				className: "text-foreground block min-w-0 truncate py-0.5 font-medium",
-				children: pageNavigationItem?.label
-			}), /* @__PURE__ */ jsx("ol", {
+			children: /* @__PURE__ */ jsx("ol", {
 				className: "flex flex-col",
-				children: contentNavigationItems.map((item, index) => {
+				children: navigationItems.map((item, index) => {
+					const isFirstItem = index === 0;
+					const isLastItem = index === navigationItems.length - 1;
 					return /* @__PURE__ */ jsxs("li", {
 						className: "relative min-w-0 pl-6",
-						children: [/* @__PURE__ */ jsx("svg", {
+						children: [/* @__PURE__ */ jsxs("svg", {
 							"aria-hidden": "true",
-							className: "text-muted-foreground pointer-events-none absolute top-0 left-0 h-full w-4",
+							className: "text-muted-foreground pointer-events-none absolute top-0 left-0 h-7 w-4",
 							fill: "none",
 							preserveAspectRatio: "none",
-							viewBox: "0 0 16 24",
-							children: /* @__PURE__ */ jsx("path", {
-								d: index < contentNavigationItems.length - 1 ? "M1 0 V24 M1 5 Q1 12 8 12 H16" : "M1 0 V5 Q1 12 8 12 H16",
-								stroke: "currentColor",
-								strokeLinecap: "square",
-								strokeWidth: "1.25",
-								vectorEffect: "non-scaling-stroke"
-							})
+							viewBox: "0 0 16 28",
+							children: [
+								!isFirstItem && /* @__PURE__ */ jsx("path", {
+									d: "M8 0 V10",
+									stroke: "currentColor",
+									strokeWidth: "1.5",
+									vectorEffect: "non-scaling-stroke"
+								}),
+								!isLastItem && /* @__PURE__ */ jsx("path", {
+									d: "M8 18 V28",
+									stroke: "currentColor",
+									strokeWidth: "1.5",
+									vectorEffect: "non-scaling-stroke"
+								}),
+								/* @__PURE__ */ jsx("circle", {
+									className: "fill-background",
+									cx: "8",
+									cy: "14",
+									r: "4",
+									stroke: "currentColor",
+									strokeWidth: "1.5",
+									vectorEffect: "non-scaling-stroke"
+								})
+							]
 						}), item.onClick ? /* @__PURE__ */ jsx("button", {
 							type: "button",
-							className: cn("hover:text-foreground relative -top-px block min-w-0 cursor-pointer truncate py-0.5 text-left transition-colors", item.isCurrent && "text-foreground font-medium"),
+							className: cn("hover:text-foreground flex h-7 min-w-0 cursor-pointer items-center truncate text-left transition-colors", item.isCurrent && "text-foreground font-medium"),
 							onClick: item.onClick,
 							children: item.label
 						}) : /* @__PURE__ */ jsx("span", {
-							className: "text-foreground relative -top-px block min-w-0 truncate py-0.5 font-medium",
+							className: "text-foreground block h-7 min-w-0 truncate leading-7 font-medium",
 							children: item.label
 						})]
 					}, item.key);
 				})
-			})]
+			})
 		})
 	}), /* @__PURE__ */ jsxs("div", {
 		className: "relative flex-1 overflow-auto",