mechanica 2.1.0-beta.2 → 2.1.0-beta.3

package/README.md

@@ -192,7 +192,7 @@ title: Readable
 - A region runs until the next `@field`, child block or `:::`, and is taken as written, blank lines and Markdown included. It fills a `text` prop with that text, and a `richText` prop with its Markdown turned into rich text.
 - Blocks nest by placing fences inside a container's fence, and `slot=<name>` puts a child into a named slot (a container's children go either all to the default slot or all to named ones). Nothing is indented: every `:::` and `@field` starts at the beginning of its line, and a block is a child of whichever fence is still open. A container may close with `::: /<blockId>`, which reports a missing `:::` at the line where the fences stop pairing up.
 - Props are YAML, so quote a value that starts with `#` or contains `: `, as in `href: "#pricing"`. Inside a region nothing needs quoting; only a line that starts with `:::`, or consists of just `@name`, takes a leading backslash (`\:::`), and not even that inside a code fence.
-- An `image` prop points at an uploaded file: `photo: { src: /@mechanica/assets/team.jpg, alt: "Our team" }`.
+- An `image` prop points at an uploaded file by its name in `.mech/assets/`: `photo: { src: /media/team.jpg, alt: "Our team" }` — the address the file has in dev and on the exported site (files uploaded through the editor get a content hash in their name).
 - Props left out take their schema defaults, so a hand-written page renders exactly like one made in the editor.
 
 With `npm run dev` running, edits you make to these files show up in the editor live, and the editor won't overwrite a file that changed on disk underneath it.

package/dist/chunks/{editor-MStotuaz.js → editor-DoYHG0mS.js}

@@ -1,6 +1,6 @@
 import { a as renderCrop, c as useDialog, d as _plugin_vue_export_helper_default, i as readImageSize, l as VIcon_default, n as VDialog_default, r as analyzeImageFile, s as dialogKey, t as ImagePickerDialog_default } from "./ImagePickerDialog-DJGhtW3r.js";
 import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, inject, mergeProps, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onErrorCaptured, onMounted, openBlock, provide, reactive, ref, renderList, renderSlot, resolveDynamicComponent, shallowRef, toDisplayString, unref, vShow, watch, withCtx, withDirectives, withKeys, withModifiers } from "vue";
-import { EDITOR_API_BASE, UPLOADS_PREFIX, deepEqual, getDefaultValue } from "mechanica-shared";
+import { EDITOR_API_BASE, deepEqual, getDefaultValue, uploadNameOf } from "mechanica-shared";
 import { unfoldSchema } from "compact-json-schema";
 import { TextEditor, uid } from "vuewrite";
 import { blocksToMarkdown, markdownToBlocks } from "vuewrite/markdown";
@@ -667,11 +667,8 @@ function derivativeName(src, rect, target) {
 }
 /** A readable, filename-safe stem for an asset src (`hero` from `…/hero.png`). */
 function baseName(src) {
-	if (!src.startsWith(UPLOADS_PREFIX)) return "image";
-	let file = src.slice(UPLOADS_PREFIX.length);
-	try {
-		file = decodeURIComponent(file);
-	} catch {}
+	const file = uploadNameOf(src);
+	if (file == null) return "image";
 	const dot = file.lastIndexOf(".");
 	return (dot > 0 ? file.slice(0, dot) : file).replace(/[^a-zA-Z0-9_-]+/g, "-").replace(/^-+|-+$/g, "") || "image";
 }

package/dist/chunks/{node-adapter-4eD9p0iP.js → node-adapter-CSZY47h6.js}

