{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "password",
  "title": "Password",
  "author": "vorhdam <https://github.com/vorhdam>",
  "description": "A super simple password input component with a toggle options that hides or reveals your password.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "button",
    "input-group"
  ],
  "files": [
    {
      "path": "src/components/ui/password.tsx",
      "content": "\"use client\";\r\n\r\nimport * as React from \"react\";\r\n\r\nimport { Button } from \"@/components/ui/button\";\r\nimport {\r\n  InputGroup,\r\n  InputGroupAddon,\r\n  InputGroupInput,\r\n} from \"@/components/ui/input-group\";\r\nimport { Eye, EyeClosed } from \"lucide-react\";\r\n\r\nfunction Password({ className, ...props }: React.ComponentProps<\"input\">) {\r\n  const [visible, setVisible] = React.useState<boolean>(false);\r\n\r\n  return (\r\n    <InputGroup>\r\n      <InputGroupInput\r\n        type={visible ? \"text\" : \"password\"}\r\n        {...props}\r\n        className={className}\r\n      />\r\n      <InputGroupAddon align={\"inline-end\"}>\r\n        <Button\r\n          variant={\"link\"}\r\n          type=\"button\"\r\n          onClick={() => setVisible(!visible)}\r\n        >\r\n          {visible ? <Eye /> : <EyeClosed />}\r\n        </Button>\r\n      </InputGroupAddon>\r\n    </InputGroup>\r\n  );\r\n}\r\n\r\nexport { Password };\r\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:block"
}