Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.layerfi.com/llms.txt

Use this file to discover all available pages before exploring further.

All Layer React components are nested under the LayerProvider component. This component takes in the below properties. 
import { LayerProvider, SupportedLocale } from "@layerfi/components";

<LayerProvider
  businessId="<layer_business_id>"
  businessAccessToken="<access_token>"
  environment={'sandbox'}
  locale={SupportedLocale.enUS}
  onError={error => {
    console.error('Layer error:', error)
  }}
  eventCallbacks={{
    onTransactionCategorized: () => {
      console.log('Transaction categorized')
    },
  }}
>
  {...}
</LayerProvider>

​
Properties

​
businessId
string
required
The ID of the business whose information you’re showing.
​
businessAccessToken
string
required
Temporary authentication token scoped to this specific business. See the getting started guide for how to fetch these tokens on your backend.
Do not use your Layer API key as the token in production. Retrieve a business-scoped access token from the Layer API and pass that value here instead.
​
environment
'production' | 'sandbox'
The predefined Layer environment to connect to. Defaults to production. Use sandbox for development and testing. Cannot be used together with environmentConfigOverride.
​
environmentConfigOverride
EnvironmentConfigOverride
Custom configuration to override API and auth endpoints. Use this instead of environment when connecting to a non-standard deployment. Cannot be used together with environment.
​
locale
SupportedLocale
default:"SupportedLocale.enUS"
Sets the locale for all Layer components. Controls the language used for UI text, date formatting, numerical formatting, and the Layer-Locale header sent with API requests. Defaults to SupportedLocale.enUS.The SupportedLocale enum is exported from @layerfi/components and currently includes:
  • SupportedLocale.enUS ('en-US') — English (United States)
  • SupportedLocale.frCA ('fr-CA') — French (Canada)
​
theme
LayerThemeConfig
Customizes the look and feel of the components. See Styling for details.
​
usePlaidSandbox
boolean
Overrides whether Plaid sandbox mode is used for bank account linking. Useful for testing.
​
onError
(error: LayerError) => void
Callback to be notified about exceptions within the components. The LayerError object contains type (e.g., 'unauthenticated', 'api', 'render'), scope, and payload.
​
eventCallbacks
EventCallbacks
Callbacks that will be triggered for specific user events within the components.

​
Environment Configuration

There are two mutually exclusive ways to configure the Layer environment: Predefined environment: 
<LayerProvider
  businessId="<layer_business_id>"
  businessAccessToken="<access_token>"
  environment="sandbox"
>
  {...}
</LayerProvider>
Custom URL override: 
<LayerProvider
  businessId="<layer_business_id>"
  businessAccessToken="<access_token>"
  environmentConfigOverride={{
    environment: 'sandbox',
    apiUrl: 'https://custom-api.example.com',
    authUrl: 'https://custom-auth.example.com/token',
    scope: 'https://sandbox.layerfi.com/sandbox'
  }}
>
  {...}
</LayerProvider>