KQ-780 · CITATION/COUNT
Citation Count
How well-sourced an answer is, as a badge: a ring that fills in proportion to claims covered on glide, a citation count whose digits roll on snap, and a word. Both turn success when every claim is covered. Pressing the badge opens a panel beneath whose height is measured by a ResizeObserver and animated on glide, listing the claims that still lack a source; rows leave on the exit ease as they become covered, and Escape closes the panel and returns focus to the badge.
KQ-780 · CITATION/COUNT
3 citations, 2 of 5 claims covered
3 citations · 2 of 5 claims covered
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/citation-count
Props
- citations
- number
- default —
- How many citation marks the answer carries.
- claims
- CitationClaim[]
- default —
- Every claim the answer makes, and whether a source backs it.
- open / defaultOpen
- boolean
- default false
- The uncovered list is shown, controlled or initial.
- onOpenChange
- (open: boolean) => void
- default —
- Fires from the badge press or Escape.
- label
- string
- default "Citations"
- Names the badge for assistive technology.
| Prop | Type | Default | Description |
|---|---|---|---|
| citations | number | — | How many citation marks the answer carries. |
| claims | CitationClaim[] | — | Every claim the answer makes, and whether a source backs it. |
| open / defaultOpen | boolean | false | The uncovered list is shown, controlled or initial. |
| onOpenChange | (open: boolean) => void | — | Fires from the badge press or Escape. |
| label | string | "Citations" | Names the badge for assistive technology. |