{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "animated-checkbox-shadcnui",
  "type": "registry:component",
  "title": "Animated Checkbox",
  "description": "Checkbox with checkmark animation",
  "registryDependencies": [
    "button"
  ],
  "dependencies": [
    "framer-motion",
    "react"
  ],
  "files": [
    {
      "path": "@uitripled/react-shadcn/src/components/forms/animated-checkbox.tsx",
      "content": "\"use client\";\n\nimport { motion } from \"framer-motion\";\nimport { Check } from \"lucide-react\";\nimport { useState } from \"react\";\n\nexport function AnimatedCheckbox() {\n  const [isChecked, setIsChecked] = useState(false);\n\n  return (\n    <div className=\"flex flex-col gap-4\">\n      {[\n        \"Subscribe to newsletter\",\n        \"Agree to terms and conditions\",\n        \"Enable notifications\",\n      ].map((label, index) => (\n        <label key={label} className=\"flex cursor-pointer items-center gap-3\">\n          <motion.div\n            className=\"relative flex h-6 w-6 items-center justify-center rounded border-2\"\n            style={{\n              borderColor:\n                index === 0 && isChecked\n                  ? \"rgb(var(--accent))\"\n                  : \"rgb(var(--border))\",\n              backgroundColor:\n                index === 0 && isChecked ? \"rgb(var(--accent))\" : \"transparent\",\n            }}\n            whileHover={{ scale: 1.1 }}\n            whileTap={{ scale: 0.95 }}\n            onClick={() => index === 0 && setIsChecked(!isChecked)}\n          >\n            <motion.div\n              initial={false}\n              animate={{\n                scale: index === 0 && isChecked ? 1 : 0,\n                opacity: index === 0 && isChecked ? 1 : 0,\n              }}\n              transition={{ type: \"spring\", stiffness: 500, damping: 30 }}\n            >\n              <Check\n                className=\"h-4 w-4 text-[var(--muted-foreground)]\"\n                strokeWidth={3}\n              />\n            </motion.div>\n          </motion.div>\n          <span className=\"text-sm\">{label}</span>\n        </label>\n      ))}\n    </div>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/uitripled/animated-checkbox-shadcnui.tsx"
    }
  ]
}