frontend/components/prism/KPIStrip.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

import type { KpiItem } from "@/lib/overview";

export function KPIStrip({ items }: { items: KpiItem[] }) {
  return (
    <section className="psm-card psm-kpis" aria-label="Key metrics">
      {items.map((item) => (
        <div className="psm-kpi" key={item.key}>
          <span className="psm-kpi-key">{item.key}</span>
          <span className={`psm-kpi-value${item.missing ? " missing" : ""}`}>{item.value}</span>
          <span className="psm-kpi-sub">{item.sublabel}</span>
        </div>
      ))}
    </section>
  );
}