@pitlane/content 0.1.0

package/dist/render-U9dXN6f0.mjs

@@ -0,0 +1,273 @@
+import { readEsm } from "./mdx.mjs";
+import * as jsxRuntime from "remix/ui/jsx-runtime";
+//#region src/render.ts
+let rendered = /* @__PURE__ */ new WeakMap();
+/**
+* Renders one entry, once.
+*
+* Nothing parses Markdown until this is called, so loading a collection to list
+* its titles never pays for the bodies it does not show. The result is cached
+* per entry, because a page rendered twice should not compile twice.
+*/
+function renderedEntry(collection, entry) {
+	let existing = rendered.get(entry);
+	if (existing) return existing;
+	let pending = render(collection, entry);
+	rendered.set(entry, pending);
+	return pending;
+}
+async function render(collection, entry) {
+	if (entry.prebuilt) return fromBundle(entry.prebuilt);
+	if (entry.body) return await fromSource(entry, entry.body);
+	throw new Error(`Entry "${collection}/${entry.id}" has no renderable content.`);
+}
+/** A body the build compiled: a module for MDX, an HTML string for Markdown. */
+function fromBundle(prebuilt) {
+	if (prebuilt.format === "md") return {
+		Content: htmlComponent(prebuilt.html),
+		headings: headingList(prebuilt.headings)
+	};
+	return {
+		Content: mdxComponent(prebuilt.module.default),
+		headings: headingList(prebuilt.module.headings)
+	};
+}
+/** A body still in source form, rendered through Sätteri on demand. */
+async function fromSource(entry, body) {
+	let satteri = await loadSatteri(entry.filePath ?? entry.id);
+	let options = await runtimeOptions(entry);
+	if (body.format === "md") {
+		let result = await satteri.markdownToHtml(body.source, options);
+		return {
+			Content: htmlComponent(result.html),
+			headings: dataHeadings(result.data)
+		};
+	}
+	let where = entry.filePath ?? entry.id;
+	let imported = await importedBindings(satteri, body.source, where, options);
+	let compiled = await satteri.mdxToJs(imported.body, {
+		...options,
+		jsxImportSource: "remix/ui",
+		outputFormat: "function-body"
+	});
+	let names = [...imported.bindings.keys()];
+	let module = compile(names, compiled.code, entry.filePath ?? entry.id)({ ...jsxRuntime }, ...names.map((name) => imported.bindings.get(name)));
+	return {
+		Content: mdxComponent(module.default, imported.bindings),
+		headings: headingList(module.headings)
+	};
+}
+/**
+* The compiled body, as a callable function.
+*
+* The engine reports a body it cannot compile against generated source the
+* author never saw: `import.meta` in an expression, which is ordinary under a
+* bundler, arrives as a bare `SyntaxError: Cannot use 'import.meta' outside a
+* module` naming neither the document nor the reason. `readEsm` catches the
+* form written in an `import`/`export` block; this catches every other one.
+*/
+function compile(names, code, where) {
+	try {
+		return new Function("__mdxRuntime", ...names, code);
+	} catch (error) {
+		let cause = error instanceof Error ? error.message : String(error);
+		throw new Error(`"${where}" has a body that cannot be compiled outside a bundler: ${cause}. The document becomes a function body here rather than a module. Add contentLayer() from @pitlane/content/vite so the build compiles this collection.`, { cause: error });
+	}
+}
+/**
+* MDX compiles to a plain function of props; a Remix component is a factory
+* returning a render function. This is the bridge, and it is why props on
+* `<Content />` reach the content and `components` overrides work.
+*
+* A document's own imports are merged last, so a caller's `components` cannot
+* replace one. Under a bundler an `import` is a real import and nothing can
+* override it; the two paths have to agree.
+*/
+function mdxComponent(exported, imported = /* @__PURE__ */ new Map()) {
+	let component = exported;
+	if (imported.size === 0) return (handle) => () => component(handle?.props ?? {});
+	return (handle) => () => {
+		let props = handle?.props ?? {};
+		let components = {
+			...props.components,
+			...Object.fromEntries(imported)
+		};
+		return component({
+			...props,
+			components
+		});
+	};
+}
+/**
+* Markdown arrives as an HTML string, and `innerHTML` is an element prop, so
+* the markup needs an element to land on. The wrapper is unavoidable.
+*/
+function htmlComponent(html) {
+	return () => () => jsxRuntime.jsx("div", { innerHTML: html });
+}
+function headingList(value) {
+	return Array.isArray(value) ? value : [];
+}
+function dataHeadings(data) {
+	if (data && typeof data === "object" && "headings" in data) return headingList(data.headings);
+	return [];
+}
+/**
+* The runtime rendering options: the application's, with the three things both
+* paths must agree on forced on.
+*
+* `headings` and `rawStyles` are the same plugins `vite-plugin-satteri` runs
+* on the prebuilt path, which is what makes the two produce the same list and
+* the same working CSS. `rawStyles` goes last so it sees the `<style>` a
+* highlighter appended. Frontmatter parsing stays on because a `LiveLoader`
+* may hand back a body that still carries a fence, and rendering that as a
+* horizontal rule would be worse than parsing it away.
+*/
+async function runtimeOptions(entry) {
+	let { headings, rawStyles } = await import("./satteri.mjs");
+	let configured = entry.satteri ?? {};
+	return {
+		...configured,
+		features: {
+			...configured.features,
+			frontmatter: true
+		},
+		mdastPlugins: [headings(), ...configured.mdastPlugins ?? []],
+		hastPlugins: [...configured.hastPlugins ?? [], rawStyles()]
+	};
+}
+/**
+* The components an MDX document imported, keyed by the local name it used,
+* and the source with those import statements removed.
+*
+* Specifiers resolve relative to the document, which is what makes the same
+* file behave identically whether the bundler compiled it or this did.
+*/
+async function importedBindings(satteri, original, where, options) {
+	let source = original.replace(/^\uFEFF/, "");
+	let blocks = esmBlocks(satteri.mdxToMdast(source, { features: options.features }));
+	let bindings = /* @__PURE__ */ new Map();
+	if (blocks.length === 0) return {
+		body: source,
+		bindings
+	};
+	let node = await nodeResolution();
+	let from = node.pathToFileURL(where);
+	let body = source;
+	for (let block of [...blocks].reverse()) {
+		let { imports, remainder } = await readEsm(block.value, where);
+		body = body.slice(0, block.start) + remainder + body.slice(block.end);
+		for (let { specifier, bindings: names, attributes } of imports) {
+			let module = await importFrom(specifier, from, where, node, attributes);
+			for (let [local, exported] of names) {
+				if (!(exported in module)) throw missingExport(exported, specifier, where);
+				bindings.set(local, module[exported]);
+			}
+		}
+	}
+	return {
+		body,
+		bindings
+	};
+}
+/**
+* An export the module does not have would otherwise arrive as `undefined` and
+* render as nothing, which is the failure this whole path exists to remove.
+*/
+function missingExport(exported, specifier, where) {
+	let name = exported === "default" ? "a default export" : `\`${exported}\``;
+	return /* @__PURE__ */ new Error(`"${where}" imports ${name} from "${specifier}", which that module does not export.`);
+}
+/**
+* The top-level ESM blocks, with the offsets Sätteri measured them at.
+*
+* Offsets rather than a text search: a page may quote its own import in a
+* fenced code block, and removing the first textual match would strike the
+* fence and leave the real statement behind.
+*
+* The end comes from the block's own text rather than its reported end, which
+* runs to the start of the next node and so swallows the blank line between
+* them. MDX needs that blank line to tell an ESM block from the body.
+*/
+function esmBlocks(tree) {
+	let children = tree.children ?? [];
+	let blocks = [];
+	for (let node of children) {
+		if (node.type !== "mdxjsEsm" || typeof node.value !== "string") continue;
+		let start = node.position?.start?.offset;
+		if (typeof start !== "number") continue;
+		blocks.push({
+			value: node.value,
+			start,
+			end: start + node.value.length
+		});
+	}
+	return blocks;
+}
+/**
+* `node:module` and `node:url`, loaded on demand.
+*
+* A static import would put them in the chain `index.ts` pulls in, and the
+* package documents itself as safe to import on any host. Only a runtime
+* `.mdx` render reaches here, and that path is already Node, Bun, and Deno
+* only because it needs `new Function`.
+*/
+async function nodeResolution() {
+	let [{ createRequire }, { pathToFileURL }] = await Promise.all([import("node:module"), import("node:url")]);
+	return {
+		createRequire,
+		pathToFileURL
+	};
+}
+async function importFrom(specifier, from, where, node, attributes) {
+	let resolved = specifier.startsWith(".") ? new URL(specifier, from).href : resolveBare(specifier, from, where, node);
+	try {
+		return await (attributes ? import(resolved, { with: attributes }) : import(resolved));
+	} catch (error) {
+		let cause = error instanceof Error ? error.message : String(error);
+		throw new Error(`"${where}" imports "${specifier}", which could not be loaded: ${cause}`, { cause: error });
+	}
+}
+/**
+* Resolves a bare or subpath specifier from the document's own location.
+*
+* `createRequire` rather than `import.meta.resolve`, whose parent argument is
+* not part of the stable API: resolution has to start at the MDX file so that
+* `#/ui/counter.tsx` means what it means in a controller of the same app. The
+* cost is that it resolves under `require` conditions, so a dependency that
+* publishes only an `import` condition fails here — loudly, naming the file
+* and the specifier.
+*/
+function resolveBare(specifier, from, where, node) {
+	try {
+		return node.pathToFileURL(node.createRequire(from).resolve(specifier)).href;
+	} catch (error) {
+		let cause = error instanceof Error ? error.message : String(error);
+		throw new Error(`"${where}" imports "${specifier}", which could not be resolved: ${cause}`, { cause: error });
+	}
+}
+/**
+* `satteri` is an optional peer dependency: an application whose content is
+* prebuilt never renders at runtime and so never needs it. The import has to be
+* dynamic for that to be true, and the failure has to name both ways out.
+*
+* The specifier is a variable because a literal one is not dynamic to a
+* bundler — Rolldown resolves it at build time and pulls the whole compiler
+* into the output. Sätteri is a native addon, so a Worker bundle that reaches
+* it fails to build: workerd resolves under the `browser` condition, which
+* sends `satteri` to its WASM binding and on to an optional package that is
+* not installed on a native platform.
+*/
+async function loadSatteri(where) {
+	let specifier = "satteri";
+	try {
+		return await import(
+			/* @vite-ignore */
+			specifier
+);
+	} catch {
+		throw new Error(`Rendering "${where}" needs the optional peer dependency "satteri"; install it, or add contentLayer() from @pitlane/content/vite so the build compiles this collection.`);
+	}
+}
+//#endregion
+export { renderedEntry };

