@apleasantview/eleventy-plugin-baseline 0.1.0-next.33 → 0.1.0-next.39

package/index.js

@@ -0,0 +1,364 @@
+import 'dotenv/config';
+import { createRequire } from 'node:module';
+
+import { HtmlBasePlugin } from '@11ty/eleventy';
+import { eleventyImageOnRequestDuringServePlugin } from '@11ty/eleventy-img';
+
+import { createLogger } from './core/logging.js';
+import { createContentMapStore } from './core/content-map-store.js';
+import { createTranslationMapStore } from './core/translation-map-store.js';
+import { createSlugIndex } from './core/slug-index.js';
+import { registerVirtualDir } from './core/virtual-dir.js';
+import { registerPageContext } from './core/page-context.js';
+import { wikilinks } from './core/wikilinks.js';
+import { settingsSchema } from './core/schema.js';
+
+import { registerGlobals } from './core/global-functions/index.js';
+import { markdownFilter, relatedPostsFilter, isStringFilter } from './core/filters/index.js';
+import { imageShortcode } from './core/shortcodes/index.js';
+import { assetsCore, headCore, multilangCore, navigatorCore, sitemapCore } from './modules.js';
+
+const __require = createRequire(import.meta.url);
+const { name, version } = __require('./package.json');
+
+const mode = process.env.ELEVENTY_ENV;
+const isDev = mode === 'development';
+const isProd = mode === 'production';
+
+const LEGACY_OPTION_KEYS = [
+	'verbose',
+	'enableNavigatorTemplate',
+	'enableSitemapTemplate',
+	'assetsESBuild',
+	'multilingual'
+];
+
+// Whitelist of reserved global data keys used internally across the plugin.
+// Positive side effect is they all get listed in order and merge data to the same key.
+// Also prevents name collision with filters.
+const INTERNAL_KEYS = [
+	'_baseline',
+	'_assets',
+	'_head',
+	'_multilang',
+	'_navigator',
+	'_sitemap',
+	'_snapshot',
+	'_pageContext'
+];
+
+/**
+ * Detect legacy single-object plugin invocation.
+ *
+ * The original plugin API accepted a single merged configuration object.
+ * This helper detects that shape and enables safe normalization into
+ * the current (settings, options) contract.
+ *
+ * NOTE: arguments.length is required because default parameters mask arity.
+ */
+function looksLikeLegacyOptions(firstArg, argsLength) {
+	if (argsLength >= 2) return false;
+	if (!firstArg || typeof firstArg !== 'object') return false;
+	return LEGACY_OPTION_KEYS.some((key) => key in firstArg);
+}
+
+/**
+ * Normalize legacy plugin input into the current structured contract.
+ *
+ * - settings → site identity (content + SEO concerns)
+ * - options  → runtime behavior flags
+ */
+function splitLegacyOptions(legacy) {
+	const { defaultLanguage, languages, ...rest } = legacy;
+	return {
+		settings: { defaultLanguage, languages },
+		options: rest
+	};
+}
+
+/**
+ * Baseline (composition root)
+ *
+ * Eleventy plugin entry point. Normalises user input, builds the runtime
+ * substrate (stores + page-context registry), and registers feature modules
+ * in deterministic order.
+ *
+ * Architecture layer:
+ *   composition root
+ *
+ * System role:
+ *   The single place that wires settings + options into state, attaches
+ *   lifecycle stores, registers the page-context registry, and hands a
+ *   uniform module context to each module. No feature behaviour lives here.
+ *
+ * Lifecycle:
+ *   build-time → legacy-shape detection, state computation, virtual dir
+ *                registration, store and page-context registration, module
+ *                wiring
+ *
+ * Why this exists:
+ *   Modules need a stable, normalised input contract and a shared runtime
+ *   surface. Centralising the wiring keeps activation rules, option
+ *   inference, and registration order in one auditable place.
+ *
+ * Scope:
+ *   Owns the legacy-shape compatibility shim, state computation, runtime
+ *   store creation, page-context registration, and the module registry.
+ *   Does not own any feature behaviour; modules implement that.
+ *
+ * Data flow:
+ *   settings + options → state → runtime stores + page-context registry →
+ *   modules
+ *
+ * Typedefs (BaselineSettings, BaselineOptions, BaselineState, BaselineContext)
+ * live in core/types.js.
+ *
+ * @param {import('./core/types.js').BaselineSettings} [settings]
+ * @param {import('./core/types.js').BaselineOptions} [options]
+ */
+export default function baseline(settings = {}, options = {}) {
+	// --- Legacy compatibility layer ---
+	const argsLength = arguments.length;
+	const wasLegacy = looksLikeLegacyOptions(settings, argsLength);
+
+	if (wasLegacy) {
+		const split = splitLegacyOptions(settings);
+		settings = split.settings;
+		options = split.options;
+	}
+
+	// Base logger outputs regardless of options.
+	const baseLog = createLogger(null, { verbose: true });
+
+	// Scoped logging.
+	function scopedLog(name) {
+		return createLogger(name, { verbose: options.verbose });
+	}
+
+	if (wasLegacy) {
+		baseLog.info('DEPRECATED: single-object plugin arg. Use baseline(settings, options) instead.');
+	}
+
+	// Validate configuration shape (non-fatal).
+	const parsed = settingsSchema.safeParse(settings);
+	if (!parsed.success) {
+		for (const issue of parsed.error.issues) {
+			baseLog.info('settings:', `${issue.path.join('.')} — ${issue.message}`);
+		}
+	}
+
+	baseLog.info('Eleventy Baseline', version);
+
+	/**
+	 * Eleventy plugin initializer.
+	 *
+	 * This function is executed during Eleventy configuration time and
+	 * composes global APIs, filters, shortcodes, and feature modules.
+	 */
+	const plugin = async function (eleventyConfig) {
+		// --- Eleventy compatibility check ---
+		try {
+			eleventyConfig.versionCheck('>=3.0');
+		} catch (e) {
+			baseLog.error('Eleventy version mismatch:', e.message);
+		}
+
+		INTERNAL_KEYS.forEach((key) => {
+			eleventyConfig.addGlobalData(key, {});
+		});
+
+		const env = {
+			name: 'Eleventy Baseline',
+			package: name,
+			version,
+			mode
+		};
+
+		eleventyConfig.addGlobalData('_baseline', {
+			env
+		});
+
+		if (!settings.url) {
+			baseLog.warn('settings.url missing — canonical URLs will be relative');
+		}
+
+		registerGlobals(eleventyConfig);
+
+		eleventyConfig.addPlugin(HtmlBasePlugin, {
+			baseHref: process.env.URL || eleventyConfig.pathPrefix
+		});
+
+		// --- State layer (authoritative configuration) ---
+		const hasImageTransformPlugin = eleventyConfig.hasPlugin('eleventyImageTransformPlugin');
+
+		const state = {
+			settings: {
+				title: settings.title,
+				tagline: settings.tagline,
+				url: settings.url,
+				noindex: settings.noindex ?? false,
+				defaultLanguage: settings.defaultLanguage,
+				languages: settings.languages,
+				head: settings.head
+			},
+
+			options: {
+				verbose: options.verbose ?? false,
+				multilang: options.multilingual ?? false,
+				sitemap: options.sitemap ?? options.enableSitemapTemplate ?? true,
+				navigator: options.navigator ?? options.enableNavigatorTemplate ?? isDev,
+				head: {
+					titleSeparator: options.head?.titleSeparator,
+					showGenerator: options.head?.showGenerator
+				},
+				assets: {
+					esbuild: options.assets?.esbuild ?? options.assetsESBuild ?? {}
+				}
+			}
+		};
+
+		eleventyConfig.addGlobalData('_baseline', {
+			features: {
+				...state.options,
+				hasImageTransformPlugin
+			}
+		});
+
+		// --- Virtual directories ---
+		registerVirtualDir(eleventyConfig, {
+			key: 'assets'
+		});
+
+		const publicDir = registerVirtualDir(eleventyConfig, {
+			key: 'public',
+			outputDir: ''
+		});
+
+		const directories = {
+			input: eleventyConfig.directories?.input,
+			output: eleventyConfig.directories?.output,
+			includes: eleventyConfig.directories?.includes,
+			data: eleventyConfig.directories?.data,
+			assets: eleventyConfig.directories?.assets,
+			public: eleventyConfig.directories?.public
+		};
+
+		eleventyConfig.addPassthroughCopy({ [publicDir.input]: '/' });
+
+		// Add paths to global.
+		eleventyConfig.addGlobalData('_baseline', {
+			paths: {
+				...directories
+			}
+		});
+
+		// --- Draft filtering (build-time concern) ---
+		if (!eleventyConfig.preprocessors.drafts) {
+			eleventyConfig.addPreprocessor('drafts', '*', (data) => {
+				if (data.draft && process.env.ELEVENTY_RUN_MODE === 'build') {
+					return false;
+				}
+			});
+		}
+
+		// --- Runtime stores (self-attach their lifecycle listeners) ---
+		const contentMapStore = createContentMapStore(eleventyConfig);
+		const translationMapStore = createTranslationMapStore(eleventyConfig);
+		const slugIndex = createSlugIndex(eleventyConfig);
+
+		// --- Module helpers (derived state) ---
+		const helpers = {};
+
+		// --- Core context (lazy access layer) ---
+		const coreContext = {
+			env,
+			state,
+			runtime: {
+				get contentMap() {
+					return contentMapStore.get();
+				},
+				translationMap: translationMapStore,
+				slugIndex
+			},
+			directories,
+			helpers
+		};
+
+		// Page context registry
+		const pageContextRegistry = registerPageContext(eleventyConfig, coreContext);
+
+		// Wikilinks: [[slug]] / [[slug | lang]] in body markdown.
+		eleventyConfig.amendLibrary('md', (md) => {
+			md.use(wikilinks, { slugIndex, pageContextRegistry, translationMapStore });
+		});
+
+		coreContext.snapshots = {
+			contentMap: () => contentMapStore.snapshot(),
+			pageContext: () => pageContextRegistry.snapshot()
+		};
+
+		// --- Module activation ---
+		const features = {
+			multilang: Boolean(state.options.multilang),
+			sitemap: Boolean(state.options.sitemap),
+			navigator: Boolean(state.options.navigator),
+			head: true,
+			assets: true
+		};
+
+		// --- Module registry ---
+		const moduleRegistry = [
+			{ when: features.multilang, name: 'multilang', plugin: multilangCore },
+			{ when: features.sitemap, name: 'sitemap', plugin: sitemapCore },
+			{ name: 'navigator', plugin: navigatorCore },
+			{ when: features.head, name: 'head', plugin: headCore, consumes: { pageContext: true } },
+			{ when: features.assets, name: 'assets', plugin: assetsCore }
+		];
+
+		for (const entry of moduleRegistry) {
+			const { when = true, name, plugin, consumes = {} } = entry;
+			if (!when) continue;
+			const moduleContext = {
+				...coreContext,
+				log: scopedLog(name),
+				resolvePageContext: consumes.pageContext ? pageContextRegistry : null
+			};
+
+			eleventyConfig.addPlugin(plugin, moduleContext);
+		}
+
+		// --- Filters ---
+		eleventyConfig.addFilter('markdownify', markdownFilter);
+		eleventyConfig.addFilter('relatedPosts', relatedPostsFilter);
+		eleventyConfig.addFilter('isString', isStringFilter);
+
+		// --- Shortcodes ---
+		eleventyConfig.addShortcode('image', imageShortcode);
+
+		// --- Dev image pipeline ---
+		eleventyConfig.addPlugin(eleventyImageOnRequestDuringServePlugin);
+	};
+
+	// Set a named function identity so eleventyConfig.hasPlugin() can detect this plugin.
+	Object.defineProperty(plugin, 'name', { value: name });
+	return plugin;
+}
+
+/**
+ * Eleventy directory configuration (external contract)
+ *
+ * Defines input/output structure for the build system.
+ */
+export const config = {
+	dir: {
+		input: 'src',
+		output: 'dist',
+		data: '_data',
+		includes: '_includes',
+		assets: 'assets',
+		public: 'static'
+	},
+	htmlTemplateEngine: 'njk',
+	markdownTemplateEngine: 'njk',
+	templateFormats: ['html', 'njk', 'md']
+};

