RealTimeX
Sign inStart for free
RealTimeXMobile Package
Introduction5-minute overviewFeaturesHow the package worksGlossary
Requirements & dependenciesBackend credentialsInstallation step by stepTutorial — your first chat appProject config fileApp entry — index.jsQuick start — minimum working chatComplete ChatScreen example
Native configuration (iOS & Android)Firebase, APNs & backend setup
Navigation — embedding the chatSession, auth & Socket.IOPermissions & access controlAudio & video callingPush notificationsMentions viewRich-text messages (WebView editor)Total unread count
Customization — four waysDefault component fallback (important)Which slots are wiredCustomization examples (Case 1–4)UI feature flags & copy (ui)Chat info (group + DM)Style overrides (ui.styles)Render props (ChatProvider)Theme, fonts & appearance
ChatProvider props referenceconfigureChat options referenceHooks & storeCallbacks referenceAPI query paramsAll exports
Production integration pattern (Fieldr)Host app integration — providers, toasts, tab bars & navigationEnvironment variablesLocal package / monorepo (Metro)
TroubleshootingSetup checklistArchitectureDocumentation & file mapPackage development (maintainers)License
Mobile packageGetting Started

Requirements & dependencies

You must install (peer dependencies)

Peers are not installed automatically. Each must exist once in your app — never let a second copy of react or react-native end up nested under this package.

Chat (always):

PackageVersionWhenWhy
react≥ 18AlwaysUI framework — exactly one copy
react-native≥ 0.78AlwaysSame reason
@react-native-async-storage/async-storage^3.1.1AlwaysPersisted chat session, drafts, appearance
@react-native-clipboard/clipboard^1.16.3AlwaysCopy message
@react-native-community/netinfo^12.0.1AlwaysReconnect / offline handling
@react-native-community/push-notification-ios^1.12.0AlwaysiOS notification clearing and badges
@react-native-documents/picker^12.0.1AlwaysDocument attachments
@react-native-firebase/app^24 || ^25AlwaysFirebase core (push)
@react-native-firebase/messaging^24 || ^25AlwaysFCM token, background messages
@react-native-masked-view/masked-view^0.3.2AlwaysNavigation stack transitions
@react-navigation/native^7.3.13AlwaysChat stack
@react-navigation/stack^7.10.16AlwaysChat stack
@react-navigation/bottom-tabs^7.18.13AlwaysType imports / demo tabs
@shopify/flash-list^2.3.2AlwaysConversation and message lists
react-native-config^1.6.1AlwaysEnv fallback for config values
react-native-device-info^15.0.2AlwaysPush installation id, app id
react-native-gesture-handler^3.1.0AlwaysSwipe to reply, sheets
react-native-heic-converter^1.3.3AlwaysHEIC photos → JPEG before upload
react-native-image-crop-picker^0.51.1AlwaysCamera / gallery attachments, group photo
react-native-keyboard-aware-scroll-view^0.9.5AlwaysForms (create group, edit info)
react-native-permissions^5.6.0AlwaysCamera / microphone / photos prompts
react-native-reanimated^4.5.2AlwaysAnimations
react-native-worklets^0.12.0AlwaysReanimated 4 runtime + Babel plugin
react-native-responsive-screen^1.4.2AlwaysLayout sizing
react-native-safe-area-context^5.8.0AlwaysSafe areas
react-native-screens^4.15.0AlwaysNative stack screens
react-native-svg^15.15.5AlwaysIcon set
react-native-toast-message^2.4.0AlwaysToasts and the in-app notification banner
react-native-webview^14.0.1AlwaysRich-text composer and Canvas editor
socket.io-client^4.8.3AlwaysReal-time connection

Calling (audio / video / PiP / screen share):

PackageVersionWhenWhy
@videosdk.live/react-native-sdk^0.6.0CallsMedia transport; register() once in index.js
@videosdk.live/react-native-incallmanager^0.1.3CallsSpeaker / earpiece routing, proximity

@videosdk.live/react-native-webrtc (0.0.22 with SDK 0.6.x) comes in transitively with the SDK.

Optional native peers (marked optional in peerDependenciesMeta — the package requires them inside try, so apps without them still bundle):

PackageVersionWhenWhy
@notifee/react-native≥ 9Android full-screen callsDraws the ringing call notification when the app is killed / locked; also needed for foregroundSystemNotifications
react-native-callkeep≥ 4.3iOS calls when killed / lockedCallKit UI for VoIP pushes
react-native-voip-push-notification≥ 3.3iOS calls when killed / lockedPushKit token + VoIP pushes

Bundled inside the package (installs automatically)

zustand, immer, axios, apisauce, date-fns, moment, yup, rn-emoji-keyboard. They are regular dependencies and install and uninstall with the package. Do not add them to your own package.json just for the chat.

The rich-text editor is built from rich-editor/ (Lexical + DOMPurify) by the package maintainers into one HTML string, src/richEditor/editorHtml.generated.ts, which runs inside react-native-webview. Lexical, DOMPurify and esbuild are devDependencies of this repository only — host apps never install them.

Verify after install:

shell
1npm ls @realtimexsco/live-chat-react-native2npm ls react-native     # expect exactly one copy3npm ls react            # expect exactly one copy
PreviousGlossaryNextBackend credentials

On this page

You must install (peer dependencies)Bundled inside the package (installs automatically)
Back to top