Security News
OpenJS: “XZ Utils Cyberattack Likely Not an Isolated Incident”
OpenJS is warning of social engineering takeovers targeting open source projects after receiving a credible attempt on the foundation.
react-google-button
Advanced tools
Weekly downloads
Readme
Simple Google sign in button for React that follows Google's style guidelines (https://developers.google.com/identity/sign-in/web/build-button)
react-google-button
is universal, so it can be used client-side or server-side.
Install through: npm install --save react-google-button
Import GoogleButton
from react-google-button
:
import GoogleButton from 'react-google-button'
Use GoogleButton
component:
<GoogleButton
onClick={() => { console.log('Google button clicked') }}
/>
oneOf([ 'light', 'dark' ])
'dark'
<GoogleButton
type="light" // can be light or dark
onClick={() => { console.log('Google button clicked') }}
/>
'light'
or 'dark'
for the different google styles (defaults to dark
)
disabled
- whether or not button is disabled
Boolean
false
<GoogleButton
disabled // can also be written as disabled={true} for clarity
onClick={() => { console.log('this will not run on click since it is disabled') }}
/>
String
'Sign in with Google'
<GoogleButton
label='Be Cool'
onClick={() => { console.log('Google button clicked') }}
/>
Override the 'Sign in with Google' words with another string.
Note: Google's branding guidelines states you should not to do this
Most commonly people consume react-google-button
as a CommonJS module. This module is what you get when you import redux in a Webpack, Browserify, or a Node environment.
If you don't use a module bundler, it's also fine. The react-google-button
npm package includes precompiled production and development UMD builds in the dist folder. They can be used directly without a bundler and are thus compatible with many popular JavaScript module loaders and environments. For example, you can drop a UMD build as a <script>
tag on the page. The UMD builds make Redux Firestore available as a window.ReduxFirestore
global variable.
It can be imported like so:
<script src="../node_modules/react-google-button/dist/react-google-button.min.js"></script>
<!-- or through cdn: <script src="https://unpkg.com/react-google-button@latest/dist/react-google-button.min.js"></script> -->
<script>console.log('redux firestore:', window.ReactGoogleButton)</script>
Note: In an effort to keep things simple, the wording from this explanation was modeled after the installation section of the Redux Docs.
FAQs
[![NPM version][npm-image]][npm-url] [![Build Status][build-status-image]][build-status-url] [![Coverage][coverage-image]][coverage-url] [![License][license-image]][license-url] [![Code Style][code-style-image]][code-style-url]
The npm package react-google-button receives a total of 30,195 weekly downloads. As such, react-google-button popularity was classified as popular.
We found that react-google-button demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
OpenJS is warning of social engineering takeovers targeting open source projects after receiving a credible attempt on the foundation.
Company News
Come meet the Socket team at BSidesSF and RSA! We're sponsoring several fun networking events and we would love to see you there.
Security News
OSI is starting a conversation aimed at removing the excuse of the SaaS loophole for companies navigating licensing and the complexities of doing business with open source.