Logprob viewPro
A reply with every token shaded by its probability, and the alternatives the model nearly chose on hover or focus.
On this page
ProSure of the policy, unsure of the date and the amount: the alternatives it nearly chose.
Installation
Usage
import { LogprobView } from "@/components/ui/chatcn/pro/logprob-view"
<LogprobView tokens={response.logprobs} />Pass tokens as { token, logprob, top? }, the shape providers return when log probabilities are requested. Likely tokens stay bare; four amber steps mark doubt, and tokens under threshold are also underlined so the shading never carries the meaning alone.
The summary gives the mean probability, perplexity and how many tokens fell under the threshold. While status is streaming, tokens append with the caret and the averages wait for the end.
Examples
Streaming
ProTokens arrive with their probabilities; the summary fills in when the reply is done.
States
ProA stricter threshold without the summary, waiting and no log probabilities.
Props
| Prop | Type | Notes |
|---|---|---|
tokens | LogprobToken[] | { token, logprob, top?: { token, logprob }[] } |
status | "streaming" | "done" | Default done |
threshold | number | Underline and count below this. Default 0.5 |
hideSummary | boolean | Hide the summary and legend |
defaultActiveIndex | number | Open the card on one token first |
maxHeight | number | string | Default 360 |
Keyboard
| Key | Action |
|---|---|
Tab | Focus the reply |
Arrow left, Arrow right | Previous or next token, with its alternatives |
Home, End | First or last token |
Esc | Close the card |
Accessibility
- Each token is named with its probability: "14, 38%". Moving with the keys announces the alternatives once per move; hovering does not, so the live region never floods.
Motion
The card appears without animation: it follows the pointer from token to token, dozens of times a minute.