React Native SDK

Add SolveoAI chat to iOS and Android apps with @solveoai/react-native and the headless @solveoai/chat-client. Available on npm. Works with Expo and React Native CLI.

Packages

@solveoai/chat-client

Headless TypeScript client. Zero React Native deps — use it for custom UIs or non-RN environments.

npm package

@solveoai/react-native

Ready-made chat UI, hooks, and overlays. Depends on @solveoai/chat-client.

npm package

Video tutorial coming soon

Add Solveo AI chat to a React Native app

1. Install

Install from npm, plus Expo-compatible peers:

pnpm add @solveoai/chat-client @solveoai/react-native \
  @react-native-async-storage/async-storage \
  expo-image-picker expo-document-picker expo-av \
  expo-notifications socket.io-client \
  react-native-markdown-display

Add Expo plugins to app.json:

{
  "expo": {
    "plugins": [
      "expo-notifications",
      "expo-image-picker",
      "expo-document-picker",
      "expo-av"
    ]
  }
}

For React Native CLI (bare), use the equivalent peer packages (react-native-image-picker, react-native-document-picker, react-native-audio-recorder-player, Firebase messaging) and run pod install in ios/.

2. Provider setup

Create a SolveoClient with your widget ID (from the dashboard Deploy / Widgets page), then wrap your app in SolveoProvider:

import React from "react";
import AsyncStorage from "@react-native-async-storage/async-storage";
import { SolveoClient } from "@solveoai/chat-client";
import { SolveoProvider, SolveoChatScreen } from "@solveoai/react-native";

const client = new SolveoClient({
  widgetId: "YOUR_WIDGET_ID", // from the SolveoAI dashboard
  // agentId: "YOUR_AGENT_ID", // optional alternative to widgetId
  // apiUrl: "https://api.solveoai.io/api/v1", // optional override
  persistence: {
    adapter: AsyncStorage,
    keyPrefix: "myapp_",
  },
});

export default function App() {
  return (
    <SolveoProvider client={client} theme={{ mode: "auto" }}>
      <SolveoChatScreen
        showHeader
        showHistory
        enableAttachments
        enableVoiceNotes
      />
    </SolveoProvider>
  );
}

enableVoiceNotes turns on in-chat audio messages (voice notes). It is not phone or telephony calling.

3. Basic chat embed

Use a full-screen chat surface, or a floating overlay on top of your existing screens:

Full-screen chat

Render SolveoChatScreen inside SolveoProvider (see above).

Floating overlay (FAB)

import { SolveoProvider, SolveoOverlay } from "@solveoai/react-native";

export default function App() {
  return (
    <SolveoProvider client={client}>
      {/* Your existing app content */}
      <SolveoOverlay position="bottom-right" buttonIcon="💬" />
    </SolveoProvider>
  );
}

Optional features

Attachments

Enable with enableAttachments on SolveoChatScreen, or use useAttachments() for custom pickers.

Voice notes

In-chat audio messages via enableVoiceNotes / useVoiceRecorder() — not telephony.

Push notifications

Call usePushNotifications() inside SolveoProvider, then registerExpo() or registerFirebase().

import { useEffect } from "react";
import { usePushNotifications } from "@solveoai/react-native";

function PushRegistrar() {
  const { isSupported, registerExpo } = usePushNotifications();

  useEffect(() => {
    if (!isSupported) return;
    void registerExpo();
  }, [isSupported, registerExpo]);

  return null;
}

Key APIs

SolveoClient
Headless client — widgetId, optional agentId / apiUrl, persistence, messaging, uploads, devices.
SolveoProvider
Supplies the client, theme, and optional component overrides to hooks and screens.
SolveoChatScreen
Full chat UI with header, history, attachments, and voice notes flags.
SolveoOverlay
Floating action button that opens chat over your existing navigation.
usePushNotifications
Registers Expo or Firebase push tokens with Solveo via the client.

Next steps

Other deployment channels

Web widget, WhatsApp, Slack, Shopify, and more

View guides

Widget builder

Create and brand a widget ID for your mobile embed

Read guide

Need Help?

Our support team can help you embed SolveoAI in your mobile app

Contact Support Browse All Docs