//  File:    score-band.tsx
//  Path:    packages/ui/src/score-band.tsx
//  Project: AI Risk Index — airiskindex.io
//  Author:  Simon-Pierre Boucher
//  Contact: contact@spboucher.ai
//  Copyright © 2026 Simon-Pierre Boucher. All rights reserved.
//
//  Description: Shared score-band pill component (score with confidence interval).

export interface ScoreBandProps {
  label: string;
  low: number;
  score: number;
  high: number;
}

/**
 * Displays a 0–100 score with its confidence interval. The UI must always be
 * able to display uncertainty (CLAUDE.md §1) — never render `score` without
 * offering the band.
 */
export function ScoreBandPill({ label, low, score, high }: ScoreBandProps): JSX.Element {
  return (
    <span className="inline-flex items-baseline gap-2 rounded-full border border-slate-300 px-3 py-1 text-sm">
      <span className="font-medium text-slate-700">{label}</span>
      <span className="text-lg font-semibold tabular-nums">{score.toFixed(0)}</span>
      <span className="text-xs text-slate-500 tabular-nums">
        {low.toFixed(0)}–{high.toFixed(0)}
      </span>
    </span>
  );
}