package/dist/satteri.d.mts

@@ -0,0 +1,41 @@
+import { HastPluginEntry, MdastPluginEntry } from "satteri";
+//#region src/satteri.d.ts
+/**
+ * Collects every heading of a document as `{ depth, slug, text }`, publishes the
+ * list as `data.headings`, and gives each heading an `id` matching its slug so an
+ * anchor link lands on it. On MDX the list is also appended to the tree as
+ * `export const headings`, so the compiled module carries its own table of
+ * contents.
+ *
+ * The plugin is a factory rather than a definition because Sätteri resolves a
+ * factory once per compile: a single `headings()` shared by a whole build gets
+ * fresh slug state per document, instead of the second document's `notes`
+ * reading `notes-1`.
+ *
+ * The definition is written out rather than passed through Sätteri's
+ * `defineMdastPlugin`, whose entire body checks that `name` is set. Calling it
+ * would make this module import the `satteri` package, and `render.ts` imports
+ * this module: a Worker bundle whose collections `contentLayer()` already prebuilt
+ * would then have to resolve a native addon it can never load.
+ */
+declare function headings(): MdastPluginEntry;
+/**
+ * Hands a `<style>` element's CSS to Remix as markup rather than as text, so
+ * the stylesheet survives being rendered.
+ *
+ * `@remix-run/ui` escapes `&`, `<`, and `>` in the text children of every
+ * element except `<script>`, and emits an `innerHTML` prop verbatim. `<style>`
+ * is a raw-text element, which is exactly the case where a browser does not
+ * undo that escaping: a rule written `pre > code` reaches the page as
+ * `pre &gt; code`, matches nothing, and says nothing. Expressive Code is how
+ * most applications meet this, because it ships its theme as one such element.
+ *
+ * A workaround, not a design. The fix belongs in `@remix-run/ui`, which
+ * already special-cases `<script>` and should treat `<style>` the same way.
+ * `<script>` is deliberately not touched here: routing it through `innerHTML`
+ * would skip `escapeScriptTextContent`, which keeps a `</script>` inside a
+ * string from ending the element early.
+ */
+declare function rawStyles(): HastPluginEntry;
+//#endregion
+export { headings, rawStyles };

