'use client'; import { useState } from 'react'; import { motion, AnimatePresence } from 'motion/react'; import { Star, Layers, Users, Zap } from 'lucide-react'; type CardItem = { id: string; title: string; description: string; icon: any; tag: string; }; const cards: CardItem[] = [ { id: '1', title: 'Discover', description: 'Explore ideas and inspiration tailored to you.', icon: Star, tag: 'New', }, { id: '2', title: 'Organize', description: 'Structure your work with clarity and ease.', icon: Layers, tag: 'Popular', }, { id: '3', title: 'Collaborate', description: 'Work with your team in real-time seamlessly.', icon: Users, tag: 'Team', }, { id: '4', title: 'Automate', description: 'Automate repetitive tasks and boost productivity effortlessly.', icon: Zap, tag: 'Pro', }, ]; export default function CardSwipe() { const [index, setIndex] = useState(0); const current = cards[index]; const Icon = current.icon; return (

{index + 1}/{cards.length}

{current.tag}

{current.title}

{current.description}

{cards.map((_, i) => (

); }

Card Swipe

Installation

Usage