Package Exports

react-plaid-link

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-plaid-link) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-plaid-link

React hooks and components for integrating with the Plaid Link drop module

Install

With npm:

npm install react-plaid-link --save

With yarn

yarn add -S react-plaid-link

Documentation

Please refer to the official Plaid Link docs for a more holistic understanding of the various Link options.

Examples

Head to the react-plaid-link storybook to try it out for yourself, or checkout:

Using React hooks

This is the new and preferred approach for integrating with Plaid Link in React.

import React, { useCallback } from 'react';
import { usePlaidLink } from 'react-plaid-link';

const App = () => {
  const onSuccess = useCallback((token, metadata) => {
    // send token to server
  }, []);

  const config = {
    token: '<GENERATED_LINK_TOKEN>',
    onSuccess,
    // ...
  };

  const { open, ready, error } = usePlaidLink(config);

  return (
    <MyButton onClick={() => open()} disabled={!ready}>
      Connect a bank account
    </MyButton>
  );
};
export default App;

Using a React component

import React from 'react';
import { PlaidLink } from 'react-plaid-link';

const App = props => {
  const onSuccess = (token, metadata) => {
    // send token to server
  };

  return (
    <PlaidLink
      token="<GENERATED_LINK_TOKEN>"
      onSuccess={onSuccess}
      {...}
    >
      Connect a bank account
    </PlaidLink>
  );
};
export default App;

All available Link configuration options

Please refer to the official Plaid Link docs for a more holistic understanding of the various Link options and the link_token.

// src/types/index.ts
interface PlaidLinkOptionsWithLinkToken = {
  token: string;
  onSuccess: Function;
  onExit?: Function;
  onLoad?: Function;
  onEvent?: Function;
  receivedRedirectUri?: string;
}

type PlaidLinkOptions = PlaidLinkOptionsWithLinkToken;

Typescript support

Typescript definitions for react-plaid-link are built into the npm packge.

Publishing

You'll need NPM publishing rights for your NPM user. Then you can run:

make release-(patch|minor|major)

Read semver to determine what type of version bump to use.