"use client"; import { Trophy } from "lucide-react"; import { cn } from "@/lib/utils"; type Tone = "primary" | "foreground" | "sunset" | "emerald" | "violet"; interface Progress14Props { level?: number; current?: number; next?: number; tone?: Tone; className?: string; } const tileClasses: Record = { primary: "bg-primary text-primary-foreground", foreground: "bg-foreground text-background", sunset: "bg-gradient-to-br from-amber-400 to-orange-500 text-white", emerald: "bg-gradient-to-br from-emerald-400 to-teal-500 text-white", violet: "bg-gradient-to-br from-violet-500 to-fuchsia-500 text-white", }; const barClasses: Record = { primary: "bg-primary", foreground: "bg-foreground", sunset: "bg-gradient-to-r from-amber-400 to-orange-500", emerald: "bg-gradient-to-r from-emerald-400 to-teal-500", violet: "bg-gradient-to-r from-violet-500 to-fuchsia-500", }; export const progress14Demo: Progress14Props = { level: 12, current: 1840, next: 2500, tone: "emerald", }; export function Progress14({ level = 1, current = 0, next = 100, tone = "emerald", className, }: Progress14Props) { const pct = next > 0 ? Math.max(0, Math.min(100, (current / next) * 100)) : 0; return (

Level{" "} {level} {current} / {next} XP

); }