1
import { Loader2 } from "lucide-react";
2
 
3
type Props = { label?: string; className?: string };
4
 
5
export function LoadingPanel({ label = "Loading…", className = "" }: Props) {
6
  return (
7
    <div
8
      role="status"
9
      aria-live="polite"
10
      aria-busy="true"
11
      className={`flex items-center justify-center gap-3 rounded-2xl border border-zinc-800/60 bg-zinc-900/40 px-6 py-10 text-sm text-zinc-400 ${className}`}
12
    >
13
      <Loader2 className="h-4 w-4 animate-spin text-accent-400" strokeWidth={2} aria-hidden="true" />
14
      {label}
15
    </div>
16
  );
17
}
18
 
19
export function Skeleton({ className = "" }: { className?: string }) {
20
  return (
21
    <div
22
      aria-hidden="true"
23
      className={`animate-shimmer rounded-lg bg-gradient-to-r from-zinc-800/0 via-zinc-700/40 to-zinc-800/0 [background-size:200%_100%] ${className}`}
24
    />
25
  );
26
}