<!-- GENERATED by scripts/build-llms.mjs from llms/retrieval.md — do not edit this file. -->

# `lr-retrieval-compare`

- **Import** `import '@aceshooting/lyra-ui/components/lr-retrieval-compare.js';` (stable tag alias; registers the tag)
- **Class** `LyraRetrievalCompare`, also available unregistered from `@aceshooting/lyra-ui/components/retrieval/retrieval-compare/retrieval-compare.class.js`
- **Family** `components/retrieval/` — see `llms/index.md` for its siblings
- **Status** `stable` since `7.0.0` — see the maturity and deprecation policy in `llms/shared.md`
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [llms-full.txt](../../llms-full.txt)
- **Deprecations** none
- **Optional peers** none
- **Themeable via** 14 parts, 1 custom property — see this component's own `@csspart`/`@cssprop` list below
- **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`

---

## `lr-retrieval-compare`

Side-by-side retrieval/reranking workbench showing effective rank, top-k Jaccard overlap, and
dense/sparse/rerank/final score breakdowns.

**Properties:** `sets: RetrievalComparisonSet[] = []` (attribute: false), where
`RetrievalComparisonSet = { id: string; label: string; chunks: RetrievalChunk[] }`;
`topK: number = 10` (attribute `top-k`, finite integer with minimum 1);
`selectedChunkId: string = ''` (attribute `selected-chunk-id`); `label?: string` (fallback name
for the overall comparison region; a non-empty host `aria-label` makes the host the sole overall
owner, while an explicitly empty host label stays empty on the region).
`RetrievalChunk` is the shared AI record carrying id/text/score/source plus optional rank, locator,
trace metadata, and `scores?: { dense?, sparse?, rerank?, final }`.

Set ids and each set's nested chunk ids are canonicalized independently. Malformed/blank rows and
later duplicates are omitted first-wins before empty state, overlap/count calculations, ranking,
controlled selection, rendering, or events.

**Events:** `lr-chunk-select` (`{ setId, chunk }`).

**CSS parts:** `base`, `overlap`, `sets`, `set`, `set-heading`, `chunks`, `chunk`,
`chunk-selected`, `chunk-rank`, `chunk-title`, `chunk-text`, `scores`, `score`, `empty`.

Chunks are ordered by effective rank, then score, then input order before the top-k slice. Overlap
is pairwise Jaccard similarity across those visible chunk ids. Selection is controlled.
**Slots:** none. **Optional peer deps:** none.

**Themeable custom properties:** `--lr-retrieval-compare-selected-border` (default
`var(--lr-color-brand)`) — the border color marking a selected `[part~="chunk-selected"]` row, the
same escape-hatch pattern as `lr-retrieval-results`'s `--lr-retrieval-results-selected-border`.

```ts
import "@aceshooting/lyra-ui/components/retrieval/retrieval-compare/retrieval-compare.js";
```