Add PageFind beta V2 (Full Text Search across Site)

.eslintrc.js

@@ -2,6 +2,7 @@
 /* eslint quotes: ["error", "double"] */
 
 module.exports = {
+  "ignorePatterns": ["docs/_site/**", "**/dist/**", "**/node_modules/**"],
   "env": {
     "node": true,
     "es6": true,

.stylelintrc.js

@@ -6,5 +6,16 @@ module.exports = {
     // MarkBind generates some blank CSS files when initialising a site,
     // which violates the no-empty-source rule
     "no-empty-source": null
-  }
+  },
+  "overrides": [
+    {
+      // pagefind uses BEM-style class names (e.g., .pagefind-ui__result) as default.
+      // Since we currently style pagefind's default UI classes, we need to ignore the kebab-case rule here. 
+      // This override should be removed once we no longer rely on pagefind's default CSS classes.
+      "files": ["**/pagefindSearchBar/**"],
+      "rules": {
+        "selector-class-pattern": null
+      }
+    }
+  ]
 };

docs/userGuide/makingTheSiteSearchable.md

@@ -37,6 +37,114 @@ You can add a search bar component to your website to allow users to search the
 <include src="syntax/keywords.md" />
 <include src="syntax/indexing.md" />
 
+
+
+
+
+## Using Pagefind (Beta)
+
+
+MarkBind now supports [Pagefind](https://pagefind.app/), a static low-bandwidth search library, as a built-in feature. This provides full-text search capabilities without external services.
+
+<box type="info">
+This is a <strong>beta</strong> feature and will be refined in future updates. To use it, you must have <code>enableSearch: true</code> in your <code>site.json</code> (this is the default).
+</box>
+
+<box type="warning">
+The Pagefind index is currently only generated during a full site build (e.g., <code>markbind build</code>). It will <strong>not</strong> repeatedly update during live reload (<code>markbind serve</code>) when you modify pages. You must restart the server (re-run <code>markbind serve</code>) or rebuild to refresh the search index.
+</box>
+
+To add the Pagefind search bar to your page, simply insert the following `div` where you want it to appear:
+
+```md
+<search />
+```
+
+MarkBind will automatically inject the necessary scripts and styles to render the search UI.
+
+The following UI will be rendered, which is provided by Pagefind:
+
+<search />
+
+<br>
+
+### Ignoring Individual Elements from Pagefind Search
+
+You can exclude specific elements from the search index by adding the `data-pagefind-ignore` attribute to them:
+
+```html
+<div>
+    <h1>This content will be in your search index.</h1>
+    <div data-pagefind-ignore>
+        This content and all its children will be excluded from search.
+    </div>
+</div>
+```
+
+For more details, see the [Pagefind documentation on removing individual elements](https://pagefind.app/docs/indexing/#removing-individual-elements-from-the-index).
+
+### Using Pagefind Configuration
+
+You can customize Pagefind's indexing behavior by adding a `pagefind` configuration in your `site.json`. This allows you to control which content is indexed and how search works.
+
+#### Excluding Content from Search Index
+
+You can use the `exclude_selectors` option to exclude specific elements from the search index. This is useful if you are migrating from Algolia and want to reuse your existing CSS class selectors.
+
+In your `site.json`:
+
+```json
+{
+  "pagefind": {
+    "exclude_selectors": [".algolia-no-index", "[class*='algolia-no-index']"]
+  }
+}
+```
+
+This tells Pagefind to exclude any element with the `algolia-no-index` class (or containing it in a space-separated list) from the search index, similar to using `data-pagefind-ignore`.
+
+#### Limiting Which Pages Are Searchable
+
+You can use the `glob` option to limit which pages are indexed by Pagefind. This is useful when you want search results to only show pages from specific sections of your site.
+
+In your `site.json`:
+
+```json
+{
+  "pagefind": {
+    "glob": [
+      "devGuide",
+      "userGuide/*"
+    ]
+  }
+}
+```
+
+MarkBind supports glob patterns and will automatically append `.html` to your patterns if not specified. For example:
+- `"devGuide"` becomes `"devGuide/**/*.html"`
+- `"devGuide/*"` becomes `"devGuide/*.html"`
+- `"**/devGuide/**"` becomes `"**/devGuide/**/*.html"`
+- `"*.html"` remains `"*.html"` (no change needed)
+
+Only pages matching these glob patterns will appear in search results. This can be particularly useful for:
+- Multi-site setups where you want to search only specific sections
+- Including only certain directories from search results
+
+For more details on glob patterns, see the [Pagefind documentation](https://pagefind.app/docs/config-options/#glob).
+
+<panel header="Potential Future Enhancements">
+
+Additional Pagefind configuration options may be supported in future releases:
+
+- **`root_selector`**: Allows specifying a custom root element for indexing (default: `html`). Useful for sites with specific content containers.
+- **`force_language`**: Forces a specific language for indexing (e.g., `"en"`, `"pt"`). Improves search accuracy for multilingual sites.
+
+</panel>
+
+
+
+<br>
+
 ## Using External Search Services
 
 MarkBind sites can use Algolia Doc Search services easily via the Algolia plugin. Unlike the built-in search, Algolia provides full-text search. See the panel below for more info.

packages/cli/test/functional/testUtil/compare.ts

@@ -13,6 +13,21 @@ const TEST_BLACKLIST = ignore().add([
   '*.log',
   '*.woff',
   '*.woff2',
+  '*.pf_fragment',
+  '*.pf_index',
+  '*.pf_meta',
+  '*.wasm.pagefind',
+  'wasm.unknown.pagefind',
+]);
+
+// File patterns to completely ignore (skip both content AND existence comparison)
+// These are files with non-deterministic content/hashes that differ across environments (e.g., PageFind)
+const TEST_BLACKLIST_EXISTENCE = ignore().add([
+  '*.pf_fragment',
+  '*.pf_index',
+  '*.pf_meta',
+  '*.wasm.pagefind',
+  'wasm.unknown.pagefind',
 ]);
 
 const CRLF_REGEX = /\r\n/g;
@@ -91,6 +106,11 @@ function compare(root: string, expectedSiteRelativePath = 'expected', siteRelati
   actualPaths = actualPaths.filter(p => !ignoredPaths.includes(p));
   expectedPaths = expectedPaths.filter(p => !ignoredPaths.includes(p));
 
+  // Filter out files with non-deterministic hashes (e.g., PageFind generated files)
+  // These files have content-dependent hashes that differ across environments
+  actualPaths = actualPaths.filter(p => !TEST_BLACKLIST_EXISTENCE.ignores(p));
+  expectedPaths = expectedPaths.filter(p => !TEST_BLACKLIST_EXISTENCE.ignores(p));
+
   let error = false;
   if (expectedPaths.length !== actualPaths.length) {
     throw new Error('Unequal number of files! '

packages/cli/test/functional/test_site/expected/bugs/index.html

@@ -16,6 +16,7 @@
   <link rel="stylesheet" href="/test_site/markbind/glyphicons/css/bootstrap-glyphicons.min.css">
   <link rel="stylesheet" href="/test_site/markbind/css/codeblock-dark.min.css">
   <link rel="stylesheet" href="/test_site/markbind/css/markbind.min.css">
+  <link rel="stylesheet" href="/test_site/markbind/pagefind/pagefind-ui.css">
   <link rel="stylesheet" href="/test_site/plugins/testMarkbindPlugin/testMarkbindPluginStylesheet.css">
   <link rel="stylesheet" href="/test_site/plugins/web3Form/web-3-form.css">
   <link rel="stylesheet" href="/test_site/plugins/markbind-plugin-anchors/markbind-plugin-anchors.css">
@@ -359,5 +360,6 @@ <h1 id="heading-in-footer-should-not-be-indexed">Heading in footer should not be
     });
 
   </script>
+<script src="/test_site/markbind/pagefind/pagefind-ui.js"></script>
 
 </html>

packages/cli/test/functional/test_site/expected/index.html

@@ -16,6 +16,7 @@
   <link rel="stylesheet" href="/test_site/markbind/glyphicons/css/bootstrap-glyphicons.min.css">
   <link rel="stylesheet" href="/test_site/markbind/css/codeblock-dark.min.css">
   <link rel="stylesheet" href="/test_site/markbind/css/markbind.min.css">
+  <link rel="stylesheet" href="/test_site/markbind/pagefind/pagefind-ui.css">
   <link rel="stylesheet" href="/test_site/plugins/testMarkbindPlugin/testMarkbindPluginStylesheet.css">
   <link rel="stylesheet" href="/test_site/plugins/web3Form/web-3-form.css">
   <link rel="stylesheet" href="/test_site/plugins/markbind-plugin-anchors/markbind-plugin-anchors.css">
@@ -1025,5 +1026,6 @@ <h1 id="heading-in-footer-should-not-be-indexed">Heading in footer should not be
     });
 
   </script>
+<script src="/test_site/markbind/pagefind/pagefind-ui.js"></script>
 
 </html>

packages/cli/test/functional/test_site/expected/markbind/pagefind/pagefind-entry.json

@@ -0,0 +1 @@
+{"version":"1.4.0","languages":{"unknown":{"hash":"unknown_ae5f7e4f4933776","wasm":null,"page_count":57}},"include_characters":["_","‿","⁀","⁔","︳","︴","﹍","﹎","﹏","＿"]}