import type { UiStatusItem } from "../types";
import { FooterCell } from "./FooterCell";

export interface StatusStripProps {
  id?: string;
  items: UiStatusItem[];
  compact?: boolean;
}

export function StatusStrip({ id, items, compact = false }: StatusStripProps) {
  return (
    <section className="status-strip" data-compact={compact} data-model-id={id}>
      {items.map((item) => (
        <FooterCell key={item.id} item={item} />
      ))}
    </section>
  );
}