> ## Documentation Index
> Fetch the complete documentation index at: https://docs.crossmint.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Providers

> React context providers for React SDK reference for Crossmint checkout

1. `CrossmintProvider` — SDK initialization (required for all Crossmint features)
2. `CrossmintCheckoutProvider` — Checkout order state management

## CrossmintProvider

### Props

<ResponseField name="apiKey" type="string" required>
  Your Crossmint client-side API key.
</ResponseField>

<ResponseField name="appId" type="string">
  Application identifier, sent as `x-app-identifier` header.
</ResponseField>

<ResponseField name="consoleLogLevel" type="ConsoleLogLevel">
  Minimum log level for console output (or "silent" to suppress all output). Logs below this level will not be written to the console. Set to "silent" to completely suppress console output. Defaults to "debug" (all logs shown) for backward compatibility.
</ResponseField>

<ResponseField name="extensionId" type="string">
  Extension identifier, sent as `x-extension-id` header.
</ResponseField>

<ResponseField name="jwt" type="string">
  JWT token for authentication.
</ResponseField>

<ResponseField name="overrideBaseUrl" type="string">
  Override the base API URL.
</ResponseField>

### Usage

```tsx theme={null}
import { CrossmintProvider } from "@crossmint/client-sdk-react-ui";

function App() {
    return (
        <CrossmintProvider apiKey="YOUR_CLIENT_API_KEY">
            {/* Your app content */}
        </CrossmintProvider>
    );
}
```

***

## CrossmintCheckoutProvider

### Usage

```tsx theme={null}
import {
    CrossmintProvider,
    CrossmintCheckoutProvider,
} from "@crossmint/client-sdk-react-ui";

function App() {
    return (
        <CrossmintProvider apiKey="YOUR_CLIENT_API_KEY">
            <CrossmintCheckoutProvider>
                {/* Your checkout components */}
            </CrossmintCheckoutProvider>
        </CrossmintProvider>
    );
}
```

> **Note:** CrossmintCheckoutProvider must be nested inside CrossmintProvider.
