{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "btn-creative-right",
  "dependencies": [
    "lucide-react"
  ],
  "devDependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "path": "./registry/components/button/btn-creative-right.tsx",
      "content": "'use client';\n\nimport { ArrowRight } from 'lucide-react';\nimport React from 'react';\n\nfunction ButtonCreativeRight() {\n  return (\n    <>\n      <div className='group relative cursor-pointer p-2 w-32 border bg-white rounded-full overflow-hidden text-black text-center font-semibold'>\n        <span className='translate-x-1 group-hover:translate-x-12 group-hover:opacity-0 transition-all duration-300 inline-block'>\n          About\n        </span>\n        <div className='flex gap-2 text-white z-10 items-center absolute top-0 h-full w-full justify-center translate-x-12 opacity-0 group-hover:-translate-x-1 group-hover:opacity-100 transition-all duration-300'>\n          <span>About</span>\n          <ArrowRight />\n        </div>\n        <div className='absolute top-[40%] left-[20%] h-2 w-2 group-hover:h-full group-hover:w-full rounded-lg bg-black scale-[1] dark:group-hover:bg-[#e7cb6e] group-hover:bg-[#263381] group-hover:scale-[1.8] transition-all duration-300 group-hover:top-[0%] group-hover:left-[0%] '></div>\n      </div>\n    </>\n  );\n}\n\nexport default ButtonCreativeRight;\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}