KQ-806 · GOLD/COMPARE

Gold Compare

An answer beside its gold reference, diffed word by word with a longest common subsequence: words the reference lacks take a warn wash and underline in the answer, words the answer missed take a cobalt wash in the reference, so the two panes read as one edit. A similarity ring fills to the Dice similarity on glide while the percent rolls its digits on snap, and a Differences only switch collapses every shared run into a counting chip as each pane glides to its measured height. The switch is a real role="switch" that Space and Enter toggle.

KQ-806 · GOLD/COMPARE

Differences only

Answer

The Basin river reaches the added: coast at Coldbrook, added: about forty kilometres south of the added: old ferry crossing.

Reference

The Basin river reaches the missing: sea at Coldbrook, missing: roughly forty kilometres south of the ferry crossing.

Case 1 · diffing · full text

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/gold-compare

Props

answer: string; default —; The model's answer.
reference: string; default —; The gold reference it is compared against.
diffOnly / defaultDiffOnly: boolean; default false; Controlled or initial state of the Differences only switch.
onDiffOnlyChange: (diffOnly: boolean) => void; default —; Fires from the switch press.
onCompare: (result: GoldCompareResult) => void; default —; Fires once a new pair has been diffed: similarity as a whole percent and the words that differ across both panes.
answerLabel: string; default "Answer"; Caption of the answer pane.
referenceLabel: string; default "Reference"; Caption of the reference pane.
className: string; default —; Layout overrides on the frame.

Prop	Type	Default	Description
answer	string	—	The model's answer.
reference	string	—	The gold reference it is compared against.
diffOnly / defaultDiffOnly	boolean	false	Controlled or initial state of the Differences only switch.
onDiffOnlyChange	(diffOnly: boolean) => void	—	Fires from the switch press.
onCompare	(result: GoldCompareResult) => void	—	Fires once a new pair has been diffed: similarity as a whole percent and the words that differ across both panes.
answerLabel	string	"Answer"	Caption of the answer pane.
referenceLabel	string	"Reference"	Caption of the reference pane.
className	string	—	Layout overrides on the frame.