package/modules/assets/index.js

@@ -0,0 +1,162 @@
+import path from 'node:path';
+import { TemplatePath } from '@11ty/eleventy-utils';
+
+import { optionsSchema } from './schema.js';
+import assetsESbuild from './processors/esbuild-process.js';
+import assetsPostCSS from './processors/postcss-process.js';
+
+/**
+ * Assets (module)
+ *
+ * Asset pipeline integration. Wires Eleventy’s template formats to esbuild
+ * and PostCSS through compile guards that allow only declared entrypoints,
+ * and exposes inline filters for critical-path assets.
+ *
+ * Architecture layer:
+ *   module
+ *
+ * System role:
+ *   Bridge between Eleventy’s template system and the external asset
+ *   processors. Reads `directories.assets` from the virtual-dir substrate.
+ *
+ * Lifecycle:
+ *   build-time → register js/css formats, compile guards, watch target, and
+ *                inline filters; guards run per-entrypoint during compile
+ *
+ * Why this exists:
+ *   Eleventy treats every .js and .css file as a template. Without compile
+ *   guards, 11tydata.js files and non-entry assets would either pollute the
+ *   template graph or trigger the wrong processor.
+ *
+ * Scope:
+ *   Owns template format registration, compile guards, watch wiring, and the
+ *   inline filters (inlinePostCSS, inlineESbuild).
+ *   Does not own the processors themselves (assets/processors/) or
+ *   `directories.assets` resolution (core/virtual-dir.js).
+ *
+ * Data flow:
+ *   assets/{js,css}/index.{js,css} entrypoints → compile guard →
+ *   esbuild/PostCSS processor → output
+ *
+ * @param {import("@11ty/eleventy").UserConfig} eleventyConfig
+ * @param {Object} moduleContext
+ */
+export function assetsCore(eleventyConfig, moduleContext) {
+	const { state, directories, log } = moduleContext;
+	const { settings, options } = state;
+
+	// Structural-only options check: log on mismatch, do not throw.
+	const parsed = optionsSchema.safeParse(options.assets);
+	if (!parsed.success) {
+		for (const issue of parsed.error.issues) {
+			log.info('options:', `${issue.path.join('.')} — ${issue.message}`);
+		}
+	}
+
+	const inputDirectory = directories.input;
+	const assetsDirectory = directories.assets;
+	const jsDirectory = `${assetsDirectory}js/`;
+	const cssDirectory = `${assetsDirectory}css/`;
+
+	const esbuildOptions = options.assets.esbuild || {};
+	const dataFiles = `${inputDirectory}**/*.11tydata.js`;
+	const watchGlob = TemplatePath.join(assetsDirectory, '**/*.{css,js,svg,png,jpeg,jpg,webp,gif,avif}');
+
+	if (!assetsDirectory) {
+		log.warn('eleventyConfig.directories.assets is unset; registerVirtualDir must run before this plugin.');
+		return;
+	}
+
+	// Watch common asset formats so edits trigger reloads during --serve.
+	eleventyConfig.addWatchTarget(watchGlob);
+
+	// --- JS (esbuild) ---
+	// Register js as a template format. Only index.js files under assets/js/
+	// are compiled; everything else (11tydata.js, non-entry scripts) is skipped
+	// by the compile guard. The inline filter wraps the same process function.
+	// Defaults (minify, target) live in assets-esbuild/process.js.
+
+	eleventyConfig.addTemplateFormats('js');
+
+	// Prevent Eleventy from processing 11tydata.js files as templates.
+	// The compile guard below also filters these, but without this ignore
+	// Eleventy still enters them into the template graph (data cascade,
+	// permalink computation) before compile gets a chance to reject them.
+	eleventyConfig.ignores.add(dataFiles);
+
+	eleventyConfig.addExtension('js', {
+		outputFileExtension: 'js',
+		useLayouts: false,
+		read: false,
+		compileOptions: {
+			permalink: true,
+			cache: true
+		},
+		// Compile guard: only process index.js files under the assets js directory.
+		// Returning undefined skips the file without error.
+		compile: async function (_inputContent, inputPath) {
+			if (
+				inputPath.includes('11tydata.js') ||
+				!inputPath.startsWith(jsDirectory) ||
+				path.basename(inputPath) !== 'index.js'
+			) {
+				return;
+			}
+
+			return async () => assetsESbuild(inputPath, esbuildOptions);
+		}
+	});
+
+	// Inline filter: bundle a JS file and wrap in <script> tags.
+	// Accepts per-call esbuild options (merged with defaults in process.js).
+	// Eleventy's addAsyncFilter handles the Nunjucks callback bridge,
+	// so this is a plain async function.
+	eleventyConfig.addAsyncFilter('inlineESbuild', async function (inputPath, opts = {}) {
+		try {
+			const js = await assetsESbuild(inputPath, opts);
+			return `<script>${js}</script>`;
+		} catch {
+			// Non-fatal: return an error comment so the build doesn't break.
+			return `<script>/* Error processing JS */</script>`;
+		}
+	});
+
+	// --- CSS (PostCSS) ---
+	// Register css as a template format. Only index.css files under assets/css/
+	// are compiled; non-entry CSS is skipped. Reads from disk (read: false) —
+	// the process function owns its own I/O. Config loading and caching live
+	// in assets-postcss/process.js.
+
+	eleventyConfig.addTemplateFormats('css');
+
+	eleventyConfig.addExtension('css', {
+		outputFileExtension: 'css',
+		useLayouts: false,
+		read: false,
+		compileOptions: {
+			permalink: true,
+			cache: true
+		},
+		// Compile guard: only process index.css files under the assets css directory.
+		compile: async function (_inputContent, inputPath) {
+			if (!inputPath.startsWith(cssDirectory) || path.basename(inputPath) !== 'index.css') {
+				return;
+			}
+
+			return async () => assetsPostCSS(inputPath);
+		}
+	});
+
+	// Inline filter: process a CSS file through PostCSS and wrap in <style> tags.
+	// Eleventy's addAsyncFilter handles the Nunjucks callback bridge,
+	// so this is a plain async function.
+	eleventyConfig.addAsyncFilter('inlinePostCSS', async function (inputPath) {
+		try {
+			const css = await assetsPostCSS(inputPath);
+			return `<style>${css}</style>`;
+		} catch {
+			// Non-fatal: return an error comment so the build doesn't break.
+			return `<style>/* Error processing CSS */</style>`;
+		}
+	});
+}

