or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

cli-interface.mdconfiguration.mdcore-application.mddependencies-engine.mdexport-engine.mdfile-engine.mdhtml-engine.mdindex.mdsearch-engine.md
tile.json

search-engine.mddocs/

Search Engine

The Search Engine provides indexing and search functionality for documentation websites.

Capabilities

SearchEngine Class

Singleton class providing search indexing and JSON generation for client-side search.

/**
 * Search indexing engine for documentation websites
 * Uses singleton pattern - access via SearchEngine.getInstance() or default export
 */
class SearchEngine {
  // Public instance properties
  searchIndex: any;
  documentsStore: Object;
  indexSize: number;
  amountOfMemory: number;
  
  /**
   * Get singleton instance of SearchEngine
   * @returns SearchEngine instance
   */
  static getInstance(): SearchEngine;
  
  /**
   * Index a page for search functionality
   * @param page - Page data to index including content and metadata
   */
  indexPage(page: any): void;
  
  /**
   * Generate search index JSON file for client-side search
   * @param outputFolder - Directory to write the search index
   * @returns Promise resolving when search index is generated
   */
  generateSearchIndexJson(outputFolder: string): Promise<any>;
}

Usage Examples:

import SearchEngine from "@compodoc/compodoc";
// or
// import { SearchEngine } from "@compodoc/compodoc";
// const engine = SearchEngine.getInstance();

// Using the default export (already an instance)
const pageData = {
  infos: {
    name: "AppComponent",
    id: "app-component",
    context: "component"
  },
  rawData: "<h1>AppComponent</h1><p>Main application component</p>",
  url: "/components/AppComponent.html"
};

SearchEngine.indexPage(pageData);

// Generate search index after indexing all pages
await SearchEngine.generateSearchIndexJson("./documentation");

Search Page Data Structure

Structure for page data that gets indexed for search.

interface SearchPageData {
  /**
   * Page metadata and information
   */
  infos: {
    name: string;
    id: string;
    context: string;
    depth?: number;
    pageType?: string;
  };
  
  /**
   * Raw HTML content of the page
   */
  rawData: string;
  
  /**
   * URL path to the page
   */
  url: string;
}

Search Index Structure

Structure of the generated search index JSON file.

interface SearchIndex {
  /**
   * Lunr.js search index data
   */
  index: any;
  
  /**
   * Store of searchable documents
   */
  store: SearchDocument[];
}

interface SearchDocument {
  /**
   * Unique document identifier
   */
  id: string;
  
  /**
   * Document title/name
   */
  title: string;
  
  /**
   * Document content for search
   */
  body: string;
  
  /**
   * Document URL for navigation
   */
  url: string;
  
  /**
   * Document type/context
   */
  type: string;
}

Search Integration

Methods for integrating search functionality into documentation websites.

/**
 * Search functionality configuration
 */
interface SearchConfiguration {
  /**
   * Enable/disable search functionality
   * @default false when Configuration.mainData.disableSearch is true
   */
  enabled: boolean;
  
  /**
   * Maximum number of search results to display
   * @default 15
   */
  maxResults: number;
  
  /**
   * Search index file path
   * @default "js/search/search_index.json" 
   */
  indexPath: string;
}

Usage Examples:

// Configure search in main configuration
const config = Configuration.getInstance();
config.mainData.disableSearch = false;
config.mainData.maxSearchResults = 25;

// Index multiple pages
const pages = [
  { infos: { name: "Overview", id: "overview", context: "page" }, rawData: "...", url: "/index.html" },
  { infos: { name: "AppModule", id: "app-module", context: "module" }, rawData: "...", url: "/modules/AppModule.html" },
  { infos: { name: "AppComponent", id: "app-component", context: "component" }, rawData: "...", url: "/components/AppComponent.html" }
];

pages.forEach(page => SearchEngine.indexPage(page));

// Generate final search index
await SearchEngine.generateSearchIndexJson("./documentation");

Client-Side Search Integration

JavaScript code structure for client-side search functionality.

// Client-side search implementation structure
class DocumentationSearch {
  constructor(indexPath, maxResults) {
    this.indexPath = indexPath;
    this.maxResults = maxResults;
    this.index = null;
    this.store = null;
  }
  
  async initialize() {
    // Load search index
    const response = await fetch(this.indexPath);
    const data = await response.json();
    
    this.index = lunr.Index.load(data.index);
    this.store = data.store;
  }
  
  search(query) {
    if (!this.index) return [];
    
    const results = this.index.search(query);
    return results
      .slice(0, this.maxResults)
      .map(result => {
        const doc = this.store.find(d => d.id === result.ref);
        return {
          ...doc,
          score: result.score
        };
      });
  }
}

Lunr.js Integration

Configuration for the Lunr.js search library used by Compodoc.

interface LunrConfiguration {
  /**
   * Fields to index for search
   */
  fields: {
    title: { boost: number };    // Title field with boosting
    body: { boost: number };     // Body content field
    type: { boost: number };     // Document type field
  };
  
  /**
   * Reference field for document lookup
   */
  ref: "id";
  
  /**
   * Pipeline functions for text processing
   */
  pipeline: string[];
  
  /**
   * Search field configuration
   */
  searchPipeline: string[];
}

Usage Examples:

// Custom search configuration example
const searchConfig: LunrConfiguration = {
  fields: {
    title: { boost: 10 },    // Higher boost for titles
    body: { boost: 1 },      // Normal boost for content
    type: { boost: 5 }       // Medium boost for types
  },
  ref: "id",
  pipeline: ["stemmer", "stopWordFilter"],
  searchPipeline: ["stemmer"]
};