Very Popular
Latest
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278import { merge } from "../core/utils/object.ts";import { posix } from "../deps/path.ts";import { Page } from "../core/file.ts";import { pagefind } from "../deps/pagefind.ts";
import type { CustomRecord, TranslationsOptions } from "../deps/pagefind.ts";import type Site from "../core/site.ts";
export interface UIOptions { /** * The container id to insert the search * @default "search" */ containerId?: string;
/** * The number of search results to load at once, before a “Load more” button is shown. * @default 5 */ pageSize?: number;
/** * Include results from page subsections (based on headings with IDs). */ showSubResults?: boolean;
/** Whether to show an image alongside each search result. */ showImages?: boolean;
/** * The maximum number of characters to show in the excerpt. * `0` means no limit */ excerptLength?: number;
/** * A function that Pagefind UI calls before performing a search. * This can be used to normalize search terms to match your content. */ processTerm?: (term: string) => string;
/** * A function that Pagefind UI calls before displaying each result. * This can be used to fix relative URLs, rewrite titles, * or any other modifications you might like to make to the raw result object * returned by Pagefind */ processResult?: (result: unknown) => unknown;
/** * By default, Pagefind UI shows filters with no results alongside the count (0). * Pass false to hide filters that have no remaining results. */ showEmptyFilters?: boolean;
/** * The default behavior of the filter display is to show values only when there is one filter with six or fewer values. When you include a filter name in openFilters it will open by default, regardless of the number of filters or values present. */ openFilters?: string[];
/** * By default, Pagefind UI applies a CSS reset to itself. * Pass false to omit this and inherit from your site styles. */ resetStyles?: boolean;
/** * The number of milliseconds to wait after a user stops typing before performing a search. * If you wish to disable this, set to 0. * @default 300 */ debounceTimeoutMs?: number;
/** * A set of custom ui strings to use instead of the automatically detected language strings. * See https://github.com/CloudCannon/pagefind/blob/main/pagefind_ui/translations/en.json for all available keys and initial values. * The items in square brackets such as SEARCH_TERM will be substituted dynamically when the text is used. */ translations?: TranslationsOptions;
/** * Enabling autofocus automatically directs attention to the search input field for * enhanced user convenience, particularly beneficial when the UI is loaded within a modal dialog. * However, exercise caution, as using autofocus indiscriminately may pose potential * accessibility challenges. */ autofocus?: boolean;
/** * Passes sort options to Pagefind for ranking. * Note that using a sort will override all ranking by relevance. */ sort?: Record<string, "asc" | "desc">;
/** * Enable the ability to highlight search terms on the result pages. * Configure the query parameter name. */ highlightParam?: string;}
export interface Options { /** The path to the pagefind bundle directory */ outputPath?: string;
/** Options for the UI interface or false to disable it */ ui?: UIOptions | false;
/** Options for the indexing process */ indexing?: pagefind.PagefindServiceConfig;
/** Other custom records */ customRecords?: CustomRecord[];}
export const defaults: Options = { outputPath: "/pagefind", ui: { containerId: "search", showImages: false, excerptLength: 0, showEmptyFilters: true, showSubResults: false, resetStyles: true, }, indexing: { rootSelector: "html", verbose: false, excludeSelectors: [], },};
/** A plugin to generate a static full text search engine */export default function (userOptions?: Options) { const options = merge(defaults, userOptions);
return (site: Site) => { site.process([".html"], async (pages, allPages) => { const { index } = await pagefind.createIndex(options.indexing);
if (!index) { throw new Error("Pagefind index not created"); }
// Page indexing for (const page of pages) { const { errors } = await index.addHTMLFile({ url: page.data.url, content: page.content as string, });
if (errors.length > 0) { throw new Error( `Pagefind index errors for ${page.src.path}:\n${errors.join("\n")}`, ); } }
if (options.customRecords) { for (const record of options.customRecords) { const { errors } = await index.addCustomRecord(record);
if (errors.length > 0) { throw new Error( `Pagefind index errors for custom record:\n${errors.join("\n")}`, ); } } }
// Output indexing const { files } = await index.getFiles(); const textDecoder = new TextDecoder(); const textExtensions = [".js", ".css", ".json"];
for (const file of files) { const { path } = file; const content = textExtensions.includes(posix.extname(path)) ? textDecoder.decode(file.content) : file.content;
allPages.push( Page.create({ url: posix.join("/", options.outputPath, path), content, }), ); }
// Cleanup await index.deleteIndex(); await pagefind.close(); });
if (options.ui) { const { containerId, ...ui } = options.ui;
site.process([".html"], (pages) => { for (const page of pages) { const { document } = page; if (!document) { continue; } const container = document.getElementById(containerId!);
// Insert UI styles and scripts if (container) { const styles = document.createElement("link"); styles.setAttribute("rel", "stylesheet"); styles.setAttribute( "href", site.url( `${posix.join(options.outputPath, "pagefind-ui.css")}`, ), );
// Insert before other styles to allow overriding const first = document.head.querySelector( "link[rel=stylesheet],style", ); if (first) { document.head.insertBefore(styles, first); } else { document.head.append(styles); }
const script = document.createElement("script"); script.setAttribute("type", "text/javascript"); script.setAttribute( "src", site.url( `${posix.join(options.outputPath, "pagefind-ui.js")}`, ), ); document.head.append(script);
const uiSettings = { element: `#${containerId}`, ...ui, bundlePath: site.url(posix.join(options.outputPath, "/")), baseUrl: site.url("/"), processTerm: ui.processTerm ? ui.processTerm.toString() : undefined, processResult: ui.processResult ? ui.processResult.toString() : undefined, }; const init = document.createElement("script"); init.setAttribute("type", "text/javascript"); init.innerHTML = ``; document.head.append(init);
if (ui.highlightParam) { const highlightScript = document.createElement("script"); highlightScript.setAttribute("type", "module"); highlightScript.innerHTML = ``; document.head.append(highlightScript); } } } }); } };}