DOCSEARCHbyAlgolia
Submit Docs

Plaid React Native Link SDK

repository·master·Indexed 42 days ago

https://github.com/plaid/react-native-plaid-link-sdk

A session-based JavaScript API for integrating Plaid Link, Identity Verification, Layer, and FinanceKit into React Native and Expo applications. Version 13.2.0 supports the New Architecture and provides specialized sessions via createPlaidLinkSession, createPlaidIdentityVerificationSession, and createPlaidHeadlessSession, as well as the PlaidEmbeddedSearchView component for embedded flows. Note that Expo Go is not supported; development builds or bare React Native apps are required.

Tokens
9.5K
Snippets
35
Records
46
Agent score
52%

What's inside Plaid React Native SDK

  1. Migrate Embedded Search to PlaidEmbeddedSearchView

    master

    The EmbeddedLinkView component from v11/v12 has been replaced by PlaidEmbeddedSearchView in v13. This new component supports Android Embedded Search.

    import { PlaidEmbeddedSearchView } from "react-native-plaid-link-sdk";

<PlaidEmbeddedSearchView
  token="#GENERATED_LINK_TOKEN#"
  style={{ height: 500 }}
  onLoad={() => {
    console.log("Embedded Search loaded");
  }}
  onSuccess={(success) => {
    console.log("Success", success);
  }}
  onExit={(exit) => {
    console.log("Exit", exit);
  }}
  onEvent={(event) => {
    console.log("Event", event);
  }}
/>

  2. Migrate from `dismissLink` to session callbacks

    master

    The global dismissLink function has been removed in v13. This function was used to programmatically dismiss the Link UI on iOS.

    In v13, Link is dismissed when the user completes or exits the flow. You should now observe this behavior using the onSuccess and onExit callbacks provided within your session configuration.

  4. Remove deprecated configuration options `logLevel` and `noLoadingState`

    master

    The following configuration options and types have been removed in v13:

    • logLevel (option)
    • LinkLogLevel (enum)
    • noLoadingState (option)

    A v13 session configuration now only requires a token and the lifecycle callbacks (onSuccess, onExit, onEvent, and optional onLoad).

    Note on noLoadingState: If you were using noLoadingState to implement a UI-less flow, you must now use createPlaidHeadlessSession instead.

    // Before v13
create({
  token: "#GENERATED_LINK_TOKEN#",
  logLevel: LinkLogLevel.ERROR,
  noLoadingState: false,
});

// After v13
const session = await createPlaidLinkSession({
  token: "#GENERATED_LINK_TOKEN#",
  onSuccess,
  onExit,
  onEvent,
});

  5. Install the Plaid React Native SDK

    master

    Depending on your project type, follow the appropriate installation steps. Note that Expo Go is not supported because the SDK contains custom native code; you must use a development build, a custom native build, or a bare React Native app.

    For Expo projects

    Install the package and rebuild your native app to include the Plaid native module.

    npm install react-native-plaid-link-sdk

    For Bare React Native projects

    You must install and configure the expo package first. If your app does not already use Expo Modules, follow Expo's guide for installing them.

    npm install react-native-plaid-link-sdk expo
npx pod-install

  7. Migrate Plaid Layer to v13

    master

    Layer now uses a dedicated PlaidLayerSession object created via createPlaidLayerSession. You must manage the session instance to call .submit().

    Workflow:

    1. Create the session with createPlaidLayerSession.
    2. Listen for LinkEventName.LAYER_READY in the onEvent callback.
    3. Call session.open() when ready.
    4. Call session.submit(payload) with user data (e.g., phoneNumber, dateOfBirth).
    import {
  LinkEventName,
  PlaidLayerSession,
  createPlaidLayerSession,
} from "react-native-plaid-link-sdk";

let session: PlaidLayerSession;

session = await createPlaidLayerSession({
  token: "#GENERATED_LINK_TOKEN#",
  onSuccess: (success) => {
    console.log("Success", success);
  },
  onExit: (exit) => {
    console.log("Exit", exit);
  },
  onEvent: async (event) => {
    if (event.eventName === LinkEventName.LAYER_READY) {
      await session.open();
    }
  },
});

await session.submit({
  phoneNumber: "415-555-0017",
  dateOfBirth: "1975-01-18",
});

  8. Configure Plaid Dashboard for Mobile

    master

    Before using the SDK, you must configure your native app identifiers in the Plaid Dashboard to support OAuth flows and Link functionality. Ensure you register:

    • Android: Package names
    • iOS: Bundle identifiers
    • All environments: OAuth redirect URIs for every environment your app supports

    Important: Link tokens must be created on your server, not within the mobile application.

  9. Migrate Standard Link from v11/v12 to v13

    master

    In v13, the global openLink, create, and open APIs are replaced by an explicit session-based API using createPlaidLinkSession. This ties callbacks directly to the active session.

    Key Changes:

    • Use createPlaidLinkSession to initialize the session.
    • Call session.open(isFullScreen: boolean) to present the Link UI.
    • Pass onSuccess, onExit, onEvent, and onLoad directly into the session creation object.
    • session.open(false) uses default presentation; session.open(true) requests full-screen presentation.
    import { createPlaidLinkSession } from "react-native-plaid-link-sdk";

const session = await createPlaidLinkSession({
  token: "#GENERATED_LINK_TOKEN#",
  onSuccess: (success) => {
    console.log("Success", success);
  },
  onExit: (exit) => {
    console.log("Exit", exit);
  },
  onEvent: (event) => {
    console.log("Event", event);
  },
});

await session.open(false);

  10. Migrate from global `destroy` to session-based flows

    master

    In v13, the global destroy function has been removed. Previously, destroy was used (primarily on Android) to clear native state before starting a new session.

    In v13, every Link flow is a discrete session object returned by createPlaidLinkSession, createPlaidLayerSession, or createPlaidHeadlessSession. Because sessions are now isolated, there is no shared state to clear. Instead of calling destroy to reset a previous session, you should simply create a new session object for each flow.

    // Before v13
import { create, destroy, submit } from "react-native-plaid-link-sdk";

create(tokenConfiguration1);
await destroy(); // clear the previous session's state
create(tokenConfiguration2);
submit({ phoneNumber: "415-555-0015" });

// After v13
import { createPlaidLayerSession } from "react-native-plaid-link-sdk";

const session = await createPlaidLayerSession(tokenConfiguration2);
await session.submit({ phoneNumber: "415-555-0015" });

  11. Install react-native-plaid-link-sdk v13

    master

    v13 is an Expo Module package.

    For Bare React Native apps: You must have Expo Modules installed and configured before installing this SDK.

    For Expo apps or apps with Expo Modules already installed:

    npm install react-native-plaid-link-sdk@^13
npx pod-install

    For new Bare React Native apps (without Expo Modules):

    npm install react-native-plaid-link-sdk expo
npx pod-install

    Note on Imports: Always import from react-native-plaid-link-sdk. Do not import directly from build/, src/, ios/, or android/.