{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "logo-wall-motion",
  "type": "registry:component",
  "title": "Logo wall motion",
  "description": "A logo wall that scrolls brand names in an endless marquee loop. Pass your own logos array; the motion stops for users who prefer reduced motion.",
  "dependencies": [
    "motion"
  ],
  "registryDependencies": [
    "utils"
  ],
  "files": [
    {
      "path": "registry/premium/logo-wall-motion.tsx",
      "type": "registry:ui",
      "target": "components/ui/logo-wall-motion.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { motion, useReducedMotion } from \"motion/react\"\nimport { cn } from \"@/lib/utils\"\n\nfunction LogoWallMotion({\n  logos = [\"Acme\", \"Globex\", \"Initech\", \"Umbrella\", \"Stark\", \"Wayne\"],\n  className,\n}: {\n  logos?: string[]\n  className?: string\n}) {\n  const reduce = useReducedMotion()\n  const row = [...logos, ...logos]\n  return (\n    <div data-slot=\"logo-wall-motion\" data-tier=\"premium\" className={cn(\"w-full max-w-full space-y-3 overflow-hidden\", className)}>\n      <p className=\"text-center text-xs font-medium tracking-[0.01em] text-fg-muted uppercase\">Trusted by product teams</p>\n      <div className=\"relative w-full min-w-0 max-w-full overflow-hidden rounded-2xl border border-border bg-sunken py-6\">\n        <div className=\"pointer-events-none absolute inset-y-0 left-0 z-10 w-16 bg-[linear-gradient(90deg,var(--color-sunken),transparent)]\" aria-hidden />\n        <div className=\"pointer-events-none absolute inset-y-0 right-0 z-10 w-16 bg-[linear-gradient(270deg,var(--color-sunken),transparent)]\" aria-hidden />\n        <motion.div\n          className=\"flex w-max gap-3 px-4\"\n          animate={reduce ? undefined : { x: [\"0%\", \"-50%\"] }}\n          transition={reduce ? undefined : { duration: 28, repeat: Infinity, ease: \"linear\" }}\n        >\n          {row.map((logo, i) => (\n            <div\n              key={`${logo}-${i}`}\n              className=\"inline-flex h-11 min-w-28 items-center justify-center rounded-xl border border-border bg-surface px-4 text-sm font-medium text-fg shadow-highlight\"\n            >\n              {logo}\n            </div>\n          ))}\n        </motion.div>\n      </div>\n    </div>\n  )\n}\nexport { LogoWallMotion }\n"
    }
  ]
}