{"id":16540473,"url":"https://github.com/itzg/react-mui-login-register","last_synced_at":"2025-03-16T19:32:04.119Z","repository":{"id":31867589,"uuid":"129623708","full_name":"itzg/react-mui-login-register","owner":"itzg","description":"A user login/register React component styled with Material UI that includes options to use an authentication provider","archived":false,"fork":false,"pushed_at":"2023-10-27T00:29:37.000Z","size":2175,"stargazers_count":44,"open_issues_count":5,"forks_count":14,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-02-27T12:44:46.266Z","etag":null,"topics":["login-forms","material-ui","react"],"latest_commit_sha":null,"homepage":"https://react-mui-login-register.surge.sh/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/itzg.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-04-15T15:30:22.000Z","updated_at":"2024-12-27T15:33:25.000Z","dependencies_parsed_at":"2024-10-27T11:10:30.703Z","dependency_job_id":"52877a27-6c76-4f3e-80c5-72d30f9d8c97","html_url":"https://github.com/itzg/react-mui-login-register","commit_stats":{"total_commits":110,"total_committers":2,"mean_commits":55.0,"dds":"0.26363636363636367","last_synced_commit":"32f47f55be6cf173ed9d0b94b620421e2949677a"},"previous_names":[],"tags_count":18,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/itzg%2Freact-mui-login-register","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/itzg%2Freact-mui-login-register/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/itzg%2Freact-mui-login-register/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/itzg%2Freact-mui-login-register/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/itzg","download_url":"https://codeload.github.com/itzg/react-mui-login-register/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243826797,"owners_count":20354221,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["login-forms","material-ui","react"],"created_at":"2024-10-11T18:52:33.247Z","updated_at":"2025-03-16T19:32:03.809Z","avatar_url":"https://github.com/itzg.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n[![](https://img.shields.io/circleci/project/github/itzg/react-mui-login-register/master.svg)](https://circleci.com/gh/itzg/react-mui-login-register/tree/master)\n[![](https://img.shields.io/npm/v/react-mui-login-register.svg)](https://www.npmjs.com/package/react-mui-login-register)\n[![](https://img.shields.io/badge/demo-surge-blue.svg)](https://react-mui-login-register.surge.sh/)\n[![](https://img.shields.io/github/stars/itzg/react-mui-login-register.svg?label=Stars\u0026style=social)](https://github.com/itzg/react-mui-login-register)\n\nThis is a user login/register React component that includes options to use an authentication provider.\nIt is styled in Material Design using [Material UI](https://material-ui-next.com/)\nand the forms are powered by [Formsy](https://github.com/formsy/formsy-react).\n\n## Screenshots\n\n![](docs/screenshot-login.png)\n\n![](docs/screenshot-register.png)\n\n## Interactive Demo/Editor\n\n[Demo of latest release](https://react-mui-login-register.surge.sh/)\n\n[![Edit try-react-mui-login-register](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/cold-sound-0fxqs?fontsize=14)\n\n## Install\n\n```\nyarn add react-mui-login-register\n```\n\nor\n\n```\nnpm i --save react-mui-login-register\n```\n\n## Quick Start\n\nThis is example of using the \n\n```javascript\nimport LoginRegister from 'react-mui-login-register';\n\n\nclass Demo extends Component {\n  render() {\n\n    const header = (\n        \u003cAppBar position=\"static\"\u003e\n          \u003cToolbar\u003e\n            \u003cTypography variant=\"title\" color=\"inherit\"\u003eWelcome\u003c/Typography\u003e\n          \u003c/Toolbar\u003e\n        \u003c/AppBar\u003e\n    );\n\n    const footer = (\n        \u003cdiv className={classes.footer}\u003e\n          \u003cTypography variant=\"caption\" align=\"center\"\u003ev0.9\u003c/Typography\u003e\n        \u003c/div\u003e\n    );\n\n    return (\n        \u003cdiv\u003e\n          \u003cLoginRegister header={header} footer={footer}\n                         onLogin={this.handleLogin}\n                         onLoginWithProvider={this.handleLoginWithProvider}\n                         onRegister={this.handleRegister}\n                         onRegisterWithProvider={this.handleRegisterWithProvider}\n          /\u003e\n        \u003c/div\u003e);\n  }\n\n  handleLogin = content =\u003e {\n    alert(`Logging in with content '${JSON.stringify(content)}'`);\n  };\n\n  handleLoginWithProvider = providerId =\u003e {\n    alert(`Logging in with provider '${providerId}'`);\n  };\n\n  handleRegister = content =\u003e {\n    alert(`Registering with content '${JSON.stringify(content)}'`);\n  };\n\n  handleRegisterWithProvider = providerId =\u003e {\n    alert(`Registering with provider '${providerId}'`);\n  };\n}\n\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fitzg%2Freact-mui-login-register","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fitzg%2Freact-mui-login-register","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fitzg%2Freact-mui-login-register/lists"}