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>
  )
}