@apleasantview/eleventy-plugin-baseline 0.1.0-next.22 → 0.1.0-next.28

package/modules/assets-core/plugins/assets-core.js

@@ -1,10 +1,10 @@
-import { TemplatePath } from "@11ty/eleventy-utils";
-import { addTrailingSlash, resolveAssetsDir } from "../../../core/helpers.js";
-import { warnIfVerbose, getVerbose } from "../../../core/logging.js";
+import { TemplatePath } from '@11ty/eleventy-utils';
+import { addTrailingSlash, resolveAssetsDir } from '../../../core/helpers.js';
+import { warnIfVerbose, getVerbose } from '../../../core/logging.js';
 
 const syncCacheFromDirectories = (cache, dirs, rawDir) => {
-	const inputDir = TemplatePath.addLeadingDotSlash(dirs.input || "./");
-	const outputDir = TemplatePath.addLeadingDotSlash(dirs.output || "./");
+	const inputDir = TemplatePath.addLeadingDotSlash(dirs.input || './');
+	const outputDir = TemplatePath.addLeadingDotSlash(dirs.output || './');
 	const { assetsDir, assetsOutputDir } = resolveAssetsDir(inputDir, outputDir, rawDir);
 
 	cache.input = addTrailingSlash(inputDir);
@@ -16,7 +16,7 @@ const syncCacheFromDirectories = (cache, dirs, rawDir) => {
 const ensureCache = (cache, eleventyConfig, rawDir, verbose) => {
 	if (cache.assetsInput) return;
 	syncCacheFromDirectories(cache, eleventyConfig.dir || {}, rawDir);
-	warnIfVerbose(verbose, "Fallback directory resolution");
+	warnIfVerbose(verbose, 'Fallback directory resolution');
 };
 
 /**
@@ -32,7 +32,7 @@ const ensureCache = (cache, eleventyConfig, rawDir, verbose) => {
 /** @param {import("@11ty/eleventy").UserConfig} eleventyConfig */
 export default function assetsCore(eleventyConfig, options = {}) {
 	const verbose = getVerbose(eleventyConfig) || options.verbose || false;
-	const userKey = "assets";
+	const userKey = 'assets';
 
 	// Extract raw directory value from config (can be done early)
 	const rawDir = eleventyConfig.dir?.[userKey] || userKey;
@@ -42,12 +42,12 @@ export default function assetsCore(eleventyConfig, options = {}) {
 		input: eleventyConfig.dir?.input || null,
 		output: eleventyConfig.dir?.output || null,
 		assetsInput: eleventyConfig.dir?.assets ?? userKey ?? null,
-		assetsOutput: null,
+		assetsOutput: null
 	};
 
 	syncCacheFromDirectories(cache, eleventyConfig.dir || {}, rawDir);
 
-	eleventyConfig.on("eleventy.directories", (directories) => {
+	eleventyConfig.on('eleventy.directories', (directories) => {
 		syncCacheFromDirectories(cache, directories, rawDir);
 
 		// Add a virtual directory key only if not already defined/configurable.
@@ -62,11 +62,11 @@ export default function assetsCore(eleventyConfig, options = {}) {
 				return cache.assetsInput;
 			},
 			enumerable: true,
-			configurable: false,
+			configurable: false
 		});
 	});
 
-	eleventyConfig.addGlobalData("_baseline.assets", () => {
+	eleventyConfig.addGlobalData('_baseline.assets', () => {
 		ensureCache(cache, eleventyConfig, rawDir, verbose);
 		// Merge with existing _baseline.assets (e.g., esbuild config)
 		const existing = eleventyConfig.globalData?._baseline?.assets || {};
@@ -79,6 +79,6 @@ export default function assetsCore(eleventyConfig, options = {}) {
 
 	// Watch target — use resolved assets input dir.
 	ensureCache(cache, eleventyConfig, rawDir, verbose);
-	const watchGlob = TemplatePath.join(cache.assetsInput, "**/*.{css,js,svg,png,jpeg}");
+	const watchGlob = TemplatePath.join(cache.assetsInput, '**/*.{css,js,svg,png,jpeg,jpg,webp,gif,avif}');
 	eleventyConfig.addWatchTarget(watchGlob);
 }

package/modules/assets-esbuild/filters/inline-esbuild.js

@@ -1,6 +1,6 @@
-import * as esbuild from "esbuild";
+import * as esbuild from 'esbuild';
 
-const defaultOptions = { minify: true, target: "es2020" };
+const defaultOptions = { minify: true, target: 'es2020' };
 
 export default async function inlineESbuild(jsFilePath, options = {}) {
 	const userOptions = { ...defaultOptions, ...options };
@@ -19,6 +19,6 @@ export default async function inlineESbuild(jsFilePath, options = {}) {
 	} catch (error) {
 		console.error(error);
 		// Surface a safe JS comment so the caller can decide how to wrap it.
-		return "/* Error processing JS */";
+		return '/* Error processing JS */';
 	}
 }

package/modules/assets-esbuild/plugins/assets-esbuild.js

@@ -1,7 +1,7 @@
-import path from "node:path";
-import * as esbuild from "esbuild";
-import { resolveAssetsDir } from "../../../core/helpers.js";
-import inlineESbuild from "../filters/inline-esbuild.js";
+import path from 'node:path';
+import * as esbuild from 'esbuild';
+import { resolveAssetsDir } from '../../../core/helpers.js';
+import inlineESbuild from '../filters/inline-esbuild.js';
 
 /**
  * assets-esbuild
@@ -16,22 +16,26 @@ import inlineESbuild from "../filters/inline-esbuild.js";
  */
 /** @param {import("@11ty/eleventy").UserConfig} eleventyConfig */
 export default function assetsESBuild(eleventyConfig, options = {}) {
-	const defaultOptions = { minify: true, target: "es2020" };
+	const defaultOptions = { minify: true, target: 'es2020' };
 	const { assetsDir } = resolveAssetsDir(
-		eleventyConfig.dir?.input || "./",
-		eleventyConfig.dir?.output || "./",
-		eleventyConfig.dir?.assets || "assets"
+		eleventyConfig.dir?.input || './',
+		eleventyConfig.dir?.output || './',
+		eleventyConfig.dir?.assets || 'assets'
 	);
 	const jsDir = `${assetsDir}js/`;
 	const userOptions = { ...defaultOptions, ...options };
-	
-	eleventyConfig.addTemplateFormats("js");
 
-	eleventyConfig.addExtension("js", {
-		outputFileExtension: "js",
+	eleventyConfig.addTemplateFormats('js');
+
+	eleventyConfig.addExtension('js', {
+		outputFileExtension: 'js',
 		useLayouts: false,
 		compile: async function (_inputContent, inputPath) {
-			if (inputPath.includes('11tydata.js') || !inputPath.startsWith(jsDir) || path.basename(inputPath) !== "index.js") {
+			if (
+				inputPath.includes('11tydata.js') ||
+				!inputPath.startsWith(jsDir) ||
+				path.basename(inputPath) !== 'index.js'
+			) {
 				return;
 			}
 
@@ -45,30 +49,23 @@ export default function assetsESBuild(eleventyConfig, options = {}) {
 				});
 
 				return result.outputFiles[0].text;
-			}
+			};
 		}
 	});
 
 	// Filter to inline a bundled entry; supports callback style (Nunjucks/Liquid) and Promise return.
-	eleventyConfig.addAsyncFilter("inlineESbuild", async function (jsFilePath, callback) {
-		const done = typeof callback === "function" ? callback : null;
+	eleventyConfig.addAsyncFilter('inlineESbuild', async function (jsFilePath, callback) {
+		const done = typeof callback === 'function' ? callback : null;
 		try {
 			const js = await inlineESbuild(jsFilePath);
 			const html = `<script>${js}</script>`;
 			if (done) return done(null, html);
 			return html;
-		} catch (error) {
+		} catch {
 			// Non-fatal fallback: return an error comment wrapped in script tags.
 			const html = `<script>/* Error processing JS */</script>`;
 			if (done) return done(null, html);
 			return html;
 		}
 	});
-
-	// Override the default collection behavior. Adding js as template format and extension collects 11tydata.js files.
-	eleventyConfig.addCollection("all", function (collectionApi) {
-		return collectionApi.getAll().filter(item => {
-			return !item.inputPath.endsWith("11tydata.js");
-		});
-	});
-};
+}

package/modules/assets-postcss/fallback/postcss.config.js

@@ -1,19 +1,17 @@
-import postcssImportExtGlob from "postcss-import-ext-glob";
-import postcssImport from "postcss-import";
-import postcssPresetEnv from "postcss-preset-env";
-import cssnano from "cssnano"; // Import cssnano for minification
+import postcssImportExtGlob from 'postcss-import-ext-glob';
+import postcssImport from 'postcss-import';
+import postcssPresetEnv from 'postcss-preset-env';
+import cssnano from 'cssnano'; // Import cssnano for minification
 
-const isProd = process.env.ELEVENTY_ENV === "production"
+const isProd = process.env.ELEVENTY_ENV === 'production';
 const plugins = [
 	postcssImportExtGlob,
 	postcssImport,
 	postcssPresetEnv({
-		"browsers": [
-			"> 0.2% and not dead"
-		],
-		"preserve": true,
+		browsers: ['> 0.2% and not dead'],
+		preserve: true
 	})
-]
+];
 
 if (isProd) {
 	plugins.push(cssnano);
@@ -24,4 +22,4 @@ const config = {
 	plugins
 };
 
-export default config
+export default config;

package/modules/assets-postcss/filters/inline-postcss.js

@@ -1,7 +1,7 @@
-import fs from "fs/promises";
-import postcss from "postcss";
-import loadPostCSSConfig from "postcss-load-config";
-import fallbackPostCSSConfig from "../fallback/postcss.config.js";
+import fs from 'fs/promises';
+import postcss from 'postcss';
+import loadPostCSSConfig from 'postcss-load-config';
+import fallbackPostCSSConfig from '../fallback/postcss.config.js';
 
 // Resolve user PostCSS config from the project root (cwd), not the Eleventy input dir.
 const configRoot = process.cwd();
@@ -16,7 +16,7 @@ export default async function inlinePostCSS(cssFilePath) {
 		try {
 			// Prefer the consuming project's PostCSS config (postcss.config.* or package.json#postcss).
 			({ plugins, options } = await loadPostCSSConfig({}, configRoot));
-		} catch (error) {
+		} catch {
 			// If none is found, fall back to the bundled Baseline config to keep builds working.
 			const { plugins: fallbackPlugins, ...fallbackOptions } = fallbackPostCSSConfig;
 			plugins = fallbackPlugins;
@@ -33,6 +33,6 @@ export default async function inlinePostCSS(cssFilePath) {
 	} catch (error) {
 		console.error(error);
 		// Surface a safe CSS string so the caller can decide how to wrap it.
-		return "/* Error processing CSS */";
+		return '/* Error processing CSS */';
 	}
-} 
+}

package/modules/assets-postcss/plugins/assets-postcss.js

@@ -1,9 +1,9 @@
-import path from "node:path";
-import postcss from "postcss";
-import loadPostCSSConfig from "postcss-load-config";
-import fallbackPostCSSConfig from "../fallback/postcss.config.js";
-import inlinePostCSS from "../filters/inline-postcss.js";
-import { resolveAssetsDir } from "../../../core/helpers.js";
+import path from 'node:path';
+import postcss from 'postcss';
+import loadPostCSSConfig from 'postcss-load-config';
+import fallbackPostCSSConfig from '../fallback/postcss.config.js';
+import inlinePostCSS from '../filters/inline-postcss.js';
+import { resolveAssetsDir } from '../../../core/helpers.js';
 
 /**
  * assets-postcss
@@ -15,22 +15,22 @@ import { resolveAssetsDir } from "../../../core/helpers.js";
 /** @param {import("@11ty/eleventy").UserConfig} eleventyConfig */
 export default function assetsPostCSS(eleventyConfig) {
 	const { assetsDir } = resolveAssetsDir(
-		eleventyConfig.dir?.input || "./",
-		eleventyConfig.dir?.output || "./",
-		eleventyConfig.dir?.assets || "assets"
+		eleventyConfig.dir?.input || './',
+		eleventyConfig.dir?.output || './',
+		eleventyConfig.dir?.assets || 'assets'
 	);
 	const cssDir = `${assetsDir}css/`;
 
 	// Resolve user PostCSS config from the project root (cwd), not the Eleventy input dir.
 	const configRoot = process.cwd();
 
-	eleventyConfig.addTemplateFormats("css");
+	eleventyConfig.addTemplateFormats('css');
 
-	eleventyConfig.addExtension("css", {
-		outputFileExtension: "css",
+	eleventyConfig.addExtension('css', {
+		outputFileExtension: 'css',
 		useLayouts: false,
 		compile: async function (_inputContent, inputPath) {
-			if (!inputPath.startsWith(cssDir) || path.basename(inputPath) !== "index.css") {
+			if (!inputPath.startsWith(cssDir) || path.basename(inputPath) !== 'index.css') {
 				return;
 			}
 
@@ -41,9 +41,9 @@ export default function assetsPostCSS(eleventyConfig) {
 				try {
 					// Prefer the consuming project's PostCSS config (postcss.config.* or package.json#postcss).
 					({ plugins, options } = await loadPostCSSConfig({}, configRoot));
-				} catch (error) {
+				} catch {
 					// If none is found, fall back to the bundled Baseline config to keep builds working.
-					({plugins, ...options } = fallbackPostCSSConfig);
+					({ plugins, ...options } = fallbackPostCSSConfig);
 				}
 
 				const result = await postcss(plugins).process(_inputContent, {
@@ -58,18 +58,18 @@ export default function assetsPostCSS(eleventyConfig) {
 	});
 
 	// Filter to inline a bundled entry; supports callback style (Nunjucks/Liquid) and Promise return.
-	eleventyConfig.addAsyncFilter("inlinePostCSS", async function (cssFilePath, callback) {
-		const done = typeof callback === "function" ? callback : null;
+	eleventyConfig.addAsyncFilter('inlinePostCSS', async function (cssFilePath, callback) {
+		const done = typeof callback === 'function' ? callback : null;
 		try {
 			const css = await inlinePostCSS(cssFilePath);
 			const html = `<style>${css}</style>`;
 			if (done) return done(null, html);
 			return html;
-		} catch (error) {
+		} catch {
 			// Keep behavior non-fatal: return a styled error comment instead of throwing.
 			const html = `<style>/* Error processing CSS */</style>`;
 			if (done) return done(null, html);
 			return html;
 		}
 	});
-};
+}

package/modules/head-core/drivers/posthtml-head-elements.js

@@ -6,143 +6,127 @@
 // Original: https://github.com/posthtml/posthtml-head-elements
 // Adapted for Baseline head-core.
 
-import util from "node:util";
-import { createRequire } from "node:module";
+import util from 'node:util';
+import { createRequire } from 'node:module';
 
 const require = createRequire(import.meta.url);
 
 function nonString(type, attrsArr) {
-  return attrsArr.map(function(attrs) {
-    return {tag: type, attrs: attrs};
-  });
+	return attrsArr.map(function (attrs) {
+		return { tag: type, attrs: attrs };
+	});
 }
 
 function nonArray(type, content) {
-  return {tag: type, content: [content]};
+	return { tag: type, content: [content] };
 }
 
 function findElmType(type, objectData) {
-
-  var elementType = {
-    'meta': function() {
-
-      if (Array.isArray(objectData)) {
-        return nonString(type, objectData);
-      } else {
-        util.log('posthtml-head-elements: Please use the correct syntax for a meta element');
-      }
-
-    },
-    'title': function() {
-
-      if (typeof objectData === 'string') {
-        return nonArray('title', objectData);
-      } else {
-        util.log('posthtml-head-elements: Please use the correct syntax for a title element');
-      }
-
-    },
-    'link': function() {
-
-      if (Array.isArray(objectData)) {
-        return nonString(type, objectData);
-      } else {
-        util.log('posthtml-head-elements: Please use the correct syntax for a link element');
-      }
-
-    },
-    'linkCanonical': function() {
-      if (Array.isArray(objectData)) {
-        return nonString('link', objectData);
-      } else {
-        util.log('posthtml-head-elements: Please use the correct syntax for a linkCanonical element');
-      }
-    },
-    'script': function() {
-      if (Array.isArray(objectData)) {
-        return objectData.map(function(entry) {
-          const { content, ...attrs } = entry || {};
-          return content !== undefined
-            ? { tag: "script", attrs, content: [content] }
-            : { tag: "script", attrs };
-        });
-      } else {
-        util.log('posthtml-head-elements: Please use the correct syntax for a script element');
-      }
-    },
-    'style': function() {
-      if (Array.isArray(objectData)) {
-        return objectData.map(function(entry) {
-          const { content, ...attrs } = entry || {};
-          return content !== undefined
-            ? { tag: "style", attrs, content: [content] }
-            : { tag: "style", attrs };
-        });
-      } else {
-        util.log('posthtml-head-elements: Please use the correct syntax for a style element');
-      }
-    },
-    'base': function() {
-
-      if (Array.isArray(objectData)) {
-        return nonString(type, objectData);
-      } else {
-        util.log('posthtml-head-elements: Please use the correct syntax for a base element');
-      }
-
-    },
-    'default': function() {
-      util.log('posthtml-head-elements: Please make sure the HTML head type is correct');
-    }
-  };
-
-  if (type.indexOf('_') !== -1) {
-    type = type.substr(0, type.indexOf('_'));
-  }
-
-  return (elementType[type]() || elementType['default']());
+	var elementType = {
+		meta: function () {
+			if (Array.isArray(objectData)) {
+				return nonString(type, objectData);
+			} else {
+				util.log('posthtml-head-elements: Please use the correct syntax for a meta element');
+			}
+		},
+		title: function () {
+			if (typeof objectData === 'string') {
+				return nonArray('title', objectData);
+			} else {
+				util.log('posthtml-head-elements: Please use the correct syntax for a title element');
+			}
+		},
+		link: function () {
+			if (Array.isArray(objectData)) {
+				return nonString(type, objectData);
+			} else {
+				util.log('posthtml-head-elements: Please use the correct syntax for a link element');
+			}
+		},
+		linkCanonical: function () {
+			if (Array.isArray(objectData)) {
+				return nonString('link', objectData);
+			} else {
+				util.log('posthtml-head-elements: Please use the correct syntax for a linkCanonical element');
+			}
+		},
+		script: function () {
+			if (Array.isArray(objectData)) {
+				return objectData.map(function (entry) {
+					const { content, ...attrs } = entry || {};
+					return content !== undefined ? { tag: 'script', attrs, content: [content] } : { tag: 'script', attrs };
+				});
+			} else {
+				util.log('posthtml-head-elements: Please use the correct syntax for a script element');
+			}
+		},
+		style: function () {
+			if (Array.isArray(objectData)) {
+				return objectData.map(function (entry) {
+					const { content, ...attrs } = entry || {};
+					return content !== undefined ? { tag: 'style', attrs, content: [content] } : { tag: 'style', attrs };
+				});
+			} else {
+				util.log('posthtml-head-elements: Please use the correct syntax for a style element');
+			}
+		},
+		base: function () {
+			if (Array.isArray(objectData)) {
+				return nonString(type, objectData);
+			} else {
+				util.log('posthtml-head-elements: Please use the correct syntax for a base element');
+			}
+		},
+		default: function () {
+			util.log('posthtml-head-elements: Please make sure the HTML head type is correct');
+		}
+	};
+
+	if (type.indexOf('_') !== -1) {
+		type = type.substr(0, type.indexOf('_'));
+	}
+
+	return elementType[type]() || elementType['default']();
 }
 
 function buildNewTree(headElements, EOL) {
+	var newHeadElements = [];
 
-  var newHeadElements = [];
-
-  Object.keys(headElements).forEach(function(value) {
-
-    newHeadElements.push(findElmType(value, headElements[value]));
+	Object.keys(headElements).forEach(function (value) {
+		newHeadElements.push(findElmType(value, headElements[value]));
+	});
 
-  });
+	function cnct(arr) {
+		return Array.prototype.concat.apply([], arr);
+	}
 
-  function cnct(arr) {
-    return Array.prototype.concat.apply([], arr);
-  }
-
-  return cnct(cnct(newHeadElements).map(function(elem) {
-    return [elem, EOL];
-  }));
+	return cnct(
+		cnct(newHeadElements).map(function (elem) {
+			return [elem, EOL];
+		})
+	);
 }
 
-export default function(options) {
-  options = options || {};
-  options.headElementsTag = options.headElementsTag || 'posthtml-head-elements';
-
-  if (!options.headElements) {
-    util.log('posthtml-head-elements: Don\'t forget to add a link to the JSON file containing the head elements to insert');
-  }
-  var jsonOne = typeof options.headElements !== 'string' ? options.headElements : require(options.headElements);
-
-  return function posthtmlHeadElements(tree) {
-
-    tree.match({tag: options.headElementsTag}, function() {
-      return {
-        tag: false, // delete this node, safe content
-        content: buildNewTree(jsonOne, options.EOL || '\n')
-      };
-    });
-
-    return tree;
-
-  };
-
-};
-
+export default function (options) {
+	options = options || {};
+	options.headElementsTag = options.headElementsTag || 'posthtml-head-elements';
+
+	if (!options.headElements) {
+		util.log(
+			"posthtml-head-elements: Don't forget to add a link to the JSON file containing the head elements to insert"
+		);
+	}
+	var jsonOne = typeof options.headElements !== 'string' ? options.headElements : require(options.headElements);
+
+	return function posthtmlHeadElements(tree) {
+		tree.match({ tag: options.headElementsTag }, function () {
+			return {
+				tag: false, // delete this node, safe content
+				content: buildNewTree(jsonOne, options.EOL || '\n')
+			};
+		});
+
+		return tree;
+	};
+}

package/modules/head-core/plugins/head-core.js

@@ -1,25 +1,24 @@
-import headElements from "../drivers/posthtml-head-elements.js";
-import { getVerbose, logIfVerbose } from "../../../core/logging.js";
-import { buildHead } from "../utils/head-utils.js";
+import headElements from '../drivers/posthtml-head-elements.js';
+import { getVerbose, logIfVerbose } from '../../../core/logging.js';
+import { buildHead } from '../utils/head-utils.js';
 
 /** @param {import("@11ty/eleventy").UserConfig} eleventyConfig */
 export default function headCore(eleventyConfig, options = {}) {
 	const verbose = getVerbose(eleventyConfig) || options.verbose || false;
 
 	// Following options are not public.
-	const userKey = options.dirKey || "head";
-	const headElementsTag = options.headElementsTag || "baseline-head";
-	const eol = options.EOL || "\n";
-	const pathPrefix = options.pathPrefix ?? eleventyConfig?.pathPrefix ?? "";
+	const userKey = options.dirKey || 'head';
+	const headElementsTag = options.headElementsTag || 'baseline-head';
+	const eol = options.EOL || '\n';
+	const pathPrefix = options.pathPrefix ?? eleventyConfig?.pathPrefix ?? '';
 	const siteUrl = options.siteUrl;
-	const inputDir = eleventyConfig.dir?.input || ".";
 
 	let cachedContentMap = {};
-	eleventyConfig.on("eleventy.contentMap", ({ inputPathToUrl, urlToInputPath }) => {
+	eleventyConfig.on('eleventy.contentMap', ({ inputPathToUrl, urlToInputPath }) => {
 		cachedContentMap = { inputPathToUrl, urlToInputPath };
 	});
 
-	eleventyConfig.addGlobalData("eleventyComputed.page.head", () => {
+	eleventyConfig.addGlobalData('eleventyComputed.page.head', () => {
 		return (data) =>
 			buildHead(data, {
 				userKey,
@@ -27,15 +26,12 @@ export default function headCore(eleventyConfig, options = {}) {
 				pathPrefix,
 				contentMap: cachedContentMap,
 				pageUrlOverride: data?.page?.url,
+				verbose
 			});
 	});
 
-	eleventyConfig.htmlTransformer.addPosthtmlPlugin("html", function (context) {
-		logIfVerbose(
-			verbose,
-			"head-core: injecting head elements for",
-			context?.page?.inputPath || context?.outputPath
-		);
+	eleventyConfig.htmlTransformer.addPosthtmlPlugin('html', function (context) {
+		logIfVerbose(verbose, 'head-core: injecting head elements for', context?.page?.inputPath || context?.outputPath);
 
 		const headElementsSpec =
 			context?.page?.head ||
@@ -45,12 +41,13 @@ export default function headCore(eleventyConfig, options = {}) {
 				pathPrefix,
 				contentMap: cachedContentMap,
 				pageUrlOverride: context?.page?.url,
+				verbose
 			});
 
 		const plugin = headElements({
 			headElements: headElementsSpec,
 			headElementsTag,
-			EOL: eol,
+			EOL: eol
 		});
 
 		return async function asyncHead(tree) {