{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "extends": "none",
  "name": "carousel-autoplay-example",
  "title": "Carousel Autoplay",
  "description": "carousel-autoplay-example",
  "dependencies": [
    "embla-carousel-autoplay"
  ],
  "registryDependencies": [
    "https://intentui.com/r/card",
    "https://intentui.com/r/carousel"
  ],
  "files": [
    {
      "path": "src/components/examples/media/carousel/carousel-autoplay-example.tsx",
      "content": "'use client'\n\nimport Autoplay from 'embla-carousel-autoplay'\nimport { useRef } from 'react'\nimport { Card, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'\nimport {\n  Carousel,\n  CarouselButton,\n  CarouselContent,\n  CarouselHandler,\n  CarouselItem,\n} from '@/components/ui/carousel'\n\nexport default function CarouselAutoplayDemo() {\n  const plugin = useRef(Autoplay({ delay: 1000, stopOnInteraction: true }))\n\n  return (\n    <Carousel\n      onMouseEnter={plugin.current.stop}\n      onMouseLeave={plugin.current.reset}\n      plugins={[plugin.current as any]}\n      opts={{\n        loop: true,\n        align: 'center',\n      }}\n      className=\"w-full max-w-xs\"\n    >\n      <CarouselContent>\n        {items.map((item) => (\n          <CarouselItem key={item.id}>\n            <div className=\"p-1\">\n              <Card>\n                <CardHeader>\n                  <CardTitle className=\"line-clamp-1 sm:text-lg\">{item.title}</CardTitle>\n                  <CardDescription className=\"line-clamp-2\">{item.description}</CardDescription>\n                </CardHeader>\n              </Card>\n            </div>\n          </CarouselItem>\n        ))}\n      </CarouselContent>\n\n      <CarouselHandler>\n        <CarouselButton segment=\"previous\" />\n        <CarouselButton segment=\"next\" />\n      </CarouselHandler>\n    </Carousel>\n  )\n}\n\nconst items = [\n  {\n    id: 1,\n    title: 'Vintage Leather Jacket',\n    description: 'Classic brown leather jacket, perfect for a stylish retro look.',\n  },\n  {\n    id: 2,\n    title: 'Wireless Bluetooth Headphones',\n    description:\n      'Experience high-quality sound with these comfortable, noise-canceling headphones.',\n  },\n  {\n    id: 3,\n    title: 'Organic Cotton T-Shirt',\n    description: 'Soft and eco-friendly t-shirt made from 100% organic cotton.',\n  },\n  {\n    id: 4,\n    title: 'Stainless Steel Water Bottle',\n    description: 'Keep your drinks cold or hot with this durable, insulated water bottle.',\n  },\n  {\n    id: 5,\n    title: 'Running Shoes',\n    description: 'Lightweight and comfortable shoes designed for optimal performance.',\n  },\n  {\n    id: 6,\n    title: 'Smartwatch',\n    description: 'Stay connected and track your fitness with this sleek smartwatch.',\n  },\n  {\n    id: 7,\n    title: 'Portable Charger',\n    description: 'Never run out of battery with this high-capacity portable charger.',\n  },\n  {\n    id: 8,\n    title: 'Noise-Canceling Earbuds',\n    description: 'Compact and powerful earbuds that block out unwanted noise.',\n  },\n  {\n    id: 9,\n    title: 'Yoga Mat',\n    description: 'Non-slip, cushioned yoga mat for a comfortable workout experience.',\n  },\n  {\n    id: 10,\n    title: 'LED Desk Lamp',\n    description: 'Bright and energy-efficient LED lamp with adjustable brightness.',\n  },\n]\n",
      "type": "registry:page",
      "target": "app/carousel-autoplay-example/page.tsx"
    }
  ],
  "type": "registry:page"
}