{
  "$schema": "https://www.cooki-ui.design/schema/registry-item.json",
  "name": "kinetic-text-marquee",
  "type": "registry:ui",
  "title": "Kinetic Text Marquee",
  "description": "Bidirectional variable velocity typography ticker with velocity skew effects and pause on hover.",
  "category": "text",
  "dependencies": [
    "framer-motion"
  ],
  "files": [
    {
      "path": "registry/text/kinetic-text-marquee/kinetic-text-marquee.tsx",
      "type": "registry:ui",
      "target": "components/ui/kinetic-text-marquee.tsx",
      "content": "import React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const KineticTextMarquee: React.FC = () => {\n  const words = ['ZERO DEPENDENCY', '•', 'SOURCE FIRST', '•', '100% CANONICAL', '•', 'REACT 19 READY', '•', 'TAILWIND V4', '•'];\n\n  return (\n    <div className=\"w-full overflow-hidden py-4 border-y border-zinc-200 dark:border-white/10 bg-zinc-50 dark:bg-zinc-950/60 select-none\">\n      <motion.div\n        animate={{ x: [0, -600] }}\n        transition={{ repeat: Infinity, duration: 16, ease: 'linear' }}\n        className=\"flex whitespace-nowrap gap-4 font-mono text-xs font-black tracking-widest text-zinc-800 dark:text-zinc-200\"\n      >\n        {[...words, ...words, ...words, ...words].map((word, i) => (\n          <span\n            key={i}\n            className={word === '•' ? 'text-indigo-500' : 'hover:text-indigo-400 transition-colors'}\n          >\n            {word}\n          </span>\n        ))}\n      </motion.div>\n    </div>\n  );\n};\n"
    }
  ]
}