mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
- 3d-carousel-demo: Added 3 carousel items with gradient content - 3d-grid-demo: Added 6 grid items with colors, spans, and elevation - 3d-marquee-demo: Added scrolling text content with icons - 3d-text-demo: Added 3D text with metallic variant - animated-number-demo: Added revenue counter with ,456 - animated-testimonials-demo: Added 3 testimonials with authors - animated-list-demo: Added 3 notification items - ai-models-demo: Added GPT-4, Claude, Gemini models - ai-actions-demo: Added 4 AI action buttons - advanced-navigation-bar-demo: Added nav items with dropdowns All demos now have required props, resolving 10 TypeScript errors.
37 lines
983 B
TypeScript
37 lines
983 B
TypeScript
import { Carousel3D } from "@/registry/default/ui/3d-carousel"
|
|
|
|
const demoItems = [
|
|
{
|
|
id: "1",
|
|
content: (
|
|
<div className="flex h-full items-center justify-center bg-gradient-to-br from-blue-500 to-blue-600 text-white">
|
|
<span className="text-2xl font-bold">Item 1</span>
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
id: "2",
|
|
content: (
|
|
<div className="flex h-full items-center justify-center bg-gradient-to-br from-purple-500 to-purple-600 text-white">
|
|
<span className="text-2xl font-bold">Item 2</span>
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
id: "3",
|
|
content: (
|
|
<div className="flex h-full items-center justify-center bg-gradient-to-br from-pink-500 to-pink-600 text-white">
|
|
<span className="text-2xl font-bold">Item 3</span>
|
|
</div>
|
|
),
|
|
},
|
|
]
|
|
|
|
export default function ThreeDCarouselDemo() {
|
|
return (
|
|
<div className="flex min-h-[400px] items-center justify-center p-8">
|
|
<Carousel3D items={demoItems} />
|
|
</div>
|
|
)
|
|
}
|