{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "navbar-2-nova",
  "title": "Navbar 2Nova",
  "dependencies": [
    "framer-motion",
    "lucide-react"
  ],
  "files": [
    {
      "path": "src/registry/navbars/nova/Navbar2Nova.jsx",
      "content": "\"use client\";\n\nimport React, { useState } from \"react\";\nimport { motion, AnimatePresence } from \"framer-motion\";\nimport { Menu, X, ArrowRight } from \"lucide-react\";\n\nconst Navbar = () => {\n  const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);\n  const navItems = [\"Home\", \"Products\", \"Resources\", \"Pricing\"];\n\n  return (\n    <div className=\"flex justify-center items-center \">\n      <motion.nav\n        initial={{\n          height: \"60px\",\n          width: \"60px\",\n          top: -100,\n          borderRadius: \"50%\",\n          background: \"rgba(255, 255, 255, 1)\",\n          border: \"1px solid rgba(255,255,255,0)\",\n        }}\n        animate={{\n          height: isMobileMenuOpen ? \"auto\" : \"60px\",\n          width: \"90%\",\n          top: 20,\n          borderRadius: \"24px\",\n          background: \"rgba(255, 255, 255, 0.8)\",\n          backdropFilter: \"blur(10px)\",\n          border: \"1px solid rgba(255,255,255,0.5)\",\n          boxShadow:\n            \"0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)\",\n        }}\n        transition={{\n          type: \"spring\",\n          stiffness: 120,\n          damping: 15,\n          mass: 1,\n          delay: 0.2,\n        }}\n        className=\"absolute z-20 flex flex-col overflow-hidden text-black\"\n      >\n        <motion.div\n          initial={{ opacity: 0 }}\n          animate={{ opacity: 1 }}\n          transition={{ duration: 0.5, delay: 0.6 }}\n          className=\"flex items-center justify-between w-full px-5 h-[60px] flex-shrink-0\"\n        >\n          <div className=\"flex items-center gap-2 cursor-pointer\">\n            <div className=\"w-8 h-8 bg-black rounded-full flex items-center justify-center text-white font-bold text-xs\">\n              P\n            </div>\n            <span className=\"text-sm font-semibold text-neutral-800 tracking-tight\">\n              PixelFlow\n            </span>\n          </div>\n\n          <div className=\"hidden md:flex items-center gap-1\">\n            {navItems.map((item) => (\n              <a\n                key={item}\n                href=\"#\"\n                className=\"text-sm font-medium text-neutral-600 hover:text-black px-3 py-1.5 hover:bg-black/5 rounded-full transition-all duration-200\"\n              >\n                {item}\n              </a>\n            ))}\n          </div>\n\n          <div className=\"flex items-center gap-2\">\n            <button className=\"hidden md:flex items-center gap-1 bg-black text-white px-4 py-2 rounded-full text-xs font-medium hover:bg-neutral-800 transition-colors\">\n              Get Started <ArrowRight size={12} />\n            </button>\n\n            <button\n              onClick={() => setIsMobileMenuOpen((open) => !open)}\n              className=\"md:hidden p-2 rounded-full hover:bg-black/5 active:bg-black/10 transition-colors\"\n            >\n              {isMobileMenuOpen ? <X size={20} /> : <Menu size={20} />}\n            </button>\n          </div>\n        </motion.div>\n\n        <AnimatePresence>\n          {isMobileMenuOpen && (\n            <motion.div\n              initial={{ opacity: 0, height: 0 }}\n              animate={{ opacity: 1, height: \"auto\" }}\n              exit={{ opacity: 0, height: 0 }}\n              transition={{ duration: 0.3, ease: \"easeInOut\" }}\n              className=\"md:hidden px-4 pb-4 bg-white/50\"\n            >\n              <div className=\"flex flex-col space-y-2 pt-2 border-t border-neutral-200/50\">\n                {navItems.map((item, idx) => (\n                  <motion.a\n                    key={item}\n                    href=\"#\"\n                    initial={{ opacity: 0, x: -10 }}\n                    animate={{ opacity: 1, x: 0 }}\n                    transition={{ delay: idx * 0.05 }}\n                    className=\"text-lg font-medium text-neutral-700 hover:text-black py-2 px-2 hover:bg-white/40 rounded-lg transition-colors\"\n                  >\n                    {item}\n                  </motion.a>\n                ))}\n                <motion.button\n                  initial={{ opacity: 0, y: 10 }}\n                  animate={{ opacity: 1, y: 0 }}\n                  transition={{ delay: 0.2 }}\n                  className=\"mt-4 w-full bg-black text-white py-3 rounded-xl font-medium flex items-center justify-center gap-2\"\n                >\n                  Get Started <ArrowRight size={16} />\n                </motion.button>\n              </div>\n            </motion.div>\n          )}\n        </AnimatePresence>\n      </motion.nav>\n    </div>\n  );\n};\n\nexport default Navbar\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}