{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "logo-cloud",
  "title": "Logo Cloud",
  "description": "Customer logos muted until hovered, so they read as texture.",
  "registryDependencies": [
    "utils"
  ],
  "files": [
    {
      "path": "src/components/velora/logo-cloud.tsx",
      "content": "import { cn } from \"@/lib/utils\";\n\ninterface LogoCloudProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** One entry per logo — pass SVGs, `img` elements or plain wordmarks */\n  logos: { name: string; logo: React.ReactNode }[];\n  /** Show logos muted until hovered */\n  dimUntilHover?: boolean;\n}\n\n/**\n * Customer or integration logos on a responsive grid, muted until hovered so\n * they read as texture rather than competing with the headline. Exposed as a\n * list, with each logo announced by its `name`.\n */\nexport function LogoCloud({\n  logos,\n  dimUntilHover = true,\n  className,\n  ...props\n}: LogoCloudProps) {\n  return (\n    <div\n      role=\"list\"\n      {...props}\n      data-slot=\"logo-cloud\"\n      className={cn(\n        \"grid grid-cols-2 items-center gap-x-8 gap-y-10 sm:grid-cols-3 lg:grid-cols-5\",\n        className\n      )}\n    >\n      {logos.map(({ name, logo }) => (\n        <div\n          key={name}\n          role=\"listitem\"\n          className={cn(\n            \"flex h-8 items-center justify-center text-muted-foreground transition-all duration-300 motion-reduce:transition-none\",\n            dimUntilHover &&\n              \"opacity-60 grayscale hover:opacity-100 hover:grayscale-0 hover:text-foreground\"\n          )}\n        >\n          <span className=\"sr-only\">{name}</span>\n          {/* The name above replaces whatever label the logo node carries. */}\n          <span aria-hidden title={name} className=\"flex items-center\">\n            {logo}\n          </span>\n        </div>\n      ))}\n    </div>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/velora/logo-cloud.tsx"
    }
  ],
  "type": "registry:ui"
}