Draggable Card

import { motion } from 'motion/react'

export function DraggableCard({ children }) {
  return (
    <motion.div
      drag
      dragConstraints={{ left: -100, right: 100, top: -100, bottom: 100 }}
      dragElastic={0.1}
      whileDrag={{ scale: 1.1, cursor: 'grabbing' }}
      transition={{
        type: 'spring',
        stiffness: 300,
        damping: 20,
      }}
      className="cursor-grab rounded-xl bg-white p-6 shadow-lg"
    >
      {children}
    </motion.div>
  )
}