@emdash-cms/admin 0.30.0 → 0.31.0

package/dist/index.js

@@ -1,5 +1,5 @@
 import { a as fetchPlugins, c as updatePluginSettings, d as fetchAuthMode, f as fetchManifest, i as fetchPluginSettings, l as API_BASE, m as throwResponseError, n as enablePlugin, p as parseApiResponse, r as fetchPlugin, s as setPluginMcpEnabled, t as disablePlugin, u as apiFetch } from "./plugins-CQAV8Ap0.js";
-import { a as SUPPORTED_LOCALES, i as DEFAULT_LOCALE, l as resolveLocale, n as useLocale, o as SUPPORTED_LOCALE_CODES, s as getLocaleDir, t as LocaleDirectionProvider } from "./LocaleDirectionProvider-McGbBpFz.js";
+import { a as SUPPORTED_LOCALES, i as DEFAULT_LOCALE, l as resolveLocale, n as useLocale, o as SUPPORTED_LOCALE_CODES, s as getLocaleDir, t as LocaleDirectionProvider } from "./LocaleDirectionProvider-CzUzBk_M.js";
 import "./locales/index.js";
 import { Autocomplete, Badge, Banner, Button, Checkbox, ClipboardText, Collapsible, Combobox, CommandPalette, Dialog, DropdownMenu, Input, InputArea, Label, LayerCard, LinkButton, LinkProvider, Loader, Popover, Select, Sidebar, Sidebar as KumoSidebar, SkeletonLine, Switch, Tabs, Text, Toast, Toasty, Tooltip, TooltipProvider, buttonVariants, useKumoToastManager, useSidebar, useSidebar as useSidebar$1 } from "@cloudflare/kumo";
 import { i18n } from "@lingui/core";
@@ -13,11 +13,12 @@ import { Dialog as Dialog$1 } from "@cloudflare/kumo/primitives";
 import { Archive, ArrowCounterClockwise, ArrowDown, ArrowRightIcon, ArrowSquareOut, ArrowUUpLeft, ArrowUUpRight, ArrowUp, ArrowsClockwise, ArrowsInSimple, ArrowsLeftRight, ArrowsOutSimple, Bell, BookOpen, BracketsAngle, BracketsCurly, Browser, Calendar, CalendarBlank, CardsThree, CaretDown, CaretRightIcon, CaretUp, CaretUpDown, ChartBar, ChartLine, Chats, Check, CheckCircle, CircleDashed, CircleNotch, ClockCounterClockwise, Cloud, CloudArrowUp, Code, CodeBlock, Columns, ColumnsPlusLeft, ColumnsPlusRight, Copy, Crop, Cube, Database, DeviceMobile, DotsSixVertical, Download, DownloadSimple, Envelope, EnvelopeSimple, Eye, EyeSlash, Faders, File, FileArrowDown, FileText, Files, FloppyDisk, Folder, FolderOpen, Folders, Gear, GithubLogo, Globe, GlobeSimple, GridFour, HardDrive, Hash, IdentificationCard, Image as Image$1, ImageBroken, ImageSquare, Images, ImagesSquare, Info, Key, Link as Link$2, LinkBreak, LinkSimple, List, ListBullets, ListChecks, ListNumbers, MagnifyingGlass, Medal, Minus, Monitor, Moon, Newspaper, Palette, PaperPlaneTilt, Paperclip, Paragraph, Path, Pencil, PencilSimple, Plug, PlugsConnected, Plus, Prohibit, PuzzlePiece, Quotes, Robot, Rows, RowsPlusBottom, RowsPlusTop, Ruler, ShareNetwork, Shield, ShieldCheck, ShieldWarning, SignOut, Signature, SlidersHorizontal, Sparkle, SquaresFour, Stack, Star, Storefront, Sun, Table, Tag, TextAlignCenter, TextAlignLeft, TextAlignRight, TextB, TextH, TextHFive, TextHFour, TextHOne, TextHSix, TextHThree, TextHTwo, TextItalic, TextStrikethrough, TextT, TextUnderline, ToggleLeft, Trash, Trophy, Upload, User, UserCircle, UserPlus, Users, Warning, WarningCircle, WebhooksLogo, X, YoutubeLogo } from "@phosphor-icons/react";
 import { clsx } from "clsx";
 import { twMerge } from "tailwind-merge";
-import { DndContext, DragOverlay, KeyboardSensor, PointerSensor, closestCenter, rectIntersection, useDraggable, useDroppable, useSensor, useSensors } from "@dnd-kit/core";
-import { SortableContext, arrayMove, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from "@dnd-kit/sortable";
+import { DndContext, DragOverlay, KeyboardSensor, MeasuringStrategy, PointerSensor, closestCenter, rectIntersection, useDraggable, useDroppable, useSensor, useSensors } from "@dnd-kit/core";
+import { SortableContext, arrayMove, rectSortingStrategy, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from "@dnd-kit/sortable";
 import { CSS } from "@dnd-kit/utilities";
+import { EditorContent, Node as Node$1, NodeViewContent, NodeViewWrapper, ReactNodeViewRenderer, mergeAttributes, useEditor, useEditorState } from "@tiptap/react";
 import { Popover as Popover$1 } from "@cloudflare/kumo/primitives/popover";
-import { Extension, InputRule, Node as Node$1, PasteRule, escapeForRegEx, mergeAttributes } from "@tiptap/core";
+import { Extension, InputRule, Node as Node$2, PasteRule, escapeForRegEx, mergeAttributes as mergeAttributes$1 } from "@tiptap/core";
 import CharacterCount from "@tiptap/extension-character-count";
 import Focus from "@tiptap/extension-focus";
 import Placeholder from "@tiptap/extension-placeholder";
@@ -29,7 +30,6 @@ import TextAlign from "@tiptap/extension-text-align";
 import Typography from "@tiptap/extension-typography";
 import { AllSelection, NodeSelection, Plugin, PluginKey, TextSelection } from "@tiptap/pm/state";
 import { CellSelection } from "@tiptap/pm/tables";
-import { EditorContent, Node as Node$2, NodeViewContent, NodeViewWrapper, ReactNodeViewRenderer, mergeAttributes as mergeAttributes$1, useEditor, useEditorState } from "@tiptap/react";
 import { BubbleMenu } from "@tiptap/react/menus";
 import StarterKit from "@tiptap/starter-kit";
 import { Decoration, DecorationSet } from "@tiptap/pm/view";
@@ -3673,7 +3673,7 @@ function probeImageDimensions(url, errorMessage) {
 		img.src = url;
 	});
 }
