{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "marquee-quotes",
  "type": "registry:component",
  "title": "Marquee quotes",
  "description": "Two rows of testimonial quotes scrolling in opposite directions as looping React marquees. Pass quote and name pairs; motion stops for reduced motion.",
  "dependencies": [
    "motion"
  ],
  "registryDependencies": [
    "utils"
  ],
  "files": [
    {
      "path": "registry/premium/marquee-quotes.tsx",
      "type": "registry:ui",
      "target": "components/ui/marquee-quotes.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { motion, useReducedMotion } from \"motion/react\"\nimport { cn } from \"@/lib/utils\"\n\ntype Q = { quote: string; name: string }\n\nfunction Row({ items, reverse }: { items: Q[]; reverse?: boolean }) {\n  const reduce = useReducedMotion()\n  const doubled = [...items, ...items]\n  return (\n    <div className=\"overflow-hidden\">\n      <motion.div\n        className=\"flex w-max gap-4\"\n        animate={reduce ? undefined : { x: reverse ? [\"-50%\", \"0%\"] : [\"0%\", \"-50%\"] }}\n        transition={reduce ? undefined : { duration: 32, repeat: Infinity, ease: \"linear\" }}\n      >\n        {doubled.map((q, i) => (\n          <figure\n            key={`${q.name}-${i}`}\n            className=\"w-72 shrink-0 rounded-xl border border-border bg-surface p-4 shadow-highlight\"\n          >\n            <blockquote className=\"text-sm leading-[1.55] text-fg\">“{q.quote}”</blockquote>\n            <figcaption className=\"mt-3 text-xs text-fg-muted\">{q.name}</figcaption>\n          </figure>\n        ))}\n      </motion.div>\n    </div>\n  )\n}\n\nfunction MarqueeQuotes({\n  items = [\n    { quote: \"Finally motion that matches the product kit.\", name: \"Jordan Lee\" },\n    { quote: \"Calm, fast, and it never gets in the way.\", name: \"Sam Ortiz\" },\n    { quote: \"We shipped the launch page in one afternoon.\", name: \"Riley Ng\" },\n    { quote: \"Every screen looks like someone cared.\", name: \"Ava Chen\" },\n  ],\n  className,\n}: {\n  items?: Q[]\n  className?: string\n}) {\n  return (\n    <div data-slot=\"marquee-quotes\" data-tier=\"premium\" className={cn(\"space-y-4\", className)}>\n      <Row items={items} />\n      <Row items={[...items].reverse()} reverse />\n    </div>\n  )\n}\nexport { MarqueeQuotes }\n"
    }
  ]
}
