@anydigital/eleventy-bricks 0.22.0

package/src/filters/merge.js

@@ -0,0 +1,47 @@
+/**
+ * Merge objects together
+ *
+ * Shallow merges objects (later values override earlier ones)
+ *
+ * @param {Object} first - The first object
+ * @param {...Object} rest - Additional objects to merge
+ * @returns {Object} The merged result
+ */
+export function merge(first, ...rest) {
+  // If first argument is null or undefined, treat as empty object
+  if (first === null || first === undefined) {
+    first = {};
+  }
+
+  // Only support objects
+  if (typeof first === "object" && !Array.isArray(first)) {
+    // Merge objects using spread operator (shallow merge)
+    return rest.reduce(
+      (acc, item) => {
+        if (item !== null && typeof item === "object" && !Array.isArray(item)) {
+          return { ...acc, ...item };
+        }
+        return acc;
+      },
+      { ...first }
+    );
+  }
+
+  // If first is not an object, return empty object
+  return {};
+}
+
+/**
+ * merge filter - Merge objects together
+ *
+ * This filter merges objects, similar to Twig's merge filter.
+ *
+ * Usage in templates:
+ *   {{ obj1 | merge(obj2) }}
+ *   {{ obj1 | merge(obj2, obj3) }}
+ *
+ * @param {Object} eleventyConfig - The Eleventy configuration object
+ */
+export function mergeFilter(eleventyConfig) {
+  eleventyConfig.addFilter("merge", merge);
+}

package/src/filters/merge.test.js

@@ -0,0 +1,51 @@
+import { test } from 'node:test';
+import assert from 'node:assert';
+import { merge } from './merge.js';
+
+test('merge - merges two objects', () => {
+  const result = merge({ a: 1, b: 2 }, { c: 3, d: 4 });
+  assert.deepStrictEqual(result, { a: 1, b: 2, c: 3, d: 4 });
+});
+
+test('merge - merges objects with override', () => {
+  const result = merge({ a: 1, b: 2 }, { b: 3, c: 4 });
+  assert.deepStrictEqual(result, { a: 1, b: 3, c: 4 });
+});
+
+test('merge - merges multiple objects', () => {
+  const result = merge({ a: 1 }, { b: 2 }, { c: 3 });
+  assert.deepStrictEqual(result, { a: 1, b: 2, c: 3 });
+});
+
+test('merge - handles null first argument', () => {
+  const result = merge(null, { a: 1 });
+  assert.deepStrictEqual(result, { a: 1 });
+});
+
+test('merge - handles undefined first argument', () => {
+  const result = merge(undefined, { a: 1 });
+  assert.deepStrictEqual(result, { a: 1 });
+});
+
+test('merge - does not modify original objects', () => {
+  const original = { a: 1 };
+  const result = merge(original, { b: 2 });
+  
+  assert.deepStrictEqual(original, { a: 1 });
+  assert.deepStrictEqual(result, { a: 1, b: 2 });
+});
+
+test('merge - returns empty object for arrays', () => {
+  const result = merge([1, 2], [3, 4]);
+  assert.deepStrictEqual(result, {});
+});
+
+test('merge - returns empty object for primitives', () => {
+  const result = merge('string', { a: 1 });
+  assert.deepStrictEqual(result, {});
+});
+
+test('merge - ignores non-object arguments in rest', () => {
+  const result = merge({ a: 1 }, 'string', { b: 2 }, null, { c: 3 });
+  assert.deepStrictEqual(result, { a: 1, b: 2, c: 3 });
+});

package/src/filters/remove_tag.js

