Skip to main content

Overview

The Bambuser React Native Commerce SDK (@bambuser/react-native-commerce-sdk) lets you embed live video shopping experiences in iOS and Android React Native apps with a single declarative component. It wraps Bambuser's native iOS and Android SDKs and exposes them through a React component plus an imperative ref-based API. No native code is required in your app.

1. Architecture​

High-performance video SDKs for React Native are not ground-up rewrites in JavaScript. The Bambuser package follows the industry-standard pattern:

  • Native Core: Native iOS (Swift) and Android (Kotlin / Jetpack Compose) SDKs handle decoding, rendering, DRM, and all real-time video work.
  • Bridge Layer: Functionality is exposed to React Native through a native view component (BambuserVideoView) and a small set of native modules.

Video frames, audio, and network I/O stay fully native. Only high-level commands (play, pause, invoke, notify) and lifecycle events cross the JS ↔ native boundary, so there is no performance cost over a pure native integration.

2. Feature Overview​

FeatureiOSAndroid
Live video playback✅✅
Play / pause / mute / unmute✅✅
invoke / notify (call into player & respond to callbacks)✅✅
Picture-in-Picture✅✅
Player state events (onStatus, onProgress, onError)✅✅
Custom events (onEvent)✅✅
Thumbnail tap callback (onThumbnailTapped)✅–
Safe-area edge control✅✅
Analytics tracking (BambuserSDK.track)✅✅

v1 scope: live videos only. Shoppable / on-demand video is not included in this release.

3. Next Steps​

  1. Installation: install the package and configure iOS / Android.
  2. Setup: mount BambuserVideoView and configure the player.
  3. Player API: ref methods, lifecycle, Picture-in-Picture, and the invoke / notify bridge.
  4. Events: handle status, progress, errors, and custom player events.
  5. Tracking: send conversion and shopper events through BambuserSDK.track.
  6. Configuration and Functions: button, UI, and behavior configuration.
  7. Cart integration: sync the in-player cart with your native cart.
  8. Product hydration: supply product data at runtime.
  9. Product highlights: react to highlighted products and custom navigation.
  10. Add to wishlist: connect the player's wishlist UI to your app.
  11. Captions: show, hide, list, and select caption tracks.
  12. Audio Control: mute, unmute, and hide the volume button.
  13. Promoted Shows: show or hide the promoted shows carousel.
Need a custom implementation?

The packaged SDK is the recommended path for most teams. If your use case requires deeper customization than what BambuserVideoView exposes, you can always roll your own implementation or bridge on top of the native iOS and Android SDKs.