{"name":"skeleton-v2","title":"Skeleton V2","type":"registry:ui","files":[{"path":"src/components/ui/skeleton-v2.tsx","type":"registry:ui","target":"@ui/skeleton-v2.tsx","content":"import * as React from \"react\";\nimport { cn } from \"./lib/utils\";\n\nexport interface SkeletonV2Props extends React.HTMLAttributes<HTMLDivElement> {\n  /** Shimmer sweep animation effect (default enabled) */\n  shimmer?: boolean;\n}\n\n/** Skeleton box v2: shimmer sweep + pulse animation. */\nexport function SkeletonV2({ className, shimmer = true, ...props }: SkeletonV2Props) {\n  return (\n    <div\n      aria-hidden=\"true\"\n      className={cn(\n        \"relative overflow-hidden rounded-md border border-dashed border-border bg-secondary/80 animate-pulse\",\n        className\n      )}\n      {...props}\n    >\n      {shimmer && (\n        <div\n          className={cn(\n            \"absolute inset-0 -translate-x-full\",\n            \"bg-[linear-gradient(90deg,transparent,var(--muted-foreground)_12%,transparent_24%)] opacity-[0.07]\",\n            \"animate-[skeletonV2Sweep_1.8s_ease-in-out_infinite]\",\n            \"motion-reduce:animate-none\"\n          )}\n        />\n      )}\n      <style>{`@keyframes skeletonV2Sweep { 100% { transform: translateX(100%); } }`}</style>\n    </div>\n  );\n}\n\n/** Monospace text skeleton: clamp lines with varying widths. */\nexport function SkeletonText({\n  lines = 3,\n  className,\n  ...props\n}: SkeletonV2Props & { lines?: number }) {\n  return (\n    <div className={cn(\"space-y-2\", className)} aria-hidden=\"true\" {...props}>\n      {Array.from({ length: lines }).map((_, i) => (\n        <SkeletonV2\n          key={i}\n          className={cn(\"h-3\", i === lines - 1 ? \"w-2/3\" : \"w-full\")}\n          style={{ animationDelay: `${i * 120}ms` }}\n        />\n      ))}\n    </div>\n  );\n}\n\n/** Card skeleton layout: image slot + title + text lines. */\nexport function SkeletonCard({ className, ...props }: SkeletonV2Props) {\n  return (\n    <div\n      aria-hidden=\"true\"\n      className={cn(\n        \"rounded-lg border border-border bg-card p-3 outline-1 outline-dashed outline-offset-[-6px]\",\n        className\n      )}\n      {...props}\n    >\n      <SkeletonV2 className=\"aspect-[16/9] w-full rounded-sm\" />\n      <div className=\"space-y-2 pt-3\">\n        <SkeletonV2 className=\"h-4 w-3/4\" />\n        <SkeletonText lines={2} />\n        <div className=\"flex gap-2 pt-1\">\n          <SkeletonV2 className=\"h-6 w-20 rounded-sm\" />\n          <SkeletonV2 className=\"h-6 w-14 rounded-sm\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n"}],"registryDependencies":["https://ui.bigbullapp.com/r/utils.json"]}