"use client"; import { CheckCircle2, ListChecks, Loader2 } from "lucide-react"; import { cn } from "@/lib/utils"; type Tone = | "primary" | "foreground" | "sky" | "emerald" | "violet" | "amber"; interface Upload19Props { total?: number; uploading?: number; done?: number; overallPercent?: number; speed?: string; tone?: Tone; className?: string; } const tileClasses: Record = { primary: "bg-primary/15 text-primary", foreground: "bg-foreground/15 text-foreground", sky: "bg-sky-500/15 text-sky-500", emerald: "bg-emerald-500/15 text-emerald-500", violet: "bg-violet-500/15 text-violet-500", amber: "bg-amber-500/15 text-amber-500", }; const barClasses: Record = { primary: "bg-primary", foreground: "bg-foreground", sky: "bg-sky-500", emerald: "bg-emerald-500", violet: "bg-violet-500", amber: "bg-amber-500", }; const spinnerClasses: Record = { primary: "text-primary", foreground: "text-foreground", sky: "text-sky-600 dark:text-sky-400", emerald: "text-emerald-600 dark:text-emerald-400", violet: "text-violet-600 dark:text-violet-400", amber: "text-amber-600 dark:text-amber-400", }; export const upload19Demo: Upload19Props = { total: 24, uploading: 3, done: 18, overallPercent: 74, speed: "9.2 MB/s overall", tone: "sky", }; export function Upload19({ total = 0, uploading = 0, done = 0, overallPercent = 0, speed, tone = "sky", className, }: Upload19Props) { const pct = Math.max(0, Math.min(100, overallPercent)); const queued = Math.max(0, total - done - uploading); return (

Uploading {total} files {speed && ( {speed} )}

{pct}%

); }