{

"name": "cog",

"type": "registry:ui",

"registryDependencies": [],

"dependencies": [

"motion"

],

"devDependencies": [],

"tailwind": {},

"cssVars": {

"light": {},

"dark": {}

},

"files": [

{

"path": "cog.tsx",

"content": "'use client';\n\nimport { motion, useAnimation } from 'motion/react';\n\nconst CogIcon = () => {\n const controls = useAnimation();\n\n return (\n <div\n className=\"cursor-pointer select-none p-2 hover:bg-accent rounded-md transition-colors duration-200 flex items-center justify-center\"\n onMouseEnter={() => controls.start('animate')}\n onMouseLeave={() => controls.start('normal')}\n >\n <motion.svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"28\"\n height=\"28\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n transition={{ type: 'spring', stiffness: 50, damping: 10 }}\n variants={{\n normal: {\n rotate: 0,\n },\n animate: {\n rotate: 180,\n },\n }}\n animate={controls}\n >\n <path d=\"M12 20a8 8 0 1 0 0-16 8 8 0 0 0 0 16Z\" />\n <path d=\"M12 14a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z\" />\n <path d=\"M12 2v2\" />\n <path d=\"M12 22v-2\" />\n <path d=\"m17 20.66-1-1.73\" />\n <path d=\"M11 10.27 7 3.34\" />\n <path d=\"m20.66 17-1.73-1\" />\n <path d=\"m3.34 7 1.73 1\" />\n <path d=\"M14 12h8\" />\n <path d=\"M2 12h2\" />\n <path d=\"m20.66 7-1.73 1\" />\n <path d=\"m3.34 17 1.73-1\" />\n <path d=\"m17 3.34-1 1.73\" />\n <path d=\"m11 13.73-4 6.93\" />\n </motion.svg>\n </div>\n );\n};\n\nexport { CogIcon };\n",

"type": "registry:ui"

}

]

}