29 lines
1.0 KiB
TypeScript
29 lines
1.0 KiB
TypeScript
import { cn } from "@/lib/utils";
|
|
|
|
const colorStyles: Record<string, { bg: string; shadow: string }> = {
|
|
green: { bg: "bg-green-500", shadow: "0 0 8px rgba(34, 197, 94, 0.5)" },
|
|
red: { bg: "bg-red-500", shadow: "0 0 8px rgba(239, 68, 68, 0.5)" },
|
|
amber: { bg: "bg-amber-500", shadow: "0 0 8px rgba(245, 158, 11, 0.5)" },
|
|
blue: { bg: "bg-blue-500", shadow: "0 0 8px rgba(59, 130, 246, 0.5)" },
|
|
purple: { bg: "bg-purple-500", shadow: "0 0 8px rgba(139, 92, 246, 0.5)" },
|
|
};
|
|
|
|
interface StatusBadgeProps {
|
|
color: "green" | "red" | "amber" | "blue" | "purple";
|
|
label?: string;
|
|
}
|
|
|
|
export function StatusBadge({ color, label }: StatusBadgeProps) {
|
|
const style = colorStyles[color] ?? { bg: "bg-gray-500", shadow: "none" };
|
|
|
|
return (
|
|
<span className="inline-flex items-center gap-1.5 text-xs">
|
|
<span
|
|
className={cn("w-2 h-2 rounded-full shrink-0", style.bg)}
|
|
style={{ boxShadow: style.shadow }}
|
|
/>
|
|
{label && <span className="text-muted-foreground">{label}</span>}
|
|
</span>
|
|
);
|
|
}
|