package/dist/satteri.mjs

@@ -0,0 +1,119 @@
+//#region src/satteri.ts
+/**
+* The base slug for a heading with no letters or digits at all (`## ---`). An
+* empty `id` is invalid HTML and makes the anchor a bare `#`, which lands
+* nowhere; a fixed word plus the usual collision suffix keeps such headings
+* addressable and distinct.
+*/
+const FALLBACK_SLUG = "heading";
+/**
+* The slug for `text`, kept distinct from every slug `taken` already holds by
+* suffixing `-1`, `-2`, … The map remembers the last suffix tried for a base so
+* a document of a hundred identical headings stays linear, and the loop covers
+* the case where the suffixed candidate is itself a real heading's slug.
+*/
+function uniqueSlug(text, taken) {
+	let base = text.toLowerCase().replace(/[^\p{L}\p{N}\p{M}]+/gu, "-").replace(/^-+|-+$/g, "");
+	if (!base) base = FALLBACK_SLUG;
+	let suffix = taken.get(base) ?? 0;
+	let slug = base;
+	while (taken.has(slug)) {
+		suffix += 1;
+		slug = `${base}-${suffix}`;
+	}
+	taken.set(base, suffix);
+	if (!taken.has(slug)) taken.set(slug, 0);
+	return slug;
+}
+/**
+* Collects every heading of a document as `{ depth, slug, text }`, publishes the
+* list as `data.headings`, and gives each heading an `id` matching its slug so an
+* anchor link lands on it. On MDX the list is also appended to the tree as
+* `export const headings`, so the compiled module carries its own table of
+* contents.
+*
+* The plugin is a factory rather than a definition because Sätteri resolves a
+* factory once per compile: a single `headings()` shared by a whole build gets
+* fresh slug state per document, instead of the second document's `notes`
+* reading `notes-1`.
+*
+* The definition is written out rather than passed through Sätteri's
+* `defineMdastPlugin`, whose entire body checks that `name` is set. Calling it
+* would make this module import the `satteri` package, and `render.ts` imports
+* this module: a Worker bundle whose collections `contentLayer()` already prebuilt
+* would then have to resolve a native addon it can never load.
+*/
+function headings() {
+	return (factoryContext) => {
+		let collected = [];
+		let taken = /* @__PURE__ */ new Map();
+		factoryContext.data.headings = collected;
+		return {
+			name: "pitlane-headings",
+			heading(node, context) {
+				let text = context.textContent(node);
+				let slug = uniqueSlug(text, taken);
+				collected.push({
+					depth: node.depth,
+					slug,
+					text
+				});
+				context.setProperty(node, "data", { hProperties: { id: slug } });
+			},
+			after(root, context) {
+				if (context.sourceFormat !== "mdx") return;
+				context.appendChild(root, {
+					type: "mdxjsEsm",
+					value: `export const headings = ${JSON.stringify(collected)};`
+				});
+			}
+		};
+	};
+}
+/**
+* Hands a `<style>` element's CSS to Remix as markup rather than as text, so
+* the stylesheet survives being rendered.
+*
+* `@remix-run/ui` escapes `&`, `<`, and `>` in the text children of every
+* element except `<script>`, and emits an `innerHTML` prop verbatim. `<style>`
+* is a raw-text element, which is exactly the case where a browser does not
+* undo that escaping: a rule written `pre > code` reaches the page as
+* `pre &gt; code`, matches nothing, and says nothing. Expressive Code is how
+* most applications meet this, because it ships its theme as one such element.
+*
+* A workaround, not a design. The fix belongs in `@remix-run/ui`, which
+* already special-cases `<script>` and should treat `<style>` the same way.
+* `<script>` is deliberately not touched here: routing it through `innerHTML`
+* would skip `escapeScriptTextContent`, which keeps a `<\/script>` inside a
+* string from ending the element early.
+*/
+function rawStyles() {
+	return (factoryContext) => {
+		if (factoryContext.sourceFormat !== "mdx") return false;
+		return {
+			name: "pitlane-raw-styles",
+			element: {
+				filter: ["style"],
+				visit(node) {
+					let css = "";
+					for (let child of node.children) {
+						if (child.type !== "text") return;
+						css += child.value;
+					}
+					if (!css) return;
+					return {
+						type: "element",
+						tagName: "style",
+						properties: {
+							...node.properties,
+							innerHTML: css
+						},
+						children: []
+					};
+				}
+			}
+		};
+	};
+}
+//#endregion
+export { headings, rawStyles };