-function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "image/", mimeTypeFilters, fieldId, title: providedTitle, hideUrlInput = false, mediaKind = "image", localOnly = false }) {
+function MediaPickerModal({ open, onOpenChange, onSelect, multiple = false, onSelectMany, mimeTypeFilter = "image/", mimeTypeFilters, fieldId, title: providedTitle, hideUrlInput = false, mediaKind = "image", localOnly = false }) {
 	const { _: _t } = useLingui();
 	const isFileKind = mediaKind === "file";
 	const filters = React$1.useMemo(() => {
@@ -3704,6 +3704,7 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 	const EmptyStateIcon = isFileKind ? Paperclip : Image$1;
 	const queryClient = useQueryClient();
 	const [selectedItem, setSelectedItem] = React$1.useState(null);
+	const [selectedItems, setSelectedItems] = React$1.useState([]);
 	const [activeProvider, setActiveProvider] = React$1.useState("local");
 	const [searchQuery, setSearchQuery] = React$1.useState("");
 	const debouncedSearch = useDebouncedValue$1(searchQuery, 300);
@@ -3715,6 +3716,7 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 	React$1.useEffect(() => {
 		if (open) {
 			setSelectedItem(null);
+			setSelectedItems([]);
 			setActiveProvider("local");
 			setSearchQuery("");
 			setImageUrl("");
@@ -3787,7 +3789,11 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 		mutationFn: (file) => uploadMedia(file, { fieldId }),
 		onSuccess: (item) => {
 			queryClient.invalidateQueries({ queryKey: ["media"] });
-			setSelectedItem({
+			if (multiple) setSelectedItems((prev) => [...prev, {
+				providerId: "local",
+				item
+			}]);
+			else setSelectedItem({
 				providerId: "local",
 				item
 			});
@@ -3801,7 +3807,11 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 		mutationFn: ({ providerId, file }) => uploadToProvider(providerId, file),
 		onSuccess: (item, { providerId }) => {
 			queryClient.invalidateQueries({ queryKey: ["provider-media", providerId] });
-			setSelectedItem({
+			if (multiple) setSelectedItems((prev) => [...prev, {
+				providerId,
+				item
+			}]);
+			else setSelectedItem({
 				providerId,
 				item
 			});
@@ -3875,19 +3885,39 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 		}
 		if (fileInputRef.current) fileInputRef.current.value = "";
 	};
+	const toMediaItem = (selected) => {
+		if (selected.providerId === "local") return selected.item;
+		const providerItem = selected.item;
+		const dims = providerDimensions[providerItem.id];
+		const itemWithDims = dims ? {
+			...providerItem,
+			width: providerItem.width ?? dims.width,
+			height: providerItem.height ?? dims.height
+		} : providerItem;
+		return providerItemToMediaItem(selected.providerId, itemWithDims);
+	};
+	const isItemSelected = (providerId, id) => multiple ? selectedItems.some((s) => s.providerId === providerId && s.item.id === id) : selectedItem?.providerId === providerId && selectedItem.item.id === id;
+	const handleItemClick = (providerId, item) => {
+		if (multiple) setSelectedItems((prev) => prev.some((s) => s.providerId === providerId && s.item.id === item.id) ? prev.filter((s) => !(s.providerId === providerId && s.item.id === item.id)) : [...prev, {
+			providerId,
+			item
+		}]);
+		else setSelectedItem({
+			providerId,
+			item
+		});
+	};
 	const handleConfirm = () => {
+		if (multiple) {
+			if (selectedItems.length === 0) return;
+			onSelectMany?.(selectedItems.map(toMediaItem));
+			onOpenChange(false);
+			setSelectedItems([]);
+			setImageUrl("");
+			return;
+		}
 		if (selectedItem) {
-			if (selectedItem.providerId === "local") onSelect(selectedItem.item);
-			else {
-				const providerItem = selectedItem.item;
-				const dims = providerDimensions[providerItem.id];
-				const itemWithDims = dims ? {
-					...providerItem,
-					width: providerItem.width ?? dims.width,
-					height: providerItem.height ?? dims.height
-				} : providerItem;
-				onSelect(providerItemToMediaItem(selectedItem.providerId, itemWithDims));
-			}
+			onSelect(toMediaItem(selectedItem));
 			onOpenChange(false);
 			setSelectedItem(null);
 			setImageUrl("");
@@ -3896,6 +3926,7 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 	const handleClose = () => {
 		onOpenChange(false);
 		setSelectedItem(null);
+		setSelectedItems([]);
 		setImageUrl("");
 		setUrlError(null);
 	};
@@ -3934,7 +3965,7 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 				id: "iC8xDQ",
 				message: "Failed to load image"
 			}));
-			onSelect({
+			const externalItem = {
 				id: "",
 				filename: url.pathname.split("/").pop() || "external-image",
 				mimeType: sniffedMime,
@@ -3944,7 +3975,9 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 				width: dimensions.width,
 				height: dimensions.height,
 				createdAt: (/* @__PURE__ */ new Date()).toISOString()
-			});
+			};
+			if (multiple) onSelectMany?.([externalItem]);
+			else onSelect(externalItem);
 			onOpenChange(false);
 			setImageUrl("");
 		} catch {
@@ -4088,6 +4121,7 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 						onClick: () => {
 							setActiveProvider(tab.id);
 							setSelectedItem(null);
+							setSelectedItems([]);
 							setSearchQuery("");
 						},
 						className: cn("flex items-center gap-2 px-4 h-9 text-sm font-medium rounded-md transition-colors whitespace-nowrap", activeProvider === tab.id ? "bg-kumo-brand text-white" : "bg-kumo-tint hover:bg-kumo-tint/80 text-kumo-subtle"),
@@ -4208,24 +4242,26 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 						}),
 						children: activeProvider === "local" ? items.map((item) => /* @__PURE__ */ jsx(MediaPickerItem, {
 							item,
-							selected: selectedItem?.providerId === "local" && selectedItem.item.id === item.id,
-							onClick: () => setSelectedItem({
-								providerId: "local",
-								item
-							}),
+							selected: isItemSelected("local", item.id),
+							onClick: () => handleItemClick("local", item),
 							onDoubleClick: () => {
+								if (multiple) {
+									handleItemClick("local", item);
+									return;
+								}
 								onSelect(item);
 								onOpenChange(false);
 							},
 							onDimensionsDetected: handleDimensionsDetected
 						}, item.id)) : items.map((item) => /* @__PURE__ */ jsx(ProviderMediaItem, {
 							item,
-							selected: selectedItem?.providerId === activeProvider && selectedItem.item.id === item.id,
-							onClick: () => setSelectedItem({
-								providerId: activeProvider,
-								item
-							}),
+							selected: isItemSelected(activeProvider, item.id),
+							onClick: () => handleItemClick(activeProvider, item),
 							onDoubleClick: () => {
+								if (multiple) {
+									handleItemClick(activeProvider, item);
+									return;
+								}
 								const dims = providerDimensions[item.id];
 								onSelect(providerItemToMediaItem(activeProvider, dims ? {
 									...item,
@@ -4266,7 +4302,11 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 					children: [
 						/* @__PURE__ */ jsx("div", {
 							className: "flex-1 text-sm text-kumo-subtle",
-							children: selectedItem && /* @__PURE__ */ jsxs("span", { children: [
+							children: multiple ? selectedItems.length > 0 && /* @__PURE__ */ jsx("span", { children: i18n._({
+								id: "agSO3s",
+								message: "{0, plural, one {# item selected} other {# items selected}}",
+								values: { 0: selectedItems.length }
+							}) }) : selectedItem && /* @__PURE__ */ jsxs("span", { children: [
 								_t({
 									id: "SVRHAR",
 									message: "Selected:"
@@ -4293,7 +4333,7 @@ function MediaPickerModal({ open, onOpenChange, onSelect, mimeTypeFilter = "imag
 						}),
 						/* @__PURE__ */ jsx(Button, {
 							onClick: handleConfirm,
-							disabled: !selectedItem,
+							disabled: multiple ? selectedItems.length === 0 : !selectedItem,
 							children: _t({
 								id: "S8Yqbl",
 								message: "Insert"
@@ -4732,7 +4772,7 @@ function findCurrentHeading(headings, cursorPos) {
 /**
 * Document outline component showing heading tree structure
 */
-function DocumentOutline({ editor, className }) {
+function DocumentOutline({ editor, className, reserveHeaderEnd = false }) {
 	const { _: _t } = useLingui();
 	const [isExpanded, setIsExpanded] = React$1.useState(true);
 	const [headings, setHeadings] = React$1.useState([]);
@@ -4774,7 +4814,7 @@ function DocumentOutline({ editor, className }) {
 				variant: "ghost",
 				className: "relative justify-between",
 				style: {
-					width: "calc(100% + 1.5rem)",
+					width: reserveHeaderEnd ? "calc(100% - 1.5rem)" : "calc(100% + 1.5rem)",
 					insetInlineStart: "-0.75rem"
 				}
 			}),
@@ -4815,6 +4855,542 @@ function DocumentOutline({ editor, className }) {
 	});
 }
 
+//#endregion
+//#region src/components/editor/GalleryNode.tsx
+/**
+* Gallery Node for TipTap
+*
+* Node view for the Portable Text `gallery` block (grid of images with
+* optional per-image captions and a column count). Provides a WYSIWYG grid
+* preview, selection state, and a settings button that opens the gallery
+* detail panel in the content sidebar (same wiring as ImageNode).
+*/
+/** Resolve the admin preview URL for a gallery image. */
+function galleryImageUrl(image) {
+	if (image.asset.url) return image.asset.url;
+	if (image.asset._ref) return `/_emdash/api/media/file/${encodeURIComponent(image.asset._ref)}`;
+	return "";
+}
+function GalleryNodeView({ node, updateAttributes, selected, deleteNode, editor, getPos }) {
+	const { _: _t } = useLingui();
+	const sidebarOpenRef = React$1.useRef(false);
+	const images = node.attrs.images ?? [];
+	const columns = typeof node.attrs.columns === "number" ? node.attrs.columns : 3;
+	const getAttrs = () => ({
+		images: node.attrs.images ?? [],
+		columns: typeof node.attrs.columns === "number" ? node.attrs.columns : void 0
+	});
+	const openSidebar = (selectedImageKey) => {
+		const onOpen = editor.storage.gallery?.onOpenBlockSidebar;
+		if (onOpen) {
+			sidebarOpenRef.current = true;
+			onOpen({
+				type: "gallery",
+				attrs: {
+					...getAttrs(),
+					selectedImageKey,
+					nodeKey: String(getPos?.() ?? "")
+				},
+				onUpdate: (attrs) => updateAttributes(attrs),
+				onReplace: (attrs) => updateAttributes(attrs),
+				onDelete: () => deleteNode(),
+				onClose: () => {
+					sidebarOpenRef.current = false;
+				}
+			});
+		}
+	};
+	const closeSidebar = () => {
+		if (!sidebarOpenRef.current) return;
+		const onClose = editor.storage.gallery?.onCloseBlockSidebar;
+		if (onClose) {
+			onClose();
+			sidebarOpenRef.current = false;
+		}
+	};
+	const toggleSidebar = () => {
+		if (sidebarOpenRef.current) closeSidebar();
+		else openSidebar();
+	};
+	React$1.useEffect(() => {
+		if (!selected) closeSidebar();
+	}, [selected]);
+	return /* @__PURE__ */ jsxs(NodeViewWrapper, {
+		className: cn("relative my-4 group", selected && "ring-2 ring-kumo-brand ring-offset-2 rounded-lg"),
+		children: [images.length === 0 ? /* @__PURE__ */ jsx(Button, {
+			type: "button",
+			variant: "outline",
+			className: "mt-2 w-full h-32 justify-center border-dashed",
+			onMouseDown: (e) => e.preventDefault(),
+			onClick: () => openSidebar(),
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col items-center gap-2 text-kumo-subtle",
+				children: [/* @__PURE__ */ jsx(Images, { className: "h-8 w-8" }), /* @__PURE__ */ jsx("span", {
+					className: "text-sm",
+					children: _t({
+						id: "Bk1Tv6",
+						message: "Empty gallery — open settings to add images"
+					})
+				})]
+			})
+		}) : /* @__PURE__ */ jsx("div", {
+			className: "grid gap-2 rounded-lg",
+			style: { gridTemplateColumns: `repeat(${Math.max(1, columns)}, 1fr)` },
+			children: images.map((image, index) => /* @__PURE__ */ jsxs("figure", {
+				className: "m-0",
+				children: [/* @__PURE__ */ jsx("button", {
+					type: "button",
+					className: "block w-full cursor-pointer",
+					onMouseDown: (e) => e.preventDefault(),
+					onClick: (e) => {
+						e.stopPropagation();
+						openSidebar(image._key);
+					},
+					"aria-label": _t({
+						id: "FjJx2y",
+						message: "Edit image {0}",
+						values: { 0: index + 1 }
+					}),
+					children: /* @__PURE__ */ jsx("img", {
+						src: galleryImageUrl(image),
+						alt: image.alt || "",
+						className: "w-full aspect-square object-cover rounded-md border",
+						draggable: false
+					})
+				}), image.caption && /* @__PURE__ */ jsx("figcaption", {
+					className: "text-xs text-kumo-subtle mt-1 text-center truncate",
+					children: image.caption
+				})]
+			}, image._key))
+		}), selected && /* @__PURE__ */ jsxs("div", {
+			className: "absolute top-2 end-2 flex gap-1 opacity-0 group-hover:opacity-100 transition-opacity",
+			children: [/* @__PURE__ */ jsx(Button, {
+				type: "button",
+				variant: "secondary",
+				shape: "square",
+				className: "h-8 w-8",
+				onMouseDown: (e) => e.preventDefault(),
+				onClick: toggleSidebar,
+				title: _t({
+					id: "VmtOUn",
+					message: "Gallery settings"
+				}),
+				"aria-label": _t({
+					id: "VmtOUn",
+					message: "Gallery settings"
+				}),
+				children: /* @__PURE__ */ jsx(SlidersHorizontal, { className: "h-4 w-4" })
+			}), /* @__PURE__ */ jsx(Button, {
+				type: "button",
+				variant: "destructive",
+				shape: "square",
+				className: "h-8 w-8",
+				onMouseDown: (e) => e.preventDefault(),
+				onClick: () => deleteNode(),
+				title: _t({
+					id: "HjItFk",
+					message: "Delete gallery"
+				}),
+				"aria-label": _t({
+					id: "HjItFk",
+					message: "Delete gallery"
+				}),
+				children: /* @__PURE__ */ jsx(Trash, { className: "h-4 w-4" })
+			})]
+		})]
+	});
+}
+const GalleryExtension = Node$1.create({
+	name: "gallery",
+	group: "block",
+	atom: true,
+	draggable: true,
+	addStorage() {
+		return {
+			onOpenBlockSidebar: null,
+			onCloseBlockSidebar: null
+		};
+	},
+	addAttributes() {
+		return {
+			images: { default: [] },
+			columns: { default: null }
+		};
+	},
+	parseHTML() {
+		return [{ tag: "div[data-type=\"gallery\"]" }];
+	},
+	renderHTML() {
+		return ["div", { "data-type": "gallery" }];
+	},
+	addNodeView() {
+		return ReactNodeViewRenderer(GalleryNodeView);
+	},
+	addCommands() {
+		return { setGallery: (options) => ({ commands }) => {
+			return commands.insertContent({
+				type: this.name,
+				attrs: options
+			});
+		} };
+	}
+});
+
+//#endregion
+//#region src/components/editor/GalleryDetailPanel.tsx
+/**
+* Gallery Detail Panel for Editor
+*
+* Sidebar panel for editing a gallery block: add images (multi-select media
+* picker), remove, drag-and-drop reorder, per-image alt/caption, and column
+* count. Changes apply immediately via onUpdate (reordering is inherently
+* live, so the whole panel follows suit instead of a save-button form).
+*/
+function generateKey$1() {
+	return Math.random().toString(36).substring(2, 11);
+}
+/** Map a picked MediaItem to the gallery's Portable Text image shape. */
+function mediaItemToGalleryImage(item) {
+	return {
+		_type: "image",
+		_key: generateKey$1(),
+		asset: {
+			_type: "reference",
+			_ref: item.id,
+			url: item.url,
+			provider: item.provider && item.provider !== "local" ? item.provider : void 0
+		},
+		alt: item.alt || "",
+		width: item.width,
+		height: item.height,
+		blurhash: item.blurhash ?? metaString(item.meta, "blurhash"),
+		dominantColor: item.dominantColor ?? metaString(item.meta, "dominantColor")
+	};
+}
+function GalleryDetailPanel({ attributes, onUpdate, onDelete, onClose, inline = false }) {
+	const { _: _t } = useLingui();
+	const sensors = useSensors(useSensor(PointerSensor, { activationConstraint: { distance: 6 } }));
+	const [showMediaPicker, setShowMediaPicker] = React$1.useState(false);
+	const selectedImageKey = attributes.selectedImageKey;
+	const nodeKey = attributes.nodeKey;
+	const [selectedKey, setSelectedKey] = React$1.useState(selectedImageKey ?? null);
+	React$1.useEffect(() => {
+		if (selectedImageKey != null) setSelectedKey(selectedImageKey);
+	}, [selectedImageKey]);
+	const [gallery, setGallery] = React$1.useState({
+		images: attributes.images ?? [],
+		columns: attributes.columns
+	});
+	React$1.useEffect(() => {
+		setGallery({
+			images: attributes.images ?? [],
+			columns: attributes.columns
+		});
+	}, [nodeKey]);
+	const images = gallery.images;
+	const columns = gallery.columns ?? 3;
+	const selectedImage = selectedKey ? images.find((image) => image._key === selectedKey) ?? null : null;
+	const apply = (patch) => {
+		setGallery((prev) => ({
+			...prev,
+			...patch
+		}));
+		onUpdate(patch);
+	};
+	const handleAdd = (items) => {
+		apply({ images: [...images, ...items.map(mediaItemToGalleryImage)] });
+	};
+	const handleRemove = (key) => {
+		apply({ images: images.filter((image) => image._key !== key) });
+		setSelectedKey((prev) => prev === key ? null : prev);
+	};
+	const handleImageChange = (key, patch) => {
+		apply({ images: images.map((image) => image._key === key ? {
+			...image,
+			...patch
+		} : image) });
+	};
+	const handleReplace = (key, item) => {
+		apply({ images: images.map((image) => image._key === key ? {
+			...image,
+			asset: {
+				_type: "reference",
+				_ref: item.id,
+				url: item.url,
+				provider: item.provider && item.provider !== "local" ? item.provider : void 0
+			},
+			alt: item.alt || "",
+			width: item.width,
+			height: item.height,
+			blurhash: item.blurhash ?? metaString(item.meta, "blurhash"),
+			dominantColor: item.dominantColor ?? metaString(item.meta, "dominantColor")
+		} : image) });
+	};
+	const handleDragEnd = (event) => {
+		const { active, over } = event;
+		if (!over || active.id === over.id) return;
+		const oldIndex = images.findIndex((image) => image._key === active.id);
+		const newIndex = images.findIndex((image) => image._key === over.id);
+		if (oldIndex === -1 || newIndex === -1) return;
+		apply({ images: arrayMove(images, oldIndex, newIndex) });
+	};
+	const body = /* @__PURE__ */ jsxs("div", {
+		className: "space-y-4",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ jsx("h3", {
+					className: "text-sm font-semibold",
+					children: _t({
+						id: "U+kFad",
+						message: "Gallery"
+					})
+				}), /* @__PURE__ */ jsx(Button, {
+					type: "button",
+					variant: "ghost",
+					shape: "square",
+					className: "h-8 w-8",
+					onClick: onClose,
+					"aria-label": _t({
+						id: "A6xK0W",
+						message: "Close gallery settings"
+					}),
+					children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+				})]
+			}),
+			/* @__PURE__ */ jsx(Select, {
+				label: _t({
+					id: "jEu4bB",
+					message: "Columns"
+				}),
+				value: String(columns),
+				onValueChange: (v) => apply({ columns: v ? parseInt(v, 10) : void 0 }),
+				items: {
+					"1": "1",
+					"2": "2",
+					"3": "3",
+					"4": "4",
+					"5": "5",
+					"6": "6"
+				}
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ jsx(Label, { children: _t({
+					id: "an5hVd",
+					message: "Images"
+				}) }), /* @__PURE__ */ jsx(Button, {
+					type: "button",
+					variant: "outline",
+					size: "sm",
+					icon: /* @__PURE__ */ jsx(Plus, {}),
+					onClick: () => setShowMediaPicker(true),
+					children: _t({
+						id: "9Pd+JF",
+						message: "Add Images"
+					})
+				})]
+			}),
+			images.length === 0 ? /* @__PURE__ */ jsx("p", {
+				className: "text-sm text-kumo-subtle text-center py-4",
+				children: _t({
+					id: "aETJnp",
+					message: "No images in this gallery yet."
+				})
+			}) : /* @__PURE__ */ jsx(DndContext, {
+				sensors,
+				collisionDetection: closestCenter,
+				onDragEnd: handleDragEnd,
+				children: /* @__PURE__ */ jsx(SortableContext, {
+					items: images.map((image) => image._key),
+					strategy: rectSortingStrategy,
+					children: /* @__PURE__ */ jsx("div", {
+						className: "grid grid-cols-3 gap-2",
+						children: images.map((image, index) => /* @__PURE__ */ jsx(SortableGalleryThumb, {
+							image,
+							index,
+							selected: selectedKey === image._key,
+							onSelect: () => setSelectedKey((prev) => prev === image._key ? null : image._key),
+							onRemove: () => handleRemove(image._key)
+						}, image._key))
+					})
+				})
+			}),
+			selectedImage && /* @__PURE__ */ jsx(GalleryImageSettings, {
+				image: selectedImage,
+				onChange: (patch) => handleImageChange(selectedImage._key, patch),
+				onReplace: (item) => handleReplace(selectedImage._key, item)
+			}, selectedImage._key),
+			/* @__PURE__ */ jsx(Button, {
+				type: "button",
+				variant: "destructive",
+				className: "w-full",
+				onClick: onDelete,
+				children: _t({
+					id: "HjItFk",
+					message: "Delete gallery"
+				})
+			}),
+			/* @__PURE__ */ jsx(MediaPickerModal, {
+				open: showMediaPicker,
+				onOpenChange: setShowMediaPicker,
+				multiple: true,
+				onSelect: () => {},
+				onSelectMany: handleAdd,
+				mimeTypeFilters: ["image/"],
+				title: _t({
+					id: "yHTMc+",
+					message: "Add images to gallery"
+				})
+			})
+		]
+	});
+	if (inline) return body;
+	return /* @__PURE__ */ jsx("div", {
+		className: "fixed inset-y-0 end-0 w-96 max-w-full bg-kumo-base border-s shadow-lg z-50 overflow-y-auto p-4",
+		children: body
+	});
+}
+function SortableGalleryThumb({ image, index, selected, onSelect, onRemove }) {
+	const { _: _t2 } = useLingui();
+	const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: image._key });
+	return /* @__PURE__ */ jsxs("div", {
+		ref: setNodeRef,
+		style: {
+			transform: CSS.Transform.toString(transform),
+			transition
+		},
+		className: "relative group",
+		children: [
+			/* @__PURE__ */ jsx(Button, {
+				type: "button",
+				variant: "ghost",
+				shape: "square",
+				"aria-label": image.alt || _t2({
+					id: "4lIvAN",
+					message: "Image {0}",
+					values: { 0: index + 1 }
+				}),
+				className: cn("aspect-square h-full w-full rounded-md border overflow-hidden", selected && "ring-2 ring-kumo-brand"),
+				onClick: onSelect,
+				...attributes,
+				...listeners,
+				children: /* @__PURE__ */ jsx("img", {
+					src: galleryImageUrl(image),
+					alt: image.alt || "",
+					className: "object-cover w-full h-full",
+					draggable: false
+				})
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				type: "button",
+				variant: "destructive",
+				shape: "square",
+				className: "absolute top-1 end-1 h-6 w-6 opacity-0 group-hover:opacity-100 focus:opacity-100",
+				onClick: (e) => {
+					e.stopPropagation();
+					onRemove();
+				},
+				onPointerDown: (e) => e.stopPropagation(),
+				"aria-label": _t2({
+					id: "YMIArw",
+					message: "Remove image {0}",
+					values: { 0: index + 1 }
+				}),
+				children: /* @__PURE__ */ jsx(Trash, { className: "h-3 w-3" })
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "absolute bottom-1 start-1 text-[10px] bg-black/60 text-white rounded px-1",
+				"aria-hidden": true,
+				children: index + 1
+			})
+		]
+	});
+}
+function GalleryImageSettings({ image, onChange, onReplace }) {
+	const { _: _t3 } = useLingui();
+	const [showReplacePicker, setShowReplacePicker] = React$1.useState(false);
+	const hasOriginalSize = typeof image.width === "number" && typeof image.height === "number";
+	return /* @__PURE__ */ jsxs("div", {
+		className: "border rounded-lg p-3 space-y-3",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "aspect-video bg-kumo-tint rounded-lg overflow-hidden flex items-center justify-center relative group",
+				children: [/* @__PURE__ */ jsx("img", {
+					src: galleryImageUrl(image),
+					alt: image.alt || "",
+					className: "max-h-full max-w-full object-contain",
+					draggable: false
+				}), /* @__PURE__ */ jsx("div", {
+					className: "absolute inset-0 bg-black/50 opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center",
+					children: /* @__PURE__ */ jsx(Button, {
+						type: "button",
+						variant: "outline",
+						size: "sm",
+						icon: /* @__PURE__ */ jsx(ImageSquare, {}),
+						onClick: () => setShowReplacePicker(true),
+						children: _t3({
+							id: "YOzD/a",
+							message: "Replace image"
+						})
+					})
+				})]
+			}),
+			hasOriginalSize && /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-2 text-sm",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "text-kumo-subtle",
+					children: _t3({
+						id: "9DNTTa",
+						message: "Original:"
+					})
+				}), /* @__PURE__ */ jsxs("span", { children: [
+					image.width,
+					" × ",
+					image.height
+				] })]
+			}),
+			/* @__PURE__ */ jsx(Input, {
+				label: _t3({
+					id: "u/DP73",
+					message: "Alt text"
+				}),
+				value: image.alt ?? "",
+				onChange: (e) => onChange({ alt: e.target.value }),
+				placeholder: _t3({
+					id: "BwNww/",
+					message: "Describe the image..."
+				})
+			}),
+			/* @__PURE__ */ jsx(Input, {
+				label: _t3({
+					id: "3Z1aAQ",
+					message: "Caption"
+				}),
+				value: image.caption ?? "",
+				onChange: (e) => onChange({ caption: e.target.value || void 0 }),
+				placeholder: _t3({
+					id: "0IiIv1",
+					message: "Optional caption"
+				})
+			}),
+			/* @__PURE__ */ jsx(MediaPickerModal, {
+				open: showReplacePicker,
+				onOpenChange: setShowReplacePicker,
+				onSelect: (item) => {
+					onReplace(item);
+					setShowReplacePicker(false);
+				},
+				mimeTypeFilters: ["image/"],
+				title: _t3({
+					id: "YOzD/a",
+					message: "Replace image"
+				})
+			})
+		]
+	});
+}
+
 //#endregion
 //#region src/components/editor/ImageDetailPanel.tsx
 /**
@@ -5611,7 +6187,7 @@ function formatFullDate(dateString) {
 * RevisionHistory component - displays revision history for a content item
 * with ability to restore previous versions.
 */
-function RevisionHistory({ collection, entryId, onRestored }) {
+function RevisionHistory({ collection, entryId, onRestored, reserveHeaderEnd = false }) {
 	const { _: _t } = useLingui();
 	const [isExpanded, setIsExpanded] = React$1.useState(false);
 	const [selectedRevision, setSelectedRevision] = React$1.useState(null);
@@ -5679,7 +6255,7 @@ function RevisionHistory({ collection, entryId, onRestored }) {
 				variant: "ghost",
 				className: "relative justify-between",
 				style: {
-					width: "calc(100% + 1.5rem)",
+					width: reserveHeaderEnd ? "calc(100% - 1.5rem)" : "calc(100% + 1.5rem)",
 					insetInlineStart: "-0.75rem"
 				}
 			}),
@@ -6483,6 +7059,207 @@ function SeoPanel({ contentKey, seo, onChange }) {
 	});
 }
 
+//#endregion
+//#region src/lib/content-settings-layout.ts
+const CONTENT_SETTINGS_LAYOUT_VERSION = 1;
+const DEFAULT_CONTENT_SETTINGS_SECTION_ORDER = [
+	"publish",
+	"ownership",
+	"bylines",
+	"translations",
+	"taxonomies",
+	"seo",
+	"outline",
+	"revisions"
+];
+const KNOWN_SECTION_IDS = new Set(DEFAULT_CONTENT_SETTINGS_SECTION_ORDER);
+function isRecord(value) {
+	return typeof value === "object" && value !== null;
+}
+function isKnownSectionId(value) {
+	return typeof value === "string" && KNOWN_SECTION_IDS.has(value);
+}
+/** Parse a browser preference without allowing malformed state to break the editor. */
+function parseContentSettingsLayout(raw) {
+	if (!raw) return null;
+	try {
+		const value = JSON.parse(raw);
+		if (!isRecord(value) || value.version !== CONTENT_SETTINGS_LAYOUT_VERSION || !Array.isArray(value.order)) return null;
+		return {
+			version: CONTENT_SETTINGS_LAYOUT_VERSION,
+			order: value.order.filter(isKnownSectionId)
+		};
+	} catch {
+		return null;
+	}
+}
+/**
+* Reconcile saved order with the current defaults. Duplicate and unknown ids
+* disappear, while sections introduced by a later EmDash version append.
+*/
+function resolveContentSettingsLayout(stored) {
+	const seen = /* @__PURE__ */ new Set();
+	const order = (stored?.order ?? []).filter((id) => {
+		if (seen.has(id)) return false;
+		seen.add(id);
+		return true;
+	});
+	for (const id of DEFAULT_CONTENT_SETTINGS_SECTION_ORDER) {
+		if (seen.has(id)) continue;
+		order.push(id);
+		seen.add(id);
+	}
+	return {
+		version: CONTENT_SETTINGS_LAYOUT_VERSION,
+		order
+	};
+}
+function reorderContentSettingsLayout(layout, activeId, overId) {
+	if (activeId === overId) return layout;
+	const from = layout.order.indexOf(activeId);
+	const to = layout.order.indexOf(overId);
+	if (from < 0 || to < 0) return layout;
+	const order = [...layout.order];
+	const [moved] = order.splice(from, 1);
+	if (!moved) return layout;
+	order.splice(to, 0, moved);
+	return {
+		...layout,
+		order
+	};
+}
+
+//#endregion
+//#region src/components/SortableContentSettingsSections.tsx
+const STORAGE_PREFIX = "emdash:content-settings-layout:v1";
+const restrictToVerticalAxis = ({ transform }) => ({
+	...transform,
+	x: 0
+});
+function readStoredLayout(storageKey) {
+	if (!storageKey || typeof window === "undefined") return null;
+	try {
+		return parseContentSettingsLayout(window.localStorage.getItem(storageKey));
+	} catch {
+		return null;
+	}
+}
+function writeStoredLayout(storageKey, layout) {
+	if (!storageKey || typeof window === "undefined") return;
+	try {
+		window.localStorage.setItem(storageKey, JSON.stringify(layout));
+	} catch {}
+}
+function SortableContentSettingsSections({ collection, userId, onSortingChange, children }) {
+	const storageKey = userId ? `${STORAGE_PREFIX}:${encodeURIComponent(userId)}:${encodeURIComponent(collection)}` : null;
+	const [storedLayout, setStoredLayout] = React$1.useState(null);
+	const [activeId, setActiveId] = React$1.useState(null);
+	React$1.useEffect(() => {
+		setStoredLayout(readStoredLayout(storageKey));
+	}, [storageKey]);
+	const layout = React$1.useMemo(() => resolveContentSettingsLayout(storedLayout), [storedLayout]);
+	const sectionsById = React$1.useMemo(() => {
+		const sections = React$1.Children.toArray(children).filter((child) => React$1.isValidElement(child));
+		return new Map(sections.map((section) => [section.props.id, section]));
+	}, [children]);
+	const visibleIds = React$1.useMemo(() => layout.order.filter((id) => sectionsById.has(id)), [layout.order, sectionsById]);
+	const sensors = useSensors(useSensor(PointerSensor, { activationConstraint: { distance: 6 } }), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
+	const handleDragStart = React$1.useCallback((event) => {
+		setActiveId(String(event.active.id));
+		onSortingChange?.(true);
+	}, [onSortingChange]);
+	const handleDragCancel = React$1.useCallback(() => {
+		setActiveId(null);
+		onSortingChange?.(false);
+	}, [onSortingChange]);
+	const handleDragEnd = React$1.useCallback((event) => {
+		setActiveId(null);
+		onSortingChange?.(false);
+		if (event.over && event.active.id !== event.over.id) {
+			const movedId = String(event.active.id);
+			const overId = String(event.over.id);
+			setStoredLayout((current) => {
+				const next = reorderContentSettingsLayout(resolveContentSettingsLayout(current), movedId, overId);
+				writeStoredLayout(storageKey, next);
+				return next;
+			});
+		}
+	}, [onSortingChange, storageKey]);
+	return /* @__PURE__ */ jsx(DndContext, {
+		sensors,
+		collisionDetection: closestCenter,
+		modifiers: [restrictToVerticalAxis],
+		measuring: { droppable: { strategy: MeasuringStrategy.Always } },
+		onDragStart: handleDragStart,
+		onDragCancel: handleDragCancel,
+		onDragEnd: handleDragEnd,
+		children: /* @__PURE__ */ jsx(SortableContext, {
+			items: visibleIds,
+			strategy: verticalListSortingStrategy,
+			children: visibleIds.map((id) => {
+				const section = sectionsById.get(id);
+				return section ? React$1.cloneElement(section, {
+					key: id,
+					isSorting: activeId !== null
+				}) : null;
+			})
+		})
+	});
+}
+function SortableContentSettingsSection({ id, label, disclosure = false, children, isSorting = false }) {
+	const { _: _t } = useLingui();
+	const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({ id });
+	return /* @__PURE__ */ jsxs("section", {
+		ref: setNodeRef,
+		style: {
+			transform: transform ? CSS.Transform.toString({
+				...transform,
+				x: 0
+			}) : void 0,
+			transition,
+			zIndex: isDragging ? 10 : void 0,
+			inlineSize: "100%"
+		},
+		"data-sorting": isSorting ? "true" : "false",
+		"data-disclosure": disclosure ? "true" : "false",
+		className: cn("relative min-w-0 border-t bg-kumo-base first:border-t-0", isSorting && "[&>*:not([data-sortable-heading]):not([data-sortable-handle])]:hidden", isDragging && "bg-kumo-tint opacity-60"),
+		children: [
+			isSorting && /* @__PURE__ */ jsx("div", {
+				"data-sortable-heading": true,
+				className: "flex items-center px-4 pe-12",
+				style: { minHeight: 48 },
+				children: /* @__PURE__ */ jsx("span", {
+					className: "text-[15px] font-semibold",
+					children: label
+				})
+			}),
+			children,
+			/* @__PURE__ */ jsx("button", {
+				type: "button",
+				"data-sortable-handle": true,
+				"data-sorting": isSorting ? "true" : "false",
+				...attributes,
+				...listeners,
+				className: cn("absolute z-10 grid size-7 touch-none cursor-grab place-items-center rounded-md text-kumo-subtle hover:bg-kumo-tint hover:text-kumo-default focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-kumo-accent active:cursor-grabbing", isSorting ? "end-3 top-1/2 -translate-y-1/2" : "top-3", !isSorting && "end-3"),
+				"aria-label": _t({
+					id: "LGF0vE",
+					message: "Drag to reorder {label}",
+					values: { label }
+				}),
+				title: _t({
+					id: "LGF0vE",
+					message: "Drag to reorder {label}",
+					values: { label }
+				}),
+				children: /* @__PURE__ */ jsx(DotsSixVertical, {
+					size: 16,
+					"aria-hidden": "true"
+				})
+			})
+		]
+	});
+}
+
 //#endregion
 //#region src/lib/taxonomy-match.ts
 /**
@@ -6558,6 +7335,17 @@ const EMPTY_TERMS = [];
 async function fetchTaxonomyDefs$1() {
 	return (await parseApiResponse(await apiFetch(`/_emdash/api/taxonomies`), "Failed to fetch taxonomies")).taxonomies;
 }
+function useApplicableTaxonomies(collection) {
+	const { data: taxonomies = [] } = useQuery({
+		queryKey: ["taxonomy-defs"],
+		queryFn: fetchTaxonomyDefs$1
+	});
+	return taxonomies.filter((taxonomy) => taxonomy.collections.includes(collection));
+}
+/** Whether the editor should include a taxonomy settings section. */
+function useHasApplicableTaxonomies(collection) {
+	return useApplicableTaxonomies(collection).length > 0;
+}
 /**
 * Fetch terms for a taxonomy, scoped to the entry's locale so only the matching
 * translation variants are offered.
@@ -6927,11 +7715,7 @@ function TaxonomySection({ taxonomy, collection, entryId, entryLocale, onChange
 */
 function TaxonomySidebar({ collection, entryId, entryLocale, onChange, className }) {
 	const { _: _t3 } = useLingui();
-	const { data: taxonomies = [] } = useQuery({
-		queryKey: ["taxonomy-defs"],
-		queryFn: fetchTaxonomyDefs$1
-	});
-	const applicableTaxonomies = taxonomies.filter((tax) => tax.collections.includes(collection));
+	const applicableTaxonomies = useApplicableTaxonomies(collection);
 	if (applicableTaxonomies.length === 0) return null;
 	return /* @__PURE__ */ jsx("div", {
 		className: cn(className),
@@ -7228,7 +8012,9 @@ const ContentSettingsPanel = React$1.memo(function ContentSettingsPanel({ collec
 	const navigate = useNavigate$1();
 	const [scheduleDate, setScheduleDate] = React$1.useState("");
 	const [showScheduler, setShowScheduler] = React$1.useState(false);
+	const [isReorderingSections, setIsReorderingSections] = React$1.useState(false);
 	const showDiscard = !isNew && supportsDrafts && hasPendingChanges && !!onDiscardDraft;
+	const hasApplicableTaxonomies = useHasApplicableTaxonomies(collection);
 	const handleScheduleSubmit = () => {
 		if (scheduleDate && onSchedule) {
 			onSchedule(new Date(scheduleDate).toISOString());
@@ -7246,318 +8032,395 @@ const ContentSettingsPanel = React$1.memo(function ContentSettingsPanel({ collec
 			onClose: onBlockSidebarClose,
 			inline: true
 		})
+	}) : blockSidebarPanel.type === "gallery" ? /* @__PURE__ */ jsx("div", {
+		className: "p-4",
+		children: /* @__PURE__ */ jsx(GalleryDetailPanel, {
+			attributes: blockSidebarPanel.attrs,
+			onUpdate: (attrs) => blockSidebarPanel.onUpdate(attrs),
+			onDelete: onBlockSidebarDelete,
+			onClose: onBlockSidebarClose,
+			inline: true
+		})
 	}) : null;
 	return /* @__PURE__ */ jsxs("div", {
 		className: "flex flex-col whitespace-normal",
-		children: [
-			/* @__PURE__ */ jsxs("div", {
-				className: "p-4",
-				children: [
-					/* @__PURE__ */ jsx(Text, {
-						bold: true,
-						as: "h3",
-						DANGEROUS_className: "mb-4",
-						children: _t5({
-							id: "EEYbdt",
-							message: "Publish"
-						})
+		children: [/* @__PURE__ */ jsxs(SortableContentSettingsSections, {
+			collection,
+			userId: currentUser?.id,
+			onSortingChange: setIsReorderingSections,
+			children: [
+				/* @__PURE__ */ jsx(SortableContentSettingsSection, {
+					id: "publish",
+					label: _t5({
+						id: "EEYbdt",
+						message: "Publish"
 					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: "space-y-4",
+					children: /* @__PURE__ */ jsxs("div", {
+						className: "p-4",
 						children: [
-							/* @__PURE__ */ jsx(Input, {
-								label: _t5({
-									id: "L85WcV",
-									message: "Slug"
-								}),
-								value: slug,
-								onChange: (e) => onSlugChange(e.target.value),
-								placeholder: "my-post-slug"
-							}),
-							/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
-								className: "flex flex-wrap items-center gap-x-3 gap-y-1.5",
-								children: [/* @__PURE__ */ jsx(Label, { children: _t5({
-									id: "uAQUqI",
-									message: "Status"
-								}) }), supportsDrafts ? /* @__PURE__ */ jsxs(Fragment, { children: [
-									isLive && /* @__PURE__ */ jsx(Badge, {
-										variant: "success",
-										children: _t5({
-											id: "u3wRF+",
-											message: "Published"
-										})
-									}),
-									hasPendingChanges && /* @__PURE__ */ jsx(Badge, {
-										variant: "secondary",
-										children: _t5({
-											id: "fkUmSB",
-											message: "Pending changes"
-										})
-									}),
-									!isLive && !hasSchedule && /* @__PURE__ */ jsx(Badge, {
-										variant: "secondary",
-										children: _t5({
-											id: "eneWvv",
-											message: "Draft"
-										})
-									}),
-									hasSchedule && /* @__PURE__ */ jsx(Badge, {
-										variant: "outline",
-										children: _t5({
-											id: "4ba0NE",
-											message: "Scheduled"
-										})
-									})
-								] }) : /* @__PURE__ */ jsx(Badge, {
-									variant: "secondary",
-									children: status.charAt(0).toUpperCase() + status.slice(1)
-								})]
-							}), showDiscard && /* @__PURE__ */ jsx("div", {
-								className: "mt-2",
-								children: /* @__PURE__ */ jsx(DiscardDraftDialog, {
-									onDiscard: onDiscardDraft,
-									triggerVariant: "outline",
-									triggerSize: "sm"
+							/* @__PURE__ */ jsx(Text, {
+								bold: true,
+								as: "h3",
+								DANGEROUS_className: "mb-4",
+								children: _t5({
+									id: "EEYbdt",
+									message: "Publish"
 								})
-							})] }),
-							item?.scheduledAt && /* @__PURE__ */ jsxs("div", {
-								className: "flex items-center justify-between gap-2 rounded-lg border px-3 py-2",
-								children: [/* @__PURE__ */ jsx("p", {
-									className: "text-xs text-kumo-subtle",
-									children: _t5({
-										id: "MjRZEl",
-										message: "Scheduled for: {0}",
-										values: { 0: formatScheduledDate(item.scheduledAt) }
-									})
-								}), /* @__PURE__ */ jsx(Button, {
-									type: "button",
-									variant: "outline",
-									size: "sm",
-									onClick: onUnschedule,
-									children: _t5({
-										id: "ssbNAt",
-										message: "Unschedule"
-									})
-								})]
 							}),
-							canSchedule && /* @__PURE__ */ jsx("div", {
-								className: "pt-2",
-								children: showScheduler ? /* @__PURE__ */ jsxs("div", {
-									className: "space-y-2",
-									children: [/* @__PURE__ */ jsx(Input, {
+							/* @__PURE__ */ jsxs("div", {
+								className: "space-y-4",
+								children: [
+									/* @__PURE__ */ jsx(Input, {
 										label: _t5({
-											id: "x6lWtJ",
-											message: "Schedule for"
+											id: "L85WcV",
+											message: "Slug"
 										}),
-										type: "datetime-local",
-										value: scheduleDate,
-										onChange: (e) => setScheduleDate(e.target.value),
-										min: (/* @__PURE__ */ new Date()).toISOString().slice(0, 16)
-									}), /* @__PURE__ */ jsxs("div", {
-										className: "flex gap-2",
-										children: [/* @__PURE__ */ jsx(Button, {
-											type: "button",
-											size: "sm",
-											onClick: handleScheduleSubmit,
-											disabled: !scheduleDate || isScheduling,
-											icon: isScheduling ? /* @__PURE__ */ jsx(Loader, { size: "sm" }) : void 0,
+										value: slug,
+										onChange: (e) => onSlugChange(e.target.value),
+										placeholder: "my-post-slug"
+									}),
+									/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
+										className: "flex flex-wrap items-center gap-x-3 gap-y-1.5",
+										children: [/* @__PURE__ */ jsx(Label, { children: _t5({
+											id: "uAQUqI",
+											message: "Status"
+										}) }), supportsDrafts ? /* @__PURE__ */ jsxs(Fragment, { children: [
+											isLive && /* @__PURE__ */ jsx(Badge, {
+												variant: "success",
+												children: _t5({
+													id: "u3wRF+",
+													message: "Published"
+												})
+											}),
+											hasPendingChanges && /* @__PURE__ */ jsx(Badge, {
+												variant: "secondary",
+												children: _t5({
+													id: "fkUmSB",
+													message: "Pending changes"
+												})
+											}),
+											!isLive && !hasSchedule && /* @__PURE__ */ jsx(Badge, {
+												variant: "secondary",
+												children: _t5({
+													id: "eneWvv",
+													message: "Draft"
+												})
+											}),
+											hasSchedule && /* @__PURE__ */ jsx(Badge, {
+												variant: "outline",
+												children: _t5({
+													id: "4ba0NE",
+													message: "Scheduled"
+												})
+											})
+										] }) : /* @__PURE__ */ jsx(Badge, {
+											variant: "secondary",
+											children: status.charAt(0).toUpperCase() + status.slice(1)
+										})]
+									}), showDiscard && /* @__PURE__ */ jsx("div", {
+										className: "mt-2",
+										children: /* @__PURE__ */ jsx(DiscardDraftDialog, {
+											onDiscard: onDiscardDraft,
+											triggerVariant: "outline",
+											triggerSize: "sm"
+										})
+									})] }),
+									item?.scheduledAt && /* @__PURE__ */ jsxs("div", {
+										className: "flex items-center justify-between gap-2 rounded-lg border px-3 py-2",
+										children: [/* @__PURE__ */ jsx("p", {
+											className: "text-xs text-kumo-subtle",
 											children: _t5({
-												id: "gmB6oO",
-												message: "Schedule"
+												id: "MjRZEl",
+												message: "Scheduled for: {0}",
+												values: { 0: formatScheduledDate(item.scheduledAt) }
 											})
 										}), /* @__PURE__ */ jsx(Button, {
 											type: "button",
 											variant: "outline",
 											size: "sm",
-											onClick: () => {
-												setShowScheduler(false);
-												setScheduleDate("");
-											},
+											onClick: onUnschedule,
 											children: _t5({
-												id: "dEgA5A",
-												message: "Cancel"
+												id: "ssbNAt",
+												message: "Unschedule"
 											})
 										})]
-									})]
-								}) : /* @__PURE__ */ jsx(Button, {
-									type: "button",
-									variant: "outline",
-									size: "sm",
-									className: "w-full",
-									onClick: () => setShowScheduler(true),
-									children: _t5({
-										id: "QS1Nla",
-										message: "Schedule for later"
+									}),
+									canSchedule && /* @__PURE__ */ jsx("div", {
+										className: "pt-2",
+										children: showScheduler ? /* @__PURE__ */ jsxs("div", {
+											className: "space-y-2",
+											children: [/* @__PURE__ */ jsx(Input, {
+												label: _t5({
+													id: "x6lWtJ",
+													message: "Schedule for"
+												}),
+												type: "datetime-local",
+												value: scheduleDate,
+												onChange: (e) => setScheduleDate(e.target.value),
+												min: (/* @__PURE__ */ new Date()).toISOString().slice(0, 16)
+											}), /* @__PURE__ */ jsxs("div", {
+												className: "flex gap-2",
+												children: [/* @__PURE__ */ jsx(Button, {
+													type: "button",
+													size: "sm",
+													onClick: handleScheduleSubmit,
+													disabled: !scheduleDate || isScheduling,
+													icon: isScheduling ? /* @__PURE__ */ jsx(Loader, { size: "sm" }) : void 0,
+													children: _t5({
+														id: "gmB6oO",
+														message: "Schedule"
+													})
+												}), /* @__PURE__ */ jsx(Button, {
+													type: "button",
+													variant: "outline",
+													size: "sm",
+													onClick: () => {
+														setShowScheduler(false);
+														setScheduleDate("");
+													},
+													children: _t5({
+														id: "dEgA5A",
+														message: "Cancel"
+													})
+												})]
+											})]
+										}) : /* @__PURE__ */ jsx(Button, {
+											type: "button",
+											variant: "outline",
+											size: "sm",
+											className: "w-full",
+											onClick: () => setShowScheduler(true),
+											children: _t5({
+												id: "QS1Nla",
+												message: "Schedule for later"
+											})
+										})
 									})
-								})
+								]
+							}),
+							item && /* @__PURE__ */ jsxs("dl", {
+								"data-testid": "content-timestamps",
+								className: "mt-4 border-t pt-4 space-y-1 text-xs text-kumo-subtle",
+								children: [/* @__PURE__ */ jsxs("div", {
+									className: "flex items-center justify-between gap-2",
+									children: [/* @__PURE__ */ jsx("dt", { children: _t5({
+										id: "d+F6q9",
+										message: "Created"
+									}) }), /* @__PURE__ */ jsx("dd", { children: new Date(item.createdAt).toLocaleString() })]
+								}), /* @__PURE__ */ jsxs("div", {
+									className: "flex items-center justify-between gap-2",
+									children: [/* @__PURE__ */ jsx("dt", { children: _t5({
+										id: "+b7T3G",
+										message: "Updated"
+									}) }), /* @__PURE__ */ jsx("dd", { children: new Date(item.updatedAt).toLocaleString() })]
+								})]
 							})
 						]
-					}),
-					item && /* @__PURE__ */ jsxs("dl", {
-						"data-testid": "content-timestamps",
-						className: "mt-4 border-t pt-4 space-y-1 text-xs text-kumo-subtle",
-						children: [/* @__PURE__ */ jsxs("div", {
-							className: "flex items-center justify-between gap-2",
-							children: [/* @__PURE__ */ jsx("dt", { children: _t5({
-								id: "d+F6q9",
-								message: "Created"
-							}) }), /* @__PURE__ */ jsx("dd", { children: new Date(item.createdAt).toLocaleString() })]
-						}), /* @__PURE__ */ jsxs("div", {
-							className: "flex items-center justify-between gap-2",
-							children: [/* @__PURE__ */ jsx("dt", { children: _t5({
-								id: "+b7T3G",
-								message: "Updated"
-							}) }), /* @__PURE__ */ jsx("dd", { children: new Date(item.updatedAt).toLocaleString() })]
-						})]
 					})
-				]
-			}),
-			currentUser && currentUser.role >= ROLE_EDITOR$3 && users && users.length > 0 && /* @__PURE__ */ jsxs("div", {
-				className: "p-4 border-t",
-				children: [/* @__PURE__ */ jsx(Text, {
-					bold: true,
-					as: "h3",
-					DANGEROUS_className: "mb-4",
-					children: _t5({
+				}),
+				currentUser && currentUser.role >= ROLE_EDITOR$3 && users && users.length > 0 && /* @__PURE__ */ jsx(SortableContentSettingsSection, {
+					id: "ownership",
+					label: _t5({
 						id: "oDAEQq",
 						message: "Ownership"
+					}),
+					children: /* @__PURE__ */ jsxs("div", {
+						className: "p-4",
+						children: [/* @__PURE__ */ jsx(Text, {
+							bold: true,
+							as: "h3",
+							DANGEROUS_className: "mb-4",
+							children: _t5({
+								id: "oDAEQq",
+								message: "Ownership"
+							})
+						}), /* @__PURE__ */ jsx(AuthorSelector, {
+							authorId: item?.authorId || null,
+							users,
+							onChange: onAuthorChange
+						})]
 					})
-				}), /* @__PURE__ */ jsx(AuthorSelector, {
-					authorId: item?.authorId || null,
-					users,
-					onChange: onAuthorChange
-				})]
-			}),
-			currentUser && currentUser.role >= ROLE_EDITOR$3 && /* @__PURE__ */ jsxs("div", {
-				className: "p-4 border-t",
-				children: [/* @__PURE__ */ jsx(Text, {
-					bold: true,
-					as: "h3",
-					DANGEROUS_className: "mb-4",
-					children: _t5({
+				}),
+				currentUser && currentUser.role >= ROLE_EDITOR$3 && /* @__PURE__ */ jsx(SortableContentSettingsSection, {
+					id: "bylines",
+					label: _t5({
 						id: "xLGa7J",
 						message: "Bylines"
+					}),
+					children: /* @__PURE__ */ jsxs("div", {
+						className: "p-4",
+						children: [/* @__PURE__ */ jsx(Text, {
+							bold: true,
+							as: "h3",
+							DANGEROUS_className: "mb-4",
+							children: _t5({
+								id: "xLGa7J",
+								message: "Bylines"
+							})
+						}), /* @__PURE__ */ jsx(BylineCreditsEditor, {
+							credits: activeBylines,
+							bylines: availableBylines ?? [],
+							selectedBylineDetails: item?.bylines?.map((entry) => entry.byline),
+							bylinesLoaded: availableBylinesLoaded,
+							onChange: onBylinesChange,
+							onQuickCreate: onQuickCreateByline,
+							onQuickEdit: onQuickEditByline,
+							entryLocale: item?.locale ?? entryLocale,
+							i18n
+						})]
 					})
-				}), /* @__PURE__ */ jsx(BylineCreditsEditor, {
-					credits: activeBylines,
-					bylines: availableBylines ?? [],
-					selectedBylineDetails: item?.bylines?.map((entry) => entry.byline),
-					bylinesLoaded: availableBylinesLoaded,
-					onChange: onBylinesChange,
-					onQuickCreate: onQuickCreateByline,
-					onQuickEdit: onQuickEditByline,
-					entryLocale: item?.locale ?? entryLocale,
-					i18n
-				})]
-			}),
-			i18n && item && !isNew && /* @__PURE__ */ jsx("div", {
-				className: "p-4 border-t",
-				children: /* @__PURE__ */ jsx(TranslationsPanel, {
-					locales: i18n.locales,
-					defaultLocale: i18n.defaultLocale,
-					currentLocale: item.locale ?? void 0,
-					translations: translations ?? [],
-					onOpen: (tr) => navigate({
-						to: "/content/$collection/$id",
-						params: {
-							collection,
-							id: tr.id
-						},
-						search: { locale: tr.locale }
+				}),
+				i18n && item && !isNew && /* @__PURE__ */ jsx(SortableContentSettingsSection, {
+					id: "translations",
+					label: _t5({
+						id: "kAy5R9",
+						message: "Translations"
 					}),
-					onCreate: onTranslate
-				})
-			}),
-			item && /* @__PURE__ */ jsx(TaxonomySidebar, {
-				className: "p-4 border-t",
-				collection,
-				entryId: item.id,
-				entryLocale: item.locale ?? entryLocale
-			}),
-			hasSeo && !isNew && onSeoChange && /* @__PURE__ */ jsxs("div", {
-				className: "p-4 border-t",
-				children: [/* @__PURE__ */ jsx(Text, {
-					bold: true,
-					as: "h3",
-					DANGEROUS_className: "mb-4",
-					children: _t5({
+					children: /* @__PURE__ */ jsx("div", {
+						className: "p-4",
+						children: /* @__PURE__ */ jsx(TranslationsPanel, {
+							locales: i18n.locales,
+							defaultLocale: i18n.defaultLocale,
+							currentLocale: item.locale ?? void 0,
+							translations: translations ?? [],
+							onOpen: (tr) => navigate({
+								to: "/content/$collection/$id",
+								params: {
+									collection,
+									id: tr.id
+								},
+								search: { locale: tr.locale }
+							}),
+							onCreate: onTranslate
+						})
+					})
+				}),
+				item && hasApplicableTaxonomies && /* @__PURE__ */ jsx(SortableContentSettingsSection, {
+					id: "taxonomies",
+					label: _t5({
+						id: "sMNeA/",
+						message: "Taxonomies"
+					}),
+					children: /* @__PURE__ */ jsx(TaxonomySidebar, {
+						className: "p-4",
+						collection,
+						entryId: item.id,
+						entryLocale: item.locale ?? entryLocale
+					})
+				}),
+				hasSeo && !isNew && onSeoChange && /* @__PURE__ */ jsx(SortableContentSettingsSection, {
+					id: "seo",
+					label: _t5({
 						id: "4Ml90q",
 						message: "SEO"
+					}),
+					children: /* @__PURE__ */ jsxs("div", {
+						className: "p-4",
+						children: [/* @__PURE__ */ jsx(Text, {
+							bold: true,
+							as: "h3",
+							DANGEROUS_className: "mb-4",
+							children: _t5({
+								id: "4Ml90q",
+								message: "SEO"
+							})
+						}), /* @__PURE__ */ jsx(SeoPanel, {
+							contentKey: item?.id ?? `new:${collection}`,
+							seo: item?.seo,
+							onChange: onSeoChange
+						})]
 					})
-				}), /* @__PURE__ */ jsx(SeoPanel, {
-					contentKey: item?.id ?? `new:${collection}`,
-					seo: item?.seo,
-					onChange: onSeoChange
-				})]
-			}),
-			portableTextEditor && /* @__PURE__ */ jsx("div", {
-				className: "p-4 border-t",
-				children: /* @__PURE__ */ jsx(DocumentOutline, { editor: portableTextEditor })
-			}),
-			!isNew && item && supportsRevisions && /* @__PURE__ */ jsx("div", {
-				className: "p-4 border-t",
-				children: /* @__PURE__ */ jsx(RevisionHistory, {
-					collection,
-					entryId: item.id
-				})
-			}),
-			!isNew && onDelete && /* @__PURE__ */ jsx("div", {
-				className: "border-t p-4",
-				children: /* @__PURE__ */ jsxs(Dialog.Root, {
-					disablePointerDismissal: true,
-					children: [/* @__PURE__ */ jsx(Dialog.Trigger, { render: (p) => /* @__PURE__ */ jsx(Button, {
-						...p,
-						type: "button",
-						variant: "outline",
-						className: "w-full text-kumo-danger hover:text-kumo-danger",
-						disabled: isDeleting,
-						icon: isDeleting ? /* @__PURE__ */ jsx(Loader, { size: "sm" }) : /* @__PURE__ */ jsx(Trash, {}),
-						children: _t5({
-							id: "q3TWG7",
-							message: "Move to Trash"
+				}),
+				portableTextEditor && /* @__PURE__ */ jsx(SortableContentSettingsSection, {
+					id: "outline",
+					label: _t5({
+						id: "dD7NPy",
+						message: "Outline"
+					}),
+					disclosure: true,
+					children: /* @__PURE__ */ jsx("div", {
+						className: "p-4",
+						children: /* @__PURE__ */ jsx(DocumentOutline, {
+							editor: portableTextEditor,
+							reserveHeaderEnd: true
 						})
-					}) }), /* @__PURE__ */ jsxs(Dialog, {
-						className: "p-6",
-						size: "sm",
-						children: [
-							/* @__PURE__ */ jsx(Dialog.Title, {
-								className: "text-lg font-semibold",
+					})
+				}),
+				!isNew && item && supportsRevisions && /* @__PURE__ */ jsx(SortableContentSettingsSection, {
+					id: "revisions",
+					label: _t5({
+						id: "ZdWn/b",
+						message: "Revisions"
+					}),
+					disclosure: true,
+					children: /* @__PURE__ */ jsx("div", {
+						className: "p-4",
+						children: /* @__PURE__ */ jsx(RevisionHistory, {
+							collection,
+							entryId: item.id,
+							reserveHeaderEnd: true
+						})
+					})
+				})
+			]
+		}), !isNew && onDelete && /* @__PURE__ */ jsx("div", {
+			"data-testid": "content-trash-actions",
+			"aria-hidden": isReorderingSections || void 0,
+			className: cn("border-t p-4", isReorderingSections && "invisible pointer-events-none"),
+			children: /* @__PURE__ */ jsxs(Dialog.Root, {
+				disablePointerDismissal: true,
+				children: [/* @__PURE__ */ jsx(Dialog.Trigger, { render: (p) => /* @__PURE__ */ jsx(Button, {
+					...p,
+					type: "button",
+					variant: "outline",
+					className: "w-full text-kumo-danger hover:text-kumo-danger",
+					disabled: isDeleting,
+					icon: isDeleting ? /* @__PURE__ */ jsx(Loader, { size: "sm" }) : /* @__PURE__ */ jsx(Trash, {}),
+					children: _t5({
+						id: "q3TWG7",
+						message: "Move to Trash"
+					})
+				}) }), /* @__PURE__ */ jsxs(Dialog, {
+					className: "p-6",
+					size: "sm",
+					children: [
+						/* @__PURE__ */ jsx(Dialog.Title, {
+							className: "text-lg font-semibold",
+							children: _t5({
+								id: "eAnjuA",
+								message: "Move to Trash?"
+							})
+						}),
+						/* @__PURE__ */ jsx(Dialog.Description, {
+							className: "text-kumo-subtle",
+							children: _t5({
+								id: "cXBP3V",
+								message: "This will move the item to trash. You can restore it later from the trash."
+							})
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "mt-6 flex justify-end gap-2",
+							children: [/* @__PURE__ */ jsx(Dialog.Close, { render: (p) => /* @__PURE__ */ jsx(Button, {
+								...p,
+								variant: "secondary",
 								children: _t5({
-									id: "eAnjuA",
-									message: "Move to Trash?"
+									id: "dEgA5A",
+									message: "Cancel"
 								})
-							}),
-							/* @__PURE__ */ jsx(Dialog.Description, {
-								className: "text-kumo-subtle",
+							}) }), /* @__PURE__ */ jsx(Dialog.Close, { render: (p) => /* @__PURE__ */ jsx(Button, {
+								...p,
+								variant: "destructive",
+								onClick: onDelete,
 								children: _t5({
-									id: "cXBP3V",
-									message: "This will move the item to trash. You can restore it later from the trash."
+									id: "q3TWG7",
+									message: "Move to Trash"
 								})
-							}),
-							/* @__PURE__ */ jsxs("div", {
-								className: "mt-6 flex justify-end gap-2",
-								children: [/* @__PURE__ */ jsx(Dialog.Close, { render: (p) => /* @__PURE__ */ jsx(Button, {
-									...p,
-									variant: "secondary",
-									children: _t5({
-										id: "dEgA5A",
-										message: "Cancel"
-									})
-								}) }), /* @__PURE__ */ jsx(Dialog.Close, { render: (p) => /* @__PURE__ */ jsx(Button, {
-									...p,
-									variant: "destructive",
-									onClick: onDelete,
-									children: _t5({
-										id: "q3TWG7",
-										message: "Move to Trash"
-									})
-								}) })]
-							})
-						]
-					})]
-				})
+							}) })]
+						})
+					]
+				})]
 			})
-		]
+		})]
 	});
 });
 function BylineCreditsEditor({ credits, bylines, selectedBylineDetails, onChange, onQuickCreate, onQuickEdit, entryLocale, i18n, bylinesLoaded = true }) {
@@ -9961,7 +10824,7 @@ function HtmlBlockNodeView({ node, updateAttributes, selected, deleteNode }) {
 * An atom node that stores raw HTML in a `html` attribute. Round-trips
 * through Portable Text as `{ _type: "htmlBlock", _key, html }`.
 */
-const HtmlBlockExtension = Node$1.create({
+const HtmlBlockExtension = Node$2.create({
 	name: "htmlBlock",
 	group: "block",
 	atom: true,
@@ -9982,7 +10845,7 @@ const HtmlBlockExtension = Node$1.create({
 		return [{ tag: "div[data-html-block]" }];
 	},
 	renderHTML({ HTMLAttributes }) {
-		return ["div", mergeAttributes(HTMLAttributes, { "data-html-block": "" })];
+		return ["div", mergeAttributes$1(HTMLAttributes, { "data-html-block": "" })];
 	},
 	addNodeView() {
 		return ReactNodeViewRenderer(HtmlBlockNodeView);
@@ -10241,7 +11104,7 @@ function ImageNodeView({ node, updateAttributes, selected, deleteNode, editor })
 		})
 	});
 }
-const ImageExtension = Node$2.create({
+const ImageExtension = Node$1.create({
 	name: "image",
 	addOptions() {
 		return {
@@ -10284,7 +11147,7 @@ const ImageExtension = Node$2.create({
 		return [{ tag: "img[src]" }];
 	},
 	renderHTML({ HTMLAttributes }) {
-		return ["img", mergeAttributes$1(this.options.HTMLAttributes, HTMLAttributes)];
+		return ["img", mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)];
 	},
 	addNodeView() {
 		return ReactNodeViewRenderer(ImageNodeView);
@@ -10666,7 +11529,7 @@ function PluginBlockNodeView({ node, updateAttributes, selected, deleteNode, edi
 /**
 * TipTap Node extension for plugin blocks (embeds)
 */
-const PluginBlockExtension = Node$1.create({
+const PluginBlockExtension = Node$2.create({
 	name: "pluginBlock",
 	group: "block",
 	atom: true,
@@ -10693,7 +11556,7 @@ const PluginBlockExtension = Node$1.create({
 		return [{ tag: "div[data-plugin-block]" }];
 	},
 	renderHTML({ HTMLAttributes }) {
-		return ["div", mergeAttributes(HTMLAttributes, { "data-plugin-block": "" })];
+		return ["div", mergeAttributes$1(HTMLAttributes, { "data-plugin-block": "" })];
 	},
 	addNodeView() {
 		return ReactNodeViewRenderer(PluginBlockNodeView);
@@ -10912,6 +11775,40 @@ const TABLE_BUBBLE_MENU_KEY = "emdashTableBubbleMenu";
 function generateKey() {
 	return Math.random().toString(36).substring(2, 11);
 }
+/**
+* Normalize an untrusted gallery `images` value into well-formed entries.
+* Mirrors `sanitizeGalleryImages` in core's content/converters (duplicated
+* like the converters themselves — see note above).
+*/
+function sanitizeGalleryImages(value, withKeys = false) {
+	if (!Array.isArray(value)) return [];
+	const images = [];
+	for (const entry of value) {
+		if (typeof entry !== "object" || entry === null || Array.isArray(entry)) continue;
+		const record = entry;
+		const asset = record.asset;
+		if (typeof asset !== "object" || asset === null) continue;
+		const assetRecord = asset;
+		const image = {
+			_type: "image",
+			_key: attrStr(record._key) ?? (withKeys ? generateKey() : ""),
+			asset: {
+				_type: "reference",
+				_ref: typeof assetRecord._ref === "string" ? assetRecord._ref : "",
+				...attrStr(assetRecord.url) ? { url: attrStr(assetRecord.url) } : {},
+				...attrStr(assetRecord.provider) ? { provider: attrStr(assetRecord.provider) } : {}
+			}
+		};
+		if (attrStr(record.alt)) image.alt = attrStr(record.alt);
+		if (attrStr(record.caption)) image.caption = attrStr(record.caption);
+		if (typeof record.width === "number") image.width = record.width;
+		if (typeof record.height === "number") image.height = record.height;
+		if (attrStr(record.blurhash)) image.blurhash = attrStr(record.blurhash);
+		if (attrStr(record.dominantColor)) image.dominantColor = attrStr(record.dominantColor);
+		images.push(image);
+	}
+	return images;
+}
 const attrStr = (v) => typeof v === "string" && v ? v : void 0;
 const attrNum = (v) => typeof v === "number" && v ? v : void 0;
 function prosemirrorToPortableText(doc) {
@@ -11022,6 +11919,15 @@ function convertPMNode(node) {
 			_key: generateKey(),
 			style: "lineBreak"
 		};
+		case "gallery": {
+			const columns = node.attrs?.columns;
+			return {
+				_type: "gallery",
+				_key: generateKey(),
+				images: sanitizeGalleryImages(node.attrs?.images, true),
+				...typeof columns === "number" ? { columns } : {}
+			};
+		}
 		case "table": {
 			const tableKey = generateKey();
 			const rows = (node.content || []).filter((row) => row.type === "tableRow").map((row, rowIndex) => {
@@ -11268,6 +12174,24 @@ function convertPTBlock(block) {
 			};
 		}
 		case "break": return { type: "horizontalRule" };
+		case "gallery": {
+			const galleryBlock = block;
+			if (!Array.isArray(galleryBlock.images)) return {
+				type: "paragraph",
+				content: [{
+					type: "text",
+					text: `[Unknown block type: ${block._type}]`,
+					marks: [{ type: "code" }]
+				}]
+			};
+			return {
+				type: "gallery",
+				attrs: {
+					images: sanitizeGalleryImages(galleryBlock.images),
+					columns: typeof galleryBlock.columns === "number" ? galleryBlock.columns : void 0
+				}
+			};
+		}
 		case "htmlBlock": return {
 			type: "htmlBlock",
 			attrs: { html: block.html || "" }
@@ -12433,6 +13357,7 @@ function PortableTextEditor({ value, onChange, placeholder, className, editable
 		else setInternalFocusMode(mode);
 	};
 	const [mediaPickerOpen, setMediaPickerOpen] = React$1.useState(false);
+	const [galleryPickerOpen, setGalleryPickerOpen] = React$1.useState(false);
 	const [pluginBlockModal, setPluginBlockModal] = React$1.useState(null);
 	const [pluginBlockInitialValues, setPluginBlockInitialValues] = React$1.useState(void 0);
 	/** When editing an existing block, store the node position for updateAttributes */
@@ -12484,6 +13409,32 @@ function PortableTextEditor({ value, onChange, placeholder, className, editable
 				setMediaPickerOpen(true);
 			}
 		});
+		cmds.push({
+			id: "gallery",
+			title: {
+				id: "U+kFad",
+				message: "Gallery"
+			},
+			description: {
+				id: "ojLvJk",
+				message: "Insert an image gallery"
+			},
+			icon: Images,
+			aliases: [
+				"gal",
+				"photos",
+				"grid"
+			],
+			category: {
+				id: "xYilR2",
+				message: "Media"
+			},
+			deferInsertion: true,
+			command: ({ editor, range }) => {
+				editor.chain().focus().deleteRange(range).run();
+				setGalleryPickerOpen(true);
+			}
+		});
 		cmds.push({
 			id: "section",
 			title: {
@@ -12569,6 +13520,7 @@ function PortableTextEditor({ value, onChange, placeholder, className, editable
 			}),
 			CodeBlockExtension,
 			HtmlBlockExtension,
+			GalleryExtension,
 			ImageExtension,
 			MarkdownLinkExtension,
 			PluginBlockExtension,
@@ -12797,17 +13749,21 @@ function PortableTextEditor({ value, onChange, placeholder, className, editable
 	onBlockSidebarCloseRef.current = onBlockSidebarClose;
 	React$1.useEffect(() => {
 		if (!editor) return;
-		const storage = editor.storage.image;
-		if (!storage) return;
-		storage.onOpenBlockSidebar = (panel) => {
-			onBlockSidebarOpenRef.current?.(panel);
-		};
-		storage.onCloseBlockSidebar = () => {
-			onBlockSidebarCloseRef.current?.();
-		};
+		const editorStorage = editor.storage;
+		const storages = [editorStorage.image, editorStorage.gallery].filter((storage) => storage !== void 0);
+		for (const storage of storages) {
+			storage.onOpenBlockSidebar = (panel) => {
+				onBlockSidebarOpenRef.current?.(panel);
+			};
+			storage.onCloseBlockSidebar = () => {
+				onBlockSidebarCloseRef.current?.();
+			};
+		}
 		return () => {
-			storage.onOpenBlockSidebar = null;
-			storage.onCloseBlockSidebar = null;
+			for (const storage of storages) {
+				storage.onOpenBlockSidebar = null;
+				storage.onCloseBlockSidebar = null;
+			}
 		};
 	}, [editor]);
 	const handleImageSelect = React$1.useCallback((item) => {
@@ -12833,6 +13789,23 @@ function PortableTextEditor({ value, onChange, placeholder, className, editable
 		pendingBlockInsertPosRef.current = null;
 		setMediaPickerOpen(false);
 	}, [editor]);
+	const handleGallerySelect = React$1.useCallback((items) => {
+		if (editor && items.length > 0) {
+			const attrs = {
+				images: items.map(mediaItemToGalleryImage),
+				columns: 3
+			};
+			const insertPos = pendingBlockInsertPosRef.current;
+			const chain = editor.chain().focus();
+			if (insertPos === null) chain.setGallery(attrs).run();
+			else chain.insertContentAt(insertPos, {
+				type: "gallery",
+				attrs
+			}).run();
+		}
+		pendingBlockInsertPosRef.current = null;
+		setGalleryPickerOpen(false);
+	}, [editor]);
 	const handlePluginBlockInsert = React$1.useCallback((values) => {
 		if (!editor || !pluginBlockModal) return;
 		const { id, ...data } = values;
@@ -12948,6 +13921,21 @@ function PortableTextEditor({ value, onChange, placeholder, className, editable
 							message: "Select Image"
 						})
 					}),
+					/* @__PURE__ */ jsx(MediaPickerModal, {
+						open: galleryPickerOpen,
+						onOpenChange: (open) => {
+							setGalleryPickerOpen(open);
+							if (!open) pendingBlockInsertPosRef.current = null;
+						},
+						multiple: true,
+						onSelect: () => {},
+						onSelectMany: handleGallerySelect,
+						mimeTypeFilter: "image/",
+						title: _t6({
+							id: "qgANyN",
+							message: "Select Gallery Images"
+						})
+					}),
 					/* @__PURE__ */ jsx(PluginBlockModal, {
 						block: pluginBlockModal,
 						initialValues: pluginBlockInitialValues,
@@ -14366,6 +15354,7 @@ function MobileSidebarPortalGuard() {
 		if (!isMobile || !openMobile) return;
 		const nestedOverlaySelector = "[role=\"dialog\"], [role=\"listbox\"], [role=\"menu\"], .kumo-tooltip-popup";
 		const keepSheetOpen = () => queueMicrotask(() => setOpenMobile(true));
+		const reopenSheetAfterDismiss = () => setTimeout(setOpenMobile, 0, true);
 		const promotePortal = (element) => {
 			const portal = (element.closest(nestedOverlaySelector) ?? element.querySelector(nestedOverlaySelector))?.closest("[data-base-ui-portal]");
 			if (!portal) return;
@@ -14375,7 +15364,13 @@ function MobileSidebarPortalGuard() {
 		const handleFocusOut = (event) => {
 			const source = event.target;
 			const destination = event.relatedTarget;
-			if (!(source instanceof Element) || !(destination instanceof Element)) return;
+			if (!(source instanceof Element)) return;
+			if (source.closest("[data-sortable-handle]") && destination === null) {
+				event.stopPropagation();
+				keepSheetOpen();
+				return;
+			}
+			if (!(destination instanceof Element)) return;
 			const sheet = source.closest("nav[data-sidebar=\"sidebar\"][data-mobile=\"true\"]");
 			if (!sheet || sheet.contains(destination)) return;
 			if (!destination.closest(nestedOverlaySelector)) return;
@@ -14385,7 +15380,12 @@ function MobileSidebarPortalGuard() {
 		const handleKeyDown = (event) => {
 			if (event.key !== "Escape") return;
 			const target = event.target;
-			if (!(target instanceof Element) || !target.closest(nestedOverlaySelector)) return;
+			if (!(target instanceof Element)) return;
+			if (target.closest("[data-sortable-handle][data-sorting=\"true\"]")) {
+				reopenSheetAfterDismiss();
+				return;
+			}
+			if (!target.closest(nestedOverlaySelector)) return;
 			keepSheetOpen();
 		};
 		document.addEventListener("focusout", handleFocusOut, true);
@@ -28220,6 +29220,15 @@ function SectionEditorForm({ section, isSaving, onSave }) {
 					},
 					onClose: handleBlockSidebarClose,
 					inline: true
+				}) : blockSidebarPanel?.type === "gallery" ? /* @__PURE__ */ jsx(GalleryDetailPanel, {
+					attributes: blockSidebarPanel.attrs,
+					onUpdate: (attrs) => blockSidebarPanel.onUpdate(attrs),
+					onDelete: () => {
+						blockSidebarPanel.onDelete();
+						setBlockSidebarPanel(null);
+					},
+					onClose: handleBlockSidebarClose,
+					inline: true
 				}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
 					className: "rounded-lg border bg-kumo-base p-6 space-y-4",
 					children: [
@@ -36570,7 +37579,7 @@ function Widgets() {
 			})
 		})
 	});
-	return /* @__PURE__ */ jsxs(DndContext, {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(DndContext, {
 		sensors,
 		collisionDetection,
 		onDragStart: handleDragStart,
@@ -36817,7 +37826,15 @@ function Widgets() {
 				onClose: handleBlockSidebarClose
 			})
 		]
-	});
+	}), blockSidebarPanel?.type === "gallery" && /* @__PURE__ */ jsx(GalleryDetailPanel, {
+		attributes: blockSidebarPanel.attrs,
+		onUpdate: (attrs) => blockSidebarPanel.onUpdate(attrs),
+		onDelete: () => {
+			blockSidebarPanel.onDelete();
+			setBlockSidebarPanel(null);
+		},
+		onClose: handleBlockSidebarClose
+	})] });
 }
 /** A draggable item in the available widgets palette */
 function DraggablePaletteItem({ id, label, description, widgetInput }) {