@@ -0,0 +1,42 @@
+/**
+ * Remove specified HTML element from provided HTML
+ * 
+ * @param {string} html - The HTML content to process
+ * @param {string} tagName - The tag name to remove
+ * @returns {string} The HTML with the specified tag removed
+ */
+export function removeTag(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 and closing tags along with their content
+  // This regex matches: <tag attributes>content</tag>
+  const regex = new RegExp(`<${escapedTag}(?:\\s[^>]*)?>.*?<\\/${escapedTag}>`, 'gis');
+  let result = html.replace(regex, '');
+  
+  // Also remove self-closing tags: <tag />
+  const selfClosingRegex = new RegExp(`<${escapedTag}(?:\\s[^>]*)?\\s*\\/?>`, 'gi');
+  result = result.replace(selfClosingRegex, '');
+
+  return result;
+}
+
+/**
+ * remove_tag filter - Remove specified HTML element from provided HTML
+ * 
+ * Usage in templates:
+ *   {{ htmlContent | remove_tag('script') }}
+ * 
+ * @param {Object} eleventyConfig - The Eleventy configuration object
+ */
+export function removeTagFilter(eleventyConfig) {
+  eleventyConfig.addFilter("remove_tag", removeTag);
+}

package/src/filters/remove_tag.test.js

@@ -0,0 +1,60 @@
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+import { removeTag } from './remove_tag.js';
+
+describe('removeTag', () => {
+  it('should remove a single tag with content', () => {
+    const html = '<div>Keep this</div><script>Remove this</script><p>Keep this too</p>';
+    const result = removeTag(html, 'script');
+    
+    assert.strictEqual(result, '<div>Keep this</div><p>Keep this too</p>');
+  });
+
+  it('should remove multiple instances of the same tag', () => {
+    const html = '<p>First</p><script>One</script><p>Second</p><script>Two</script><p>Third</p>';
+    const result = removeTag(html, 'script');
+    
+    assert.strictEqual(result, '<p>First</p><p>Second</p><p>Third</p>');
+  });
+
+  it('should handle tags with attributes', () => {
+    const html = '<div>Keep</div><script type="text/javascript" src="file.js">Code</script><p>Keep</p>';
+    const result = removeTag(html, 'script');
+    
+    assert.strictEqual(result, '<div>Keep</div><p>Keep</p>');
+  });
+
+  it('should handle self-closing tags', () => {
+    const html = '<div>Keep</div><br /><p>Keep</p>';
+    const result = removeTag(html, 'br');
+    
+    assert.strictEqual(result, '<div>Keep</div><p>Keep</p>');
+  });
+
+  it('should return original HTML if tag does not exist', () => {
+    const html = '<div>Keep this</div><p>Keep this too</p>';
+    const result = removeTag(html, 'script');
+    
+    assert.strictEqual(result, html);
+  });
+
+  it('should handle empty or null input', () => {
+    assert.strictEqual(removeTag('', 'script'), '');
+    assert.strictEqual(removeTag(null, 'script'), null);
+    assert.strictEqual(removeTag(undefined, 'script'), undefined);
+  });
+
+  it('should be case-insensitive', () => {
+    const html = '<div>Keep</div><SCRIPT>Remove</SCRIPT><Script>Remove</Script><p>Keep</p>';
+    const result = removeTag(html, 'script');
+    
+    assert.strictEqual(result, '<div>Keep</div><p>Keep</p>');
+  });
+
+  it('should handle nested content', () => {
+    const html = '<div>Keep</div><script><div>Nested</div></script><p>Keep</p>';
+    const result = removeTag(html, 'script');
+    
+    assert.strictEqual(result, '<div>Keep</div><p>Keep</p>');
+  });
+});

package/src/filters/where_in.js

@@ -0,0 +1,49 @@
+import lodash from "@11ty/lodash-custom";
+const { get } = lodash;
+
+/**
+ * Core logic for filtering collection items by attribute value
+ *
+ * This function takes a collection, an attribute name, and a target value,
+ * and returns items where the attribute matches the target value.
+ * If the attribute is an array, it checks if the array includes the target value.
+ *
+ * Supports nested attribute names using dot notation (e.g., "data.tags").
+ *
+ * @param {Array} collection - The collection to filter
+ * @param {string} attrName - The attribute name to check (supports dot notation for nested properties)
+ * @param {*} targetValue - The value to match against
+ * @returns {Array} Filtered collection
+ */
+export function whereIn(collection, attrName, targetValue) {
+  if (!collection || !Array.isArray(collection)) {
+    return [];
+  }
+
+  return collection.filter((item) => {
+    // Get the attribute value from the item (supports nested paths like "data.tags")
+    const attrValue = get(item, attrName);
+
+    // If attribute doesn't exist, skip this item
+    if (attrValue === undefined || attrValue === null) {
+      return false;
+    }
+
+    // If the attribute is an array, check if it includes the target value
+    if (Array.isArray(attrValue)) {
+      return attrValue.includes(targetValue);
+    }
+
+    // Otherwise, do a direct comparison
+    return attrValue === targetValue;
+  });
+}
+
+/**
+ * Registers the where_in filter with Eleventy
+ *
+ * @param {Object} eleventyConfig - The Eleventy configuration object
+ */
+export function whereInFilter(eleventyConfig) {
+  eleventyConfig.addFilter("where_in", whereIn);
+}

