emdash 0.37.0 → 0.38.0

package/src/client/index.ts

@@ -733,6 +733,8 @@ export class EmDashClient {
 			status?: string;
 			_rev?: string;
 			locale?: string;
+			/** Write even though another editor holds this entry's edit lock. */
+			overrideLock?: boolean;
 		},
 	): Promise<ContentItem> {
 		// Convert markdown strings to PT
@@ -747,6 +749,7 @@ export class EmDashClient {
 			slug: input.slug,
 			status: input.status,
 			...(input._rev ? { _rev: input._rev } : {}),
+			...(input.overrideLock ? { overrideLock: true } : {}),
 		};
 		const params = new URLSearchParams();
 		if (input.locale) params.set("locale", input.locale);
@@ -764,35 +767,54 @@ export class EmDashClient {
 	}
 
 	/** Delete (soft) a content item */
-	async delete(collection: string, id: string): Promise<void> {
+	async delete(
+		collection: string,
+		id: string,
+		options: { overrideLock?: boolean } = {},
+	): Promise<void> {
+		const query = options.overrideLock ? "?overrideLock=true" : "";
 		await this.request<unknown>(
 			"DELETE",
-			`/content/${encodeURIComponent(collection)}/${encodeURIComponent(id)}`,
+			`/content/${encodeURIComponent(collection)}/${encodeURIComponent(id)}${query}`,
 		);
 	}
 
 	/** Publish a content item */
-	async publish(collection: string, id: string): Promise<void> {
+	async publish(
+		collection: string,
+		id: string,
+		options: { overrideLock?: boolean } = {},
+	): Promise<void> {
 		await this.request<unknown>(
 			"POST",
 			`/content/${encodeURIComponent(collection)}/${encodeURIComponent(id)}/publish`,
+			options.overrideLock ? { overrideLock: true } : undefined,
 		);
 	}
 
 	/** Unpublish a content item */
-	async unpublish(collection: string, id: string): Promise<void> {
+	async unpublish(
+		collection: string,
+		id: string,
+		options: { overrideLock?: boolean } = {},
+	): Promise<void> {
 		await this.request<unknown>(
 			"POST",
 			`/content/${encodeURIComponent(collection)}/${encodeURIComponent(id)}/unpublish`,
+			options.overrideLock ? { overrideLock: true } : undefined,
 		);
 	}
 
 	/** Schedule publishing */
-	async schedule(collection: string, id: string, options: { at: string }): Promise<void> {
+	async schedule(
+		collection: string,
+		id: string,
+		options: { at: string; overrideLock?: boolean },
+	): Promise<void> {
 		await this.request<unknown>(
 			"POST",
 			`/content/${encodeURIComponent(collection)}/${encodeURIComponent(id)}/schedule`,
-			{ scheduledAt: options.at },
+			{ scheduledAt: options.at, ...(options.overrideLock ? { overrideLock: true } : {}) },
 		);
 	}
 
@@ -821,10 +843,15 @@ export class EmDashClient {
 	}
 
 	/** Discard draft revision, reverting to the published version */
-	async discardDraft(collection: string, id: string): Promise<void> {
+	async discardDraft(
+		collection: string,
+		id: string,
+		options: { overrideLock?: boolean } = {},
+	): Promise<void> {
 		await this.request<unknown>(
 			"POST",
 			`/content/${encodeURIComponent(collection)}/${encodeURIComponent(id)}/discard-draft`,
+			options.overrideLock ? { overrideLock: true } : undefined,
 		);
 	}
 

package/src/components/EmDashBodyEnd.astro

@@ -13,6 +13,7 @@
 import type { PublicPageContext } from "../plugins/types.js";
 import { renderFragments } from "../page/fragments.js";
 import { getPageRuntime } from "../page/index.js";
+import { resolveSeoPanelPage } from "../page/seo-contributions.js";
 
 interface Props {
 	page: PublicPageContext;
@@ -24,7 +25,9 @@ const runtime = getPageRuntime(Astro.locals as Record<string, unknown>);
 let html = "";
 
 if (runtime) {
-	const contributions = await runtime.collectPageFragments(page);
+	// Same SEO panel overlay as <EmDashHead>, so body fragment hooks see
+	// the identical page context as head hooks (a request-cache read).
+	const contributions = await runtime.collectPageFragments(await resolveSeoPanelPage(page));
 	html = renderFragments(contributions, "body:end");
 }
 ---

package/src/components/EmDashBodyStart.astro

@@ -13,6 +13,7 @@
 import type { PublicPageContext } from "../plugins/types.js";
 import { renderFragments } from "../page/fragments.js";
 import { getPageRuntime } from "../page/index.js";
+import { resolveSeoPanelPage } from "../page/seo-contributions.js";
 
 interface Props {
 	page: PublicPageContext;
@@ -24,7 +25,9 @@ const runtime = getPageRuntime(Astro.locals as Record<string, unknown>);
 let html = "";
 
 if (runtime) {
-	const contributions = await runtime.collectPageFragments(page);
+	// Same SEO panel overlay as <EmDashHead>, so body fragment hooks see
+	// the identical page context as head hooks (a request-cache read).
+	const contributions = await runtime.collectPageFragments(await resolveSeoPanelPage(page));
 	html = renderFragments(contributions, "body:start");
 }
 ---

package/src/components/EmDashHead.astro

@@ -3,8 +3,16 @@
  * Renders base SEO metadata, plugin-contributed metadata, and trusted head fragments.
  *
  * Base SEO metadata (meta tags, OG, Twitter Card, canonical, JSON-LD) is generated
- * from the page context's seo/articleMeta/siteName fields. Contributions are
- * composed in the order `[...plugin, ...site, ...base]` and resolved by
+ * from the page context's seo/articleMeta/siteName fields. When the page renders
+ * a content entry (`page.content` is set) that was fetched through EmDash's
+ * content APIs in this request (`getEmDashEntry()` or the live loader,
+ * including warm object-cache hits), the entry's SEO panel values are overlaid
+ * onto the page context automatically: the entry query folds the
+ * `_emdash_seo` row in as a subselect and primes a request-scoped cache, so
+ * the overlay costs zero additional queries. Editor-set values flow into the
+ * base contributions, the JSON-LD builders, and plugin hooks — the body
+ * fragment components apply the same overlay. Contributions are composed in
+ * the order `[...plugin, ...site, ...base]` and resolved by
  * `resolvePageMetadata()` with first-wins dedup. Plugins sit at the front of
  * the array, so for any given key plugin contributions override site-level
  * ones, which override base ones.
@@ -30,6 +38,7 @@ import JsonLdScript from "./JsonLdScript.astro";
 import {
 	generateBaseSeoContributions,
 	generateSiteSeoContributions,
+	resolveSeoPanelPage,
 } from "../page/seo-contributions.js";
 import { renderSiteIdentity } from "../page/site-identity.js";
 import { getPageRuntime } from "../page/index.js";
@@ -51,21 +60,32 @@ let fragmentsHtml = "";
 let jsonLdScripts: ResolvedPageMetadata["jsonld"] = [];
 
 if (runtime) {
-	// Run independent async loads in parallel: site settings (SEO meta
-	// tags + favicon) and plugin page-metadata contributions. Plugin
-	// contributions come BEFORE site/base in the contribution array,
-	// so resolvePageMetadata's first-wins dedup lets plugins override
-	// defaults.
-	//
 	// `getSiteSettings()` is request-cached and worker-cached, so when
 	// a parent template has already called it (the standard pattern in
 	// `Base.astro`), this is free. Otherwise it's a single batched
 	// query that supersedes any per-key fetch this component would
-	// otherwise have done.
-	const [siteSettings, pluginContributions, fragments] = await Promise.all([
-		getSiteSettings(),
-		runtime.collectPageMetadata(page),
-		runtime.collectPageFragments(page),
+	// otherwise have done. Loaded first because the site URL feeds the
+	// SEO-panel overlay below.
+	const siteSettings = await getSiteSettings();
+	const siteUrl =
+		page.siteUrl || siteSettings.url || (URL.canParse(page.url) ? new URL(page.url).origin : "");
+
+	// SEO panel values for the rendered content entry, primed by
+	// the entry query's folded _emdash_seo column — a request-cache read,
+	// never a database query. Overlaid onto the page context before
+	// anything consumes it, so editor-set description/image/canonical/
+	// noindex take effect by default — in the rendered head tags, in the
+	// JSON-LD builders, and in what plugin hooks see — without the
+	// template wiring getSeoMeta().
+	const resolvedPage = await resolveSeoPanelPage(page, siteUrl);
+
+	// Plugin page-metadata contributions and body fragments run in
+	// parallel. Plugin contributions come BEFORE site/base in the
+	// contribution array, so resolvePageMetadata's first-wins dedup lets
+	// plugins override defaults.
+	const [pluginContributions, fragments] = await Promise.all([
+		runtime.collectPageMetadata(resolvedPage),
+		runtime.collectPageFragments(resolvedPage),
 	]);
 
 	// Site-level default OG image: applied per-page in base contributions
@@ -80,10 +100,10 @@ if (runtime) {
 	const defaultOgImage = absolutizeMediaUrl(
 		siteSettings.seo?.defaultOgImage?.url,
 		siteSettings.url,
-		page,
+		resolvedPage,
 	);
 	const baseContributions: PageMetadataContribution[] = generateBaseSeoContributions(
-		page,
+		resolvedPage,
 		defaultOgImage,
 	);
 
@@ -94,7 +114,6 @@ if (runtime) {
 	// key is the hreflang value).
 	let hreflangContributions: PageMetadataContribution[] = [];
 	if (page.content && isI18nEnabled()) {
-		const siteUrl = page.siteUrl || siteSettings.url || new URL(page.url).origin;
 		const alternates = await getHreflangAlternates(page.content.collection, page.content.id, {
 			siteUrl,
 		});

package/src/components/Gallery.astro

@@ -11,7 +11,12 @@ import { Image as AstroImage } from "astro:assets";
 import type { ImageEmbed } from "../media/types.js";
 import { getMediaProvider } from "../media/provider-loader.js";
 import { buildRenderMediaUrl } from "../media/url.js";
-import { toAbsoluteMediaUrl, RESPONSIVE_BREAKPOINTS } from "../media/responsive.js";
+import {
+	toAbsoluteMediaUrl,
+	gallerySizes,
+	GALLERY_DEFAULT_COLUMNS,
+	RESPONSIVE_BREAKPOINTS,
+} from "../media/responsive.js";
 import { getPublicOrigin } from "../api/public-url.js";
 import { focalPointToObjectPosition } from "../media/focal-point.js";
 
@@ -43,6 +48,12 @@ export interface Props {
 	};
 	/** Render the LQIP placeholder as an inline background. Disable for strict CSP. */
 	placeholder?: boolean;
+	/**
+	 * `sizes` attribute for every image in the gallery. Defaults to an estimate
+	 * from the column count against the viewport; set it when the gallery renders
+	 * in a narrower container, e.g. `"(max-width: 640px) 45vw, 220px"`.
+	 */
+	sizes?: string;
 }
 
 /**
@@ -61,9 +72,11 @@ function generateSrcset(
 		.join(", ");
 }
 
-const { node, placeholder = true } = Astro.props;
+const { node, placeholder = true, sizes: sizesOverride } = Astro.props;
 const images = node?.images ?? [];
-const columns = node?.columns ?? 3;
+const columns = node?.columns ?? GALLERY_DEFAULT_COLUMNS;
+// Each image fills one grid cell, not the viewport.
+const cellSizes = sizesOverride ?? gallerySizes(columns);
 
 if (!images.length) {
 	return null;
@@ -102,7 +115,7 @@ const resolvedImages = await Promise.all(
 						if (embed.getSrc) {
 							const maxWidth = width || 1200;
 							srcset = generateSrcset(embed.getSrc, maxWidth, aspectRatio);
-							sizes = width ? `(min-width: ${width}px) ${width}px, 100vw` : "100vw";
+							sizes = cellSizes;
 						}
 					}
 				} catch (error) {
@@ -166,6 +179,7 @@ const resolvedImages = await Promise.all(
 						width={image.width!}
 						height={image.height!}
 						layout="constrained"
+						sizes={cellSizes}
 						style={image.objectPosition ? `object-position: ${image.objectPosition};` : undefined}
 					/>
 				) : (

package/src/components/InlineEditor.astro

@@ -13,9 +13,10 @@ export interface Props {
 	collection: string;
 	entryId: string;
 	field: string;
+	tablePlaceholder?: string;
 }
 
-const { value, collection, entryId, field } = Astro.props;
+const { value, collection, entryId, field, tablePlaceholder } = Astro.props;
 ---
 
 <InlinePortableTextEditor
@@ -24,4 +25,5 @@ const { value, collection, entryId, field } = Astro.props;
 	collection={collection}
 	entryId={entryId}
 	field={field}
+	tablePlaceholder={tablePlaceholder}
 />

package/src/components/InlinePortableTextEditor.tsx

@@ -18,6 +18,7 @@ import Placeholder from "@tiptap/extension-placeholder";
 import TextAlign from "@tiptap/extension-text-align";
 import Typography from "@tiptap/extension-typography";
 import Underline from "@tiptap/extension-underline";
+import { Plugin } from "@tiptap/pm/state";
 import { useEditor, EditorContent, type Editor } from "@tiptap/react";
 import { BubbleMenu } from "@tiptap/react/menus";
 import StarterKit from "@tiptap/starter-kit";
@@ -65,13 +66,19 @@ interface PTTextBlock {
 	textAlign?: "left" | "center" | "right" | "justify";
 }
 
-type PTBlock = PTTextBlock | { _type: string; _key: string; [key: string]: unknown };
+type PTTableBlock = { _type: "table"; [key: string]: unknown };
+type PTBlock = PTTextBlock | PTTableBlock | { _type: string; _key: string; [key: string]: unknown };
+const TABLE_BLOCK_PLACEHOLDER_HTML = /<[^>]+\bdata-emdash-table-block(?:\s|=|>)/i;
 
 /** Type guard for PTTextBlock */
 function isPTTextBlock(block: PTBlock): block is PTTextBlock {
 	return block._type === "block";
 }
 
+function isPTTableBlock(value: unknown): value is PTTableBlock {
+	return typeof value === "object" && value !== null && "_type" in value && value._type === "table";
+}
+
 /** Type guard for ProseMirror JSON document node */
 function isPMNode(value: unknown): value is PMNode {
 	return (
@@ -284,6 +291,11 @@ function convertPMNode(node: PMNode, path: string): PTBlock | PTBlock[] | null {
 		}
 		case "horizontalRule":
 			return { _type: "break", _key: k(), style: "lineBreak" };
+		case "table": {
+			const rawTable = node.attrs?.rawTable;
+			if (isPTTableBlock(rawTable)) return rawTable;
+			return null;
+		}
 		case "pluginBlock": {
 			// Spread the captured data back out so the block round-trips losslessly.
 			// `data` holds every field except _type / _key / id (which live on
@@ -600,14 +612,17 @@ function convertPTBlock(block: PTBlock): PMNode | null {
 			},
 		};
 	}
+	if (block._type === "table") {
+		return {
+			type: "table",
+			attrs: { rawTable: block },
+		};
+	}
 	// Unknown block types — treat as plugin blocks. Capture every field other
 	// than the well-known ones into `data` so the block round-trips losslessly,
 	// even if no plugin currently registers this type. Matches the admin
 	// editor's behaviour at PortableTextEditor.tsx:572-588.
-	const { _type, _key, id, url, ...rest } = block as { _type: string; _key: string } & Record<
-		string,
-		unknown
-	>;
+	const { _type, _key, id, url, ...rest } = block;
 	// Filter out _-prefixed keys to prevent accumulation across edit cycles.
 	const data = Object.fromEntries(Object.entries(rest).filter(([key]) => !key.startsWith("_")));
 	return {
@@ -1100,6 +1115,76 @@ const HtmlBlockNode = Node.create({
 	},
 });
 
+const TableBlockNode = Node.create<{ placeholder: string }>({
+	name: "table",
+	group: "block",
+	atom: true,
+	selectable: true,
+	draggable: true,
+
+	addOptions() {
+		return { placeholder: "Table (edit in admin)" };
+	},
+
+	addAttributes() {
+		return {
+			rawTable: { default: null, rendered: false, parseHTML: () => null },
+		};
+	},
+
+	parseHTML() {
+		return [{ tag: 'div[data-emdash-table-block="true"]' }];
+	},
+
+	addProseMirrorPlugins() {
+		return [
+			new Plugin({
+				props: {
+					handleDOMEvents: {
+						cut: (view, event) => {
+							let hasTable = false;
+							view.state.selection.content().content.descendants((node) => {
+								hasTable ||= node.type.name === "table";
+							});
+							if (!hasTable) return false;
+							event.preventDefault();
+							return true;
+						},
+					},
+					handlePaste: (_view, event, slice) => {
+						const html = event.clipboardData?.getData("text/html") ?? "";
+						if (!TABLE_BLOCK_PLACEHOLDER_HTML.test(html)) return false;
+
+						let hasTable = false;
+						let hasMissingPayload = false;
+						slice.content.descendants((node) => {
+							if (node.type.name !== "table") return;
+							hasTable = true;
+							if (!isPTTableBlock(node.attrs.rawTable)) hasMissingPayload = true;
+						});
+						if (hasTable && !hasMissingPayload) return false;
+
+						event.preventDefault();
+						return true;
+					},
+				},
+			}),
+		];
+	},
+
+	renderHTML({ HTMLAttributes }) {
+		return [
+			"div",
+			mergeAttributes(HTMLAttributes, {
+				"data-emdash-table-block": "true",
+				class: "emdash-plugin-block-placeholder",
+				contenteditable: "false",
+			}),
+			this.options.placeholder,
+		];
+	},
+});
+
 /**
  * Minimal `pluginBlock` TipTap node for the inline (visual-editing) editor.
  *
@@ -2000,6 +2085,7 @@ export interface InlinePortableTextEditorProps {
 	collection: string;
 	entryId: string;
 	field: string;
+	tablePlaceholder?: string;
 }
 
 export function InlinePortableTextEditor({
@@ -2007,8 +2093,13 @@ export function InlinePortableTextEditor({
 	collection,
 	entryId,
 	field,
+	tablePlaceholder = TableBlockNode.options.placeholder,
 }: InlinePortableTextEditorProps) {
 	const initialRef = React.useRef(value);
+	// The editor document last known to be stored: the one the loaded content
+	// produced, then the one each successful save sent. `save()` does nothing
+	// while the current document is structurally equal to it (`Node.eq`).
+	const savedDocRef = React.useRef<Editor["state"]["doc"] | null>(null);
 	const savingRef = React.useRef(false);
 	const editorRef = React.useRef<ReturnType<typeof useEditor>>(null);
 
@@ -2072,9 +2163,9 @@ export function InlinePortableTextEditor({
 			// one that can still land.
 			if (savingRef.current && !options?.keepalive) return;
 
-			const current = JSON.stringify(getBlocks());
-			const initial = JSON.stringify(initialRef.current);
-			if (current === initial) return;
+			const doc = editorRef.current?.state.doc;
+			if (!doc || !savedDocRef.current || doc.eq(savedDocRef.current)) return;
+			const blocks = getBlocks();
 
 			savingRef.current = true;
 			try {
@@ -2084,13 +2175,14 @@ export function InlinePortableTextEditor({
 						method: "PUT",
 						credentials: "same-origin",
 						headers: { "Content-Type": "application/json", "X-EmDash-Request": "1" },
-						body: JSON.stringify({ data: { [field]: getBlocks() } }),
+						body: JSON.stringify({ data: { [field]: blocks } }),
 						keepalive: options?.keepalive ?? false,
 					},
 				);
 
 				if (res.ok) {
-					initialRef.current = getBlocks();
+					initialRef.current = blocks;
+					savedDocRef.current = doc;
 					document.dispatchEvent(new CustomEvent("emdash:save", { detail: { state: "saved" } }));
 					document.dispatchEvent(
 						new CustomEvent("emdash:content-changed", {
@@ -2184,6 +2276,7 @@ export function InlinePortableTextEditor({
 			}),
 			Typography,
 			HtmlBlockNode,
+			TableBlockNode.configure({ placeholder: tablePlaceholder }),
 			PluginBlockNode,
 			slashCommandsExtension,
 		],
@@ -2201,9 +2294,10 @@ export function InlinePortableTextEditor({
 		},
 	});
 
-	// Store editor ref for getBlocks
+	// Store editor ref for getBlocks, and record the loaded document as saved.
 	React.useEffect(() => {
 		editorRef.current = editor;
+		if (editor && !savedDocRef.current) savedDocRef.current = editor.state.doc;
 	}, [editor]);
 
 	// Slash menu command handler
@@ -2571,3 +2665,4 @@ export function InlinePortableTextEditor({
 export { pmToPortableText as _pmToPortableText };
 export { portableTextToPM as _portableTextToPM };
 export { createUnsupportedFileHandlers as _createUnsupportedFileHandlers };
+export { TableBlockNode as _InlineTableBlockNode };

package/src/components/PortableText.astro

@@ -30,12 +30,15 @@ import { groupBlockquoteRuns } from "./portable-text-blockquote-group.js";
 
 export interface Props extends Omit<PortableTextProps, "value"> {
 	value: PortableTextProps["value"];
+	/** Initial label for read-only inline tables; defaults to English. */
+	tablePlaceholder?: string;
 }
 
 const {
 	value,
 	components: userComponents,
 	listNestingMode = "html",
+	tablePlaceholder,
 	...rest
 } = Astro.props;
 
@@ -68,6 +71,7 @@ if (!editMeta) {
 		collection={editMeta.collection}
 		entryId={editMeta.id}
 		field={editMeta.field}
+		tablePlaceholder={tablePlaceholder}
 	/>
 ) : (
 	<BasePortableText