package/modules/{assets-esbuild/process.js → assets/processors/esbuild-process.js}

@@ -1,5 +1,7 @@
 import * as esbuild from 'esbuild';
+import { createLogger } from '../../../core/logging.js';
 
+const log = createLogger('assets-esbuild');
 const defaultOptions = { minify: true, target: 'es2020' };
 
 /**
@@ -26,7 +28,7 @@ export default async function assetsESbuild(jsFilePath, options = {}) {
 		// Return raw JS; markup wrapping is handled by the plugin registration.
 		return result.outputFiles[0].text;
 	} catch (error) {
-		console.error(error);
+		log.error('esbuild failed:', error);
 		// Surface a safe JS comment so the caller can decide how to wrap it.
 		return '/* Error processing JS */';
 	}

package/modules/{assets-postcss/process.js → assets/processors/postcss-process.js}

@@ -1,7 +1,10 @@
 import fs from 'fs/promises';
 import postcss from 'postcss';
 import loadPostCSSConfig from 'postcss-load-config';
-import fallbackPostCSSConfig from './fallback/postcss.config.js';
+import fallbackPostCSSConfig from '../configs/postcss.config.js';
+import { createLogger } from '../../../core/logging.js';
+
+const log = createLogger('assets-postcss');
 
 // Resolve user PostCSS config from the project root (cwd), not the Eleventy input dir.
 const configRoot = process.cwd();
