# react-native-dark-login-screen > Extremely easy to create a React Native Component Library with both Stateful and Functional Component Examples. Latest version **0.1.1** (published 2021-09-06) · MIT license · 0 weekly downloads ## Install ```sh npm install react-native-dark-login-screen pnpm add react-native-dark-login-screen yarn add react-native-dark-login-screen bun add react-native-dark-login-screen ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.1.1 | | Published | 2021-09-06 | | First published | 2021-03-13 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 1 | | Unpacked size | 154.6 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 10 | | Author | Sevval Eygul | | Maintainers | sevvaleygul | | Keywords | SevvalEygul, Şevval, şevval, ŞevvalEygül, sevvaleygul, sevval, Sevval, react, react-native, javascript, typescript, ui-lib, rn, login, dark-login, darkLogin, dark-login-screen, login-screen, loginScreen, darkLoginScreen, react-native-dark-login-screen, react-native-login | ## Links - npm: https://www.npmjs.com/package/react-native-dark-login-screen - Repository: https://github.com/sevvaleygul0/react-native-dark-login-screen - Homepage: https://github.com/sevvaleygul0/react-native-dark-login-screen#readme - Issues: https://github.com/sevvaleygul0/react-native-dark-login-screen/issues - npm.io page: https://npm.io/package/react-native-dark-login-screen ## Dependencies (1) - [@freakycoder/react-native-helpers](https://npm.io/package/@freakycoder/react-native-helpers.md) ^1.0.1 ## Alternatives - [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads - [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads - [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads - [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads - [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads ## Recent versions - 0.1.1 (latest) — 2021-09-06 - 0.1.0 — 2021-09-06 - 0.0.8 — 2021-05-16 - 0.0.7 — 2021-05-12 - 0.0.6 — 2021-05-12 - 0.0.5 — 2021-05-12 - 0.0.4 — 2021-05-12 - 0.0.3 — 2021-03-13 - 0.0.2 — 2021-03-13 - 0.0.1 — 2021-03-13 ## README React Native Typescript Library Starter [![Battle Tested ✅](https://img.shields.io/badge/-Battle--Tested%20%E2%9C%85-03666e?style=for-the-badge)](https://github.com/sevvaleygul0/react-native-dark-login-screen)
React Native Social Login Screen React Native Social Login Screen
React Native Social Login Screen
# Installation Add the dependency: ```bash npm i react-native-dark-login-screen ``` ## Peer Dependencies
IMPORTANT! You need install them
```js "react": ">= 16.x.x", "react-native": ">= 0.55.x", ``` # Usage ## Import ```jsx import DarkLoginScreen from "react-native-dark-login-screen"; ``` ## Fundamental Usage ```jsx {}} handleGoogleLogIn={() => {}} handleFacebookLogIn={() => {}} handleSignInButton={() => {}} /> ``` # Configuration - Props ## Sign In Screen | Property | Type | Default | Description | | ----------------------- | :-------: | :----------------------------: | ---------------------------------------------------------------------------------------- | | titleText | string | Welcome Back! | change the title text | | titleTextStyle | TextStyle | default | set or override the style object for the title text | | descriptionText | string | Please sign in to your account | change the description text | | descriptionTextStyle | TextStyle | default | set or override the style object for the description | | usernamePlaceholder | string | Username | change the username placeholder | | textInputStyle | ViewStyle | default | set or override the style object for the username, password, fullname, email text inputs | | placeholderTextColor | string | #6C6D72 | change the placeholder text | | passwordPlaceholder | string | Password | change the password placeholder | | passwordTextInputStyle | ViewStyle | default | set or override the style object for the password text input | | forgotPasswordText | string | Forgot Password? | change the forgot password text | | forgotPasswordTextStyle | TextStyle | default | change the forgot button's text | | signInButtonStyle | ViewStyle | default | set or override the style object for the sign in button style | | signInButtonText | string | Sign In | change the sign in button text | | signInButtonTextStyle | TextStyle | default | set or override the style object for the sign in button text style | | googleButtonStyle | View | default | set or override the style object for the google button style | | googleButtonTextStyle | TextStyle | default | set or override the style object for the google button text style | | googleButtonText | string | Sign In With Google | change the google button style | | facebookButtonStyle | ViewStyle | default | set or override the style object for the facebook button style | | facebookButtonTextStyle | TextStyle | default | set or override the style object for the facebook button text style | | facebookButtonText | string | Sign In With Facebook | change the facebook button text | | appleButtonStyle | ViewStyle | default | set or override the style object for the apple button style | | appleButtonTextStyle | TextStyle | default | set or override the style object for the apple button text style | | appleButtonText | string | Sign In With Apple | change the apple button text | | enableGoogleLogin | boolean | true | enable the google login button | | enableFacebookLogin | boolean | true | enable the facebook login button | | enableAppleLogin | boolean | true | enable the apple login button | | signUpQuestionText | string | Don't Have An Account ? | change the question to sign up screen | | signUpButtonText | string | Sign Up | change the sign up button text | | signUpTextStyle | TextStyle | default | change the sign up button style | | signUpButtonTextStyle | TextStyle | default | set or override the style object for the sign up button text style | | usernameChangeText | function | undefined | handle the usernameChangeText function | | passwordChangeText | function | undefined | handle the passwordChangeText function | | handleSignInButton | function | undefined | handle Sign In button is pressed | | handleGoogleLogIn | function | undefined | handle handleGoogleLogIn button is pressed | | handleAppleLogIn | function | undefined | handle handleAppleLogIn button is pressed | | handleFacebookLogIn | function | undefined | handle handleFacebookLogIn button is pressed | | handleForgotPassword | function | undefined | handle handleForgotPassword button is pressed | | handleSignUp | function | undefined | handle handleSignUp button is pressed for navigation to sign up screen | | enableForgotPassword | boolean | true | enable the forgot password button | ## Sign Up Screen | Property | Type | Default | Description | | -------------------------- | :-------: | :---------------------------------: | ---------------------------------------------------------------------------------------- | | signUpTitle | string | Create New Account | change the sign up screen title | | signUpDescriptionText | string | Please fill in the form to continue | change the sign up description | | signUpTitleTextStyle | TextStyle | default | change the title text style | | signUpDescriptionTextStyle | TextStyle | default | change the description text style | | fullNamePlaceholderText | string | Full Name | change the full name text input placeholder | | placeholderTextColor | string | #6C6D72 | change the placeholder text color | | textInputStyle | ViewStyle | default | set or override the style object for the username, password, fullname, email text inputs | | emailPlaceholderText | string | Email Address | change the placeholder for email text input | | passwordPlaceholder | string | Password | change the placeholder for password text input | | passwordTextInputStyle | ViewStyle | default | set or override the style object for the password text input | | signUpButtonText | string | Sign Up | change the sign up button text | | signUpButtonStyle | ViewStyle | default | set or override the style object for the sign up button style | | signUpButtonTextStyle | TextStyle | default | set or override the style object for the sign up button text style | | signInQuestionTextStyle | TextStyle | default | set or override the style object for the sign in question text style | | signInQuestionText | string | Have An Account? | change the sign in question text | | signInButtonTextStyle | TextStyle | default | set or override the style object for the sign in button text style | | signInButtonText | string | Sign In | change the sign in button text | | fullNameOnChange | function | undefined | handle fullNameOnChange input is changed | | emailOnChange | function | undefined | handle emailOnChange input is changed | | singUpPasswordChangeText | function | undefined | handle singUpPasswordChangeText is changed | | handleSignUpButton | function | undefined | handle handleSignUpButton is pressed | | handleSignIn | function | undefined | handle handleSignIn is pressed | ## Future Plans - [x] ~~LICENSE~~ - [ ] Light mode integration :) ## Inspirer Thanks to https://dribbble.com/shots/15196515-Abda-The-Beginning for the design. ## Author Sevval Eygul, sevvalleygull@gmail.com ## License React Native Typescript Library Starter is available under the MIT license. See the LICENSE file for more info. --- _Source: https://npm.io/package/react-native-dark-login-screen · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._