spb/satelliteindex

1/** Pulse skeletons used as Suspense fallbacks (the route itself is not wrapped in loading.tsx so 308/404 status codes stay real). */2export function Bone({ className }: { className: string }) {3  return <div className={`animate-pulse rounded bg-plane-2 ${className}`} aria-hidden />;4}56export function SectionSkeleton({ rows = 8, chart = false, title }: { rows?: number; chart?: boolean; title?: string }) {7  return (8    <div className="py-6 md:py-8" role="status" aria-label={title ?? 'Loading section'}>9      <div className="mb-4 border-b border-rule pb-3">10        <Bone className="h-3 w-16" />11        <Bone className="mt-2 h-6 w-48" />12      </div>13      {chart && <Bone className="mb-6 h-44 w-full" />}14      <div className="space-y-3">15        {Array.from({ length: rows }).map((_, i) => (16          <Bone key={i} className="h-4 w-full" />17        ))}18      </div>19    </div>20  );21}2223export function TableSkeleton({ rows = 12 }: { rows?: number }) {24  return (25    <div className="space-y-2" role="status" aria-label="Loading table">26      <Bone className="h-8 w-full" />27      {Array.from({ length: rows }).map((_, i) => (28        <Bone key={i} className="h-10 w-full" />29      ))}30    </div>31  );32}33