@@ -42,7 +45,7 @@ export default async function assetsPostCSS(cssFilePath) {
 		// Return raw CSS; markup wrapping is handled in the plugin registration.
 		return result.css;
 	} catch (error) {
-		console.error(error);
+		log.error('PostCSS failed:', error);
 		// Surface a safe CSS string so the caller can decide how to wrap it.
 		return '/* Error processing CSS */';
 	}

package/modules/assets/schema.js

@@ -0,0 +1,14 @@
+import * as z from 'zod';
+
+// Structural schema for the `options.assets` slice. Permissive on unknown
+// keys (esbuild accepts many options we don't touch); strict on the keys the
+// plugin itself reads.
+
+export const esbuildOptionsSchema = z.looseObject({
+	minify: z.boolean().optional(),
+	target: z.string().optional()
+});
+
+export const optionsSchema = z.looseObject({
+	esbuild: esbuildOptionsSchema.optional()
+});

package/modules/head/drivers/capo-adapter.js

@@ -0,0 +1,72 @@
+/**
+ * capo.js adapter for PostHTML AST nodes.
+ *
+ * Implements the HTMLAdapter interface capo.js v2 uses to compute element
+ * weights (src/adapters/adapter.js in @rviscomi/capo.js). Only getWeight is
+ * consumed downstream; the rest are shimmed to satisfy the shape.
+ *
+ * A PostHTML element node looks like `{ tag, attrs, content }` where attrs
+ * is either undefined or a plain object. Boolean attributes appear with an
+ * empty-string value (`{ async: '' }`) or as `true`.
+ */
+
+const hasAttr = (node, name) => {
+	if (!node || !node.attrs) return false;
+	const key = name.toLowerCase();
+	for (const k of Object.keys(node.attrs)) {
+		if (k.toLowerCase() === key) return true;
+	}
+	return false;
+};
+
+const getAttr = (node, name) => {
+	if (!node || !node.attrs) return null;
+	const key = name.toLowerCase();
+	for (const k of Object.keys(node.attrs)) {
+		if (k.toLowerCase() === key) {
+			const v = node.attrs[k];
+			return v === true ? '' : v == null ? null : String(v);
+		}
+	}
+	return null;
+};
+
+const getText = (node) => {
+	if (!node || node.content == null) return '';
+	if (typeof node.content === 'string') return node.content;
+	if (Array.isArray(node.content)) return node.content.filter((c) => typeof c === 'string').join('');
+	return '';
+};
+
+export const capoPosthtmlAdapter = {
+	isElement(node) {
+		return !!(node && typeof node === 'object' && typeof node.tag === 'string');
+	},
+	getTagName(node) {
+		return node && typeof node.tag === 'string' ? node.tag.toLowerCase() : '';
+	},
+	getAttribute(node, name) {
+		return getAttr(node, name);
+	},
+	hasAttribute(node, name) {
+		return hasAttr(node, name);
+	},
+	getAttributeNames(node) {
+		return node && node.attrs ? Object.keys(node.attrs) : [];
+	},
+	getTextContent(node) {
+		return getText(node);
+	},
+	getChildren() {
+		return [];
+	},
+	getParent() {
+		return null;
+	},
+	getSiblings() {
+		return [];
+	},
+	stringify(node) {
+		return node && node.tag ? `<${node.tag}>` : '';
+	}
+};