package/src/filters/where_in.test.js

@@ -0,0 +1,148 @@
+import { describe, it } from "node:test";
+import assert from "node:assert";
+import { whereIn, whereInFilter } from "./where_in.js";
+
+describe("whereIn (core logic)", () => {
+  it("should filter items by exact attribute match", () => {
+    const collection = [
+      { category: "blog", title: "Post 1" },
+      { category: "news", title: "Post 2" },
+      { category: "blog", title: "Post 3" },
+    ];
+
+    const result = whereIn(collection, "category", "blog");
+    assert.strictEqual(result.length, 2);
+    assert.strictEqual(result[0].title, "Post 1");
+    assert.strictEqual(result[1].title, "Post 3");
+  });
+
+  it("should filter items when attribute is an array (includes check)", () => {
+    const collection = [
+      { tags: ["javascript", "tutorial"], title: "Post 1" },
+      { tags: ["python", "tutorial"], title: "Post 2" },
+      { tags: ["javascript", "advanced"], title: "Post 3" },
+    ];
+
+    const result = whereIn(collection, "tags", "javascript");
+    assert.strictEqual(result.length, 2);
+    assert.strictEqual(result[0].title, "Post 1");
+    assert.strictEqual(result[1].title, "Post 3");
+  });
+
+  it("should return empty array when collection is not an array", () => {
+    const result = whereIn(null, "category", "blog");
+    assert.strictEqual(result.length, 0);
+  });
+
+  it("should filter out items without the specified attribute", () => {
+    const collection = [
+      { category: "blog", title: "Post 1" },
+      { title: "Post 2" },
+      { category: "blog", title: "Post 3" },
+    ];
+
+    const result = whereIn(collection, "category", "blog");
+    assert.strictEqual(result.length, 2);
+  });
+
+  it("should work with attribute directly on item (not in data)", () => {
+    const collection = [
+      { category: "blog", title: "Post 1" },
+      { category: "news", title: "Post 2" },
+      { category: "blog", title: "Post 3" },
+    ];
+
+    const result = whereIn(collection, "category", "blog");
+    assert.strictEqual(result.length, 2);
+  });
+
+  it("should handle array that does not include target value", () => {
+    const collection = [
+      { tags: ["python", "tutorial"], title: "Post 1" },
+      { tags: ["ruby", "guide"], title: "Post 2" },
+    ];
+
+    const result = whereIn(collection, "tags", "javascript");
+    assert.strictEqual(result.length, 0);
+  });
+
+  it("should handle different value types", () => {
+    const collection = [
+      { priority: 1, title: "Post 1" },
+      { priority: 2, title: "Post 2" },
+      { priority: 1, title: "Post 3" },
+    ];
+
+    const result = whereIn(collection, "priority", 1);
+    assert.strictEqual(result.length, 2);
+  });
+
+  it("should support nested attribute names with dot notation", () => {
+    const collection = [
+      { data: { category: "blog" }, title: "Post 1" },
+      { data: { category: "news" }, title: "Post 2" },
+      { data: { category: "blog" }, title: "Post 3" },
+    ];
+
+    const result = whereIn(collection, "data.category", "blog");
+    assert.strictEqual(result.length, 2);
+    assert.strictEqual(result[0].title, "Post 1");
+    assert.strictEqual(result[1].title, "Post 3");
+  });
+
+  it("should support nested arrays with dot notation", () => {
+    const collection = [
+      { data: { tags: ["javascript", "tutorial"] }, title: "Post 1" },
+      { data: { tags: ["python", "tutorial"] }, title: "Post 2" },
+      { data: { tags: ["javascript", "advanced"] }, title: "Post 3" },
+    ];
+
+    const result = whereIn(collection, "data.tags", "javascript");
+    assert.strictEqual(result.length, 2);
+    assert.strictEqual(result[0].title, "Post 1");
+    assert.strictEqual(result[1].title, "Post 3");
+  });
+
+  it("should handle deeply nested paths", () => {
+    const collection = [
+      { data: { meta: { status: "published" } }, title: "Post 1" },
+      { data: { meta: { status: "draft" } }, title: "Post 2" },
+      { data: { meta: { status: "published" } }, title: "Post 3" },
+    ];
+
+    const result = whereIn(collection, "data.meta.status", "published");
+    assert.strictEqual(result.length, 2);
+    assert.strictEqual(result[0].title, "Post 1");
+    assert.strictEqual(result[1].title, "Post 3");
+  });
+
+  it("should return empty array when nested path does not exist", () => {
+    const collection = [
+      { data: { category: "blog" }, title: "Post 1" },
+      { title: "Post 2" },
+    ];
+
+    const result = whereIn(collection, "data.nonexistent.path", "value");
+    assert.strictEqual(result.length, 0);
+  });
+});
+
+describe("whereInFilter (Eleventy integration)", () => {
+  it("should register the filter with eleventyConfig", () => {
+    let registeredName;
+    let registeredFn;
+
+    const mockEleventyConfig = {
+      addFilter(name, fn) {
+        registeredName = name;
+        registeredFn = fn;
+      },
+    };
+
+    whereInFilter(mockEleventyConfig);
+
+    assert.strictEqual(registeredName, "where_in");
+    assert.strictEqual(typeof registeredFn, "function");
+    assert.strictEqual(registeredFn, whereIn);
+  });
+});