package/dist/symbols-DmXlrDbX.mjs

@@ -0,0 +1,29 @@
+//#region src/symbols.ts
+/**
+* The two globals `contentLayer()` and the runtime use to find each other.
+*
+* They are named here rather than at each site because a drifted spelling fails
+* in the quietest possible way: the emitted manifest assigns one symbol,
+* `prebuiltManifest()` reads another, every collection silently falls back to
+* its loader, and that works on Node — so the mistake only surfaces on a host
+* with no filesystem, in production.
+*
+* `manifest.ts` cannot import these through `prebuild.ts`, which imports it
+* back for its side effect, so this module holds nothing but the names.
+*/
+/** Set by `contentLayer()` before it runs the content entry; read to decide whether to prebuild. */
+const PREBUILD_CHANNEL = Symbol.for("pitlane.content.prebuild");
+/** Assigned by the module `contentLayer()` emits in place of `manifest.ts`. */
+const PREBUILT_MANIFEST = Symbol.for("pitlane.content.manifest");
+/** The spelling the emitted module writes, which has to match {@link PREBUILT_MANIFEST}. */
+const PREBUILT_MANIFEST_KEY = "pitlane.content.manifest";
+/**
+* Hangs the development watcher's handle off a collection.
+*
+* A symbol rather than a method because `invalidate()` on the public
+* `Collection` would let any caller empty a collection someone else is
+* reading. `@pitlane/content/hot` is the only intended reader.
+*/
+const HOT_COLLECTION = Symbol.for("pitlane.content.hot");
+//#endregion
+export { PREBUILT_MANIFEST_KEY as i, PREBUILD_CHANNEL as n, PREBUILT_MANIFEST as r, HOT_COLLECTION as t };