The Pipecat React Native SDK leverages the Pipecat JavaScript SDK to provide seamless integration for React Native applications. Since the JavaScript SDK is designed to work across both web and React Native platforms, the core functionalities remain the same:

• Device and media stream management
• Managing bot configuration
• Sending actions to the bot
• Handling bot messages and responses
• Managing session state and errors

The primary difference lies in the transport layer, which is tailored to support the unique requirements of the React Native environment.

For example, when using the SDK with React Native, you would install RNDailyTransport instead of DailyTransport.

​

Installation

Install the SDK and a transport implementation (e.g. Daily for WebRTC):

npm i @pipecat-ai/react-native-daily-transport
npm i @daily-co/react-native-daily-js@^0.70.0
npm i @daily-co/react-native-webrtc@^118.0.3-daily.2
npm i @react-native-async-storage/async-storage@^1.23.1
npm i react-native-background-timer@^2.4.1
npm i react-native-get-random-values@^1.11.0

If you are using Expo, you will also need to add the following dependencies:

npm i @config-plugins/react-native-webrtc@^10.0.0
npm i @daily-co/config-plugin-rn-daily-js@0.0.7

​

Requirements

This package introduces some constraints on what OS/SDK versions your project can support:

• iOS: Deployment target >= 13
• Android: minSdkVersion >= 24

​

Quick start

Here’s a simple example using Daily as the transport layer:

import { RNDailyTransport } from '@pipecat-ai/react-native-daily-transport';
import { RTVIClient } from '@pipecat-ai/client-js';

// Create and configure the client
let voiceClient = new RTVIClient({
  params: {
    baseUrl: process.env.PIPECAT_API_URL || "/api",
  },
  transport: new RNDailyTransport(),
  enableMic: true
});

// Connect to your bot
await voiceClient.connect();

You can find a basic working example here and a more comprehensive example here.

​

Explore the SDK

The Pipecat React Native SDK leverages the Pipecat JavaScript SDK for seamless integration with React Native applications. For detailed information, refer to our JavaScript documentation.

Just ensure you use the appropriate transport layer for React Native.