package/src/index.cjs

@@ -0,0 +1,26 @@
+/**
+ * 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', 'setAttrFilter', 'whereInFilter', 'mergeFilter', 'removeTagFilter', 'ifFilter', 'attrConcatFilter', 'siteData'].forEach(name => {
+  module.exports[name] = async (eleventyConfig) => {
+    const module = await import('./index.js');
+    return module[name](eleventyConfig);
+  };
+});
+
+// Export transform/utility functions for advanced usage
+['transformAutoRaw', 'transformNl2br', 'merge', 'removeTag', 'iff', 'attrConcat'].forEach(name => {
+  module.exports[name] = async (...args) => {
+    const module = await import('./index.js');
+    return module[name](...args);
+  };
+});

package/src/index.js

@@ -0,0 +1,94 @@
+import {
+  mdAutoRawTags,
+  mdAutoNl2br,
+  mdAutoLinkFavicons,
+  transformAutoRaw,
+  transformNl2br,
+  isPlainUrlText,
+  cleanLinkText,
+  buildFaviconLink,
+  transformLink,
+} from "./markdown.js";
+import { setAttrFilter } from "./filters/attr.js";
+import { whereInFilter } from "./filters/where_in.js";
+import { mergeFilter, merge } from "./filters/merge.js";
+import { removeTagFilter, removeTag } from "./filters/remove_tag.js";
+import { ifFilter, iff } from "./filters/if.js";
+import { attrConcatFilter, attrConcat } from "./filters/attr_concat.js";
+import { siteData } from "./siteData.js";
+
+/**
+ * 11ty Bricks Plugin
+ *
+ * A collection of helpful utilities and filters for Eleventy (11ty).
+ * Can be used as a plugin or by importing individual helpers.
+ *
+ * @param {Object} eleventyConfig - The Eleventy configuration object
+ * @param {Object} options - Plugin options
+ * @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.mdAutoLinkFavicons - Enable mdAutoLinkFavicons to add favicons to plain text links (default: false)
+ * @param {Array<string>} options.filters - Array of filter names to enable: 'attr', 'where_in', 'merge', 'remove_tag', 'if', 'attr_concat' (default: [])
+ * @param {boolean} options.siteData - Enable site.year and site.prod global data (default: false)
+ */
+export default function eleventyBricksPlugin(eleventyConfig, options = {}) {
+  const plugins = {
+    mdAutoRawTags,
+    mdAutoNl2br,
+    mdAutoLinkFavicons,
+    siteData,
+  };
+
+  const filters = {
+    attr: setAttrFilter,
+    where_in: whereInFilter,
+    merge: mergeFilter,
+    remove_tag: removeTagFilter,
+    if: ifFilter,
+    attr_concat: attrConcatFilter,
+  };
+
+  // Handle individual plugin options
+  Object.entries(options).forEach(([key, enabled]) => {
+    if (key !== "filters" && enabled && plugins[key]) {
+      plugins[key](eleventyConfig);
+    }
+  });
+
+  // Handle filters array
+  if (Array.isArray(options.filters)) {
+    options.filters.forEach((filterName) => {
+      if (filters[filterName]) {
+        filters[filterName](eleventyConfig);
+      }
+    });
+  }
+}
+
+// Export individual helpers for granular usage
+export {
+  mdAutoRawTags,
+  mdAutoNl2br,
+  mdAutoLinkFavicons,
+  setAttrFilter,
+  whereInFilter,
+  mergeFilter,
+  removeTagFilter,
+  ifFilter,
+  attrConcatFilter,
+  siteData,
+};
+
+// Export transform/utility functions for advanced usage
+export {
+  transformAutoRaw,
+  transformNl2br,
+  isPlainUrlText,
+  cleanLinkText,
+  buildFaviconLink,
+  transformLink,
+  merge,
+  removeTag,
+  iff,
+  attrConcat,
+};

