react-zeplin-login

React component for simple OAuth with Zeplin

Usage no npm install needed!

<script type="module">
  import reactZeplinLogin from 'https://cdn.skypack.dev/react-zeplin-login';
</script>

README

react-zeplin-login

npm npm bundle size npm

React component for a simple OAuth login with Zeplin.

DEMO HERE

button examples

🚀 Get Started

Follow these steps to start using React Zeplin Login:

  1. Installation

    # with npm
npm i react-zeplin-login

# with yarn
yarn add react-zeplin-login

  2. Import and configure component.

    import React from "react";
import ZeplinLogin from "react-zeplin-login";

export default props => {
  const authHandler = (err, data) => {
    console.log(err, data);
  };

  return (
    <ZeplinLogin
      authCallback={authHandler}
      clientId={CLIENT_ID}
      clientSecret={CLIENT_SECRET}
      redirectUri={REDIRECT_URI}
    />
  );
};

  3. Find more info about keys and OAuth apps in Zeplin official docs

📖 API

Property Type Default Description
authCallback function required Callback function which takes two arguments (error, authData)
clientId string required Client ID of your OAuth App
clientSecret string required Client Secret of your OAuth App
redirectUri string required Authorization callback URL of your OAuth App
buttonTheme enum("classic", "light", "light_short", "dark", "dark_short") "classic" Button style theme. Just "classic" is approved by Zeplin team, and de-facto is only one official option
className string "" Custom class name

📝 License

MIT