@anydigital/eleventy-bricks 0.27.0 → 0.27.1

package/README.md

@@ -177,13 +177,13 @@ eleventyConfig.addPlugin(eleventyBricks, {
 
 The plugin also exports the following utility functions for advanced usage:
 
-- `transformAutoRaw(content)`: The transform function used by `mdAutoRawTags` preprocessor. Can be used programmatically to wrap Nunjucks syntax with raw tags.
-- `transformNl2br(content)`: The transform function used by `mdAutoNl2br` preprocessor. Can be used programmatically to convert `\n` sequences to `<br>` tags.
+- `transformAutoRaw(content)`: The processor function used by `mdAutoRawTags` preprocessor. Can be used programmatically to wrap Nunjucks syntax with raw tags.
+- `transformNl2br(content)`: The processor function used by `mdAutoNl2br` preprocessor. Can be used programmatically to convert `\\n` sequences to `\u003cbr\u003e` tags.
 - `isPlainUrlText(linkText, domain)`: Helper function that checks if link text looks like a plain URL or domain.
 - `cleanLinkText(linkText, domain)`: Helper function that cleans link text by removing protocol, domain, and leading slash.
 - `buildFaviconLink(attrs, domain, text)`: Helper function that builds HTML for a link with favicon.
-- `transformLink(match, attrs, url, linkText)`: The transform function used by `autoLinkFavicons` that transforms a single link to include a favicon.
-- `replaceLinksInHtml(content, transformer)`: Helper function that replaces all anchor links in HTML content with transformed versions.
+- `transformLink(match, attrs, url, linkText)`: The processor function used by `autoLinkFavicons` that processes a single link to include a favicon.
+- `replaceLinksInHtml(content, processor)`: Helper function that replaces all anchor links in HTML content with processed versions.
 - `attrIncludes(collection, attrName, targetValue)`: The core logic for filtering collection items by checking if an attribute array includes a target value. Can be used programmatically to filter collections.
 - `merge(first, ...rest)`: The core merge function used by the `merge` filter. Can be used programmatically to merge arrays or objects.
 - `removeTag(html, tagName)`: The core function used by the `remove_tag` filter. Can be used programmatically to remove HTML tags from content.
@@ -192,37 +192,25 @@ The plugin also exports the following utility functions for advanced usage:
 - `attrSet(obj, key, value)`: The core function used by the `attr_set` filter. Can be used programmatically to override object attributes.
 - `section(content, sectionName)`: The core function used by the `section` filter. Can be used programmatically to extract named sections from content.
 
-<!--section:11ty-->
-
-## Tricks from [Eleventy Bricks](https://github.com/anydigital/eleventy-bricks) {#eleventy-bricks}
-
-### Filters
-
-|      Input | Nunjucks                                                                       | Liquid <hr>                                          |
-| ---------: | ------------------------------------------------------------------------------ | ---------------------------------------------------- |
-| {.divider} | Logical                                                                        |
-|  `ANY \| ` | `default(VALUE)` <br>= `d(...)`                                                | `default: VALUE`                                     |
-|   `ANY \|` | [`if(TEST, OP, VALUE)`](#if) <sub>currently only `if(TEST)`</sub>              | [`if: TEST, OP, VALUE`](#if)                         |
-| {.divider} | On objects                                                                     |
-|   `OBJ \|` | [`merge(OBJ2)`](#merge)                                                        | [`merge: OBJ2`](#merge)                              |
-| {.divider} | On object attributes                                                           |
-|   `OBJ \|` | `selectattr(BOOL_ATTR)`                                                        | `where: ATTR, VALUE`                                 |
-|   `OBJ \|` | `rejectattr(BOOL_ATTR)`                                                        | N/A                                                  |
-|   `OBJ \|` | [`attr_includes(ARRAY_ATTR, VALUE)`](#attr_includes) <sub>was `where_in`</sub> | [`attr_includes: ARRAY_ATTR, VALUE`](#attr_includes) |
-|   `OBJ \|` | [`attr_set(ATTR, VALUE)`](#attr_set) <sub>was `attr`</sub>                     | [`attr_set: ATTR, VALUE`](#attr_set)                 |
-|   `OBJ \|` | [`attr_concat(ARRAY_ATTR, ARRAY2)`](#attr_concat)                              | [`attr_concat: ARRAY_ATTR, ARRAY2`](#attr_concat)    |
-| {.divider} | Textual                                                                        |
-|  `HTML \|` | `striptags`                                                                    | `strip_html`                                         |
-|  `HTML \|` | [`remove_tag(TAG)`](#remove_tag)                                               | [`remove_tag: TAG`](#remove_tag)                     |
-|  `HTML \|` | [`section(NAME)`](#section)                                                    | [`section: NAME`](#section)                          |
-|   `STR \|` | `remove: STR2`                                                                 | `remove: STR2`                                       |
-| {.divider} | Other                                                                          |
-|   `URL \|` | [`fetch`](#fetch)                                                              | [`fetch`](#fetch)                                    |
-
-Ref:
-
-- https://mozilla.github.io/nunjucks/templating.html#builtin-filters
-- https://shopify.github.io/liquid/
+## Features
+
+<!--section:filters-h3-->
+
+### Universal 11ty filters <small>for `.njk` & `.liquid`</small> <sub>by https://github.com/anydigital/eleventy-bricks</sub>
+
+|      Input | Filter                            | Arguments                                          |
+| ---------: | --------------------------------- | -------------------------------------------------- |
+| {.divider} | Logical filters:                  |
+|   `ANY \|` | [`if`](#if)                       | `TEST, OP, VALUE` <sub>currently only `TEST`</sub> |
+| {.divider} | Filters for objects:              |
+|   `OBJ \|` | [`merge`](#merge)                 | `OBJ2`                                             |
+|   `OBJ \|` | [`attr_set`](#attr_set)           | `ATTR, VALUE`                                      |
+|   `OBJ \|` | [`attr_concat`](#attr_concat)     | `ATTR, ARRAY2`                                     |
+|   `OBJ \|` | [`attr_includes`](#attr_includes) | `ATTR, VALUE`                                      |
+| {.divider} | Other filters:                    |
+|   `URL \|` | [`fetch`](#fetch)                 |                                                    |
+|  `HTML \|` | [`section`](#section)             | `NAME`                                             |
+|  `HTML \|` | [`remove_tag`](#remove_tag)       | `TAG`                                              |
 
 #### `attr_set`
 
@@ -554,15 +542,15 @@ export default function (eleventyConfig) {
 ```markdown
 # My Post
 
-&lt;!--section:intro-->
+<¡--section:intro-->
 
 This is the introduction that appears at the top of the page.
 
-&lt;!--section:main-->
+<¡--section:main-->
 
 This is the main body of the post with all the details.
 
-&lt;!--section:summary,sidebar-->
+<¡--section:summary,sidebar-->
 
 This content appears in both the summary and the sidebar!
 ```
@@ -593,11 +581,11 @@ This content appears in both the summary and the sidebar!
 
 **Features:**
 
-- **Multiple names**: A single section can have multiple names separated by commas: `&lt;!--section:name1,name2-->`
+- **Multiple names**: A single section can have multiple names separated by commas: `<¡--section:name1,name2-->`
 - **Case-insensitive**: Section names are matched without regard to case
 - **Multiple occurrences**: If a section name appears multiple times, the filter concatenates all matching sections
 - **Non-destructive**: Returns extracted content without modifying the original input
-- **EOF support**: Sections continue until the next `&lt;!--section*-->` marker or the end of the file
+- **EOF support**: Sections continue until the next `<¡--section*-->` marker or the end of the file
 
 **Examples:**
 
@@ -620,8 +608,8 @@ This content appears in both the summary and the sidebar!
 
 **Syntax Rules:**
 
-- Sections start with: `&lt;!--section:NAME-->` or `&lt;!--section:NAME1,NAME2-->`
-- Sections end at the next `&lt;!--section*-->` marker or end of file
+- Sections start with: `<¡--section:NAME-->` or `<¡--section:NAME1,NAME2-->`
+- Sections end at the next `<¡--section*-->` marker or end of file
 - Whitespace around names and inside comments is automatically trimmed
 
 #### `if`
@@ -914,61 +902,108 @@ your-project/
 
 **Note:** The filter returns raw text content. Use Eleventy's built-in filters like `| safe`, `| markdown`, or `| fromJson` to process the content as needed.
 
-### Transforms
+<!--section:data&processors-h3-->
 
-#### mdAutoRawTags
+### Global `site` data helpers
 
-Prevents Nunjucks syntax from being processed in Markdown files by automatically wrapping `{{`, `}}`, `{%`, and `%}` with `{% raw %}` tags.
+Adds global `site` data to your Eleventy project, providing commonly needed values that can be accessed in all templates:
 
-**Why use this?**
+| Variable          | Value                                                                                                        |
+| ----------------- | ------------------------------------------------------------------------------------------------------------ |
+| `{{ site.year }}` | The current year as a number (e.g., `2026`)                                                                  |
+| `{{ site.prod }}` | Boolean indicating if running in production mode (`true` for `eleventy build`, `false` for `eleventy serve`) |
 
-When writing documentation or tutorials about templating in Markdown files, you often want to show Nunjucks/Liquid syntax as literal text. This preprocessor automatically escapes these special characters so they display as-is instead of being processed by the template engine.
+<details>
+<summary>Quick setup</summary>
 
-**Usage:**
+```sh
+npm install @anydigital/eleventy-bricks
+```
 
-1. Enable `mdAutoRawTags` in your Eleventy config:
+Then choose one of the following options:
 
-```javascript
-import { mdAutoRawTags } from "@anydigital/eleventy-bricks";
+1. ```js {data-caption="As a plugin in eleventy.config.js (balanced)"}
+   import eleventyBricksPlugin from "@anydigital/eleventy-bricks";
 
-export default function (eleventyConfig) {
-  mdAutoRawTags(eleventyConfig);
-  // Or use as plugin:
-  // eleventyConfig.addPlugin(eleventyBricks, { mdAutoRawTags: true });
-}
-```
+   export default function (eleventyConfig) {
+     eleventyConfig.addPlugin(eleventyBricksPlugin, { siteData: true });
+   }
+   ```
+
+2. ```js {data-caption="Individual import in eleventy.config.js (minimal)"}
+   import { siteData } from "@anydigital/eleventy-bricks";
+
+   export default function (eleventyConfig) {
+     siteData(eleventyConfig);
+   }
+   ```
+
+3. ```sh {data-caption="Symlink entire eleventy.config.js (easiest)"}
+   ln -s node_modules/@anydigital/eleventy-bricks/src/eleventy.config.js
+   ```
+
+{.list-[upper-roman]}
+
+</details>
+
+### `mdAutoRawTags` preprocessor
+
+Prevents Nunjucks syntax from being processed in Markdown files by automatically wrapping `{{`, `}}`, `{%`, and `%}` with `{% raw %}` tags.
+
+**Why use this?**
+
+When writing documentation or tutorials about templating in Markdown files, you often want to show Nunjucks/Liquid syntax as literal text. This preprocessor automatically escapes these special characters so they display as-is instead of being processed by the template engine.
 
 **Example:**
 
 Before `mdAutoRawTags`, writing this in Markdown:
 
 ```markdown
-Use {{ variable }} to output variables.
+### Using {{ variable }} to output variables
 ```
 
 Would try to process `{{ variable }}` as a template variable. With `mdAutoRawTags`, it displays exactly as written.
 
-#### mdAutoNl2br
+<details>
+<summary>Quick setup</summary>
 
-Automatically converts `\n` sequences to `<br>` tags in Markdown content. This is particularly useful for adding line breaks inside Markdown tables where standard newlines don't work.
+```sh
+npm install @anydigital/eleventy-bricks
+```
 
-**Why use this?**
+Then choose one of the following options:
 
-Markdown tables don't support multi-line content in cells. By using `\n` in your content, this preprocessor will convert it to `<br>` tags, allowing you to display line breaks within table cells and other content.
+1. ```js {data-caption="As a plugin in eleventy.config.js (balanced)"}
+   import eleventyBricksPlugin from "@anydigital/eleventy-bricks";
 
-**Usage:**
+   export default function (eleventyConfig) {
+     eleventyConfig.addPlugin(eleventyBricksPlugin, { mdAutoRawTags: true });
+   }
+   ```
 
-1. Enable `mdAutoNl2br` in your Eleventy config:
+2. ```js {data-caption="Individual import in eleventy.config.js (minimal)"}
+   import { mdAutoRawTags } from "@anydigital/eleventy-bricks";
 
-```javascript
-import { mdAutoNl2br } from "@anydigital/eleventy-bricks";
+   export default function (eleventyConfig) {
+     mdAutoRawTags(eleventyConfig);
+   }
+   ```
 
-export default function (eleventyConfig) {
-  mdAutoNl2br(eleventyConfig);
-  // Or use as plugin:
-  // eleventyConfig.addPlugin(eleventyBricks, { mdAutoNl2br: true });
-}
-```
+3. ```sh {data-caption="Symlink entire eleventy.config.js (easiest)"}
+   ln -s node_modules/@anydigital/eleventy-bricks/src/eleventy.config.js
+   ```
+
+{.list-[upper-roman]}
+
+</details>
+
+### `mdAutoNl2br` converter
+
+Automatically converts `\n` sequences to `<br>` tags in Markdown content. This is particularly useful for adding line breaks inside Markdown tables where standard newlines don't work.
+
+**Why use this?**
+
+Markdown tables don't support multi-line content in cells. By using `\n` in your content, this preprocessor will convert it to `<br>` tags, allowing you to display line breaks within table cells and other content.
 
 **Example:**
 
@@ -989,31 +1024,48 @@ Will render as:
 
 **Note:** This processes literal `\n` sequences (backslash followed by 'n'), not actual newline characters. Type `\n` in your source files where you want line breaks.
 
-#### autoLinkFavicons
+<details>
+<summary>Quick setup</summary>
 
-Automatically adds favicon images from Google's favicon service to links that display plain URLs or domain names. This transform processes all HTML output files and adds inline favicon images next to link text that appears to be a plain URL.
+```sh
+npm install @anydigital/eleventy-bricks
+```
 
-**Why use this?**
+Then choose one of the following options:
 
-When you have links in your content that display raw URLs or domain names (like `https://example.com/page`), adding favicons provides a visual indicator of the external site. This transform automatically detects these plain-text URL links and enhances them with favicon images, making them more visually appealing and easier to recognize.
+1. ```js {data-caption="As a plugin in eleventy.config.js (balanced)"}
+   import eleventyBricksPlugin from "@anydigital/eleventy-bricks";
 
-**Usage:**
+   export default function (eleventyConfig) {
+     eleventyConfig.addPlugin(eleventyBricksPlugin, { mdAutoNl2br: true });
+   }
+   ```
 
-1. Enable `autoLinkFavicons` in your Eleventy config:
+2. ```js {data-caption="Individual import in eleventy.config.js (minimal)"}
+   import { mdAutoNl2br } from "@anydigital/eleventy-bricks";
 
-```javascript
-import { autoLinkFavicons } from "@anydigital/eleventy-bricks";
+   export default function (eleventyConfig) {
+     mdAutoNl2br(eleventyConfig);
+   }
+   ```
 
-export default function (eleventyConfig) {
-  autoLinkFavicons(eleventyConfig);
-  // Or use as plugin:
-  // eleventyConfig.addPlugin(eleventyBricks, { autoLinkFavicons: true });
-}
-```
+3. ```sh {data-caption="Symlink entire eleventy.config.js (easiest)"}
+   ln -s node_modules/@anydigital/eleventy-bricks/src/eleventy.config.js
+   ```
 
-**How it works:**
+{.list-[upper-roman]}
+
+</details>
 
-The transform:
+### `autoLinkFavicons` processor
+
+Automatically adds favicon images from Google's favicon service to links that display plain URLs or domain names. This processor processes all HTML output files and adds inline favicon images next to link text that appears to be a plain URL.
+
+**Why use this?**
+
+When you have links in your content that display raw URLs or domain names (like `https://example.com/page`), adding favicons provides a visual indicator of the external site. This processor automatically detects these plain-text URL links and enhances them with favicon images, making them more visually appealing and easier to recognize.
+
+**How it works:**
 
 1. Scans all HTML output files for `<a>` tags
 2. Checks if the link text appears to be a plain URL or domain
@@ -1023,13 +1075,13 @@ The transform:
 
 **Example:**
 
-Before transformation:
+Before processing:
 
 ```html
 <a href="https://github.com/anydigital/eleventy-bricks">https://github.com/anydigital/eleventy-bricks</a>
 ```
 
-After transformation:
+After processing:
 
 ```html
 <a href="https://github.com/anydigital/eleventy-bricks" class="whitespace-nowrap" target="_blank">
@@ -1045,124 +1097,49 @@ After transformation:
 - Removes the trailing slash from the display text
 - Only applies if at least 3 characters remain after removing the domain (to avoid showing favicons for bare domain links)
 - Uses Google's favicon service at `https://www.google.com/s2/favicons?domain=DOMAIN&sz=32`
-- Adds `target="_blank"` to the transformed links (only if not already present)
+- Adds `target="_blank"` to the processed links (only if not already present)
 - Adds `whitespace-nowrap` class to the link
 - Wraps the link text in a `<span>` element
 - The favicon is wrapped in an `<i>` tag for easy styling
 
-**Styling:**
+<details>
+<summary>Quick setup</summary>
 
-You can style the favicon icons with CSS:
-
-```css
-/* Style the favicon wrapper */
-a i {
-  display: inline-block;
-  margin-right: 0.25em;
-}
-
-/* Style the favicon image */
-a i img {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
-}
-```
-
-**Note:** This transform only processes HTML output files (those ending in `.html`). It does not modify the original content files.
-
-### Global Data
-
-Adds global site data to your Eleventy project, providing commonly needed values that can be accessed in all templates.
-
-**Why use this?**
-
-Many websites need access to the current year (for copyright notices) and environment information (to conditionally enable features based on production vs development). This helper provides these as global `site` data without manually setting them up.
-
-**Usage:**
-
-1. Enable `siteData` in your Eleventy config:
-
-```javascript
-import { siteData } from "@anydigital/eleventy-bricks";
-
-export default function (eleventyConfig) {
-  siteData(eleventyConfig);
-  // Or use as plugin:
-  // eleventyConfig.addPlugin(eleventyBricks, { siteData: true });
-}
-```
-
-2. Use the global data in your templates:
-
-**Current Year:**
-
-```njk
-<footer>
-  <p>&copy; {{ site.year }} Your Company Name. All rights reserved.</p>
-</footer>
-```
-
-**Environment Check:**
-
-```njk
-{% if site.prod %}
-  <!-- Production-only features -->
-  <script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>
-{% else %}
-  <!-- Development-only features -->
-  <div class="dev-toolbar">Development Mode</div>
-{% endif %}
+```sh
+npm install @anydigital/eleventy-bricks
 ```
 
-**Available Data:**
+Then choose one of the following options:
 
-- `site.year`: The current year as a number (e.g., `2026`)
-- `site.prod`: Boolean indicating if running in production mode (`true` for `eleventy build`, `false` for `eleventy serve`)
+1. ```js {data-caption="As a plugin in eleventy.config.js (balanced)"}
+   import eleventyBricksPlugin from "@anydigital/eleventy-bricks";
 
-**Features:**
+   export default function (eleventyConfig) {
+     eleventyConfig.addPlugin(eleventyBricksPlugin, { autoLinkFavicons: true });
+   }
+   ```
 
-- Automatically updates the year value
-- Detects production vs development mode based on `ELEVENTY_RUN_MODE` environment variable
-- Available globally in all templates without manual setup
-- No configuration required
+2. ```js {data-caption="Individual import in eleventy.config.js (minimal)"}
+   import { autoLinkFavicons } from "@anydigital/eleventy-bricks";
 
-**Examples:**
+   export default function (eleventyConfig) {
+     autoLinkFavicons(eleventyConfig);
+   }
+   ```
 
-```njk
-{# Copyright notice #}
-<p>Copyright &copy; {{ site.year }} My Site</p>
+3. ```sh {data-caption="Symlink entire eleventy.config.js (easiest)"}
+   ln -s node_modules/@anydigital/eleventy-bricks/src/eleventy.config.js
+   ```
 
-{# Conditional loading of analytics #}
-{% if site.prod %}
-  <script src="/analytics.js"></script>
-{% endif %}
+{.list-[upper-roman]}
 
-{# Different behavior in dev vs prod #}
-{% if site.prod %}
-  <link rel="stylesheet" href="/css/styles.min.css">
-{% else %}
-  <link rel="stylesheet" href="/css/styles.css">
-  <script src="/live-reload.js"></script>
-{% endif %}
-```
+</details>
 
-### Symlinked Configuration Files
+<!--section:config-h3-->
 
-The package includes pre-configured starter files in `node_modules/@anydigital/eleventy-bricks/src/` that you can symlink to your project for quick setup:
+### Symlinked `eleventy.config.js` <sub>from https://github.com/anydigital/eleventy-bricks</sub>
 
-Benefits of Symlinking:
-
-- **Always up-to-date**: Configuration automatically updates when you upgrade the package
-- **Less maintenance**: No need to manually sync configuration changes
-- **Quick setup**: Get started immediately with best-practice configurations
-- **Easy customization**: Override specific settings by creating your own config that imports from the symlinked version
-
-If you prefer to customize the configurations extensively, you can copy the files instead.
-
-#### eleventy.config.js
-
-A fully-configured Eleventy config file with:
+The package includes a fully-configured Eleventy config file `eleventy.config.js` that you can symlink to your project to get:
 
 - All eleventy-bricks plugins enabled
 - Eleventy Navigation plugin
@@ -1171,30 +1148,27 @@ A fully-configured Eleventy config file with:
 - YAML data support
 - CLI input directory support
 - Symlink support for development
+- _and more_
 
-**Required dependencies:**
+**Benefits of symlinking:**
 
-```bash
-npm install @11ty/eleventy-navigation markdown-it markdown-it-anchor markdown-it-attrs js-yaml minimist
-```
-
-**Optional dependencies:**
+- **Always up-to-date**: Configuration automatically updates when you upgrade the package
+- **Less maintenance**: No need to manually sync configuration changes
+- **Quick setup**: Get started immediately with best-practice configurations
+- **Easy customization**: Override specific settings by creating your own config that imports from the symlinked version
 
-```bash
-# For the fetch filter
-npm install @11ty/eleventy-fetch
+**Quick setup:**
 
-# For table of contents generation
-npm install @uncenter/eleventy-plugin-toc
+```sh
+npm install @anydigital/eleventy-bricks
+ln -s node_modules/@anydigital/eleventy-bricks/src/eleventy.config.js
 ```
 
-**Symlink to your project:**
+Done! 🎉
 
-```bash
-ln -s node_modules/@anydigital/eleventy-bricks/src/eleventy.config.js eleventy.config.js
-```
+<!--section:cms-h4-->
 
-#### admin/index.html
+### Symlinked CMS
 
 A ready-to-use Sveltia CMS admin interface for content management.
 
@@ -1205,61 +1179,54 @@ mkdir -p admin
 ln -s ../node_modules/@anydigital/eleventy-bricks/src/admin/index.html admin/index.html
 ```
 
-<!--section:npm,11ty-->
+<!--section:npm-h3-->
 
-### Using the `do` Folder Pattern
+### Reusable 11ty npm scripts <small>via npm workspace</small> <sub>from https://github.com/anydigital/eleventy-bricks</sub>
 
 This package provides a pre-configured `do` folder setup that helps organize your development workflow using npm workspaces. The `do` folder contains scripts for building and running your Eleventy project.
 
-**Setup:**
+**Quick setup:**
 
-1. Create a `do` folder in your project root:
+1. Create a simple folder, which will hold reusable npm scripts:
 
-```bash
-mkdir do
-```
+   ```sh
+   mkdir do
+   ```
 
-2. Symlink the package.json from the eleventy-bricks package:
+2. Install https://github.com/anydigital/eleventy-bricks to reuse default 11ty scripts from there:
 
-```bash
-ln -s node_modules/@anydigital/eleventy-bricks/src/do/package.json do/package.json
-```
+   ```sh
+   npm install @anydigital/eleventy-bricks
+   ```
 
-3. Configure your root `package.json` to use npm workspaces:
+3. Symlink the `do/package.json` containing scripts into your project's `do` folder:
 
-```json
-{
-  "name": "my-project",
-  "workspaces": ["do"],
-  "scripts": {
-    "build": "npm -w do run build",
-    "start": "npm -w do run start"
-  }
-}
-```
-
-**Usage:**
-
-Run your Eleventy project:
+   ```sh
+   cd do
+   ln -s node_modules/@anydigital/eleventy-bricks/src/do/package.json
+   ```
 
-```bash
-npm start
-```
+4. Finally register `do` folder as npm workspace in your `package.json`, and enjoy default 11ty scripts as simple as:
 
-Build for production:
+   ```json {data-caption="YOUR project's package.json"}
+   {
+     "workspaces": ["do"],
+     "scripts": {
+       "start": "npm -w do run start",
+       "stage": "npm -w do run stage",
+       "build": "npm -w do run build"
+     }
+   }
+   ```
 
-```bash
-npm run build
-```
+**Done!** 🎉 Now you can run:
 
-**Available Scripts in `do` folder:**
+- `npm start` to start 11ty dev server with live reload and Tailwind watch mode
+- `npm run stage` to build and serve production-like site locally
+- `npm run build` to finally build the site for production
+- all available scripts: https://github.com/anydigital/eleventy-bricks/blob/main/src/do/package.json
 
-- `build` - Build the site with Eleventy and minify CSS with Tailwind
-- `start` - Start Eleventy dev server with live reload and Tailwind watch mode
-- `stage` - Clean build and serve locally for preview
-- `11ty` - Run Eleventy commands directly
-- `11ty:clean` - Remove the `_site` output directory
-- `tw` - Run Tailwind CSS commands
+**Example setup:** https://github.com/anydigital/sveleven
 
 **Benefits:**
 

package/package.json

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

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,7 +6,7 @@ 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";

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