react-figma-login

React component for a simple OAuth login with Figma.

DEMO HERE

🚀 Get Started

Follow these steps to start using React Figma Login:

1. Installation

   # with npm
   npm i react-figma-login
   
   # with yarn
   yarn add react-figma-login

2. Import and configure component.

   import React from "react";
   import FigmaLogin from "react-figma-login";
   
   export default props => {
     const authHandler = (err, data) => {
       console.log(err, data);
     };
   
     return (
       <FigmaLogin
         authCallback={authHandler}
         clientId={CLIENT_ID}
         clientSecret={CLIENT_SECRET}
         redirectUri={REDIRECT_URI}
         scope={SCOPE}
       />
     );
   };

3. Find more info about keys and OAuth apps in Figma 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 | | scope | string | required | Scope that will be requested. For now only "file_read" is available. | | buttonTheme | enum("light", "light_short", "dark", "dark_short") | "light" | Button style theme that based on Figma styles | | className | string | "" | Custom class name |

📝 License

MIT