{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "animated-radio-shadcnui",
  "type": "registry:component",
  "title": "Animated Radio",
  "description": "Radio button group with selection ripple",
  "registryDependencies": [
    "button"
  ],
  "dependencies": [
    "framer-motion",
    "react"
  ],
  "files": [
    {
      "path": "@uitripled/react-shadcn/src/components/forms/animated-radio.tsx",
      "content": "\"use client\";\n\nimport { motion } from \"framer-motion\";\nimport { useState } from \"react\";\n\nconst options = [\"Daily\", \"Weekly\", \"Monthly\", \"Never\"];\n\nexport function AnimatedRadio() {\n  const [selected, setSelected] = useState(\"Weekly\");\n\n  return (\n    <div className=\"space-y-3\">\n      <p className=\"text-sm font-medium\">Email frequency</p>\n      {options.map((option) => (\n        <label key={option} className=\"flex cursor-pointer items-center gap-3\">\n          <motion.div\n            className=\"relative flex h-6 w-6 items-center justify-center rounded-full border-2\"\n            style={{\n              borderColor:\n                selected === option\n                  ? \"rgb(var(--accent))\"\n                  : \"rgb(var(--border))\",\n            }}\n            whileHover={{ scale: 1.1 }}\n            whileTap={{ scale: 0.95 }}\n            onClick={() => setSelected(option)}\n          >\n            <motion.div\n              initial={false}\n              animate={{\n                scale: selected === option ? 1 : 0,\n              }}\n              transition={{ type: \"spring\", stiffness: 500, damping: 30 }}\n              className=\"h-3 w-3 rounded-full\"\n              style={{ backgroundColor: \"rgb(var(--accent))\" }}\n            />\n          </motion.div>\n          <span className=\"text-sm\">{option}</span>\n        </label>\n      ))}\n    </div>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/uitripled/animated-radio-shadcnui.tsx"
    }
  ]
}