Installations
npm install react-plaid-link
Developer Guide
Typescript
Yes
Module System
CommonJS, UMD
Node Version
20.17.0
NPM Version
10.8.2
Score
95
Supply Chain
94.8
Quality
85.4
Maintenance
100
Vulnerability
100
License
Releases
Unable to fetch releases
Contributors
Unable to fetch Contributors
Languages
TypeScript (65.85%)
JavaScript (27.29%)
Makefile (5.29%)
Shell (1.58%)
Developer
Download Statistics
Total Downloads
32,126,023
Last Day
48,143
Last Week
191,101
Last Month
948,414
Last Year
9,532,803
GitHub Statistics
272 Stars
164 Commits
151 Forks
53 Watching
43 Branches
235 Contributors
Bundle Size
7.59 kB
Minified
3.01 kB
Minified + Gzipped
Package Meta Information
Latest Version
3.6.1
Package Id
react-plaid-link@3.6.1
Unpacked Size
179.33 kB
Size
26.87 kB
File Count
29
NPM Version
10.8.2
Node Version
20.17.0
Publised On
30 Oct 2024
Total Downloads
Cumulative downloads
Total Downloads
32,126,023
Last day
-27.6%
48,143
Compared to previous day
Last week
-33.4%
191,101
Compared to previous week
Last month
34.3%
948,414
Compared to previous month
Last year
8.1%
9,532,803
Compared to previous year
Daily Downloads
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
2
Dev Dependencies
53
react-plaid-link
React hook and components for integrating with Plaid Link
Compatibility
React 16.8+
Install
With npm
:
npm install --save react-plaid-link
With yarn
yarn add react-plaid-link
Documentation
Please refer to the official Plaid Link docs for a more holistic understanding of Plaid Link.
Examples
Head to the react-plaid-link
storybook to try out a live demo.
See the examples folder for various complete source code examples.
Using React hooks
This is the preferred approach for integrating with Plaid Link in React.
Note: token
can be null
initially and then set once you fetch or generate
a link_token
asynchronously.
ℹ️ See a full source code examples of using hooks:
- examples/simple.tsx: minimal example of using hooks
- examples/hooks.tsx: example using hooks with all available callbacks
- examples/oauth.tsx: example handling OAuth with hooks
1import { usePlaidLink } from 'react-plaid-link'; 2 3// ... 4 5const { open, ready } = usePlaidLink({ 6 token: '<GENERATED_LINK_TOKEN>', 7 onSuccess: (public_token, metadata) => { 8 // send public_token to server 9 }, 10}); 11 12return ( 13 <button onClick={() => open()} disabled={!ready}> 14 Connect a bank account 15 </button> 16);
Available Link configuration options
ℹ️ See src/types/index.ts for exported types.
Please refer to the official Plaid Link
docs for a more holistic understanding of
the various Link options and the
link_token
.
usePlaidLink
arguments
key | type |
---|---|
token | string | null |
onSuccess | (public_token: string, metadata: PlaidLinkOnSuccessMetadata) => void |
onExit | (error: null | PlaidLinkError, metadata: PlaidLinkOnExitMetadata) => void |
onEvent | (eventName: PlaidLinkStableEvent | string, metadata: PlaidLinkOnEventMetadata) => void |
onLoad | () => void |
receivedRedirectUri | string | null | undefined |
usePlaidLink
return value
key | type |
---|---|
open | () => void |
ready | boolean |
submit | (data: PlaidHandlerSubmissionData) => void |
error | ErrorEvent | null |
exit | (options?: { force: boolean }, callback?: () => void) => void |
OAuth / opening Link without a button click
Handling OAuth redirects requires opening Link without any user input (such as clicking a button). This can also be useful if you simply want Link to open immediately when your page or component renders.
ℹ️ See full source code example at examples/oauth.tsx
1import { usePlaidLink } from 'react-plaid-link'; 2 3// ... 4 5const { open, ready } = usePlaidLink(config); 6 7// open Link immediately when ready 8React.useEffect(() => { 9 if (ready) { 10 open(); 11 } 12}, [ready, open]); 13 14return <></>;
Using the pre-built component instead of the usePlaidLink hook
If you cannot use React hooks for legacy reasons such as incompatibility with
class components, you can use the PlaidLink
component.
ℹ️ See full source code example at examples/component.tsx
1import { PlaidLink } from "react-plaid-link"; 2 3const App extends React.Component { 4 // ... 5 render() { 6 return ( 7 <PlaidLink 8 token={this.state.token} 9 onSuccess={this.onSuccess} 10 // onEvent={...} 11 // onExit={...} 12 > 13 Link your bank account 14 </PlaidLink> 15 ); 16 } 17}
Typescript support
TypeScript definitions for react-plaid-link
are built into the npm package.
If you have previously installed @types/react-plaid-link
before this package
had types, please uninstall it in favor of built-in types.
No vulnerabilities found.
Reason
no dangerous workflow patterns detected
Reason
no binaries found in the repo
Reason
all changesets reviewed
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
5 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 4
Reason
detected GitHub workflow tokens with excessive permissions
Details
- Warn: no topLevel permission defined: .github/workflows/build.yml:1
- Info: no jobLevel write permissions found
Reason
dependency not pinned by hash detected -- score normalized to 0
Details
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/build.yml:10: update your workflow using https://app.stepsecurity.io/secureworkflow/plaid/react-plaid-link/build.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/build.yml:12: update your workflow using https://app.stepsecurity.io/secureworkflow/plaid/react-plaid-link/build.yml/master?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/build.yml:16: update your workflow using https://app.stepsecurity.io/secureworkflow/plaid/react-plaid-link/build.yml/master?enable=pin
- Info: 0 out of 2 GitHub-owned GitHubAction dependencies pinned
- Info: 0 out of 1 third-party GitHubAction dependencies pinned
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 30 are checked with a SAST tool
Reason
68 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw
- Warn: Project is vulnerable to: GHSA-w8qv-6jwh-64r5
- Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-9vvw-cc9w-f27h
- Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
- Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq
- Warn: Project is vulnerable to: GHSA-653v-rqx9-j85p
- Warn: Project is vulnerable to: GHSA-h6ch-v84p-w6p9
- Warn: Project is vulnerable to: GHSA-phwq-j96m-2c2q
- Warn: Project is vulnerable to: GHSA-ghr5-ch3p-vcr6
- Warn: Project is vulnerable to: GHSA-434g-2637-qmqr
- Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m
- Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw
- Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p
- Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747
- Warn: Project is vulnerable to: GHSA-6h5x-7c5m-7cr7
- Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc
- Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx
- Warn: Project is vulnerable to: GHSA-qh2h-chj9-jffq
- Warn: Project is vulnerable to: GHSA-vfrc-7r7c-w9mx
- Warn: Project is vulnerable to: GHSA-7wwv-vh3v-89cq
- Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22
- Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq
- Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488
- Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g
- Warn: Project is vulnerable to: GHSA-4wx3-54gh-9fr9
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-hxm2-r34f-qmc5
- Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
- Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m
- Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-w9mr-4mfr-499f
- Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr
- Warn: Project is vulnerable to: GHSA-3j8f-xvm3-ffx4
- Warn: Project is vulnerable to: GHSA-4p35-cfcx-8653
- Warn: Project is vulnerable to: GHSA-7f3x-x4pr-wqhj
- Warn: Project is vulnerable to: GHSA-jpp7-7chh-cf67
- Warn: Project is vulnerable to: GHSA-q6wq-5p59-983w
- Warn: Project is vulnerable to: GHSA-j9fq-vwqv-2fm2
- Warn: Project is vulnerable to: GHSA-pqw5-jmp5-px4v
- Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j
- Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w
- Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j
- Warn: Project is vulnerable to: GHSA-wvhm-4hhf-97x9
- Warn: Project is vulnerable to: GHSA-h4hr-7fg3-h35w
- Warn: Project is vulnerable to: GHSA-gj77-59wh-66hg
- Warn: Project is vulnerable to: GHSA-hqhp-5p83-hx96
- Warn: Project is vulnerable to: GHSA-3949-f494-cm99
- Warn: Project is vulnerable to: GHSA-5q6m-3h65-w53x
- Warn: Project is vulnerable to: GHSA-gcx4-mw62-g8wm
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-4x5v-gmq8-25ch
- Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg
- Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p
- Warn: Project is vulnerable to: GHSA-g4rg-993r-mgx7
- Warn: Project is vulnerable to: GHSA-w5hq-hm5m-4548
- Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-fhg7-m89q-25r3
- Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6
- Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
Score
4.2
/10
Last Scanned on 2025-01-20
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More