Shared utilities for displaying and categorizing AI confidence scores with consistent visual styling across the application. ## Key Components - **`getConfidenceColorClass()`** - Returns combined border and text color classes for confidence badges - **`getConfidenceLevel()`** - Categorizes confidence scores into 'high', 'medium', 'low', or 'none' levels - **`getConfidenceBorderClass()`** - Returns border color class for confidence indicators - **`getConfidenceTextClass()`** - Returns text color class for confidence displays - **`getConfidenceBgClass()`** - Returns subtle background color class for confidence elements - **`getConfidenceLabel()`** - Returns human-readable confidence level labels All functions follow a consistent confidence threshold system: - **High (≥80%)**: Green styling - **Medium (50-79%)**: Yellow styling - **Low (<50%)**: Red styling - **None/undefined**: Empty string or 'Unknown' ## Usage Example ```typescript import { getConfidenceColorClass, getConfidenceLevel, getConfidenceLabel } from './confidence-helpers'; // Display confidence badge with appropriate styling const confidence = 75; const badgeClasses = `px-2 py-1 rounded border ${getConfidenceColorClass(confidence)}`; const level = getConfidenceLevel(confidence); // 'medium' const label = getConfidenceLabel(confidence); // 'Medium' // Usage in JSX {label} ({confidence}%) // For background styling const bgClass = getConfidenceBgClass(90); // 'bg-green-500/10' ```