Link Web SDK 
=============

#### Reference for integrating with the Link JavaScript SDK and React SDK 

Prefer to learn with code examples? Check out our [GitHub repo](https://github.com/plaid/tiny-quickstart) with working example Link implementations for both [JavaScript](https://github.com/plaid/tiny-quickstart/tree/main/vanilla_js) and [React](https://github.com/plaid/tiny-quickstart/tree/main/react) .

#### Installation 

Select group for content switcher

JavaScriptReact

Include the Plaid Link initialize script on each page of your site. It must always be loaded directly from `https://cdn.plaid.com`, rather than included in a bundle or hosted yourself. Unlike Plaid's other SDKs, the JavaScript web SDK is not versioned; `cdn.plaid.com` will automatically provide the latest available SDK.

index.html

```html
<script src="https://cdn.plaid.com/link/v2/stable/link-initialize.js"></script>
```

To get started with Plaid Link for React, clone the [GitHub repository](https://github.com/plaid/react-plaid-link) and review the example application and README, which provide reference implementations.

Next, you'll need to install the react-plaid-link package.

With npm:

```bash
npm install --save react-plaid-link
```

With yarn:

```bash
yarn add react-plaid-link
```

Then import the necessary components and types:

```tsx
import {
  usePlaidLink,
  PlaidLinkOptions,
  PlaidLinkOnSuccess,
} from 'react-plaid-link';
```

#### CSP directives 

If you are using a Content Security Policy (CSP), use the following directives to allow Link traffic:

CSP Directives

```html
default-src https://cdn.plaid.com/;
script-src 'unsafe-inline' https://cdn.plaid.com/link/v2/stable/link-initialize.js;
style-src 'unsafe-inline';
style-src-elem 'unsafe-inline';
style-src-attr 'unsafe-inline';
frame-src https://cdn.plaid.com/;
connect-src https://production.plaid.com/;
```

If using Sandbox instead of Production, make sure to update the `connect-src` directive to point to the appropriate server (`https://sandbox.plaid.com`).

If your organization does not allow the use of `unsafe-inline`, use a [CSP nonce](https://content-security-policy.com/nonce/) generated for the page response instead:

CSP Directives

```html
default-src https://cdn.plaid.com/;
script-src 'nonce-<PAGE_RESPONSE_NONCE>' https://cdn.plaid.com/link/v2/stable/link-initialize.js;
style-src 'nonce-<PAGE_RESPONSE_NONCE>';
style-src-elem 'nonce-<PAGE_RESPONSE_NONCE>';
style-src-attr 'unsafe-inline';
frame-src https://cdn.plaid.com/;
connect-src https://production.plaid.com/;
```

Then reference the same nonce value on the Plaid Link script tag:

Link script tag

```html
<script
  nonce="<PAGE_RESPONSE_NONCE>"
  src="https://cdn.plaid.com/link/v2/stable/link-initialize.js"
></script>
```

#### Creating a Link token 

Before you can create an instance of Link, you need to first create a `link_token`. A `link_token` can be configured for different Link flows and is used to control much of Link's behavior. To learn how to create a new `link_token`, see the API Reference entry for [/link/token/create](https://plaid.com/docs/api/link/index.html.md#linktokencreate) .

\=\*=\*=\*=

#### create() 

`Plaid.create` accepts one argument, a configuration `Object`, and returns an `Object` with three functions, [open](https://plaid.com#open) , [exit](https://plaid.com#exit) , and [destroy](https://plaid.com#destroy) . Calling `open` will open Link and display the Consent Pane view, calling `exit` will close Link, and calling `destroy` will clean up the iframe.

It is recommended to call `Plaid.create` when initializing the view that is responsible for loading Plaid, as this will allow Plaid to pre-initialize Link, resulting in lower UI latency upon calling `open`, which can increase Link conversion.

When using the React SDK, this method is called `usePlaidLink` and returns an object with four values, [open](https://plaid.com#open) , [exit](https://plaid.com#exit) , `ready`, and `error`. The values `open` and `exit` behave as described above. `ready` is a passthrough for `onLoad` and will be `true` when Link is ready to be opened. `error` is populated only if Plaid fails to load the Link JavaScript. There is no separate method to destroy Link in the React SDK, as unmount will automatically destroy the Link instance.

**Note:** Control whether or not your Link integration uses the Account Select view from the [Dashboard](https://dashboard.plaid.com/signin?redirect=%2Flink%2Faccount-select) .

**Properties**

string

Specify a `link_token` to authenticate your app with Link. This is a short lived, one-time use token that should be unique for each Link session. In addition to the primary flow, a `link_token` can be configured to launch Link in [update mode](https://plaid.com/docs/link/update-mode/index.html.md) . See the `/link/token/create` endpoint for a full list of configurations.

callback

A function that is called when a user successfully links an Item. The function should expect two arguments, the `public_token` and a `metadata` object. See [onSuccess](https://plaid.com#onsuccess) .

callback

A function that is called when a user exits Link without successfully linking an Item, or when an error occurs during Link initialization. The function should expect two arguments, a nullable `error` object and a `metadata` object. See [onExit](https://plaid.com#onexit) .

callback

A function that is called when a user reaches certain points in the Link flow. The function should expect two arguments, an `eventName` string and a `metadata` object. See [onEvent](https://plaid.com#onevent) .

callback

A function that is called when the Link module has finished loading. Calls to `plaidLinkHandler.open()` prior to the `onLoad` callback will be delayed until the module is fully loaded.

string

A `receivedRedirectUri` is required to support OAuth authentication flows when re-launching Link on a mobile device.

deprecated, string

The `public_key` is no longer used for new implementations of Link. If your integration is still using a `public_key`, please contact Plaid support or your account manager.

```javascript
const handler = Plaid.create({
  token: 'GENERATED_LINK_TOKEN',
  onSuccess: (public_token, metadata) => {},
  onLoad: () => {},
  onExit: (err, metadata) => {},
  onEvent: (eventName, metadata) => {},
});

```

```tsx
// The usePlaidLink hook manages Plaid Link creation
// It does not return a destroy function;
// instead, on unmount it automatically destroys the Link instance
const config: PlaidLinkOptions = {
  onSuccess: (public_token, metadata) => {},
  onExit: (err, metadata) => {},
  onEvent: (eventName, metadata) => {},
  token: 'GENERATED_LINK_TOKEN',
};

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

```

\=\*=\*=\*=

#### onSuccess 

The `onSuccess` callback is called when a user successfully links an Item. It takes two arguments: the `public_token` and a `metadata` object.

**Properties**

string

Displayed once a user has successfully completed Link. If using Identity Verification or Beacon, this field will be `null`. If using Document Income or Payroll Income, the `public_token` will be returned, but is not used.

object

Displayed once a user has successfully completed Link.

nullable, object

An institution object. If the Item was created via Same-Day Micro-deposit verification, will be `null`.

string

The full institution name, such as `'Wells Fargo'`

string

The Plaid institution identifier

object

A list of accounts attached to the connected Item. If Account Select is enabled via the developer dashboard, `accounts` will only include selected accounts.

string

The Plaid `account_id`

string

The official account name

nullable, string

The last 2-4 alphanumeric characters of an account's official account number. Note that the mask may be non-unique between an Item's accounts. It may also not match the mask that the bank displays to the user.

string

The account type. See the [Account schema](https://plaid.com/docs/api/accounts/index.html.md#account-type-schema) for a full list of possible values

string

The account subtype. See the [Account schema](https://plaid.com/docs/api/accounts/index.html.md#account-type-schema) for a full list of possible values

nullable, string

Indicates an Item's micro-deposit-based verification or database verification status. Possible values are:

`pending_automatic_verification`: The Item is pending automatic verification

`pending_manual_verification`: The Item is pending manual micro-deposit verification. Items remain in this state until the user successfully verifies the deposit.

`automatically_verified`: The Item has successfully been automatically verified

`manually_verified`: The Item has successfully been manually verified

`verification_expired`: Plaid was unable to automatically verify the deposit within 7 calendar days and will no longer attempt to validate the Item. Users may retry by submitting their information again through Link.

`verification_failed`: The Item failed manual micro-deposit verification because the user exhausted all 3 verification attempts. Users may retry by submitting their information again through Link.

`database_matched`: The Item has successfully been verified using Plaid's data sources.

`database_insights_pending`: The Database Insights result is pending and will be available upon Auth request.

`null`: Neither micro-deposit-based verification nor database verification are being used for the Item.

deprecated, nullable, string

If micro-deposit verification was being used, indicates the user's selection when asked if the account being verified is a `business` or `personal` account. This field is deprecated as Plaid no longer collects this information during the micro-deposit flow.

deprecated, nullable, object

Deprecated. Use `accounts` instead.

string

A unique identifier associated with a user's actions and events through the Link flow. Include this identifier when opening a support ticket for faster turnaround.

nullable, string

The status of a transfer. Returned only when [Transfer UI](https://plaid.com/docs/transfer/using-transfer-ui/index.html.md) is implemented.

*   `COMPLETE` – The transfer was completed.
*   `INCOMPLETE` – The transfer could not be completed. For help, see [Troubleshooting Transfer UI](https://plaid.com/docs/transfer/using-transfer-ui/index.html.md#troubleshooting-transfer-ui) .

Possible values: `COMPLETE`, `INCOMPLETE`

```tsx
import {
  PlaidLinkOnSuccess,
  PlaidLinkOnSuccessMetadata,
} from 'react-plaid-link';

const onSuccess = useCallback(
  (public_token: string, metadata: PlaidLinkOnSuccessMetadata) => {
    // log and save metadata
    // exchange public token (if using Item-based products)
    fetch('//yourserver.com/exchange-public-token', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        public_token,
      }),
    });
  },
  [],
);

```

```javascript
const handler = Plaid.create({
  ...,
  onSuccess: (public_token, metadata) => {
    // log and save metadata
    // exchange public token (if using Item-based products)
    fetch('//yourserver.com/get_access_token', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        public_token: public_token,
      }),
    });
  }
});

```

Metadata schema

```javascript
{
  institution: {
    name: 'Wells Fargo',
    institution_id: 'ins_4'
  },
  accounts: [
    {
      id: 'ygPnJweommTWNr9doD6ZfGR6GGVQy7fyREmWy',
      name: 'Plaid Checking',
      mask: '0000',
      type: 'depository',
      subtype: 'checking',
      verification_status: null
    },
    {
      id: '9ebEyJAl33FRrZNLBG8ECxD9xxpwWnuRNZ1V4',
      name: 'Plaid Saving',
      mask: '1111',
      type: 'depository',
      subtype: 'savings'
    }
    ...
  ],
  link_session_id: '79e772be-547d-4c9c-8b76-4ac4ed4c441a'
}
```

\=\*=\*=\*=

#### onExit 

The `onExit` callback is called when a user exits Link without successfully linking an Item, or when an error occurs during Link initialization. `onExit` takes two arguments, a nullable `error` object and a `metadata` object. The `metadata` parameter is always present, though some values may be `null`. Note that `onExit` will not be called when Link is destroyed in some other way than closing Link, such as the user hitting the browser back button or closing the browser tab on which the Link session is present.

**Properties**

nullable, object

A nullable object that contains the error type, code, and message of the error that was last encountered by the user. If no error was encountered, error will be null.

String

A broad categorization of the error.

String

The particular error code. Each `error_type` has a specific set of `error_codes`.

String

A developer-friendly representation of the error code.

nullable, String

A user-friendly representation of the error code. `null` if the error is not related to user action. This may change over time and is not safe for programmatic use.

object

Displayed if a user exits Link without successfully linking an Item.

nullable, object

An institution object. If the Item was created via Same-Day Micro-deposit verification, will be `null`.

string

The full institution name, such as `Wells Fargo`

string

The Plaid institution identifier

string

The point at which the user exited the Link flow. One of the following values.

User prompted to answer security questions

User prompted to answer multiple choice question(s)

User prompted to provide a one-time passcode

User prompted to select a device on which to receive a one-time passcode

User prompted to provide credentials for the selected financial institution or has not yet selected a financial institution

User prompted to select one or more financial accounts to share

User prompted to enter an OAuth flow

User exited the Link flow on the institution selection pane. Typically this occurs after the user unsuccessfully (no results returned) searched for a financial institution. Note that this status does not necessarily indicate that the user was unable to find their institution, as it is used for all user exits that occur from the institution selection pane, regardless of other user behavior.

User exited the Link flow after discovering their selected institution is no longer supported by Plaid

string

A unique identifier associated with a user's actions and events through the Link flow. Include this identifier when opening a support ticket for faster turnaround.

string

The request ID for the last request made by Link. This can be shared with Plaid Support to expedite investigation.

```tsx
import {
  PlaidLinkOnExit,
  PlaidLinkOnExitMetadata,
  PlaidLinkError,
} from 'react-plaid-link';

const onExit = useCallback(
  (error: PlaidLinkError, metadata: PlaidLinkOnExitMetadata) => {
    // log and save error and metadata
    // handle invalid link token
    if (error != null && error.error_code === 'INVALID_LINK_TOKEN') {
      // generate new link token
    }
    // to handle other error codes, see https://plaid.com/docs/errors/
  },
  [],
);

```

```javascript
const handler = Plaid.create({
  ...,
  onExit: (error, metadata) => {
    // Save data from the onExit handler
    supportHandler.report({
      error: error,
      institution: metadata.institution,
      link_session_id: metadata.link_session_id,
      plaid_request_id: metadata.request_id,
      status: metadata.status,
    });
  },
});

```

Error schema

```javascript
{
  error_type: 'ITEM_ERROR',
  error_code: 'INVALID_CREDENTIALS',
  error_message: 'the credentials were not correct',
  display_message: 'The credentials were not correct.',
}
```

Metadata schema

```javascript
{
  institution: {
    name: 'Wells Fargo',
    institution_id: 'ins_4'
  },
  status: 'requires_credentials',
  link_session_id: '36e201e0-2280-46f0-a6ee-6d417b450438',
  request_id: '8C7jNbDScC24THu'
}
```

\=\*=\*=\*=

#### onEvent 

The `onEvent` callback is called at certain points in the Link flow. It takes two arguments, an `eventName` string and a `metadata` object.

The `metadata` parameter is always present, though some values may be `null`. Note that new `eventNames`, `metadata` keys, or view names may be added without notice.

The `OPEN`, `LAYER_READY`, `LAYER_NOT_AVAILABLE`, and `LAYER_AUTOFILL_NOT_AVAILABLE` events will fire in real time; subsequent events will fire at the end of the Link flow, along with the `onSuccess` or `onExit` callback. Callback ordering is not guaranteed; `onEvent` callbacks may fire before, after, or surrounding the `onSuccess` or `onExit` callback, and event callbacks are not guaranteed to fire in the order in which they occurred. If you need to determine the exact time when an event happened, use the `timestamp` in the metadata.

The following callback events are stable, which means that they are suitable for programmatic use in your application's logic: `OPEN`, `EXIT`, `HANDOFF`, `SELECT_INSTITUTION`, `ERROR`, `BANK_INCOME_INSIGHTS_COMPLETED`, `IDENTITY_VERIFICATION_PASS_SESSION`, `IDENTITY_VERIFICATION_FAIL_SESSION`, `IDENTITY_MATCH_FAILED`, `IDENTITY_MATCH_PASSED`, `LAYER_READY`, `LAYER_NOT_AVAILABLE`, `LAYER_AUTOFILL_NOT_AVAILABLE`. The remaining callback events are informational and subject to change and should be used for analytics and troubleshooting purposes only.

**Properties**

string

A string representing the event that has just occurred in the Link flow.

The user was automatically sent an OTP code without a UI prompt. This event can only occur if the user's phone number was provided to Link via the `/link/token/create` call and the user has previously consented to receive OTP codes from Plaid.

The user has completed the Assets and Bank Income Insights flow.

The user closed the third-party website or mobile app without completing the OAuth flow.

The user has chosen to link a new institution instead of linking a saved institution. This event is only emitted in the Link Returning User Experience flow.

A recoverable error occurred in the Link flow, see the `error_code` metadata.

The user has exited without completing the Link flow and the [onExit](https://plaid.com#onexit) callback is fired.

The user encountered an error while completing the third-party's OAuth login flow.

The user has exited Link after successfully linking an Item.

An Identity Match check configured via the Account Verification Dashboard failed the Identity Match rules and did not detect a match.

An Identity Match check configured via the Account Verification Dashboard passed the Identity Match rules and detected a match.

The user has started a step of the Identity Verification flow. The step is indicated by `view_name`.

The user has passed a step of the Identity Verification flow. The step is indicated by `view_name`.

The user has failed a step of the Identity Verification flow. The step is indicated by `view_name`.

The user has reached the pending review state.

The user has started a new Identity Verification session.

The user has resumed an existing Identity Verification session.

The user has passed their Identity Verification session.

The user has failed their Identity Verification session.

The user has completed their Identity Verification session, which is now in a pending review state.

The user has opened the UI of their Identity Verification session.

The user has resumed the UI of their Identity Verification session.

The user has closed the UI of their Identity Verification session.

The user's date of birth passed to Link is not eligible for Layer Extended Autofill.

The user phone number passed to Link is not eligible for Layer.

The user phone number passed to Link is eligible for Layer and `open()` may now be called.

The user selected an institution that was presented as a matched institution. This event can be emitted if [Embedded Institution Search](https://plaid.com/docs/link/embedded-institution-search/index.html.md) is being used, if the institution was surfaced as a matched institution likely to have been linked to Plaid by a returning user, or if the institution's `routing_number` was provided when calling `/link/token/create`. For details on which scenario is triggering the event, see `metadata.matchReason`.

The user has opened Link.

The user has opened my.plaid.com. This event is only sent when Link is initialized with Assets as a product

The user has navigated to a third-party website or mobile app in order to complete the OAuth login flow.

The user has searched for an institution.

The user has chosen whether to Link instantly or manually (i.e., with micro-deposits). This event emits the `selection` metadata to indicate the user's selection.

The user selected a brand, e.g. Bank of America. The `SELECT_BRAND` event is only emitted for large financial institutions with multiple online banking portals.

The user selected an institution with a `DEGRADED` health status and was shown a corresponding message.

The user selected an institution with a `DOWN` health status and was shown a corresponding message.

The user selected an institution Plaid does not support all requested products for and was shown a corresponding message.

The user selected an institution.

The user has opted to not provide their phone number to Plaid. This event is only emitted in the Link Returning User Experience flow.

The user has submitted an account number. This event emits the `account_number_mask` metadata to indicate the mask of the account number the user provided.

The user has submitted credentials.

The user is being prompted to submit documents for an Income verification flow.

The user encountered an error when submitting documents for an Income verification flow.

The user has successfully submitted documents for an Income verification flow.

The user has submitted MFA.

The user has submitted an OTP code during the phone number verification flow. This event is only emitted in the Link Returning User Experience (Remember Me) flow or Layer flow. This event will not be emitted if the phone number is verified via SNA.

The user has submitted their phone number. This event is only emitted in the Link Returning User Experience (Remember Me) flow.

The user has submitted a routing number. This event emits the `routing_number` metadata to indicate user's routing number.

The `TRANSITION_VIEW` event indicates that the user has moved from one view to the next.

The user has successfully verified their phone number via either OTP or SNA. This event is only emitted in the Link Returning User Experience (Remember Me) flow or the Layer flow.

The user has viewed data types on the data transparency consent pane.

object

An object containing information about the event.

nullable, string

The account number mask extracted from the user-provided account number. If the user-inputted account number is four digits long, `account_number_mask` is empty. Emitted by `SUBMIT_ACCOUNT_NUMBER`.

nullable, string

The error type that the user encountered. Emitted by: `ERROR`, `EXIT`.

nullable, string

The error code that the user encountered. Emitted by `ERROR`, `EXIT`.

nullable, string

The error message that the user encountered. Emitted by: `ERROR`, `EXIT`.

nullable, string

The status key indicates the point at which the user exited the Link flow. Emitted by: `EXIT`

nullable, string

The ID of the selected institution. Emitted by: _all events_.

nullable, string

The name of the selected institution. Emitted by: _all events_.

nullable, string

The query used to search for institutions. Emitted by: `SEARCH_INSTITUTION`.

nullable, string

Indicates if the current Link session is an update mode session. Emitted by: `OPEN`.

nullable, string

The reason this institution was matched. This will be either `returning_user` or `routing_number` if emitted by: `MATCHED_SELECT_INSTITUTION`. Otherwise, this will be `SAVED_INSTITUTION` or `AUTO_SELECT_SAVED_INSTITUTION` if emitted by: `SELECT_INSTITUTION`.

nullable, string

The routing number submitted by user at the micro-deposits routing number pane. Emitted by `SUBMIT_ROUTING_NUMBER`.

nullable, string

If set, the user has encountered one of the following MFA types: `code`, `device`, `questions`, `selections`. Emitted by: `SUBMIT_MFA` and `TRANSITION_VIEW` when `view_name` is `MFA`

nullable, string

The name of the view that is being transitioned to. Emitted by: `TRANSITION_VIEW`.

The view showing Terms of Service in the identity verification flow.

The user has connected their account.

We ask the user to consent to the privacy policy.

Asking the user for their account credentials.

The view requesting Documentary Verification in the identity verification flow (configured via "Fallback Settings" in the "Rulesets" section of the template editor).

An error has occurred.

Confirming if the user wishes to close Link.

The user has authorized an instant micro-deposit to be sent to their account over the RTP or FedNow network with a 3-letter code to verify their account.

The view representing the "know your customer" step in the identity verification flow.

Link is making a request to our servers.

The user is asked by the institution for additional MFA authentication.

The user is asked to insert their account and routing numbers.

The user goes through the Same-Day Micro-deposits flow with Reroute to Credentials.

The user is informed they will authenticate with the financial institution via OAuth.

The user is asked to review their profile data in the Layer flow.

The user was presented with a Google reCAPTCHA to verify they are human.

The risk check step in the identity verification flow (configured via "Risk Rules" in the "Rulesets" section of the template editor).

The user has authorized a same day micro-deposit to be sent to their account over the ACH network with a 3-letter code to verify their account.

The watchlist screening step in the identity verification flow.

We ask the user to choose an account.

The user is asked to choose whether to Link instantly or manually (i.e., with micro-deposits).

The user is asked to select a brand, e.g. Bank of America. The brand selection interface occurs before the institution select pane and is only provided for large financial institutions with multiple online banking portals.

We ask the user to choose their institution.

The user is asked to select their saved accounts and/or new accounts for linking in the Link Returning User Experience (Remember Me) flow.

The user is asked to pick a saved institution or link a new one in the Link Returning User Experience (Remember Me) flow.

The view in the identity verification flow which uses the camera to confirm there is a real user present that matches their ID documents.

The user is asked for their phone number in the Link Returning User Experience (Remember Me) flow.

The user is asked to upload documents (for Income verification).

The user is asked to verify their phone in the Link Returning User Experience (Remember Me) flow or the Layer flow. This screen will appear even if a non-OTP verification method is used.

The SMS verification step in the identity verification flow.

string

The request ID for the last request made by Link. This can be shared with Plaid Support to expedite investigation. Emitted by: _all events_.

string

The `link_session_id` is a unique identifier for a single session of Link. It's always available and will stay constant throughout the flow. Emitted by: _all events_.

string

An ISO 8601 representation of when the event occurred. For example `2017-09-14T14:42:19.350Z`. Emitted by: _all events_.

nullable, string

The Auth Type Select flow type selected by the user. Possible values are `flow_type_manual` or `flow_type_instant`. Emitted by: `SELECT_AUTH_TYPE`.

```tsx
import {
  PlaidLinkOnEvent,
  PlaidLinkOnEventMetadata,
  PlaidLinkStableEvent,
} from 'react-plaid-link';

const onEvent = useCallback(
  (
    eventName: PlaidLinkStableEvent | string,
    metadata: PlaidLinkOnEventMetadata,
  ) => {
    // log eventName and metadata
  },
  [],
);

```

```javascript
const handler = Plaid.create({
  ...,
  onEvent: (eventName, metadata) => {
    // send event and metadata to self-hosted analytics
    analytics.send(eventName, metadata);
  },
});

```

Metadata schema

```javascript
{
  error_type: 'ITEM_ERROR',
  error_code: 'INVALID_CREDENTIALS',
  error_message: 'the credentials were not correct',
  exit_status: null,
  institution_id: 'ins_4',
  institution_name: 'Wells Fargo',
  institution_search_query: 'wellsf',
  mfa_type: null,
  view_name: 'ERROR',
  request_id: 'm8MDnv9okwxFNBV',
  link_session_id: '30571e9b-d6c6-42ee-a7cf-c34768a8f62d',
  timestamp: '2017-09-14T14:42:19.350Z',
  selection: null,
}
```

\=\*=\*=\*=

#### open() 

Calling `open` will display the Consent Pane view to your user, starting the Link flow. Once `open` is called, you will begin receiving events via the [onEvent callback](https://plaid.com#onevent) .

**Properties**

This endpoint or method takes an empty request body.

```javascript
const handler = Plaid.create({ ... });

// Open Link
handler.open();

```

```tsx
const { open, exit, ready } = usePlaidLink(config);

// Open Link
if (ready) {
  open();
}

```

\=\*=\*=\*=

#### exit() 

The `exit` function allows you to programmatically close Link. Calling `exit` will trigger either the [onExit](https://plaid.com#onexit) or [onSuccess](https://plaid.com#onsuccess) callbacks.

The `exit` function takes a single, optional argument, a configuration `Object`.

**Properties**

boolean

If `true`, Link will exit immediately. If `false`, or the option is not provided, an exit confirmation screen may be presented to the user.

```javascript
const handler = Plaid.create({ ... });

// Graceful exit - Link may display a confirmation screen
// depending on how far the user is in the flow
handler.exit();

```

```tsx
const { open, exit, ready } = usePlaidLink(config);

// Graceful exit - Link may display a confirmation screen
// depending on how far the user is in the flow
exit();

```

```javascript
const handler = Plaid.create({ ... });

// Force exit - Link exits immediately
handler.exit({ force: true });

```

```tsx
const { open, exit, ready } = usePlaidLink(config);

// Force exit - Link exits immediately
exit({ force: true });

```

\=\*=\*=\*=

#### destroy() 

The `destroy` function allows you to destroy the Link handler instance, properly removing any DOM artifacts that were created by it. Use `destroy()` when creating new replacement Link handler instances in the `onExit` callback.

**Properties**

This endpoint or method takes an empty request body.

```javascript
const handler = Plaid.create({ ... })

// Destroy and clean up the Link handler & iFrame
handler.destroy();

```

```tsx
// On unmount usePlaidLink hook automatically destroys any
// existing link instance

```

\=\*=\*=\*=

#### submit() 

The `submit` function is currently only used in the Layer product. It allows the client application to submit additional user-collected data to the Link flow (e.g. a user phone number).

**Properties**

string

The user's phone number.

string

The user's date of birth. To be provided in the format "yyyy-mm-dd".

```javascript
const handler = Plaid.create({ ... })

// After collecting a user phone number, submit it to Link
handler.submit({
  "phone_number": "+14155550123"
});

```

```tsx
const { open, exit, submit } = usePlaidLink(config);

// After collecting a user phone number...
submit({
    "phone_number": "+14155550123"
});

```

#### OAuth 

Using Plaid Link with an OAuth flow requires some additional setup instructions. For details, see the [OAuth Guide](https://plaid.com/docs/link/oauth/index.html.md) .

#### Supported browsers 

Plaid officially supports Link on the latest versions of Chrome, Firefox, Safari, and Edge. Browsers are supported on Windows, Mac, Linux, iOS, and Android. Previous browser versions are also supported, as long as they are actively maintained; Plaid does not support browser versions that are no longer receiving patch updates, or that have been assigned official end of life (EOL) or end of support (EOS) status.

Ad-blocking software is not officially supported with Link web, and some ad-blockers are known to cause conflicts with Link.

#### Example code in Plaid Pattern 

For a real-life example of using Plaid Link for React, see [LaunchLink.tsx](https://github.com/plaid/pattern/blob/master/client/src/components/LaunchLink.tsx) . This file illustrates the code for implementation of Plaid Link for React for the Node-based [Plaid Pattern](https://github.com/plaid/pattern) sample app.