wuppycms 0.0.0-stage → 0.2.0

package/dist/theme-pages-CRsBm1EX.mjs

@@ -0,0 +1,246 @@
+import { t as parseDocument } from "./frontmatter-DGaz9--t.mjs";
+import { t as listThemeComponents } from "./components-BrGAEPly.mjs";
+import { realpathSync } from "node:fs";
+import { readFile } from "node:fs/promises";
+import { join, relative, resolve, sep } from "node:path";
+
+//#region src/astro/quiet-hmr.ts
+/**
+* The visual editor changes a theme element on the canvas itself, then writes the same change to the `.astro` file.
+* Astro would reload the whole page for that write (it looks like F5 while typing), so a write the editor marks as
+* already shown skips the reload: the file's server modules are still invalidated, so the next request renders it.
+*/
+const KEY = "__wuppyQuietFiles";
+const quiet = globalThis[KEY] ??= /* @__PURE__ */ new Map();
+/** The next change of this file (within a few seconds, so a later edit outside the editor still reloads) is quiet. */
+const quietNextChange = (file) => quiet.set(realpathSync(file), Date.now() + 3e3);
+function quietHmrPlugin() {
+	return {
+		name: "wuppy:quiet-hmr",
+		enforce: "pre",
+		hotUpdate: {
+			order: "pre",
+			handler({ file, modules, timestamp }) {
+				const until = quiet.get(file);
+				if (!until) return;
+				if (until < Date.now()) {
+					quiet.delete(file);
+					return;
+				}
+				const own = modules.filter((m) => m.file === file);
+				if (!own.length) return;
+				const seen = /* @__PURE__ */ new Set();
+				for (const m of own) this.environment.moduleGraph.invalidateModule(m, seen, timestamp, true);
+				const runner = this.environment.runner?.evaluatedModules;
+				for (const m of seen) {
+					const cached = m.id && runner?.getModuleById(m.id);
+					if (cached) runner.invalidateModule(cached);
+				}
+				return modules.filter((m) => m.file !== file);
+			}
+		}
+	};
+}
+
+//#endregion
+//#region src/astro/theme-components.ts
+/**
+* Makes the active theme's Astro components available to MDX content without asking the theme author to pass a
+* components map in every page template. A tiny Vite transform adds `components={__wuppyComponents}` to `<Content />`
+* (build and live rendering use the same page) and imports the components directly, so there is no virtual module for
+* Vite's dev module runner to resolve.
+*
+* The map is generated from source files, so adding a component needs a dev-server restart/rebuild; that matches the
+* theme source workflow (Code view already asks for a rebuild after source changes).
+*/
+function mapSource(list) {
+	return [
+		"import { markHTMLString as __wuppyHtml } from \"astro/runtime/server/index.js\";",
+		"const __wuppySafe = (name, C) => Object.assign((result, props, slots) => {",
+		"	const failed = (e) => {",
+		"		console.error(`[wuppy] <${name}> could not render: ${e?.message ?? e}`);",
+		"		return __wuppyHtml(`<!-- wuppy: <${name}> could not render -->`);",
+		"	};",
+		"	try {",
+		"		const out = C(result, props, slots);",
+		"		return out && typeof out.then === \"function\" ? out.catch(failed) : out;",
+		"	} catch (e) {",
+		"		return failed(e);",
+		"	}",
+		"}, C);",
+		...list.map((component, i) => `import __wuppyC${i} from ${JSON.stringify(component.path)};`),
+		`const __wuppyComponents = { ${list.map((component, i) => `${JSON.stringify(component.name)}: __wuppySafe(${JSON.stringify(component.name)}, __wuppyC${i})`).join(", ")} };`
+	].join("\n");
+}
+/**
+* Wraps the page's `<Content />` in `<!--wuppy:body-->` comments, so the visual editor can load the live page and edit
+* the entry in place inside any theme's layout. Comments do not change layout or CSS.
+*/
+const BODY_SOURCE = ["import { createComponent as __wuppyCreate, renderComponent as __wuppyRenderComponent, render as __wuppyRender } from \"astro/runtime/server/index.js\";", "const __wuppyBody = (C) => __wuppyCreate((result, props, slots) => __wuppyRender`<!--wuppy:body-->${__wuppyRenderComponent(result, \"Content\", C, props, slots)}<!--/wuppy:body-->`);"].join("\n");
+function themeComponentsPlugin(root) {
+	const roots = [resolve(root)];
+	let pending;
+	const components = () => pending ??= (async () => {
+		const out = [];
+		const seen = /* @__PURE__ */ new Set();
+		for (const base of roots) for (const component of await listThemeComponents(base)) {
+			if (seen.has(component.name)) continue;
+			seen.add(component.name);
+			out.push({
+				name: component.name,
+				path: join(base, component.path)
+			});
+		}
+		return out;
+	})();
+	return {
+		name: "wuppy:theme-components",
+		transform: {
+			order: "post",
+			async handler(code, id) {
+				if (!id.endsWith(".astro") || id.includes("/node_modules/")) return null;
+				if (code.includes("const __wuppyBody")) return null;
+				const list = await components();
+				if (code.includes(`renderComponent($$result, "Content", Content`)) {
+					const map = list.length > 0 && !/\bcomponents\s*[:,]/.test(code);
+					const patched = code.replace(/renderComponent\(\$\$result, "Content", Content, \{/g, `renderComponent($$$$result, "Content", __wuppyBody(Content), {${map ? " components: __wuppyComponents," : ""}`);
+					return {
+						code: `${BODY_SOURCE}\n${map ? `${mapSource(list)}\n` : ""}${patched}`,
+						map: null
+					};
+				}
+				if (!list.length || code.includes("const __wuppyComponents")) return null;
+				if (!code.includes("<Content")) return null;
+				let changed = false;
+				const body = code.replace(/<Content\b([^>]*)>/g, (full, attrs) => {
+					if (/\bcomponents\s*=/.test(attrs)) return full;
+					changed = true;
+					return `<Content components={__wuppyComponents}${attrs}>`;
+				});
+				if (!changed) return null;
+				const at = /^---\r?\n/.exec(body)?.[0].length ?? 0;
+				const out = `${body.slice(0, at)}${mapSource(list)}\n${body.slice(at)}`;
+				return {
+					code: at ? out : `---\n${mapSource(list)}\n---\n${body}`,
+					map: null
+				};
+			}
+		}
+	};
+}
+
+//#endregion
+//#region src/astro/theme-pages.ts
+/** `<theme>/src/pages/docs/intro.md` -> `docs/intro`, or undefined when it is not a static Markdown or Astro page. */
+function themePageRel(root, id) {
+	const rel = relative(join(root, "src/pages"), id).split(sep).join("/");
+	if (rel.startsWith("..") || !/\.(mdx?|astro)$/.test(rel) || rel.includes("[") || rel.split("/").some((p) => p.startsWith("_"))) return void 0;
+	return rel.replace(/\.(mdx?|astro)$/, "");
+}
+const BODY_ID = "virtual:wuppy-theme-body/";
+/**
+* A theme `.astro` page keeps its own markup; the blocks added to it in the admin (its Pages entry's body) render at the
+* end of its `<main>`, or inside its last element when it has none, through a generated `<WuppyThemeBody />`.
+*/
+function withThemeBody(source, rel) {
+	const front = /^\s*---\r?\n/.exec(source);
+	const importLine = `import WuppyThemeBody from ${JSON.stringify(BODY_ID + rel)};`;
+	const head = front ? source.slice(0, front[0].length) + importLine + (themeBodyShift(source) ? "\n" : " ") : `---\n${importLine}\n---\n`;
+	const rest = front ? source.slice(front[0].length) : source;
+	const end = front ? rest.search(/^---\s*$/m) : 0;
+	const template = rest.slice(end);
+	let at = template.lastIndexOf("</main>");
+	if (at === -1) {
+		for (const m of template.matchAll(/<\/([A-Za-z][\w.:-]*)\s*>/g)) if (!/^(style|script)$/i.test(m[1])) at = m.index;
+	}
+	if (at === -1) return source;
+	return head + rest.slice(0, end) + template.slice(0, at) + "<WuppyThemeBody />" + template.slice(at);
+}
+/** Lines withThemeBody adds before the template: none, unless the page has no frontmatter or an empty one. */
+function themeBodyShift(source) {
+	const front = /^\s*---\r?\n/.exec(source);
+	if (!front) return 3;
+	return /^---\s*$/m.test(source.slice(front[0].length).split("\n")[0] ?? "") ? 1 : 0;
+}
+/** The `<WuppyThemeBody />` module for one page: the entry's body between the visual editor's markers. */
+const bodyModule = (rel, runtime, components, settings) => `import { createComponent, render, renderComponent, unescapeHTML } from "astro/runtime/server/index.js";
+import { themeBody } from ${JSON.stringify(runtime)};
+${components || "const __wuppyComponents = {};"}
+export default createComponent(async (result) => {
+	const page = await themeBody(${JSON.stringify(rel)}, ${JSON.stringify(settings)});
+	if (!page) return render\`\`;
+	return page.Content
+		? render\`<!--wuppy:body-->\${renderComponent(result, "Content", page.Content, { components: __wuppyComponents })}<!--/wuppy:body-->\`
+		: render\`<!--wuppy:body-->\${unescapeHTML(page.html)}<!--/wuppy:body-->\`;
+});
+`;
+function pageModule(o) {
+	return `import { createComponent, render, renderComponent, unescapeHTML } from "astro/runtime/server/index.js";
+import { themePage } from ${JSON.stringify(o.runtime)};
+${o.layout ? `import Layout from ${JSON.stringify(o.layout)};` : ""}
+${o.components || "const __wuppyComponents = {};"}
+const file = ${JSON.stringify(o.file)};
+const url = ${JSON.stringify(o.url)};
+export default createComponent(async (result) => {
+	const page = await themePage(${JSON.stringify(o.rel)}, file, ${JSON.stringify(o.settings)});
+	const content = { ...page.data, file, url };
+	const body = () => page.Content
+		? render\`<!--wuppy:body-->\${renderComponent(result, "Content", page.Content, { components: __wuppyComponents })}<!--/wuppy:body-->\`
+		: render\`<!--wuppy:body-->\${unescapeHTML(page.html)}<!--/wuppy:body-->\`;
+	return ${o.layout ? `render\`\${renderComponent(result, "Layout", Layout, { file, url, content, frontmatter: content, headings: page.headings, "server:root": true }, { default: body })}\`` : "body()"};
+});
+`;
+}
+function themePagesPlugin(o) {
+	return {
+		name: "wuppy:theme-pages",
+		enforce: "pre",
+		resolveId: (id) => id.startsWith(BODY_ID) ? `\0${id}` : null,
+		transform: {
+			order: "pre",
+			handler(code, id) {
+				if (id.includes("?") || !id.endsWith(".astro")) return null;
+				const rel = themePageRel(o.root, id);
+				return rel ? {
+					code: withThemeBody(code, rel),
+					map: null
+				} : null;
+			}
+		},
+		load: {
+			order: "pre",
+			async handler(id) {
+				const map = async () => {
+					const all = await listThemeComponents(o.root);
+					return all.length ? mapSource(all.map((c) => ({
+						...c,
+						path: join(o.root, c.path)
+					}))) : "";
+				};
+				if (id.startsWith(`\0${BODY_ID}`)) return {
+					code: bodyModule(id.slice(26), o.runtime, await map(), o.markdown()),
+					map: null
+				};
+				const file = id.split("?")[0];
+				const rel = themePageRel(o.root, file);
+				if (!rel || id.includes("?") || file.endsWith(".astro")) return null;
+				const { layout } = parseDocument(await readFile(file, "utf8")).data;
+				return {
+					code: pageModule({
+						rel,
+						file,
+						runtime: o.runtime,
+						layout: typeof layout === "string" ? layout : void 0,
+						url: `/${rel.replace(/(^|\/)index$/, "")}`,
+						components: await map(),
+						settings: o.markdown()
+					}),
+					map: null
+				};
+			}
+		}
+	};
+}
+
+//#endregion
+export { themeComponentsPlugin as a, mapSource as i, themePageRel as n, quietHmrPlugin as o, themePagesPlugin as r, quietNextChange as s, themeBodyShift as t };

package/dist/theme-seo-middleware.d.mts

@@ -0,0 +1,7 @@
+//#region src/astro/theme-seo-middleware.d.ts
+declare const onRequest: (ctx: {
+  request: Request;
+  url: URL;
+}, next: () => Promise<Response>) => Promise<Response>;
+//#endregion
+export { onRequest };

package/dist/theme-seo-middleware.mjs

@@ -0,0 +1,62 @@
+import "./config-CM8_-x_W.mjs";
+import { t as parseDocument } from "./frontmatter-DGaz9--t.mjs";
+import { a as pagesDir, c as templateUrl, i as loadSiteConfig } from "./site-dF-xVPqe.mjs";
+import { esc } from "./seo.mjs";
+import { readFile, readdir } from "node:fs/promises";
+import { join } from "node:path";
+
+//#region src/astro/theme-seo.ts
+/** Puts a Pages entry's SEO fields into the `<head>` a theme page rendered. */
+function withSeo(html, data) {
+	const str = (k) => typeof data[k] === "string" && data[k] ? data[k] : void 0;
+	const title = str("seoTitle");
+	const description = str("seoDescription");
+	let out = html;
+	if (title) out = out.replace(/<title>[\s\S]*?<\/title>/i, `<title>${esc(title)}</title>`);
+	const tags = [];
+	if (description) {
+		const meta = /<meta\s+name=["']description["'][^>]*>/i;
+		const tag = `<meta name="description" content="${esc(description)}">`;
+		if (meta.test(out)) out = out.replace(meta, tag);
+		else tags.push(tag);
+	}
+	if (data.noindex === true) tags.push("<meta name=\"robots\" content=\"noindex\">");
+	const at = out.search(/<\/head>/i);
+	return tags.length && at !== -1 ? out.slice(0, at) + tags.join("") + out.slice(at) : out;
+}
+/** The site's Pages entries that stand for a theme `.astro` page, by the URL that page serves. */
+async function templatePages(site, dir) {
+	const map = /* @__PURE__ */ new Map();
+	if (!dir) return map;
+	const names = await readdir(join(site, dir), { recursive: true }).catch(() => []);
+	for (const name of names.filter((n) => /\.mdx?$/.test(n))) {
+		const { data } = parseDocument(await readFile(join(site, dir, name), "utf8"));
+		if (typeof data.template === "string") map.set(templateUrl(data.template), data);
+	}
+	return map;
+}
+/** A theme run for a site: the theme's `.astro` pages get the SEO title, description and noindex set in the admin. */
+function createThemeSeoMiddleware(site, theme) {
+	let dir;
+	return async (ctx, next) => {
+		if (ctx.request.method !== "GET") return next();
+		const res = await next();
+		if (res.status !== 200 || !(res.headers.get("content-type") ?? "").includes("text/html")) return res;
+		const path = ctx.url.pathname.replace(/\/$/, "") || "/";
+		const data = (await templatePages(site, await (dir ??= loadSiteConfig(site, theme).then((c) => pagesDir(c.collections))))).get(path);
+		if (!data) return res;
+		const headers = new Headers(res.headers);
+		headers.delete("content-length");
+		return new Response(withSeo(await res.text(), data), {
+			status: res.status,
+			headers
+		});
+	};
+}
+
+//#endregion
+//#region src/astro/theme-seo-middleware.ts
+const onRequest = createThemeSeoMiddleware(process.env.WUPPY_BASE_ROOT ?? process.cwd(), process.cwd());
+
+//#endregion
+export { onRequest };

package/dist/visual-middleware.d.mts

@@ -0,0 +1,7 @@
+//#region src/astro/visual-middleware.d.ts
+declare const onRequest: (ctx: {
+  request: Request;
+  url: URL;
+}, next: () => Promise<Response>) => Promise<Response>;
+//#endregion
+export { onRequest };

package/dist/visual-middleware.mjs

@@ -0,0 +1,71 @@
+import "./config-CM8_-x_W.mjs";
+import "./frontmatter-DGaz9--t.mjs";
+import { s as siteRoot } from "./site-dF-xVPqe.mjs";
+import { readFile, stat } from "node:fs/promises";
+import { join } from "node:path";
+import { createHash } from "node:crypto";
+import { fontLinks, pageCss, visualCss, visualDataSchema } from "@wuppycms/visual-editor";
+
+//#region src/astro/visual.ts
+const SKIP_PATH = /^\/(admin|api|uploads|_astro)(\/|$)/;
+let loaded;
+const defaults = visualDataSchema.parse({});
+/** The visual editor's site data, re-read when the file changes. Null before the editor ever saved any. */
+async function visualData(root) {
+	const path = join(root, ".wuppy", "data", "visual.json");
+	const info = await stat(path).catch(() => null);
+	if (!info) return null;
+	if (loaded?.mtime === info.mtimeMs) return loaded;
+	const raw = await readFile(path, "utf8").then(JSON.parse).catch(() => null);
+	const parsed = visualDataSchema.safeParse(raw);
+	if (!parsed.success) return null;
+	const css = visualCss(parsed.data);
+	loaded = {
+		mtime: info.mtimeMs,
+		data: parsed.data,
+		version: css ? createHash("sha1").update(css).digest("hex").slice(0, 10) : ""
+	};
+	return loaded;
+}
+/**
+* Adds the visual editor's CSS to every HTML page: a link to the site-wide sheet (framework, selectors, user CSS),
+* the font stylesheets, and a `<style>` with the responsive/state styles of the visual nodes on this page.
+*/
+/**
+* Astro's dev server marks each element with the `.astro` file and spot it comes from, and its dev toolbar removes the
+* marks once the page loads. The visual editor edits theme markup by them, so it gets a copy the toolbar leaves alone.
+*/
+const withSourceCopy = (html) => html.includes("data-astro-source-file") ? html.replace(/ data-astro-source-(file|loc)="([^"]*)"/g, " data-astro-source-$1=\"$2\" data-wuppy-$1=\"$2\"") : html;
+function createVisualMiddleware(root) {
+	return async (ctx, next) => {
+		if (ctx.request.method !== "GET" || SKIP_PATH.test(ctx.url.pathname)) return next();
+		const res = await next();
+		if (res.status !== 200 || !(res.headers.get("content-type") ?? "").includes("text/html")) return res;
+		const html = withSourceCopy(await res.text());
+		const visual = await visualData(root);
+		const tags = [];
+		if (visual?.version) tags.push(`<link rel="stylesheet" href="/api/public/visual.css?v=${visual.version}">`);
+		for (const href of visual ? fontLinks(visual.data.framework) : []) tags.push(`<link rel="stylesheet" href="${href.replace(/&/g, "&amp;")}">`);
+		const page = pageCss(html, visual?.data ?? defaults);
+		if (page) tags.push(`<style data-wuppy-visual>${page}</style>`);
+		const headers = new Headers(res.headers);
+		headers.delete("content-length");
+		if (!tags.length) return new Response(html, {
+			status: res.status,
+			headers
+		});
+		const at = html.search(/<\/head>/i);
+		const out = at === -1 ? tags.join("") + html : html.slice(0, at) + tags.join("") + html.slice(at);
+		return new Response(out, {
+			status: res.status,
+			headers
+		});
+	};
+}
+
+//#endregion
+//#region src/astro/visual-middleware.ts
+const onRequest = createVisualMiddleware(siteRoot());
+
+//#endregion
+export { onRequest };

package/package.json

@@ -1,6 +1,75 @@
 {
   "name": "wuppycms",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.2.0",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.mts",
+      "import": "./dist/index.mjs"
+    },
+    "./astro": {
+      "types": "./dist/astro.d.mts",
+      "import": "./dist/astro.mjs"
+    },
+    "./seo": {
+      "types": "./dist/seo.d.mts",
+      "import": "./dist/seo.mjs"
+    },
+    "./publishing": {
+      "types": "./dist/publishing.d.mts",
+      "import": "./dist/publishing.mjs"
+    },
+    "./site": {
+      "types": "./dist/site.d.mts",
+      "import": "./dist/site.mjs"
+    },
+    "./markdown": {
+      "types": "./dist/markdown.d.mts",
+      "import": "./dist/markdown.mjs"
+    },
+    "./mdx": {
+      "types": "./dist/mdx.d.mts",
+      "import": "./dist/mdx.mjs"
+    }
+  },
+  "dependencies": {
+    "@astrojs/compiler-rs": "^0.5.2",
+    "hono": "4.13.13",
+    "nodemailer": "^10.1.7",
+    "quickjs-emscripten": "0.32.0",
+    "resend": "^6.34.1",
+    "yaml": "^2.8.0",
+    "zod": "4.5.4",
+    "@wuppycms/admin": "0.2.0",
+    "@wuppycms/auth": "0.2.0",
+    "@wuppycms/git": "0.2.0",
+    "@wuppycms/plugin-types": "0.2.0",
+    "@wuppycms/visual-editor": "0.2.0"
+  },
+  "devDependencies": {
+    "@types/node": "^22.16.0",
+    "@types/nodemailer": "^8.0.2",
+    "astro": "^7.3.2",
+    "tsdown": "^0.20.3",
+    "typescript": "^6.0.3",
+    "vitest": "4.1.12"
+  },
+  "peerDependencies": {
+    "astro": "^7.3.2"
+  },
+  "bin": {
+    "wuppycms": "./dist/cli.mjs"
+  },
+  "files": [
+    "dist"
+  ],
+  "optionalDependencies": {
+    "sharp": "0.35.5"
+  },
+  "scripts": {
+    "test": "vitest run",
+    "typecheck": "tsc --noEmit",
+    "build": "tsdown",
+    "smoke:dist": "node scripts/smoke-dist.mjs"
+  }
 }

package/README.md

@@ -1,3 +0,0 @@
-# Temporary Holding Version
-
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.