facebook-login-redux-react
v1.1.0
Published
a button component in order to make easier integration with facebook
Downloads
6
Readme
Change Log - Version 1.0.0
- Reduced library size from 38k to 4.7kb!
- Styles can now be modified through props.
- Minor Changes to the props API.
Example: Integrating Button with Redux
source code can be found in [demo
Installation
npm i facebook-login-redux-react
Usage
Props
| Props | Type | Default | Notes | |--------------- |---------- |--------------------------------------------- |------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | appId | string | None.It is a required prop. | | | version | string | 'v2.9' | refer to Facebook Docs for explanation on available values | | loginLabel | string | Log In To Facebook | | | loginOptions | object | {scope: 'email'} | all options listed on Facebook Docs are passable with camelCase. e.g : {returnScopes: false} | | logoutLabel | string | Log out from Facebook | | | onClick | function | | will execute before the onLoginEvent/onLogoutEvent. useful for triggering the fetching event for redux store. | | sdkLoaded | Object | returns an object with the following keys: isConnected: Boolean. is the User conneted? FB: the api object. | | onLoginEvent | function | | | | onLogoutEvent | function | | |
Style Props
Style Props Accepts any valid String values for those css Properties:
| Prop Name | Default Value (String) | |-----------------|-----------------------------------| | width | None | | padding | 0 15px 0px 46px | | fontSize | 16px | | backgroundImage | linear-gradient(#4C69BA, #3B55A0) | | color | #FFF | | lineHeight | 34px |
Example:
<FacebookReduxLogin
appId='12345678'
onLoginEvent={this.login}
onLogoutEvent={this.logout}
onClick={() => this.props.startFetching()}
/>
Development
- running the demo on dev server
npm start
. this will run the demo app, which is configured for redux,
Contribute
I welcome any kind of contributions/requests/questions/general feedback. Please Open an Issue Or a pull request. Tests
======
tests will be added hopefully soon.