{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "testimonials-with-carousel",
  "type": "registry:block",
  "title": "Testimonials with Carousel",
  "description": "A testimonial carousel with staggered title animations and smooth transitions, showcasing customer feedback in an elegant layout.",
  "author": "Ahdeetai <https://aditya.is-cool.dev>",
  "registryDependencies": [
    "@scrollxui/avatar",
    "@scrollxui/button",
    "@scrollxui/card",
    "@scrollxui/testimonial-carousel"
  ],
  "dependencies": ["motion"],
  "files": [
    {
      "type": "registry:component",
      "path": "registry/blocks/testimonials/testimonials-with-carousel.tsx",
      "content": "'use client';\n\nimport { motion } from 'motion/react';\nimport TestimonialCarousel from '@/components/ui/testimonial-carousel';\n\nconst testimonials = [\n  {\n    name: 'Sarah Mitchell',\n    handle: 'Product Designer',\n    description:\n      'The attention to detail is incredible. Every interaction feels polished and intentional. My clients are always impressed with the final results.',\n    image: 'https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=80&q=80&auto=format',\n  },\n  {\n    name: 'Michael Torres',\n    handle: 'Lead Developer',\n    description:\n      'Implementation was seamless from start to finish. The code quality is exceptional and everything just works out of the box.',\n    image: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=80&q=80&auto=format',\n  },\n  {\n    name: 'Jessica Park',\n    handle: 'Design Systems Lead',\n    description:\n      \"The component architecture is brilliant. It's flexible enough for complex use cases yet simple enough for quick prototypes.\",\n    image: 'https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?w=80&q=80&auto=format',\n  },\n  {\n    name: 'Robert Kim',\n    handle: 'Senior Engineer',\n    description:\n      \"Finally, a library that doesn't sacrifice performance for aesthetics. Everything runs smoothly even on lower-end devices.\",\n    image: 'https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=80&q=80&auto=format',\n  },\n];\n\nexport default function TestimonialsCarousel() {\n  const title = 'Built for teams who ship fast';\n  const titleWords = title.split(' ');\n\n  return (\n    <section className='relative w-full min-h-screen bg-background flex flex-col items-center justify-center px-4'>\n      <div className='relative z-10 flex flex-col items-center gap-12 w-full max-w-6xl'>\n        <div className='flex flex-col items-center gap-4 text-center'>\n          <h2 className='text-5xl md:text-7xl font-bold text-foreground tracking-tight leading-tight'>\n            {titleWords.map((word, index) => (\n              <motion.span\n                key={`title-${word}-${index}`}\n                initial={{ opacity: 0, filter: 'blur(6px)', y: 12 }}\n                whileInView={{ opacity: 1, filter: 'blur(0px)', y: 0 }}\n                viewport={{ once: true }}\n                transition={{\n                  duration: 0.4,\n                  delay: index * 0.08,\n                  ease: 'easeInOut',\n                }}\n                className='mr-3 inline-block'\n              >\n                {word}\n              </motion.span>\n            ))}\n          </h2>\n          \n          <motion.p\n            initial={{ opacity: 0 }}\n            whileInView={{ opacity: 1 }}\n            viewport={{ once: true }}\n            transition={{ duration: 0.5, delay: 0.6 }}\n            className='text-base md:text-lg text-muted-foreground max-w-2xl'\n          >\n            Join thousands of professionals building better products\n            <br className='hidden sm:block' />\n            with components that just work.\n          </motion.p>\n        </div>\n\n        <motion.div\n          initial={{ opacity: 0, y: 20 }}\n          whileInView={{ opacity: 1, y: 0 }}\n          viewport={{ once: true }}\n          transition={{ duration: 0.6, delay: 0.75 }}\n          className='w-full'\n        >\n          <TestimonialCarousel data={testimonials} borderType=\"solid\" />\n        </motion.div>\n      </div>\n    </section>\n  );\n}"
    }
  ]
}