@@ -1,11 +1,11 @@
-import { n as configureSite, r as indexGeneratedPages } from "./site-DR_X2rzc.js";
-import { A as savePage, B as saveDerivedAsset, C as listFolders, D as pageVersion, G as writeFileAtomic, N as setPageDraft, O as readPage, P as translationsOf, R as listImages, T as movePage, U as markMutated, V as saveUpload, _ as deletePage, a as folderOf, b as fillContentDefaults, c as mergeLocaleSiteData, f as readSiteData, g as createTranslation, h as createPage, k as renamePage, l as mergeSiteData, m as PageExistsError, o as mergeFolderData, s as mergeLocaleFolderData, u as readFolderData, v as deleteTranslation, w as listPages, x as fillImageMeta, y as duplicatePage } from "./rich-text-codec--Nssj0Nn.js";
+import { n as configureSite, r as indexGeneratedPages } from "./site-ONN3eU9_.js";
+import { A as pageVersion, C as harvestPageImages, D as movePage, E as listPages, G as listUploads, H as fsAssetStore, I as setPageDraft, L as translationsOf, M as renamePage, N as savePage, R as contentFilesOf, T as listFolders, U as isAssetName, _ as deletePage, a as folderOf, b as fillContentDefaults, c as mergeLocaleSiteData, f as readSiteData, g as createTranslation, h as createPage, j as readPage, l as mergeSiteData, m as PageExistsError, o as mergeFolderData, q as storeUpload, s as mergeLocaleFolderData, u as readFolderData, v as deleteTranslation, w as imageNamesOf, x as fillImageMeta, y as duplicatePage } from "./rich-text-codec-D8JAuJIS.js";
 import fs, { readFileSync, readdirSync } from "node:fs";
 import { basename, extname, join, resolve, sep } from "node:path";
 import { EDITOR_DIST_DIR, mergeTranslation, parseLocalePath, passDataToHTML, resolveQueryKey, serializeState } from "mechanica-shared";
 import { parseComposedBlock, serializeComposedBlock } from "mechanica-shared/block-format";
-import { Readable } from "node:stream";
 import { createHash } from "node:crypto";
+import { Readable } from "node:stream";
 //#region src/vite/collect-composed.ts
 /** Filename suffix for composed-block documents under `<mech>/blocks`. */
 var COMPOSED_EXT = ".block.yml";
@@ -41,35 +41,6 @@ function collectComposed(dir, onError) {
 	return `export const composedList = ${JSON.stringify(defs)}\n`;
 }
 //#endregion
-//#region src/server/query-dev.ts
-/**
-* The dev server's {@link QuerySource}: pages come live from the `.mech`
-* store; `useFetch` URLs are fetched server-side (no CORS, matching how the
-* export resolves them at build time). `generated` pages (plugin `generatePages`)
-* are merged into the page listing so `usePages()` sees them, like the export.
-*/
-function devQuerySource(mechDir, generated) {
-	return {
-		listPages: (options) => listPages(mechDir, {
-			...options,
-			generated
-		}),
-		fetchJson: async ({ url, ...init }) => {
-			const res = await fetch(url, init);
-			if (!res.ok) throw new Error(`${url} responded ${res.status}`);
-			return res.json();
-		}
-	};
-}
-/**
-* Resolve a dev-mode query key against the local `.mech` store. Keys are of the
-* form `"<type>.<json-args>"` (the same encoding the runtime composables use);
-* `context.page` selects the chunk of a paginated query.
-*/
-function resolveDevQuery(mechDir, key, context = {}, generated) {
-	return resolveQueryKey(devQuerySource(mechDir, generated), key, context);
-}
-//#endregion
 //#region src/server/page-state.ts
 /**
 * Recognize a paginated variant URL (`/blog/2`): no page file of its own, a
@@ -77,14 +48,14 @@ function resolveDevQuery(mechDir, key, context = {}, generated) {
 * Checked against the default-locale (base) files — pagination structure is
 * defined by the logical page, and variant URLs never have their own file.
 */
