MDLProvider

Configure the React mDL context provider for your application.

Overview

MDLProvider is a React context provider that initializes the mDL SDK and makes it available to all child components. Wrap your application (or the part that needs verification) with this provider.

Basic Setup

Provider Props

Prop	Type	Default	Description
`apiKey`	`string`	Required	Your Owl Eyes API key
`environment`	`'sandbox' \| 'production'`	`'sandbox'`	API environment
`trustAnchorSource`	`TrustAnchorSource`	`'aamva_vical'`	Trust anchor source
`timeout`	`number`	`30000`	Default timeout (ms)
`onInitialized`	`() => void`	-	Called when SDK is ready
`onError`	`(error) => void`	-	Called on initialization error
`children`	`ReactNode`	Required	Child components

Full Configuration

Trust Anchor Sources

Configure the trust anchor source based on your deployment region:

Accessing Provider Context

Use the useMDL hook to access the SDK context:

Context Values

Property	Type	Description
`isInitialized`	`boolean`	Whether SDK is ready
`isInitializing`	`boolean`	Whether SDK is initializing
`error`	`Error \| null`	Initialization error if any
`verifier`	`OwlEyesMDL \| null`	SDK instance (for advanced use)
`config`	`MDLConfig`	Current configuration

Environment Variables

Store your API key securely in environment variables:

Security Note: The API key is exposed to the client. Use environment-specific keys and enable domain restrictions in your Owl Eyes dashboard.

Next.js App Router

For Next.js App Router, create a client component wrapper:

Next Steps

Components

Learn about verification components.

Hooks

Build custom verification UIs.