@anydigital/eleventy-bricks 0.27.0 → 0.28.0-alpha

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anydigital/eleventy-bricks",
-  "version": "0.27.0",
+  "version": "0.28.0-alpha",
   "description": "A collection of helpful utilities and filters for Eleventy (11ty)",
   "type": "module",
   "main": "./src/index.js",

package/src/eleventy.config.js

@@ -2,9 +2,14 @@
 import minimist from "minimist";
 /* Plugins */
 import { RenderPlugin } from "@11ty/eleventy";
-import eleventyNavigationPlugin from "@11ty/eleventy-navigation";
 import eleventyBricksPlugin from "@anydigital/eleventy-bricks";
-/* Conditional imports */
+/* Dynamic plugins */
+let eleventyNavigationPlugin;
+try {
+  eleventyNavigationPlugin = (await import("@11ty/eleventy-navigation")).default;
+} catch (e) {
+  // @11ty/eleventy-navigation not installed
+}
 let pluginTOC;
 try {
   pluginTOC = (await import("@uncenter/eleventy-plugin-toc")).default;
@@ -13,8 +18,25 @@ try {
 }
 /* Libraries */
 import markdownIt from "markdown-it";
-import markdownItAnchor from "markdown-it-anchor";
-import markdownItAttrs from "markdown-it-attrs";
+/* Dynamic libraries */
+let slugify;
+try {
+  slugify = (await import("@sindresorhus/slugify")).default;
+} catch (e) {
+  // @sindresorhus/slugify not installed
+}
+let markdownItAnchor;
+try {
+  markdownItAnchor = (await import("markdown-it-anchor")).default;
+} catch (e) {
+  // markdown-it-anchor not installed
+}
+let markdownItAttrs;
+try {
+  markdownItAttrs = (await import("markdown-it-attrs")).default;
+} catch (e) {
+  // markdown-it-attrs not installed
+}
 /* Data */
 import yaml from "js-yaml";
 
@@ -26,17 +48,17 @@ import yaml from "js-yaml";
 export default function (eleventyConfig) {
   /* CLI support */
   const argv = minimist(process.argv.slice(2));
-  const inputDir = argv.input || "src";
+  const inputDir = argv.input || ".";
 
   /* Plugins */
   eleventyConfig.addPlugin(RenderPlugin);
-  eleventyConfig.addPlugin(eleventyNavigationPlugin);
+  if (eleventyNavigationPlugin) eleventyConfig.addPlugin(eleventyNavigationPlugin);
   eleventyConfig.addPlugin(eleventyBricksPlugin, {
     mdAutoNl2br: true,
     mdAutoRawTags: true,
     autoLinkFavicons: true,
     siteData: true,
-    filters: ["attr_set", "attr_includes", "merge", "remove_tag", "if", "attr_concat", "fetch", "section"],
+    filters: ["attr_set", "attr_includes", "merge", "remove_tag", "if", "attr_concat", "fetch", "section", "strip_tag"],
   });
   if (pluginTOC) {
     eleventyConfig.addPlugin(pluginTOC, {
@@ -46,21 +68,25 @@ export default function (eleventyConfig) {
   }
 
   /* Libraries */
-  eleventyConfig.setLibrary(
-    "md",
-    markdownIt({
-      html: true,
-      // breaks: true,
-      linkify: true,
-    })
-      .use(markdownItAnchor, {
-        permalink: markdownItAnchor.permalink.ariaHidden(),
-      })
-      .use(markdownItAttrs),
-  );
+  eleventyConfig.setLiquidOptions({
+    dynamicPartials: false, // This allows unquoted includes like Jekyll
+  });
+  let md = markdownIt({
+    html: true,
+    linkify: true,
+  });
+  if (markdownItAnchor) {
+    md = md.use(markdownItAnchor, {
+      slugify: slugify, // @TODO: TRICKS
+      permalink: markdownItAnchor.permalink.ariaHidden(),
+    });
+  }
+  if (markdownItAttrs) md = md.use(markdownItAttrs);
+  eleventyConfig.setLibrary("md", md);
+  eleventyConfig.addFilter("markdownify", (content) => md.render(String(content ?? "")));
 
   /* Data */
-  eleventyConfig.addGlobalData("layout", "__layout");
+  // eleventyConfig.addGlobalData("layout", "__layout");
   eleventyConfig.addDataExtension("yml", (contents) => yaml.load(contents));
 
   /* Build */
@@ -80,7 +106,7 @@ export default function (eleventyConfig) {
   return {
     dir: {
       input: inputDir,
-      includes: "_theme",
+      // includes: "_theme",
     },
   };
 }

package/src/filters/strip_tag.js

@@ -0,0 +1,41 @@
+/**
+ * Strip a specified HTML element from provided HTML, keeping its inner content
+ *
+ * @param {string} html - The HTML content to process
+ * @param {string} tagName - The tag name to strip (opening/closing tags removed, inner content kept)
+ * @returns {string} The HTML with the specified tag stripped but its inner content preserved
+ */
+export function stripTag(html, tagName) {
+  if (!html || typeof html !== "string") {
+    return html;
+  }
+
+  if (typeof tagName !== "string" || !tagName) {
+    return html;
+  }
+
+  // Escape special regex characters in tag name
+  const escapedTag = tagName.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+
+  // Remove opening tags (with optional attributes): <tag> or <tag attr="val">
+  const openingRegex = new RegExp(`<${escapedTag}(?:\\s[^>]*)?>`, "gi");
+  let result = html.replace(openingRegex, "");
+
+  // Remove closing tags: </tag>
+  const closingRegex = new RegExp(`<\\/${escapedTag}>`, "gi");
+  result = result.replace(closingRegex, "");
+
+  return result;
+}
+
+/**
+ * strip_tag filter - Strip a specified HTML element, keeping its inner content
+ *
+ * Usage in templates:
+ *   {{ htmlContent | strip_tag('div') }}
+ *
+ * @param {Object} eleventyConfig - The Eleventy configuration object
+ */
+export function stripTagFilter(eleventyConfig) {
+  eleventyConfig.addFilter("strip_tag", stripTag);
+}

package/src/filters/strip_tag.test.js

@@ -0,0 +1,74 @@
+import { describe, it } from "node:test";
+import assert from "node:assert";
+import { stripTag } from "./strip_tag.js";
+
+describe("stripTag", () => {
+  it("should strip a tag but keep its inner content", () => {
+    const html = "<div><p>Keep this</p></div>";
+    const result = stripTag(html, "div");
+
+    assert.strictEqual(result, "<p>Keep this</p>");
+  });
+
+  it("should strip multiple instances of the same tag", () => {
+    const html = "<div>First</div><p>Middle</p><div>Second</div>";
+    const result = stripTag(html, "div");
+
+    assert.strictEqual(result, "First<p>Middle</p>Second");
+  });
+
+  it("should handle tags with attributes", () => {
+    const html = '<div class="wrapper" id="main">Content</div>';
+    const result = stripTag(html, "div");
+
+    assert.strictEqual(result, "Content");
+  });
+
+  it("should only strip the specified tag, leaving others intact", () => {
+    const html = "<div><span>Keep span</span><em>Keep em</em></div>";
+    const result = stripTag(html, "div");
+
+    assert.strictEqual(result, "<span>Keep span</span><em>Keep em</em>");
+  });
+
+  it("should handle nested content with the same tag", () => {
+    const html = "<div>outer <div>inner</div> text</div>";
+    const result = stripTag(html, "div");
+
+    assert.strictEqual(result, "outer inner text");
+  });
+
+  it("should return original HTML if tag does not exist", () => {
+    const html = "<p>Some text</p>";
+    const result = stripTag(html, "div");
+
+    assert.strictEqual(result, html);
+  });
+
+  it("should handle empty or null input", () => {
+    assert.strictEqual(stripTag("", "div"), "");
+    assert.strictEqual(stripTag(null, "div"), null);
+    assert.strictEqual(stripTag(undefined, "div"), undefined);
+  });
+
+  it("should handle missing or invalid tagName", () => {
+    const html = "<div>Content</div>";
+    assert.strictEqual(stripTag(html, ""), html);
+    assert.strictEqual(stripTag(html, null), html);
+    assert.strictEqual(stripTag(html, undefined), html);
+  });
+
+  it("should be case-insensitive", () => {
+    const html = '<DIV class="foo">Content</DIV>';
+    const result = stripTag(html, "div");
+
+    assert.strictEqual(result, "Content");
+  });
+
+  it("should preserve whitespace and newlines inside the tag", () => {
+    const html = "<div>\n  <p>Line 1</p>\n  <p>Line 2</p>\n</div>";
+    const result = stripTag(html, "div");
+
+    assert.strictEqual(result, "\n  <p>Line 1</p>\n  <p>Line 2</p>\n");
+  });
+});

package/src/index.js

@@ -1,4 +1,4 @@
-import { mdAutoRawTags, mdAutoNl2br, transformAutoRaw, transformNl2br } from "./transforms/markdown.js";
+import { mdAutoRawTags, mdAutoNl2br, transformAutoRaw, transformNl2br } from "./processors/markdown.js";
 import {
   autoLinkFavicons,
   isPlainUrlText,
@@ -6,11 +6,12 @@ import {
   buildFaviconLink,
   transformLink,
   replaceLinksInHtml,
-} from "./transforms/autoLinkFavicons.js";
+} from "./processors/autoLinkFavicons.js";
 import { attrSetFilter, attrSet } from "./filters/attr_set.js";
 import { attrIncludesFilter } from "./filters/attr_includes.js";
 import { mergeFilter, merge } from "./filters/merge.js";
 import { removeTagFilter, removeTag } from "./filters/remove_tag.js";
+import { stripTagFilter, stripTag } from "./filters/strip_tag.js";
 import { ifFilter, iff } from "./filters/if.js";
 import { attrConcatFilter, attrConcat } from "./filters/attr_concat.js";
 import { sectionFilter, section as sectionFn } from "./filters/section.js";
@@ -37,7 +38,7 @@ try {
  * @param {boolean} options.mdAutoRawTags - Enable mdAutoRawTags preprocessor (default: false)
  * @param {boolean} options.mdAutoNl2br - Enable mdAutoNl2br for \n to <br> conversion (default: false)
  * @param {boolean} options.autoLinkFavicons - Enable autoLinkFavicons to add favicons to plain text links (default: false)
- * @param {Array<string>} options.filters - Array of filter names to enable: 'attr_set', 'attr_includes', 'merge', 'remove_tag', 'if', 'attr_concat', 'section', 'fetch' (default: [])
+ * @param {Array<string>} options.filters - Array of filter names to enable: 'attr_set', 'attr_includes', 'merge', 'remove_tag', 'strip_tag', 'if', 'attr_concat', 'section', 'fetch' (default: [])
  * @param {boolean} options.siteData - Enable site.year and site.prod global data (default: false)
  */
 export default function eleventyBricksPlugin(eleventyConfig, options = {}) {
@@ -53,6 +54,7 @@ export default function eleventyBricksPlugin(eleventyConfig, options = {}) {
     attr_includes: attrIncludesFilter,
     merge: mergeFilter,
     remove_tag: removeTagFilter,
+    strip_tag: stripTagFilter,
     if: ifFilter,
     attr_concat: attrConcatFilter,
     section: sectionFilter,
@@ -86,6 +88,7 @@ export {
   attrIncludesFilter,
   mergeFilter,
   removeTagFilter,
+  stripTagFilter,
   ifFilter,
   attrConcatFilter,
   sectionFilter,
@@ -104,6 +107,7 @@ export {
   replaceLinksInHtml,
   merge,
   removeTag,
+  stripTag,
   iff,
   attrConcat,
   attrSet,

package/examples/section-filter.md

@@ -1,96 +0,0 @@
-# Section Filter Examples
-
-## Basic Usage
-
-```markdown
-<!--section:intro-->
-
-This is the introduction section.
-
-<!--section:main-->
-
-This is the main content.
-
-<!--section:footer-->
-
-This is the footer.
-```
-
-In your template:
-
-```nunjucks
-{{ content | section('intro') }}
-```
-
-Output:
-
-```
-This is the introduction section.
-```
-
-## Multiple Names per Section
-
-```markdown
-<!--section:summary,abstract-->
-
-This content appears in both 'summary' and 'abstract' sections.
-
-<!--section:conclusion-->
-
-Final thoughts.
-```
-
-Both of these work:
-
-```nunjucks
-{{ content | section('summary') }}
-{{ content | section('abstract') }}
-```
-
-## Real-World Example
-
-```markdown
-# Research Paper
-
-<!--section:abstract,summary-->
-
-A brief overview of the research findings.
-
-<!--section:introduction-->
-
-Background and context for the research.
-
-<!--section:methodology-->
-
-How the research was conducted.
-
-<!--section:results-->
-
-Key findings from the study.
-
-<!--section:conclusion,summary-->
-
-Summary and implications of the research.
-```
-
-Usage:
-
-```nunjucks
-<!-- Get full summary (abstract + conclusion) -->
-<div class="summary">
-  {{ content | section('summary') }}
-</div>
-
-<!-- Get just introduction -->
-<div class="intro">
-  {{ content | section('introduction') }}
-</div>
-```
-
-## Notes
-
-- Section names are **case-insensitive**: `intro`, `INTRO`, and `Intro` are all the same
-- Multiple names can be comma-separated: `<!--section:name1,name2,name3-->`
-- Whitespace around names is trimmed
-- Content extends from the section marker to the next `<!--section*>` or EOF
-- If a section name appears multiple times, all matching sections are concatenated

package/src/index.cjs

@@ -1,51 +0,0 @@
-/**
- * CommonJS wrapper for 11ty Bricks Plugin
- * Provides compatibility for projects using require()
- */
-
-// Dynamic import for ES modules
-module.exports = async function eleventyBricksPlugin(eleventyConfig, options) {
-  const { default: plugin } = await import("./index.js");
-  return plugin(eleventyConfig, options);
-};
-
-// Export individual helpers for granular usage
-[
-  "mdAutoRawTags",
-  "mdAutoNl2br",
-  "autoLinkFavicons",
-  "attrSetFilter",
-  "attrIncludesFilter",
-  "mergeFilter",
-  "removeTagFilter",
-  "ifFilter",
-  "attrConcatFilter",
-  "fetchFilter",
-  "siteData",
-].forEach((name) => {
-  module.exports[name] = async (...args) => {
-    const module = await import("./index.js");
-    return module[name](...args);
-  };
-});
-
-// Export transform/utility functions for advanced usage
-[
-  "transformAutoRaw",
-  "transformNl2br",
-  "isPlainUrlText",
-  "cleanLinkText",
-  "buildFaviconLink",
-  "transformLink",
-  "replaceLinksInHtml",
-  "merge",
-  "removeTag",
-  "iff",
-  "attrConcat",
-  "attrSet",
-].forEach((name) => {
-  module.exports[name] = async (...args) => {
-    const module = await import("./index.js");
-    return module[name](...args);
-  };
-});