rnd

react-native-dark-login-screen

Customizable social login screen

Showing:

Popularity

Downloads/wk

107

GitHub Stars

6

Maintenance

Last Commit

12d ago

Contributors

1

Package

Dependencies

1

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Readme

React Native Typescript Library Starter

Battle Tested ✅

React Native Social Login Screen React Native Social Login Screen
React Native Social Login Screen

Installation

Add the dependency:

npm i react-native-dark-login-screen

Peer Dependencies

IMPORTANT! You need install them
"react": ">= 16.x.x",
"react-native": ">= 0.55.x",

Usage

Import

import DarkLoginScreen from "react-native-dark-login-screen";

Fundamental Usage

<DarkLoginScreen
  handleSignInButton={() => {}}
  handleGoogleLogIn={() => {}}
  handleFacebookLogIn={() => {}}
  handleSignInButton={() => {}}
/>

Configuration - Props

Sign In Screen

PropertyTypeDefaultDescription
titleTextstringWelcome Back!change the title text
titleTextStyleTextStyledefaultset or override the style object for the title text
descriptionTextstringPlease sign in to your accountchange the description text
descriptionTextStyleTextStyledefaultset or override the style object for the description
usernamePlaceholderstringUsernamechange the username placeholder
textInputStyleViewStyledefaultset or override the style object for the username, password, fullname, email text inputs
placeholderTextColorstring#6C6D72change the placeholder text
passwordPlaceholderstringPasswordchange the password placeholder
passwordTextInputStyleViewStyledefaultset or override the style object for the password text input
forgotPasswordTextstringForgot Password?change the forgot password text
forgotPasswordTextStyleTextStyledefaultchange the forgot button's text
signInButtonStyleViewStyledefaultset or override the style object for the sign in button style
signInButtonTextstringSign Inchange the sign in button text
signInButtonTextStyleTextStyledefaultset or override the style object for the sign in button text style
googleButtonStyleViewdefaultset or override the style object for the google button style
googleButtonTextStyleTextStyledefaultset or override the style object for the google button text style
googleButtonTextstringSign In With Googlechange the google button style
facebookButtonStyleViewStyledefaultset or override the style object for the facebook button style
facebookButtonTextStyleTextStyledefaultset or override the style object for the facebook button text style
facebookButtonTextstringSign In With Facebookchange the facebook button text
appleButtonStyleViewStyledefaultset or override the style object for the apple button style
appleButtonTextStyleTextStyledefaultset or override the style object for the apple button text style
appleButtonTextstringSign In With Applechange the apple button text
enableGoogleLoginbooleantrueenable the google login button
enableFacebookLoginbooleantrueenable the facebook login button
enableAppleLoginbooleantrueenable the apple login button
signUpQuestionTextstringDon't Have An Account ?change the question to sign up screen
signUpButtonTextstringSign Upchange the sign up button text
signUpTextStyleTextStyledefaultchange the sign up button style
signUpButtonTextStyleTextStyledefaultset or override the style object for the sign up button text style
usernameChangeTextfunctionundefinedhandle the usernameChangeText function
passwordChangeTextfunctionundefinedhandle the passwordChangeText function
handleSignInButtonfunctionundefinedhandle Sign In button is pressed
handleGoogleLogInfunctionundefinedhandle handleGoogleLogIn button is pressed
handleAppleLogInfunctionundefinedhandle handleAppleLogIn button is pressed
handleFacebookLogInfunctionundefinedhandle handleFacebookLogIn button is pressed
handleForgotPasswordfunctionundefinedhandle handleForgotPassword button is pressed
handleSignUpfunctionundefinedhandle handleSignUp button is pressed for navigation to sign up screen
enableForgotPasswordbooleantrueenable the forgot password button

Sign Up Screen

PropertyTypeDefaultDescription
signUpTitlestringCreate New Accountchange the sign up screen title
signUpDescriptionTextstringPlease fill in the form to continuechange the sign up description
signUpTitleTextStyleTextStyledefaultchange the title text style
signUpDescriptionTextStyleTextStyledefaultchange the description text style
fullNamePlaceholderTextstringFull Namechange the full name text input placeholder
placeholderTextColorstring#6C6D72change the placeholder text color
textInputStyleViewStyledefaultset or override the style object for the username, password, fullname, email text inputs
emailPlaceholderTextstringEmail Addresschange the placeholder for email text input
passwordPlaceholderstringPasswordchange the placeholder for password text input
passwordTextInputStyleViewStyledefaultset or override the style object for the password text input
signUpButtonTextstringSign Upchange the sign up button text
signUpButtonStyleViewStyledefaultset or override the style object for the sign up button style
signUpButtonTextStyleTextStyledefaultset or override the style object for the sign up button text style
signInQuestionTextStyleTextStyledefaultset or override the style object for the sign in question text style
signInQuestionTextstringHave An Account?change the sign in question text
signInButtonTextStyleTextStyledefaultset or override the style object for the sign in button text style
signInButtonTextstringSign Inchange the sign in button text
fullNameOnChangefunctionundefinedhandle fullNameOnChange input is changed
emailOnChangefunctionundefinedhandle emailOnChange input is changed
singUpPasswordChangeTextfunctionundefinedhandle singUpPasswordChangeText is changed
handleSignUpButtonfunctionundefinedhandle handleSignUpButton is pressed
handleSignInfunctionundefinedhandle handleSignIn is pressed

Future Plans

  • 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.

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100