15 lines
616 B
TypeScript
15 lines
616 B
TypeScript
|
export function StatusTag({ children, tone = "accent" }: { children: React.ReactNode; tone?: "accent" | "down" | "degraded" | "neutral" }) {
|
||
|
|
const toneClass = {
|
||
|
|
accent: "bg-accent/15 text-accent border-accent/40",
|
||
|
|
down: "bg-status-down/15 text-status-down border-status-down/40",
|
||
|
|
degraded: "bg-status-degraded/15 text-status-degraded border-status-degraded/40",
|
||
|
|
neutral: "bg-surface-raised text-fg-muted border-border",
|
||
|
|
}[tone];
|
||
|
|
|
||
|
|
return (
|
||
|
|
<span className={`inline-flex items-center rounded-md border px-2 py-0.5 text-[11px] tracking-wide ${toneClass}`}>
|
||
|
|
{children}
|
||
|
|
</span>
|
||
|
|
);
|
||
|
|
}
|