-function paginatedVariantOf(mechDir, urlPath) {
+function paginatedVariantOf(mech, urlPath) {
 	const match = urlPath.match(/^(.*)\/(\d+)$/);
 	if (!match) return null;
 	const page = Number(match[2]);
 	if (page < 2) return null;
-	if (pageVersion(mechDir, urlPath) != null) return null;
+	if (pageVersion(mech, urlPath) != null) return null;
 	const basePath = match[1] || "/";
-	if (pageVersion(mechDir, basePath) == null) return null;
+	if (pageVersion(mech, basePath) == null) return null;
 	return {
 		basePath,
 		page
@@ -101,28 +72,32 @@ function paginatedVariantOf(mechDir, urlPath) {
 * `page.pagination` set — `page.path` stays the base path, so editing the
 * variant edits (and saves to) the real page.
 *
+* Image info (LQIP previews, dimensions) is not in the result — page files
+* don't carry it and the asset store that does is asynchronous: follow up with
+* {@link fillStateImages}.
+*
 * A locale-prefixed URL (`/ru/about`) serves that page's translation: the
 * prefix is stripped to the logical path, `page.locale`/`page.locales` are set,
 * and the version targets the translation file. When no translation exists the
 * default-locale content renders as a fallback (`page.localeFallback`).
 */
-function buildPageState(mechDir, urlPath, config) {
+function buildPageState(mech, urlPath, config) {
 	const { locale, path: localePathStripped } = parseLocalePath(urlPath, config);
-	const variant = paginatedVariantOf(mechDir, localePathStripped);
+	const variant = paginatedVariantOf(mech, localePathStripped);
 	const pagePath = variant?.basePath ?? localePathStripped;
 	const localeCode = !config || locale === config.default ? void 0 : locale;
 	let fallback = false;
-	let page = readPage(mechDir, pagePath, localeCode);
+	let page = readPage(mech, pagePath, localeCode);
 	let layout = page.layout;
 	if (localeCode) {
-		const hasTranslation = pageVersion(mechDir, pagePath, localeCode) != null;
-		const hasBase = pageVersion(mechDir, pagePath) != null;
+		const hasTranslation = pageVersion(mech, pagePath, localeCode) != null;
+		const hasBase = pageVersion(mech, pagePath) != null;
 		if (!hasTranslation) {
-			page = readPage(mechDir, pagePath);
+			page = readPage(mech, pagePath);
 			fallback = true;
 			layout = page.layout;
 		} else if (hasBase) {
-			const base = readPage(mechDir, pagePath);
+			const base = readPage(mech, pagePath);
 			layout = base.layout;
 			const merged = mergeTranslation({
 				content: base.content ?? [],
@@ -142,18 +117,16 @@ function buildPageState(mechDir, urlPath, config) {
 		}
 	}
 	const content = page.content ?? [];
-	fillContentDefaults(mechDir, content);
-	fillImageMeta(mechDir, content);
+	fillContentDefaults(mech, content);
 	let baseContent;
-	if (localeCode && pageVersion(mechDir, pagePath) != null) {
-		const base = readPage(mechDir, pagePath).content ?? [];
-		fillContentDefaults(mechDir, base);
-		fillImageMeta(mechDir, base);
+	if (localeCode && pageVersion(mech, pagePath) != null) {
+		const base = readPage(mech, pagePath).content ?? [];
+		fillContentDefaults(mech, base);
 		baseContent = base;
 	}
-	const folder = folderOf(mechDir, pagePath);
-	const siteData = readSiteData(mechDir, localeCode);
-	const folderData = readFolderData(mechDir, folder, localeCode);
+	const folder = folderOf(mech, pagePath);
+	const siteData = readSiteData(mech, localeCode);
+	const folderData = readFolderData(mech, folder, localeCode);
 	const pageData = page.data ?? {};
 	const pageMeta = {
 		path: pagePath,
@@ -163,7 +136,7 @@ function buildPageState(mechDir, urlPath, config) {
 	if (variant) pageMeta.pagination = { page: variant.page };
 	if (config) {
 		pageMeta.locale = locale;
-		pageMeta.locales = translationsOf(mechDir, pagePath, config);
+		pageMeta.locales = translationsOf(mech, pagePath, config);
 		if (fallback) pageMeta.localeFallback = true;
 	}
 	return {
@@ -178,7 +151,7 @@ function buildPageState(mechDir, urlPath, config) {
 		pageData,
 		folder,
 		page: pageMeta,
-		version: pageVersion(mechDir, pagePath, localeCode),
+		version: pageVersion(mech, pagePath, localeCode),
 		...config ? { locales: config } : {},
 		...baseContent ? { baseContent } : {}
 	};
@@ -192,14 +165,13 @@ function buildPageState(mechDir, urlPath, config) {
 * null and `generated` is set, so the editor treats it as read-only and never
 * queues a save against a file that doesn't exist.
 */
-function buildGeneratedState(mechDir, vp, config) {
+function buildGeneratedState(mech, vp, config) {
 	const content = vp.content ?? [];
-	fillContentDefaults(mechDir, content);
-	fillImageMeta(mechDir, content);
+	fillContentDefaults(mech, content);
 	const localeCode = !config || !vp.locale || vp.locale === config.default ? void 0 : vp.locale;
-	const folder = folderOf(mechDir, vp.path);
-	const siteData = readSiteData(mechDir, localeCode);
-	const folderData = readFolderData(mechDir, folder, localeCode);
+	const folder = folderOf(mech, vp.path);
+	const siteData = readSiteData(mech, localeCode);
+	const folderData = readFolderData(mech, folder, localeCode);
 	const pageData = vp.data ?? {};
 	const pageMeta = {
 		path: vp.path,
@@ -227,6 +199,49 @@ function buildGeneratedState(mechDir, vp, config) {
 		...config ? { locales: config } : {}
 	};
 }
+/**
+* Complete a page state with the image info its content refers to — previews
+* and dimensions come from the asset store, the one lookup a state needs that
+* is not a content file. Fills `content` and, on a translation, `baseContent`.
+*/
+async function fillStateImages(mech, assets, state) {
+	if (!assets) return state;
+	const lists = [state.content, ...state.baseContent ? [state.baseContent] : []];
+	const names = [...new Set(lists.flatMap((content) => imageNamesOf(mech, content)))];
+	if (!names.length) return state;
+	const images = await assets.info(names);
+	for (const content of lists) fillImageMeta(mech, content, images);
+	return state;
+}
+//#endregion
+//#region src/server/query-dev.ts
+/**
+* The dev server's {@link QuerySource}: pages come live from the `.mech`
+* store; `useFetch` URLs are fetched server-side (no CORS, matching how the
+* export resolves them at build time). `generated` pages (plugin `generatePages`)
+* are merged into the page listing so `usePages()` sees them, like the export.
+*/
+function devQuerySource(mech, generated) {
+	return {
+		listPages: (options) => listPages(mech, {
+			...options,
+			generated
+		}),
+		fetchJson: async ({ url, ...init }) => {
+			const res = await fetch(url, init);
+			if (!res.ok) throw new Error(`${url} responded ${res.status}`);
+			return res.json();
+		}
+	};
+}
+/**
+* Resolve a dev-mode query key against the local `.mech` store. Keys are of the
+* form `"<type>.<json-args>"` (the same encoding the runtime composables use);
+* `context.page` selects the chunk of a paginated query.
+*/
+function resolveDevQuery(mech, key, context = {}, generated) {
+	return resolveQueryKey(devQuerySource(mech, generated), key, context);
+}
 //#endregion
 //#region src/server/composed-store.ts
 /**
@@ -236,11 +251,9 @@ function buildGeneratedState(mechDir, vp, config) {
 * optimistic-concurrency saves (a 409 when the file changed under the editor).
 * See PLAN.md § 5.1.
 */
-/** The directory composed blocks live in. */
-function composedDirOf(mechDir) {
-	return join(mechDir, "blocks");
-}
-var fileOf = (mechDir, id) => join(composedDirOf(mechDir), `${id}${COMPOSED_EXT}`);
+/** The directory composed blocks live in, relative to the `.mech` root. */
+var BLOCKS = "blocks";
+var fileOf = (id) => `${BLOCKS}/${id}${COMPOSED_EXT}`;
 var hash = (text) => createHash("sha1").update(text).digest("hex").slice(0, 16);
 /** Thrown by {@link createComposedBlock} when the id is already taken. */
 var ComposedBlockExistsError = class ComposedBlockExistsError extends Error {
@@ -252,55 +265,62 @@ var ComposedBlockExistsError = class ComposedBlockExistsError extends Error {
 		Object.setPrototypeOf(this, ComposedBlockExistsError.prototype);
 	}
 };
+/** Every composed-block definition of the site, in id order; a malformed file is skipped. */
+function readComposedBlocks(mech) {
+	const files = contentFilesOf(mech);
+	const defs = [];
+	for (const file of files.list(BLOCKS).sort()) {
+		const name = file.slice(7);
+		if (name.includes("/") || !name.endsWith(".block.yml")) continue;
+		try {
+			defs.push(parseComposedBlock(files.read(file) ?? "", name.slice(0, -COMPOSED_EXT.length)));
+		} catch {}
+	}
+	return defs;
+}
 /** List every composed block (summaries), skipping malformed files. */
-function listComposedBlocks(mechDir) {
-	return loadComposedDefinitions(composedDirOf(mechDir)).map((def) => ({
+function listComposedBlocks(mech) {
+	return readComposedBlocks(mech).map((def) => ({
 		id: def.id,
 		name: def.name,
 		icon: def.icon,
 		category: def.category
 	}));
 }
-/** Read one composed block plus its on-disk version, or `null` when absent. */
-function readComposedBlock(mechDir, id) {
-	const file = fileOf(mechDir, id);
-	if (!fs.existsSync(file)) return null;
-	const text = fs.readFileSync(file, "utf-8");
+/** Read one composed block plus its version, or `null` when absent. */
+function readComposedBlock(mech, id) {
+	const text = contentFilesOf(mech).read(fileOf(id));
+	if (text == null) return null;
 	return {
 		def: parseComposedBlock(text, id),
 		version: hash(text)
 	};
 }
-/** A composed block's current on-disk version (content hash), or `null`. */
-function composedVersion(mechDir, id) {
-	const file = fileOf(mechDir, id);
-	if (!fs.existsSync(file)) return null;
-	return hash(fs.readFileSync(file, "utf-8"));
+/** A composed block's current version (content hash), or `null`. */
+function composedVersion(mech, id) {
+	const text = contentFilesOf(mech).read(fileOf(id));
+	return text == null ? null : hash(text);
 }
-var writeDef = (mechDir, id, def) => {
-	const file = fileOf(mechDir, id);
-	writeFileAtomic(file, serializeComposedBlock({
+var writeDef = (mech, id, def) => {
+	const text = serializeComposedBlock({
 		...def,
 		id
-	}));
-	return hash(fs.readFileSync(file, "utf-8"));
+	});
+	contentFilesOf(mech).write(fileOf(id), text);
+	return hash(text);
 };
 /** Create a new composed block; throws {@link ComposedBlockExistsError} if taken. */
-function createComposedBlock(mechDir, def) {
-	if (fs.existsSync(fileOf(mechDir, def.id))) throw new ComposedBlockExistsError(def.id);
-	return { version: writeDef(mechDir, def.id, def) };
+function createComposedBlock(mech, def) {
+	if (contentFilesOf(mech).has(fileOf(def.id))) throw new ComposedBlockExistsError(def.id);
+	return { version: writeDef(mech, def.id, def) };
 }
-/** Overwrite a composed block's definition; returns the new on-disk version. */
-function saveComposedBlock(mechDir, id, def) {
-	return { version: writeDef(mechDir, id, def) };
+/** Overwrite a composed block's definition; returns the new version. */
+function saveComposedBlock(mech, id, def) {
+	return { version: writeDef(mech, id, def) };
 }
 /** Delete a composed block. Returns whether it existed. */
-function deleteComposedBlock(mechDir, id) {
-	const file = fileOf(mechDir, id);
-	if (!fs.existsSync(file)) return false;
-	fs.rmSync(file);
-	markMutated(file);
-	return true;
+function deleteComposedBlock(mech, id) {
+	return contentFilesOf(mech).remove(fileOf(id));
 }
 //#endregion
 //#region src/server/editor-page.ts
@@ -394,15 +414,34 @@ function validateComposed(def) {
 	if (d.template !== void 0 && !Array.isArray(d.template)) return { template: "template must be a list" };
 	return null;
 }
-/** Create the editor API over a site's `.mech` directory. */
-function createEditorService(mechDir, options = {}) {
+/**
+* Create the editor API over a site's content: a `.mech` directory, or a set of
+* content files (`ContentFiles`) a host assembled — then uploads, which need a
+* directory, are not served.
+*/
+function createEditorService(mech, options = {}) {
+	const mechDir = typeof mech === "string" ? mech : null;
+	const assets = options.assets ?? (mechDir ? fsAssetStore(mechDir) : null);
+	const asset = async (encoded) => {
+		let name;
+		try {
+			name = decodeURIComponent(encoded);
+		} catch {
+			return new Response("Bad request", { status: 400 });
+		}
+		if (!assets || !isAssetName(name)) return null;
+		const body = await assets.open(name);
+		if (!body) return null;
+		const type = MIME[extname(name).toLowerCase()];
+		return new Response(body, { headers: type ? { "content-type": type } : {} });
+	};
 	let configured = null;
 	let generatedIndex = null;
 	const currentSite = async () => {
 		if (!options.site) return null;
 		const manifest = typeof options.site === "function" ? await options.site() : options.site;
 		if (manifest !== configured) {
-			configureSite(mechDir, manifest);
+			configureSite(mech, manifest);
 			generatedIndex = indexGeneratedPages(manifest);
 			configured = manifest;
 		}
@@ -421,36 +460,39 @@ function createEditorService(mechDir, options = {}) {
 		const body = () => request.json();
 		/** The rejection for a mutation targeting a file-less generated page, if it is one. */
 		const generatedGuard = (path) => path && gen?.logical.has(path) ? json({ error: "This page is generated and read-only" }, 409) : null;
-		if (pathname.startsWith("/assets/")) return serveFile(resolve(mechDir, "assets"), pathname.slice(8));
-		if (pathname.startsWith("/thumbs/")) return serveFile(resolve(mechDir, "thumbs"), pathname.slice(8), { "cache-control": "no-cache" });
-		if (pathname === "/images" && method === "GET") return json(listImages(mechDir));
-		if (pathname === "/folders" && method === "GET") return json(listFolders(mechDir));
+		if (pathname.startsWith("/assets/")) return await asset(pathname.slice(8)) ?? new Response("Not found", { status: 404 });
+		if (pathname.startsWith("/thumbs/")) {
+			if (!mechDir) return new Response("Not found", { status: 404 });
+			return serveFile(resolve(mechDir, "thumbs"), pathname.slice(8), { "cache-control": "no-cache" });
+		}
+		if (pathname === "/images" && method === "GET") return json(assets ? await listUploads(assets) : []);
+		if (pathname === "/folders" && method === "GET") return json(listFolders(mech));
 		if (pathname === "/query" && method === "GET") {
 			const key = query.get("q");
 			if (!key) return json({ error: "Missing query key" }, 400);
-			return json(await resolveDevQuery(mechDir, key, {
+			return json(await resolveDevQuery(mech, key, {
 				page: Number(query.get("page") ?? "") || void 0,
 				locale: variantCode(query.get("locale"))
 			}, gen?.pages));
 		}
 		if (pathname === "/upload" && method === "POST") {
-			const bytes = Buffer.from(await request.arrayBuffer());
+			if (!assets) return json({ error: "No asset storage" }, 501);
+			const bytes = new Uint8Array(await request.arrayBuffer());
 			const header = request.headers.get("x-file-name") ?? "file";
 			let name = header;
 			try {
 				name = decodeURIComponent(header);
 			} catch {}
-			if (request.headers.get("x-derived-asset")) return json(await saveDerivedAsset(mechDir, name, bytes));
-			return json(await saveUpload(mechDir, name, bytes));
+			return json(await storeUpload(assets, name, bytes, { derived: request.headers.has("x-derived-asset") }));
 		}
 		if (pathname === "/state" && method === "GET") {
 			const pathParam = query.get("path");
 			if (!pathParam) return json({ error: "Missing path" }, 400);
 			const generated = gen?.byServed.get(pathParam);
-			if (generated) return json(buildGeneratedState(mechDir, generated, config));
-			return json(buildPageState(mechDir, pathParam, config));
+			const state = generated ? buildGeneratedState(mech, generated, config) : buildPageState(mech, pathParam, config);
+			return json(await fillStateImages(mech, assets, state));
 		}
-		if (pathname === "/pages" && method === "GET") return json(listPages(mechDir, {
+		if (pathname === "/pages" && method === "GET") return json(listPages(mech, {
 			...config ? { locales: config } : {},
 			generated: gen?.pages
 		}));
@@ -465,7 +507,7 @@ function createEditorService(mechDir, options = {}) {
 		if (pathname === "/pages" && method === "DELETE") {
 			const pathParam = query.get("path");
 			if (!pathParam) return json({ error: "Missing path" }, 400);
-			return generatedGuard(pathParam) ?? json({ success: deletePage(mechDir, pathParam) });
+			return generatedGuard(pathParam) ?? json({ success: deletePage(mech, pathParam) });
 		}
 		if (pathname === "/pages/draft" && method === "POST") {
 			const pathParam = query.get("path");
@@ -473,7 +515,7 @@ function createEditorService(mechDir, options = {}) {
 			const blocked = generatedGuard(pathParam);
 			if (blocked) return blocked;
 			const { draft } = await body();
-			setPageDraft(mechDir, pathParam, draft === true, variantCode(query.get("locale")));
+			setPageDraft(mech, pathParam, draft === true, variantCode(query.get("locale")));
 			return json({
 				success: true,
 				draft: draft === true
@@ -487,7 +529,7 @@ function createEditorService(mechDir, options = {}) {
 			if (blocked) return blocked;
 			if (!config || locale === config.default || !config.all.includes(locale)) return json({ error: "Unknown locale" }, 400);
 			try {
-				createTranslation(mechDir, pathParam, locale);
+				createTranslation(mech, pathParam, locale);
 				return json({ success: true });
 			} catch (error) {
 				if (error instanceof PageExistsError) return json({ error: "Translation already exists" }, 400);
@@ -498,7 +540,7 @@ function createEditorService(mechDir, options = {}) {
 			const pathParam = query.get("path");
 			const locale = query.get("locale");
 			if (!pathParam || !locale) return json({ error: "Missing path or locale" }, 400);
-			return generatedGuard(pathParam) ?? json({ success: deleteTranslation(mechDir, pathParam, locale) });
+			return generatedGuard(pathParam) ?? json({ success: deleteTranslation(mech, pathParam, locale) });
 		}
 		if (pathname === "/pages/duplicate" && method === "POST") {
 			const pathParam = query.get("path");
@@ -508,7 +550,7 @@ function createEditorService(mechDir, options = {}) {
 			const input = await body();
 			if (!input.path || !input.name) return json({ error: "path and name are required" }, 400);
 			try {
-				return json(duplicatePage(mechDir, pathParam, input));
+				return json(duplicatePage(mech, pathParam, input));
 			} catch (error) {
 				if (error instanceof PageExistsError) return json({ error: { path: "Page already exists" } }, 400);
 				throw error;
@@ -521,8 +563,8 @@ function createEditorService(mechDir, options = {}) {
 				const blocked = generatedGuard(pathParam);
 				if (blocked) return blocked;
 				try {
-					const path = typeof input.path === "string" && input.path.trim() && input.path.trim() !== pathParam ? movePage(mechDir, pathParam, input.path).path : pathParam;
-					if (input.name) renamePage(mechDir, path, input.name);
+					const path = typeof input.path === "string" && input.path.trim() && input.path.trim() !== pathParam ? movePage(mech, pathParam, input.path).path : pathParam;
+					if (input.name) renamePage(mech, path, input.name);
 					return json({
 						success: true,
 						path
@@ -538,7 +580,7 @@ function createEditorService(mechDir, options = {}) {
 				if (first && first !== config.default && config.all.includes(first)) return json({ error: { path: `"/${first}" is reserved for the ${first} locale` } }, 400);
 			}
 			try {
-				return json(createPage(mechDir, input));
+				return json(createPage(mech, input));
 			} catch (error) {
 				if (error instanceof PageExistsError) return json({ error: { path: "Page already exists" } }, 400);
 				throw error;
@@ -552,31 +594,34 @@ function createEditorService(mechDir, options = {}) {
 			const locale = variantCode(query.get("locale"));
 			const save = await body();
 			if (!save.force && typeof save.version === "string") {
-				const current = pageVersion(mechDir, pathParam, locale);
+				const current = pageVersion(mech, pathParam, locale);
 				if (current != null && current !== save.version) return json({
 					error: "conflict",
 					version: current
 				}, 409);
 			}
-			const folder = folderOf(mechDir, pathParam);
-			const version = savePage(mechDir, pathParam, {
+			const folder = folderOf(mech, pathParam);
+			if (assets && Array.isArray(save.content)) await assets.saveInfo(harvestPageImages(mech, save.content));
+			const baseNames = assets && locale ? imageNamesOf(mech, readPage(mech, pathParam).content ?? []) : [];
+			const baseImages = assets && baseNames.length ? await assets.info(baseNames) : {};
+			const version = savePage(mech, pathParam, {
 				content: save.content,
 				data: save.pageData ?? {},
 				layout: save.layout
-			}, locale);
+			}, locale, baseImages);
 			const siteI18n = save.siteDataI18n ?? {};
 			const folderI18n = save.folderDataI18n ?? {};
 			if (locale) {
-				mergeSiteData(mechDir, save.siteData ?? {});
-				mergeFolderData(mechDir, folder, save.folderData ?? {});
-				mergeLocaleSiteData(mechDir, locale, siteI18n);
-				mergeLocaleFolderData(mechDir, locale, folder, folderI18n);
+				mergeSiteData(mech, save.siteData ?? {});
+				mergeFolderData(mech, folder, save.folderData ?? {});
+				mergeLocaleSiteData(mech, locale, siteI18n);
+				mergeLocaleFolderData(mech, locale, folder, folderI18n);
 			} else {
-				mergeSiteData(mechDir, {
+				mergeSiteData(mech, {
 					...save.siteData ?? {},
 					...siteI18n
 				});
-				mergeFolderData(mechDir, folder, {
+				mergeFolderData(mech, folder, {
 					...save.folderData ?? {},
 					...folderI18n
 				});
@@ -586,11 +631,11 @@ function createEditorService(mechDir, options = {}) {
 				version
 			});
 		}
-		if (pathname === "/composed" && method === "GET") return json(listComposedBlocks(mechDir));
+		if (pathname === "/composed" && method === "GET") return json(listComposedBlocks(mech));
 		if (pathname === "/composed/get" && method === "GET") {
 			const id = query.get("id");
 			if (!id || !isValidId(id)) return json({ error: "Missing or invalid id" }, 400);
-			const result = readComposedBlock(mechDir, id);
+			const result = readComposedBlock(mech, id);
 			return result ? json(result) : json({ error: "not found" }, 404);
 		}
 		if (pathname === "/composed/create" && method === "POST") {
@@ -601,7 +646,7 @@ function createEditorService(mechDir, options = {}) {
 			try {
 				return json({
 					success: true,
-					...createComposedBlock(mechDir, def)
+					...createComposedBlock(mech, def)
 				});
 			} catch (error) {
 				if (error instanceof ComposedBlockExistsError) return json({ error: { id: "A block with this id already exists" } }, 400);
@@ -615,7 +660,7 @@ function createEditorService(mechDir, options = {}) {
 			const invalid = validateComposed(save.def);
 			if (invalid) return json({ error: invalid }, 400);
 			if (!save.force && typeof save.version === "string") {
-				const current = composedVersion(mechDir, id);
+				const current = composedVersion(mech, id);
 				if (current != null && current !== save.version) return json({
 					error: "conflict",
 					version: current
@@ -623,13 +668,13 @@ function createEditorService(mechDir, options = {}) {
 			}
 			return json({
 				success: true,
-				...saveComposedBlock(mechDir, id, save.def)
+				...saveComposedBlock(mech, id, save.def)
 			});
 		}
 		if (pathname === "/composed/delete" && method === "POST") {
 			const id = query.get("id");
 			if (!id || !isValidId(id)) return json({ error: "Missing or invalid id" }, 400);
-			return json({ success: deleteComposedBlock(mechDir, id) });
+			return json({ success: deleteComposedBlock(mech, id) });
 		}
 		return null;
 	};
@@ -641,13 +686,14 @@ function createEditorService(mechDir, options = {}) {
 				return json({ error: String(error) }, 500);
 			}
 		},
+		asset,
 		async page(urlPath) {
 			if (!options.editorHtml) return null;
 			const site = await currentSite();
 			const template = typeof options.editorHtml === "function" ? await options.editorHtml() : options.editorHtml;
 			const generated = site ? generatedIndex?.byServed.get(urlPath) : void 0;
 			const locales = site?.locales ?? null;
-			const html = renderEditablePage(template, generated ? buildGeneratedState(mechDir, generated, locales) : buildPageState(mechDir, urlPath, locales), {
+			const html = renderEditablePage(template, await fillStateImages(mech, assets, generated ? buildGeneratedState(mech, generated, locales) : buildPageState(mech, urlPath, locales)), {
 				site: site?.site,
 				hostConfig: options.hostConfig
 			});
@@ -688,12 +734,32 @@ function toNodeMiddleware(service) {
 			});
 			const response = await service.handle(request);
 			if (!response) return next();
-			res.statusCode = response.status;
-			response.headers.forEach((value, name) => res.setHeader(name, value));
-			if (response.body) for await (const chunk of response.body) res.write(chunk);
-			res.end();
+			await send(res, response);
+		})().catch(next);
+	};
+}
+async function send(res, response) {
+	res.statusCode = response.status;
+	response.headers.forEach((value, name) => res.setHeader(name, value));
+	if (response.body) for await (const chunk of response.body) res.write(chunk);
+	res.end();
+}
+/**
+* Serve a site's uploads on a Node HTTP stack. Mount it at the uploads prefix
+* (`app.use('/media', …)`, see `UPLOADS_PREFIX`) — `req.url` then arrives as
+* `/<name>`. A name that is not an upload falls through to `next()`, so files
+* a site keeps in `public/media` are still served by whatever comes after.
+*/
+function toAssetMiddleware(service) {
+	return (req, res, next) => {
+		if (req.method !== "GET" && req.method !== "HEAD") return next();
+		(async () => {
+			const name = (req.url ?? "/").split("?")[0].slice(1);
+			const response = name ? await service.asset(name) : null;
+			if (!response) return next();
+			await send(res, response);
 		})().catch(next);
 	};
 }
 //#endregion
-export { buildGeneratedState as a, collectComposed as c, renderEditablePage as i, loadComposedDefinitions as l, createEditorService as n, buildPageState as o, readEditorTemplate as r, COMPOSED_EXT as s, toNodeMiddleware as t };
+export { renderEditablePage as a, fillStateImages as c, loadComposedDefinitions as d, readEditorTemplate as i, COMPOSED_EXT as l, toNodeMiddleware as n, buildGeneratedState as o, createEditorService as r, buildPageState as s, toAssetMiddleware as t, collectComposed as u };