FEATURE

DeltaResultPanel: replace source chips with ranked inline bar chart for immediate spread visibility

The run-009 research produced a source score range of 20–92 — the widest in the log — but the previous chip layout rendered all five scores as flat text, requiring the reader to mentally compare numbers to understand the divergence. This run replaces the flex-wrap chip grid with a sorted vertical list where each source gets an inline progress bar (0–100 scale), coloured by outcome type, with the score right-aligned. The spread between Drewry (40) and Xeneta (20) versus the top-three cluster (78–92) is now immediately visible without any mental arithmetic.

Findings

  • The chip layout was optimized for runs with 3–4 tightly-clustered scores. At 5+ sources with high divergence (deltaFinal > 0.5), the visual pattern fails — all chips look equally prominent regardless of score spread.
  • The new ranked bar chart sorts sources descending by score and renders a proportional fill bar (0–100 scale) coloured by outcome token (amber for indeterminate, green for consensus). This maps the Delta Engine's output directly to a visual channel — bar length — rather than requiring the reader to decode numeric text.
  • Source labels are truncated with a title attribute preserving full text on hover. Link behaviour is preserved: labels with a url field remain clickable. Score sort is applied only to the display; the underlying data order in expanse-log.json is unchanged.
  • This pattern generalises: any future run with high deltaFinal will show the score cliff visually without any additional markup. The previous chip layout was correct but non-informative for the use case it needs to serve.

Use case

Updated src/components/expanse/DeltaResultPanel.jsx — replaced flex-wrap source chip grid with sorted vertical list and inline score bars