ai-search-web-components

Web components for documentation search.

This package provides two components:

• wg-doc-search (classic: Fuse.js-based retrieval)
• wg-rag-search (recommended: Orama + Transformers.js retrieval)

Install

pnpm add ai-search-web-components

Recommended: wg-rag-search

Use this with vector-context.json generated by VectorDocIndexer.

<wg-rag-search
  context-path="./vector-context.json"
  placeholder="Ask docs..."
  top-k="3"
  max-results="10"
></wg-rag-search>

<script type="module">
  import 'ai-search-web-components/rag-search';
</script>

Props

• context-path: path to vector-context.json
• placeholder: input placeholder text
• top-k: number of chunks used for grounded answer (3 default)
• max-results: number of retrieval cards below answer (10 default)

Classic: wg-doc-search

Use this with context.json generated by WebsiteIndexer.

<wg-doc-search context-path="./context.json"></wg-doc-search>

<script type="module">
  import 'ai-search-web-components/doc-search';
</script>

Browser AI behavior

Both components can use Chrome Prompt API (LanguageModel) for answer generation.

• If Prompt API is available: grounded answer is generated in-browser
• If unavailable: retrieval still works; fallback answer UI is shown

Local Demo

From repo root:

pnpm --dir packages/web-components dev

Pages:

• http://127.0.0.1:5173/ -> classic wg-doc-search
• http://127.0.0.1:5173/rag.html -> wg-rag-search

Index Requirements

• wg-doc-search requires context.json
• wg-rag-search requires vector-context.json

Generate these with the ai-search-indexer package.

Tutorial

See full integration guide:

• packages/web-components/TUTORIAL.md

License

MIT