From 1bf83499b028abc8ff643c0d41ade383d6d01252 Mon Sep 17 00:00:00 2001
From: Lea Verou <lea@verou.me>
Date: Tue, 17 Dec 2024 12:08:41 -0500
Subject: [PATCH] Refactor: Move 11ty filters to separate file

---
 docs/.eleventy.js      | 18 +++++-------------
 docs/_utils/filters.js | 24 ++++++++++++++++++++++++
 2 files changed, 29 insertions(+), 13 deletions(-)
 create mode 100644 docs/_utils/filters.js

diff --git a/docs/.eleventy.js b/docs/.eleventy.js
index d55b0fb10..5d3122df3 100644
--- a/docs/.eleventy.js
+++ b/docs/.eleventy.js
@@ -1,4 +1,3 @@
-import { parse } from 'path';
 import { anchorHeadingsPlugin } from './_utils/anchor-headings.js';
 import { codeExamplesPlugin } from './_utils/code-examples.js';
 import { copyCodePlugin } from './_utils/copy-code.js';
@@ -10,6 +9,7 @@ import { removeDataAlphaElements } from './_utils/remove-data-alpha-elements.js'
 import litPlugin from '@lit-labs/eleventy-plugin-lit';
 import { readFile } from 'fs/promises';
 import componentList from './_data/componentList.js';
+import * as filters from './_utils/filters.js';
 import { outlinePlugin } from './_utils/outline.js';
 import { replaceTextPlugin } from './_utils/replace-text.js';
 import { searchPlugin } from './_utils/search.js';
@@ -38,18 +38,10 @@ export default function (eleventyConfig) {
   // Template filters - {{ content | filter }}
   eleventyConfig.addFilter('inlineMarkdown', content => markdown.renderInline(content || ''));
   eleventyConfig.addFilter('markdown', content => markdown.render(content || ''));
-  eleventyConfig.addFilter('stripExtension', string => parse(string).name);
-  eleventyConfig.addFilter('stripPrefix', content => content.replace(/^wa-/, ''));
-  eleventyConfig.addFilter('trimPipes', content => {
-    // Trims whitespace and pipes from the start and end of a string. Useful for CEM types, which can be pipe-delimited.
-    // With Prettier 3, this means a leading pipe will exist be present when the line wraps.
-    return typeof content === 'string' ? content.replace(/^(\s|\|)/g, '').replace(/(\s|\|)$/g, '') : content;
-  });
-  eleventyConfig.addFilter('keys', obj => Object.keys(obj));
-  eleventyConfig.addFilter('log', (firstArg, ...rest) => {
-    console.log(firstArg, ...rest);
-    return firstArg;
-  });
+
+  for (let name in filters) {
+    eleventyConfig.addFilter(name, filters[name]);
+  }
 
   eleventyConfig.addFilter('sort', (arr, key = 'data.title') => {
     key = key.split('.');
diff --git a/docs/_utils/filters.js b/docs/_utils/filters.js
new file mode 100644
index 000000000..2bec1ff86
--- /dev/null
+++ b/docs/_utils/filters.js
@@ -0,0 +1,24 @@
+import { parse } from 'path';
+
+export function stripExtension(string) {
+  return parse(string).name;
+}
+
+export function stripPrefix(content) {
+  return content.replace(/^wa-/, '');
+}
+
+// Trims whitespace and pipes from the start and end of a string. Useful for CEM types, which can be pipe-delimited.
+// With Prettier 3, this means a leading pipe will exist be present when the line wraps.
+export function trimPipes(content) {
+  return typeof content === 'string' ? content.replace(/^(\s|\|)/g, '').replace(/(\s|\|)$/g, '') : content;
+}
+
+export function keys(obj) {
+  return Object.keys(obj);
+}
+
+export function log(firstArg, ...rest) {
+  console.log(firstArg, ...rest);
+  return firstArg;
+}