{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "screenshot",
  "type": "registry:ui",
  "title": "Screenshot",
  "description": "A theme-aware screenshot component that switches between light and dark images.",
  "files": [
    {
      "path": "components/ui/screenshot.tsx",
      "content": "import Image, { type ImageProps } from \"next/image\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface ScreenshotProps {\n  srcLight: string;\n  srcDark?: string;\n  alt: string;\n  width: number;\n  height: number;\n  loading?: ImageProps[\"loading\"];\n  className?: string;\n}\n\nexport default function Screenshot({\n  srcLight,\n  srcDark,\n  alt,\n  width,\n  height,\n  loading,\n  className,\n}: ScreenshotProps) {\n  if (!srcDark) {\n    return (\n      <Image\n        src={srcLight}\n        alt={alt}\n        width={width}\n        height={height}\n        loading={loading}\n        className={className}\n        unoptimized={srcLight.endsWith(\".svg\")}\n      />\n    );\n  }\n\n  return (\n    <>\n      <Image\n        src={srcLight}\n        alt={alt}\n        width={width}\n        height={height}\n        loading={loading}\n        className={cn(className, \"block dark:hidden\")}\n        unoptimized={srcLight.endsWith(\".svg\")}\n      />\n      <Image\n        src={srcDark}\n        alt={alt}\n        width={width}\n        height={height}\n        loading={loading}\n        className={cn(className, \"hidden dark:block\")}\n        unoptimized={srcDark.endsWith(\".svg\")}\n      />\n    </>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/ui/screenshot.tsx"
    }
  ],
  "dependencies": [
    "next-themes"
  ]
}