23 lines
961 B
TypeScript
23 lines
961 B
TypeScript
export default function EnumBarChart({ counts }: { counts: Record<string, number> }) {
|
|
const entries = Object.entries(counts).sort(([, countA], [, countB]) => countB - countA);
|
|
const maxCount = Math.max(...entries.map(([, count]) => count), 1);
|
|
|
|
return (
|
|
<div className="space-y-1 mt-1">
|
|
{entries.map(([label, count]) => (
|
|
<div key={label} className="flex items-center gap-2 text-xs">
|
|
<span className="w-16 truncate text-warm-500 dark:text-warm-400 text-right shrink-0">
|
|
{label}
|
|
</span>
|
|
<div className="flex-1 h-3 bg-warm-100 dark:bg-navy-700 rounded overflow-hidden">
|
|
<div
|
|
className="h-full bg-teal-500 dark:bg-teal-400 rounded"
|
|
style={{ width: `${(count / maxCount) * 100}%` }}
|
|
/>
|
|
</div>
|
|
<span className="w-8 text-warm-500 dark:text-warm-400 text-right shrink-0">{count}</span>
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|