27 lines
793 B
TypeScript

import { cn } from "@/lib/utils"
import type { ReactNode } from "react"
interface SurrealBadgeProps {
children: ReactNode
variant?: "default" | "primary" | "secondary" | "outline"
className?: string
}
export function SurrealBadge({ children, variant = "default", className }: SurrealBadgeProps) {
return (
<span
className={cn(
"inline-flex items-center rounded-full px-3 py-1 text-xs font-medium transition-colors",
{
"bg-primary text-primary-foreground": variant === "default" || variant === "primary",
"bg-secondary text-secondary-foreground": variant === "secondary",
"border border-primary text-primary bg-transparent": variant === "outline",
},
className,
)}
>
{children}
</span>
)
}