package/src/markdown.js

@@ -0,0 +1,163 @@
+/**
+ * Transform Nunjucks syntax in content by wrapping it with raw tags
+ *
+ * This function wraps Nunjucks syntax ({{, }}, {%, %}) with {% raw %} tags
+ * to prevent them from being processed by the template engine.
+ *
+ * @param {string} content - The content to transform
+ * @returns {string} The transformed content with Nunjucks syntax wrapped
+ */
+export function transformAutoRaw(content) {
+  // This regex looks for {{, }}, {%, or %} individually and wraps them
+  return content.replace(/({{|}}|{%|%})/g, "{% raw %}$1{% endraw %}");
+}
+
+/**
+ * mdAutoRawTags - Forbid Nunjucks processing in Markdown files
+ *
+ * This preprocessor wraps Nunjucks syntax ({{, }}, {%, %}) with {% raw %} tags
+ * to prevent them from being processed by the template engine in Markdown files.
+ *
+ * @param {Object} eleventyConfig - The Eleventy configuration object
+ */
+export function mdAutoRawTags(eleventyConfig) {
+  eleventyConfig.addPreprocessor("mdAutoRawTags", "md", (data, content) => {
+    return transformAutoRaw(content);
+  });
+}
+
+/**
+ * Transform \n sequences to <br> tags
+ *
+ * This function converts literal \n sequences (double backslash + n) to HTML <br> tags.
+ * It handles both double \n\n and single \n sequences, processing double ones first.
+ *
+ * @param {string} content - The content to transform
+ * @returns {string} The transformed content with \n converted to <br>
+ */
+export function transformNl2br(content) {
+  // Replace double \n\n first, then single \n to avoid double conversion
+  return content.replace(/\\n\\n/g, "<br>").replace(/\\n/g, "<br>");
+}
+
+/**
+ * mdAutoNl2br - Auto convert \n to <br> in markdown (especially tables)
+ *
+ * This function amends the markdown library to automatically convert \n
+ * to <br> tags in text content, which is particularly useful for line breaks
+ * inside markdown tables where standard newlines don't work.
+ *
+ * @param {Object} eleventyConfig - The Eleventy configuration object
+ */
+export function mdAutoNl2br(eleventyConfig) {
+  eleventyConfig.amendLibrary("md", (mdLib) => {
+    mdLib.renderer.rules.text = (tokens, idx) => {
+      return transformNl2br(tokens[idx].content);
+    };
+  });
+}
+
+/**
+ * Check if link text looks like a plain URL or domain
+ *
+ * @param {string} linkText - The text content of the link
+ * @param {string} domain - The domain extracted from the URL
+ * @returns {boolean} True if the link text appears to be a plain URL
+ */
+export function isPlainUrlText(linkText, domain) {
+  return linkText.trim().includes(domain) || linkText.trim().match(/^https?:\/\//) !== null;
+}
+
+/**
+ * Clean link text by removing protocol, domain, and leading slash
+ *
+ * @param {string} linkText - The original link text
+ * @param {string} domain - The domain to remove
+ * @returns {string} The cleaned text
+ */
+export function cleanLinkText(linkText, domain) {
+  return linkText
+    .trim()
+    .replace(/^https?:\/\//, "")
+    .replace(domain, "")
+    .replace(/\/$/, "");
+}
+
+/**
+ * Build HTML for a link with favicon
+ *
+ * @param {string} attrs - The link attributes (including href)
+ * @param {string} domain - The domain for the favicon
+ * @param {string} text - The text to display
+ * @returns {string} The HTML string
+ */
+export function buildFaviconLink(attrs, domain, text) {
+  return `<a ${attrs} target="_blank"><i><img src="https://www.google.com/s2/favicons?domain=${domain}&sz=32"></i>${text}</a>`;
+}
+
+/**
+ * Transform a single link to include a favicon
+ *
+ * @param {string} match - The full matched link HTML
+ * @param {string} attrs - The link attributes
+ * @param {string} url - The URL from the href attribute
+ * @param {string} linkText - The text content of the link
+ * @returns {string} The transformed link or original match if not applicable
+ */
+export function transformLink(match, attrs, url, linkText) {
+  try {
+    // Extract domain from URL
+    const urlObj = new URL(url, "http://dummy.com");
+    const domain = urlObj.hostname;
+
+    // Only add favicon if link text looks like a plain URL/domain
+    if (isPlainUrlText(linkText, domain)) {
+      // Remove domain from link text
+      const cleanedText = cleanLinkText(linkText, domain);
+
+      // Only apply if there are at least 2 letters remaining after domain
+      if (cleanedText.length > 2) {
+        return buildFaviconLink(attrs, domain, cleanedText);
+      }
+    }
+    return match;
+  } catch (e) {
+    // If URL parsing fails, return original match
+    return match;
+  }
+}
+
+/**
+ * Replace all anchor links in HTML content with transformed versions
+ *
+ * This function searches for all anchor tags in HTML content and replaces them
+ * using the provided transform function. The regex captures:
+ * - Group 1: All attributes including href
+ * - Group 2: The URL from the href attribute
+ * - Group 3: The link text content
+ *
+ * @param {string} content - The HTML content to process
+ * @param {Function} transformer - Function to transform each link (receives match, attrs, url, linkText)
+ * @returns {string} The HTML content with transformed links
+ */
+export function replaceLinksInHtml(content, transformer) {
+  return content.replace(/<a\s+([^>]*href=["']([^"']+)["'][^>]*)>([^<]+)<\/a>/gi, transformer);
+}
+
+/**
+ * mdAutoLinkFavicons - Add favicon images to plain text links
+ *
+ * This transform automatically adds favicon images from Google's favicon service
+ * to links that display plain URLs or domain names. It processes all HTML output
+ * files and adds inline favicon images next to the link text.
+ *
+ * @param {Object} eleventyConfig - The Eleventy configuration object
+ */
+export function mdAutoLinkFavicons(eleventyConfig) {
+  eleventyConfig.addTransform("mdAutoLinkFavicons", function (content) {
+    if (this.page.outputPath && this.page.outputPath.endsWith(".html")) {
+      return replaceLinksInHtml(content, transformLink);
+    }
+    return content;
+  });
+}