@livekit/react-native 1.0.0 → 1.1.0

package/README.md

@@ -1,40 +1,91 @@
-<!--BEGIN_BANNER_IMAGE--><!--END_BANNER_IMAGE-->
+<!--BEGIN_BANNER_IMAGE-->
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="/.github/banner_dark.png">
+    <source media="(prefers-color-scheme: light)" srcset="/.github/banner_light.png">
+    <img style="width:100%;" alt="The LiveKit icon, the name of the repository and some sample code in the background." src="/.github/banner_light.png">
+  </picture>
+  <!--END_BANNER_IMAGE-->
 
 # livekit-react-native
 
-<!--BEGIN_DESCRIPTION-->
-LiveKit Client SDK for React Native. (beta)
-<!--END_DESCRIPTION-->
-
-> **Info**
-> Beta status currently
+<!--BEGIN_DESCRIPTION-->Use this SDK to add real-time video, audio and data features to your React Native app. By connecting to a self- or cloud-hosted <a href="https://livekit.io/">LiveKit</a> server, you can quickly build applications like interactive live streaming or video calls with just a few lines of code.<!--END_DESCRIPTION-->
 
 ## Installation
 
 ### NPM
 
 ```sh
-npm install @livekit/react-native
+npm install @livekit/react-native @livekit/react-native-webrtc
 ```
 
 ### Yarn
 
 ```sh
-yarn add @livekit/react-native
+yarn add @livekit/react-native @livekit/react-native-webrtc
 ```
 
-This library depends on `react-native-webrtc`, which has additional installation instructions found here:
+This library depends on `@livekit/react-native-webrtc`, which has additional installation instructions found here:
 
-- [iOS Installation Guide](https://github.com/react-native-webrtc/react-native-webrtc/blob/master/Documentation/iOSInstallation.md)
-- [Android Installation Guide](https://github.com/react-native-webrtc/react-native-webrtc/blob/master/Documentation/AndroidInstallation.md)
+- [iOS Installation Guide](https://github.com/livekit/react-native-webrtc/blob/master/Documentation/iOSInstallation.md)
+- [Android Installation Guide](https://github.com/livekit/react-native-webrtc/blob/master/Documentation/AndroidInstallation.md)
 
-## Example app
+----
 
-We've included an [example app](example/) that you can try out.
+Once the `@livekit/react-native-webrtc` dependency is installed, one last step is needed to finish the installation:
+
+### Android
+
+In your [MainApplication.java](https://github.com/livekit/client-sdk-react-native/blob/main/example/android/app/src/main/java/com/example/livekitreactnative/MainApplication.java) file:
 
-## Beta limitations
+```
+import com.livekit.reactnative.video.SimulcastVideoEncoderFactoryWrapper;
+import com.oney.WebRTCModule.WebRTCModuleOptions;
+import com.oney.WebRTCModule.webrtcutils.H264AndSoftwareVideoDecoderFactory;
+
+import org.webrtc.*;
+
+public class MainApplication extends Application implements ReactApplication {
+
+  @Override
+  public void onCreate() {
+    // Place this above any other RN related initialization
+    WebRTCModuleOptions options = WebRTCModuleOptions.getInstance();
+    options.videoEncoderFactory = new SimulcastVideoEncoderFactoryWrapper(null, true, true);
+    options.videoDecoderFactory = new H264AndSoftwareVideoDecoderFactory(null);
+    // ...
+  }
+}
+```
 
-This library does not currently support simulcast due to a limitation with `react-native-webrtc`
+### iOS
+
+In your [AppDelegate.m](https://github.com/livekit/client-sdk-react-native/blob/main/example/ios/LivekitReactNativeExample/AppDelegate.mm) file:
+
+```
+#import "WebRTCModule.h"
+#import "WebRTCModuleOptions.h"
+
+@implementation AppDelegate
+
+- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
+{
+  // Place this above any other RN related initialization
+  RTCDefaultVideoEncoderFactory *videoEncoderFactory = [[RTCDefaultVideoEncoderFactory alloc] init];
+  RTCVideoEncoderFactorySimulcast *simulcastVideoEncoderFactory = 
+          [[RTCVideoEncoderFactorySimulcast alloc] initWithPrimary:videoEncoderFactory fallback:videoEncoderFactory];
+  WebRTCModuleOptions *options = [WebRTCModuleOptions sharedInstance];
+  options.videoEncoderFactory = simulcastVideoEncoderFactory;
+  //...
+}
+```
+
+### Expo
+
+LiveKit is available on Expo through development builds. [See the instructions found here](https://github.com/livekit/client-sdk-react-native/wiki/Expo-Development-Build-Instructions).
+
+## Example app
+
+We've included an [example app](example/) that you can try out.
 
 ## Usage
 
@@ -153,4 +204,14 @@ See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the
 
 Apache License 2.0
 
-<!--BEGIN_REPO_NAV--><!--END_REPO_NAV-->
+<!--BEGIN_REPO_NAV-->
+<br/><table>
+<thead><tr><th colspan="2">LiveKit Ecosystem</th></tr></thead>
+<tbody>
+<tr><td>Client SDKs</td><td><a href="https://github.com/livekit/components-js">Components</a> · <a href="https://github.com/livekit/client-sdk-js">JavaScript</a> · <a href="https://github.com/livekit/client-sdk-rust">Rust</a> · <a href="https://github.com/livekit/client-sdk-swift">iOS/macOS</a> · <a href="https://github.com/livekit/client-sdk-android">Android</a> · <a href="https://github.com/livekit/client-sdk-flutter">Flutter</a> · <a href="https://github.com/livekit/client-sdk-unity-web">Unity (web)</a> · <b>React Native (beta)</b></td></tr><tr></tr>
+<tr><td>Server SDKs</td><td><a href="https://github.com/livekit/server-sdk-js">Node.js</a> · <a href="https://github.com/livekit/server-sdk-go">Golang</a> · <a href="https://github.com/livekit/server-sdk-ruby">Ruby</a> · <a href="https://github.com/livekit/server-sdk-kotlin">Java/Kotlin</a> · <a href="https://github.com/agence104/livekit-server-sdk-php">PHP (community)</a> · <a href="https://github.com/tradablebits/livekit-server-sdk-python">Python (community)</a></td></tr><tr></tr>
+<tr><td>Services</td><td><a href="https://github.com/livekit/livekit">Livekit server</a> · <a href="https://github.com/livekit/egress">Egress</a> · <a href="https://github.com/livekit/ingress">Ingress</a></td></tr><tr></tr>
+<tr><td>Resources</td><td><a href="https://docs.livekit.io">Docs</a> · <a href="https://github.com/livekit-examples">Example apps</a> · <a href="https://livekit.io/cloud">Cloud</a> · <a href="https://docs.livekit.io/oss/deployment">Self-hosting</a> · <a href="https://github.com/livekit/livekit-cli">CLI</a></td></tr>
+</tbody>
+</table>
+<!--END_REPO_NAV-->

package/android/build.gradle

@@ -9,7 +9,7 @@ buildscript {
   }
 
   dependencies {
-    classpath 'com.android.tools.build:gradle:3.2.1'
+    classpath("com.android.tools.build:gradle:7.3.1")
     // noinspection DifferentKotlinGradleVersion
     classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
   }
@@ -28,14 +28,15 @@ def getExtOrIntegerDefault(name) {
 
 android {
   compileSdkVersion getExtOrIntegerDefault('compileSdkVersion')
+  namespace "com.livekit.reactnative"
   defaultConfig {
     minSdkVersion 16
     targetSdkVersion getExtOrIntegerDefault('targetSdkVersion')
     versionCode 1
     versionName "1.0"
-    
+
   }
-  
+
   buildTypes {
     release {
       minifyEnabled false
@@ -129,5 +130,6 @@ dependencies {
   api 'com.facebook.react:react-native:+'
   implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
   api 'com.github.davidliu:audioswitch:c498d866c57f1d88056d5e7e7a78d622e3b0c046'
+  api 'io.github.webrtc-sdk:android:104.5112.09'
   implementation "androidx.annotation:annotation:1.4.0"
 }

package/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,5 +1,5 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-6.8-bin.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-7.5.1-all.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists

package/android/gradlew

@@ -1,7 +1,7 @@
-#!/usr/bin/env sh
+#!/bin/sh
 
 #
-# Copyright 2015 the original author or authors.
+# Copyright © 2015-2021 the original authors.
 #
 # Licensed under the Apache License, Version 2.0 (the "License");
 # you may not use this file except in compliance with the License.
@@ -17,67 +17,101 @@
 #
 
 ##############################################################################
-##
-##  Gradle start up script for UN*X
-##
+#
+#   Gradle start up script for POSIX generated by Gradle.
+#
+#   Important for running:
+#
+#   (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
+#       noncompliant, but you have some other compliant shell such as ksh or
+#       bash, then to run this script, type that shell name before the whole
+#       command line, like:
+#
+#           ksh Gradle
+#
+#       Busybox and similar reduced shells will NOT work, because this script
+#       requires all of these POSIX shell features:
+#         * functions;
+#         * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
+#           «${var#prefix}», «${var%suffix}», and «$( cmd )»;
+#         * compound commands having a testable exit status, especially «case»;
+#         * various built-in commands including «command», «set», and «ulimit».
+#
+#   Important for patching:
+#
+#   (2) This script targets any POSIX shell, so it avoids extensions provided
+#       by Bash, Ksh, etc; in particular arrays are avoided.
+#
+#       The "traditional" practice of packing multiple parameters into a
+#       space-separated string is a well documented source of bugs and security
+#       problems, so this is (mostly) avoided, by progressively accumulating
+#       options in "$@", and eventually passing that to Java.
+#
+#       Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
+#       and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
+#       see the in-line comments for details.
+#
+#       There are tweaks for specific operating systems such as AIX, CygWin,
+#       Darwin, MinGW, and NonStop.
+#
+#   (3) This script is generated from the Groovy template
+#       https://github.com/gradle/gradle/blob/master/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
+#       within the Gradle project.
+#
+#       You can find Gradle at https://github.com/gradle/gradle/.
+#
 ##############################################################################
 
 # Attempt to set APP_HOME
+
 # Resolve links: $0 may be a link
-PRG="$0"
-# Need this for relative symlinks.
-while [ -h "$PRG" ] ; do
-    ls=`ls -ld "$PRG"`
-    link=`expr "$ls" : '.*-> \(.*\)$'`
-    if expr "$link" : '/.*' > /dev/null; then
-        PRG="$link"
-    else
-        PRG=`dirname "$PRG"`"/$link"
-    fi
+app_path=$0
+
+# Need this for daisy-chained symlinks.
+while
+    APP_HOME=${app_path%"${app_path##*/}"}  # leaves a trailing /; empty if no leading path
+    [ -h "$app_path" ]
+do
+    ls=$( ls -ld "$app_path" )
+    link=${ls#*' -> '}
+    case $link in             #(
+      /*)   app_path=$link ;; #(
+      *)    app_path=$APP_HOME$link ;;
+    esac
 done
-SAVED="`pwd`"
-cd "`dirname \"$PRG\"`/" >/dev/null
-APP_HOME="`pwd -P`"
-cd "$SAVED" >/dev/null
+
+APP_HOME=$( cd "${APP_HOME:-./}" && pwd -P ) || exit
 
 APP_NAME="Gradle"
-APP_BASE_NAME=`basename "$0"`
+APP_BASE_NAME=${0##*/}
 
 # Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
 DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
 
 # Use the maximum available, or set MAX_FD != -1 to use that value.
-MAX_FD="maximum"
+MAX_FD=maximum
 
 warn () {
     echo "$*"
-}
+} >&2
 
 die () {
     echo
     echo "$*"
     echo
     exit 1
-}
+} >&2
 
 # OS specific support (must be 'true' or 'false').
 cygwin=false
 msys=false
 darwin=false
 nonstop=false
-case "`uname`" in
-  CYGWIN* )
-    cygwin=true
-    ;;
-  Darwin* )
-    darwin=true
-    ;;
-  MINGW* )
-    msys=true
-    ;;
-  NONSTOP* )
-    nonstop=true
-    ;;
+case "$( uname )" in                #(
+  CYGWIN* )         cygwin=true  ;; #(
+  Darwin* )         darwin=true  ;; #(
+  MSYS* | MINGW* )  msys=true    ;; #(
+  NONSTOP* )        nonstop=true ;;
 esac
 
 CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
@@ -87,9 +121,9 @@ CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
 if [ -n "$JAVA_HOME" ] ; then
     if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
         # IBM's JDK on AIX uses strange locations for the executables
-        JAVACMD="$JAVA_HOME/jre/sh/java"
+        JAVACMD=$JAVA_HOME/jre/sh/java
     else
-        JAVACMD="$JAVA_HOME/bin/java"
+        JAVACMD=$JAVA_HOME/bin/java
     fi
     if [ ! -x "$JAVACMD" ] ; then
         die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
@@ -98,7 +132,7 @@ Please set the JAVA_HOME variable in your environment to match the
 location of your Java installation."
     fi
 else
-    JAVACMD="java"
+    JAVACMD=java
     which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
 
 Please set the JAVA_HOME variable in your environment to match the
@@ -106,80 +140,95 @@ location of your Java installation."
 fi
 
 # Increase the maximum file descriptors if we can.
-if [ "$cygwin" = "false" -a "$darwin" = "false" -a "$nonstop" = "false" ] ; then
-    MAX_FD_LIMIT=`ulimit -H -n`
-    if [ $? -eq 0 ] ; then
-        if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then
-            MAX_FD="$MAX_FD_LIMIT"
-        fi
-        ulimit -n $MAX_FD
-        if [ $? -ne 0 ] ; then
-            warn "Could not set maximum file descriptor limit: $MAX_FD"
-        fi
-    else
-        warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT"
-    fi
+if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
+    case $MAX_FD in #(
+      max*)
+        MAX_FD=$( ulimit -H -n ) ||
+            warn "Could not query maximum file descriptor limit"
+    esac
+    case $MAX_FD in  #(
+      '' | soft) :;; #(
+      *)
+        ulimit -n "$MAX_FD" ||
+            warn "Could not set maximum file descriptor limit to $MAX_FD"
+    esac
 fi
 
-# For Darwin, add options to specify how the application appears in the dock
-if $darwin; then
-    GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\""
-fi
+# Collect all arguments for the java command, stacking in reverse order:
+#   * args from the command line
+#   * the main class name
+#   * -classpath
+#   * -D...appname settings
+#   * --module-path (only if needed)
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
 
 # For Cygwin or MSYS, switch paths to Windows format before running java
-if [ "$cygwin" = "true" -o "$msys" = "true" ] ; then
-    APP_HOME=`cygpath --path --mixed "$APP_HOME"`
-    CLASSPATH=`cygpath --path --mixed "$CLASSPATH"`
-
-    JAVACMD=`cygpath --unix "$JAVACMD"`
-
-    # We build the pattern for arguments to be converted via cygpath
-    ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null`
-    SEP=""
-    for dir in $ROOTDIRSRAW ; do
-        ROOTDIRS="$ROOTDIRS$SEP$dir"
-        SEP="|"
-    done
-    OURCYGPATTERN="(^($ROOTDIRS))"
-    # Add a user-defined pattern to the cygpath arguments
-    if [ "$GRADLE_CYGPATTERN" != "" ] ; then
-        OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)"
-    fi
+if "$cygwin" || "$msys" ; then
+    APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
+    CLASSPATH=$( cygpath --path --mixed "$CLASSPATH" )
+
+    JAVACMD=$( cygpath --unix "$JAVACMD" )
+
     # Now convert the arguments - kludge to limit ourselves to /bin/sh
-    i=0
-    for arg in "$@" ; do
-        CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -`
-        CHECK2=`echo "$arg"|egrep -c "^-"`                                 ### Determine if an option
-
-        if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then                    ### Added a condition
-            eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"`
-        else
-            eval `echo args$i`="\"$arg\""
+    for arg do
+        if
+            case $arg in                                #(
+              -*)   false ;;                            # don't mess with options #(
+              /?*)  t=${arg#/} t=/${t%%/*}              # looks like a POSIX filepath
+                    [ -e "$t" ] ;;                      #(
+              *)    false ;;
+            esac
+        then
+            arg=$( cygpath --path --ignore --mixed "$arg" )
         fi
-        i=`expr $i + 1`
+        # Roll the args list around exactly as many times as the number of
+        # args, so each arg winds up back in the position where it started, but
+        # possibly modified.
+        #
+        # NB: a `for` loop captures its iteration list before it begins, so
+        # changing the positional parameters here affects neither the number of
+        # iterations, nor the values presented in `arg`.
+        shift                   # remove old arg
+        set -- "$@" "$arg"      # push replacement arg
     done
-    case $i in
-        0) set -- ;;
-        1) set -- "$args0" ;;
-        2) set -- "$args0" "$args1" ;;
-        3) set -- "$args0" "$args1" "$args2" ;;
-        4) set -- "$args0" "$args1" "$args2" "$args3" ;;
-        5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;;
-        6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;;
-        7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;;
-        8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;;
-        9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;;
-    esac
 fi
 
-# Escape application args
-save () {
-    for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done
-    echo " "
-}
-APP_ARGS=`save "$@"`
+# Collect all arguments for the java command;
+#   * $DEFAULT_JVM_OPTS, $JAVA_OPTS, and $GRADLE_OPTS can contain fragments of
+#     shell script including quotes and variable substitutions, so put them in
+#     double quotes to make sure that they get re-expanded; and
+#   * put everything else in single quotes, so that it's not re-expanded.
+
+set -- \
+        "-Dorg.gradle.appname=$APP_BASE_NAME" \
+        -classpath "$CLASSPATH" \
+        org.gradle.wrapper.GradleWrapperMain \
+        "$@"
+
+# Use "xargs" to parse quoted args.
+#
+# With -n1 it outputs one arg per line, with the quotes and backslashes removed.
+#
+# In Bash we could simply go:
+#
+#   readarray ARGS < <( xargs -n1 <<<"$var" ) &&
+#   set -- "${ARGS[@]}" "$@"
+#
+# but POSIX shell has neither arrays nor command substitution, so instead we
+# post-process each arg (as a line of input to sed) to backslash-escape any
+# character that might be a shell metacharacter, then use eval to reverse
+# that process (while maintaining the separation between arguments), and wrap
+# the whole thing up as a single "set" statement.
+#
+# This will of course break if any of these variables contains a newline or
+# an unmatched quote.
+#
 
-# Collect all arguments for the java command, following the shell quoting and substitution rules
-eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS"
+eval "set -- $(
+        printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
+        xargs -n1 |
+        sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
+        tr '\n' ' '
+    )" '"$@"'
 
-exec "$JAVACMD" "$@"
+exec "$JAVACMD" "$@"

package/android/src/main/AndroidManifest.xml

@@ -1,5 +1,4 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android"
-          package="com.livekit.reactnative">
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
 
     <uses-permission android:name="android.permission.INTERNET" />
     <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

package/android/src/main/java/com/livekit/reactnative/video/SimulcastVideoEncoderFactoryWrapper.kt

@@ -0,0 +1,249 @@
+package com.livekit.reactnative.video
+
+import android.util.Log
+import org.webrtc.EglBase
+import org.webrtc.HardwareVideoEncoderFactory
+import org.webrtc.SimulcastVideoEncoderFactory
+import org.webrtc.SoftwareVideoEncoderFactory
+import org.webrtc.VideoCodecInfo
+import org.webrtc.VideoCodecStatus
+import org.webrtc.VideoEncoder
+import org.webrtc.VideoEncoderFactory
+import org.webrtc.VideoEncoderFallback
+import org.webrtc.VideoFrame
+import org.webrtc.WrappedNativeVideoEncoder
+import java.util.concurrent.Callable
+import java.util.concurrent.ExecutorService
+import java.util.concurrent.Executors
+
+/*
+Copyright 2017, Lyo Kato <lyo.kato at gmail.com> (Original Author)
+Copyright 2017-2021, Shiguredo Inc.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+ */
+open class SimulcastVideoEncoderFactoryWrapper(
+    sharedContext: EglBase.Context?,
+    enableIntelVp8Encoder: Boolean,
+    enableH264HighProfile: Boolean
+) : VideoEncoderFactory {
+
+    /**
+     * Factory that prioritizes software encoder.
+     *
+     * When the selected codec can't be handled by the software encoder,
+     * it uses the hardware encoder as a fallback. However, this class is
+     * primarily used to address an issue in libwebrtc, and does not have
+     * purposeful usecase itself.
+     *
+     * To use simulcast in libwebrtc, SimulcastEncoderAdapter is used.
+     * SimulcastEncoderAdapter takes in a primary and fallback encoder.
+     * If HardwareVideoEncoderFactory and SoftwareVideoEncoderFactory are
+     * passed in directly as primary and fallback, when H.264 is used,
+     * libwebrtc will crash.
+     *
+     * This is because SoftwareVideoEncoderFactory does not handle H.264,
+     * so [SoftwareVideoEncoderFactory.createEncoder] returns null, and
+     * the libwebrtc side does not handle nulls, regardless of whether the
+     * fallback is actually used or not.
+     *
+     * To avoid nulls, we simply pass responsibility over to the HardwareVideoEncoderFactory.
+     * This results in HardwareVideoEncoderFactory being both the primary and fallback,
+     * but there aren't any specific problems in doing so.
+     */
+    private class FallbackFactory(private val hardwareVideoEncoderFactory: VideoEncoderFactory) :
+        VideoEncoderFactory {
+
+        private val softwareVideoEncoderFactory: VideoEncoderFactory = SoftwareVideoEncoderFactory()
+
+        override fun createEncoder(info: VideoCodecInfo): VideoEncoder? {
+            val softwareEncoder = softwareVideoEncoderFactory.createEncoder(info)
+            val hardwareEncoder = hardwareVideoEncoderFactory.createEncoder(info)
+            return if (hardwareEncoder != null && softwareEncoder != null) {
+                VideoEncoderFallback(hardwareEncoder, softwareEncoder)
+            } else {
+                softwareEncoder ?: hardwareEncoder
+            }
+        }
+
+        override fun getSupportedCodecs(): Array<VideoCodecInfo> {
+            val supportedCodecInfos: MutableList<VideoCodecInfo> = mutableListOf()
+            supportedCodecInfos.addAll(softwareVideoEncoderFactory.supportedCodecs)
+            supportedCodecInfos.addAll(hardwareVideoEncoderFactory.supportedCodecs)
+            return supportedCodecInfos.toTypedArray()
+        }
+
+    }
+
+    /**
+     * Wraps each stream encoder and performs the following:
+     * - Starts up a single thread
+     * - When the width/height from [initEncode] doesn't match the frame buffer's,
+     *   scales the frame prior to encoding.
+     * - Always calls the encoder on the thread.
+     */
+    private class StreamEncoderWrapper(private val encoder: VideoEncoder) : VideoEncoder {
+
+        val executor: ExecutorService = Executors.newSingleThreadExecutor()
+        var streamSettings: VideoEncoder.Settings? = null
+
+        override fun initEncode(
+            settings: VideoEncoder.Settings,
+            callback: VideoEncoder.Callback?
+        ): VideoCodecStatus {
+            streamSettings = settings
+            val future = executor.submit(Callable {
+                Log.i(
+                    "SimulVideoEncoderFac",
+                    """initEncode() thread=${Thread.currentThread().name} [${Thread.currentThread().id}]
+                |  encoder=${encoder.implementationName}
+                |  streamSettings:
+                |    numberOfCores=${settings.numberOfCores}
+                |    width=${settings.width}
+                |    height=${settings.height}
+                |    startBitrate=${settings.startBitrate}
+                |    maxFramerate=${settings.maxFramerate}
+                |    automaticResizeOn=${settings.automaticResizeOn}
+                |    numberOfSimulcastStreams=${settings.numberOfSimulcastStreams}
+                |    lossNotification=${settings.capabilities.lossNotification}
+            """.trimMargin()
+                )
+                return@Callable encoder.initEncode(settings, callback)
+            })
+            return future.get()
+        }
+
+        override fun release(): VideoCodecStatus {
+            val future = executor.submit(Callable { return@Callable encoder.release() })
+            return future.get()
+        }
+
+        override fun encode(
+            frame: VideoFrame,
+            encodeInfo: VideoEncoder.EncodeInfo?
+        ): VideoCodecStatus {
+            val future = executor.submit(Callable {
+                //LKLog.d { "encode() buffer=${frame.buffer}, thread=${Thread.currentThread().name} " +
+                //        "[${Thread.currentThread().id}]" }
+                if (streamSettings == null) {
+                    return@Callable encoder.encode(frame, encodeInfo)
+                } else if (frame.buffer.width == streamSettings!!.width) {
+                    return@Callable encoder.encode(frame, encodeInfo)
+                } else {
+                    // The incoming buffer is different than the streamSettings received in initEncode()
+                    // Need to scale.
+                    val originalBuffer = frame.buffer
+                    // TODO: Do we need to handle when the scale factor is weird?
+                    val adaptedBuffer = originalBuffer.cropAndScale(
+                        0, 0, originalBuffer.width, originalBuffer.height,
+                        streamSettings!!.width, streamSettings!!.height
+                    )
+                    val adaptedFrame = VideoFrame(adaptedBuffer, frame.rotation, frame.timestampNs)
+                    val result = encoder.encode(adaptedFrame, encodeInfo)
+                    adaptedBuffer.release()
+                    return@Callable result
+                }
+            })
+            return future.get()
+        }
+
+        override fun setRateAllocation(
+            allocation: VideoEncoder.BitrateAllocation?,
+            frameRate: Int
+        ): VideoCodecStatus {
+            val future = executor.submit(Callable {
+                return@Callable encoder.setRateAllocation(
+                    allocation,
+                    frameRate
+                )
+            })
+            return future.get()
+        }
+
+        override fun getScalingSettings(): VideoEncoder.ScalingSettings {
+            val future = executor.submit(Callable { return@Callable encoder.scalingSettings })
+            return future.get()
+        }
+
+        override fun getImplementationName(): String {
+            val future = executor.submit(Callable { return@Callable encoder.implementationName })
+            return future.get()
+        }
+
+        override fun createNativeVideoEncoder(): Long {
+            val future = executor.submit(Callable { return@Callable encoder.createNativeVideoEncoder() })
+            return future.get()
+        }
+
+        override fun isHardwareEncoder(): Boolean {
+            val future = executor.submit(Callable { return@Callable encoder.isHardwareEncoder })
+            return future.get()
+        }
+
+        override fun setRates(rcParameters: VideoEncoder.RateControlParameters?): VideoCodecStatus {
+            val future = executor.submit(Callable { return@Callable encoder.setRates(rcParameters) })
+            return future.get()
+        }
+
+        override fun getResolutionBitrateLimits(): Array<VideoEncoder.ResolutionBitrateLimits> {
+            val future = executor.submit(Callable { return@Callable encoder.resolutionBitrateLimits })
+            return future.get()
+        }
+
+        override fun getEncoderInfo(): VideoEncoder.EncoderInfo {
+            val future = executor.submit(Callable { return@Callable encoder.encoderInfo })
+            return future.get()
+        }
+    }
+
+    private class StreamEncoderWrapperFactory(private val factory: VideoEncoderFactory) :
+        VideoEncoderFactory {
+        override fun createEncoder(videoCodecInfo: VideoCodecInfo?): VideoEncoder? {
+            val encoder = factory.createEncoder(videoCodecInfo)
+            if (encoder == null) {
+                return null
+            }
+            if (encoder is WrappedNativeVideoEncoder) {
+                return encoder
+            }
+            return StreamEncoderWrapper(encoder)
+        }
+
+        override fun getSupportedCodecs(): Array<VideoCodecInfo> {
+            return factory.supportedCodecs
+        }
+    }
+
+
+    private val primary: VideoEncoderFactory
+    private val fallback: VideoEncoderFactory
+    private val native: SimulcastVideoEncoderFactory
+
+    init {
+        val hardwareVideoEncoderFactory = HardwareVideoEncoderFactory(
+            sharedContext, enableIntelVp8Encoder, enableH264HighProfile
+        )
+        primary = StreamEncoderWrapperFactory(hardwareVideoEncoderFactory)
+        fallback = StreamEncoderWrapperFactory(FallbackFactory(primary))
+        native = SimulcastVideoEncoderFactory(primary, fallback)
+    }
+
+    override fun createEncoder(info: VideoCodecInfo?): VideoEncoder? {
+        return native.createEncoder(info)
+    }
+
+    override fun getSupportedCodecs(): Array<VideoCodecInfo> {
+        return native.supportedCodecs
+    }
+
+}

package/lib/commonjs/components/VideoView.js

@@ -11,7 +11,7 @@ var _reactNative = require("react-native");
 
 var _livekitClient = require("livekit-client");
 
-var _reactNativeWebrtc = require("react-native-webrtc");
+var _reactNativeWebrtc = require("@livekit/react-native-webrtc");
 
 var _ViewPortDetector = _interopRequireDefault(require("./ViewPortDetector"));
 
@@ -76,8 +76,12 @@ const VideoView = _ref => {
   }, /*#__PURE__*/React.createElement(_ViewPortDetector.default, {
     onChange: isVisible => elementInfo.onVisibility(isVisible),
     style: styles.videoView
-  }, /*#__PURE__*/React.createElement(_reactNativeWebrtc.RTCView, {
-    style: styles.videoView,
+  }, /*#__PURE__*/React.createElement(_reactNativeWebrtc.RTCView // eslint-disable-next-line react-native/no-inline-styles
+  , {
+    style: {
+      flex: 1,
+      width: '100%'
+    },
     streamURL: (_mediaStream$toURL = mediaStream === null || mediaStream === void 0 ? void 0 : mediaStream.toURL()) !== null && _mediaStream$toURL !== void 0 ? _mediaStream$toURL : '',
     objectFit: objectFit,
     zOrder: zOrder,

package/lib/commonjs/components/VideoView.js.map

@@ -1 +1 @@
-{"version":3,"sources":["VideoView.tsx"],"names":["VideoView","style","videoTrack","objectFit","zOrder","mirror","elementInfo","info","VideoViewElementInfo","id","sid","something","mediaStream","setMediaStream","LocalVideoTrack","onRestarted","track","on","TrackEvent","Restarted","off","RemoteVideoTrack","isAdaptiveStream","observeElementInfo","stopObservingElementInfo","styles","container","event","onLayout","isVisible","onVisibility","videoView","toURL","StyleSheet","create","flex","width","_width","_height","observe","_observing","stopObserving","height","nativeEvent","layout","handleResize","visible","visibilityChangedAt","Date","now","handleVisibilityChanged"],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport { LayoutChangeEvent, StyleSheet, View, ViewStyle } from 'react-native';\nimport {\n  ElementInfo,\n  LocalVideoTrack,\n  Track,\n  TrackEvent,\n  VideoTrack,\n} from 'livekit-client';\nimport { RTCView } from 'react-native-webrtc';\nimport { useEffect, useState } from 'react';\nimport { RemoteVideoTrack } from 'livekit-client';\nimport ViewPortDetector from './ViewPortDetector';\n\nexport type Props = {\n  videoTrack?: VideoTrack | undefined;\n  style?: ViewStyle;\n  objectFit?: 'cover' | 'contain' | undefined;\n  mirror?: boolean;\n  zOrder?: number;\n};\n\nexport const VideoView = ({\n  style = {},\n  videoTrack,\n  objectFit = 'cover',\n  zOrder,\n  mirror,\n}: Props) => {\n  const [elementInfo] = useState(() => {\n    let info = new VideoViewElementInfo();\n    info.id = videoTrack?.sid;\n    info.something = videoTrack;\n    return info;\n  });\n\n  const [mediaStream, setMediaStream] = useState(videoTrack?.mediaStream);\n  useEffect(() => {\n    setMediaStream(videoTrack?.mediaStream);\n    if (videoTrack instanceof LocalVideoTrack) {\n      const onRestarted = (track: Track | null) => {\n        setMediaStream(track?.mediaStream);\n      };\n      videoTrack.on(TrackEvent.Restarted, onRestarted);\n\n      return () => {\n        videoTrack.off(TrackEvent.Restarted, onRestarted);\n      };\n    } else {\n      return () => {};\n    }\n  }, [videoTrack]);\n\n  useEffect(() => {\n    if (videoTrack instanceof RemoteVideoTrack && videoTrack.isAdaptiveStream) {\n      videoTrack?.observeElementInfo(elementInfo);\n      return () => {\n        videoTrack?.stopObservingElementInfo(elementInfo);\n      };\n    } else {\n      return () => {};\n    }\n  }, [videoTrack, elementInfo]);\n\n  return (\n    <View\n      style={{ ...style, ...styles.container }}\n      onLayout={(event) => {\n        elementInfo.onLayout(event);\n      }}\n    >\n      <ViewPortDetector\n        onChange={(isVisible: boolean) => elementInfo.onVisibility(isVisible)}\n        style={styles.videoView}\n      >\n        <RTCView\n          style={styles.videoView}\n          streamURL={mediaStream?.toURL() ?? ''}\n          objectFit={objectFit}\n          zOrder={zOrder}\n          mirror={mirror}\n        />\n      </ViewPortDetector>\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {},\n  videoView: {\n    flex: 1,\n    width: '100%',\n  },\n});\n\nclass VideoViewElementInfo implements ElementInfo {\n  element: object = {};\n  something?: any;\n  id?: string;\n  _width = 0;\n  _height = 0;\n  _observing = false;\n  visible: boolean = true;\n  visibilityChangedAt: number | undefined;\n  pictureInPicture = false;\n  handleResize?: (() => void) | undefined;\n  handleVisibilityChanged?: (() => void) | undefined;\n  width = () => this._width;\n  height = () => this._height;\n\n  observe(): void {\n    this._observing = true;\n  }\n  stopObserving(): void {\n    this._observing = false;\n  }\n\n  onLayout(event: LayoutChangeEvent) {\n    let { width, height } = event.nativeEvent.layout;\n    this._width = width;\n    this._height = height;\n\n    if (this._observing) {\n      this.handleResize?.();\n    }\n  }\n  onVisibility(isVisible: boolean) {\n    if (this.visible !== isVisible) {\n      this.visible = isVisible;\n      this.visibilityChangedAt = Date.now();\n      if (this._observing) {\n        this.handleVisibilityChanged?.();\n      }\n    }\n  }\n}\n"]}
+{"version":3,"sources":["VideoView.tsx"],"names":["VideoView","style","videoTrack","objectFit","zOrder","mirror","elementInfo","info","VideoViewElementInfo","id","sid","something","mediaStream","setMediaStream","LocalVideoTrack","onRestarted","track","on","TrackEvent","Restarted","off","RemoteVideoTrack","isAdaptiveStream","observeElementInfo","stopObservingElementInfo","styles","container","event","onLayout","isVisible","onVisibility","videoView","flex","width","toURL","StyleSheet","create","_width","_height","observe","_observing","stopObserving","height","nativeEvent","layout","handleResize","visible","visibilityChangedAt","Date","now","handleVisibilityChanged"],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport { LayoutChangeEvent, StyleSheet, View, ViewStyle } from 'react-native';\nimport {\n  ElementInfo,\n  LocalVideoTrack,\n  Track,\n  TrackEvent,\n  VideoTrack,\n} from 'livekit-client';\nimport { RTCView } from '@livekit/react-native-webrtc';\nimport { useEffect, useState } from 'react';\nimport { RemoteVideoTrack } from 'livekit-client';\nimport ViewPortDetector from './ViewPortDetector';\n\nexport type Props = {\n  videoTrack?: VideoTrack | undefined;\n  style?: ViewStyle;\n  objectFit?: 'cover' | 'contain' | undefined;\n  mirror?: boolean;\n  zOrder?: number;\n};\n\nexport const VideoView = ({\n  style = {},\n  videoTrack,\n  objectFit = 'cover',\n  zOrder,\n  mirror,\n}: Props) => {\n  const [elementInfo] = useState(() => {\n    let info = new VideoViewElementInfo();\n    info.id = videoTrack?.sid;\n    info.something = videoTrack;\n    return info;\n  });\n\n  const [mediaStream, setMediaStream] = useState(videoTrack?.mediaStream);\n  useEffect(() => {\n    setMediaStream(videoTrack?.mediaStream);\n    if (videoTrack instanceof LocalVideoTrack) {\n      const onRestarted = (track: Track | null) => {\n        setMediaStream(track?.mediaStream);\n      };\n      videoTrack.on(TrackEvent.Restarted, onRestarted);\n\n      return () => {\n        videoTrack.off(TrackEvent.Restarted, onRestarted);\n      };\n    } else {\n      return () => {};\n    }\n  }, [videoTrack]);\n\n  useEffect(() => {\n    if (videoTrack instanceof RemoteVideoTrack && videoTrack.isAdaptiveStream) {\n      videoTrack?.observeElementInfo(elementInfo);\n      return () => {\n        videoTrack?.stopObservingElementInfo(elementInfo);\n      };\n    } else {\n      return () => {};\n    }\n  }, [videoTrack, elementInfo]);\n\n  return (\n    <View\n      style={{ ...style, ...styles.container }}\n      onLayout={(event) => {\n        elementInfo.onLayout(event);\n      }}\n    >\n      <ViewPortDetector\n        onChange={(isVisible: boolean) => elementInfo.onVisibility(isVisible)}\n        style={styles.videoView}\n      >\n        <RTCView\n          // eslint-disable-next-line react-native/no-inline-styles\n          style={{\n            flex: 1,\n            width: '100%',\n          }}\n          streamURL={mediaStream?.toURL() ?? ''}\n          objectFit={objectFit}\n          zOrder={zOrder}\n          mirror={mirror}\n        />\n      </ViewPortDetector>\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {},\n  videoView: {\n    flex: 1,\n    width: '100%',\n  },\n});\n\nclass VideoViewElementInfo implements ElementInfo {\n  element: object = {};\n  something?: any;\n  id?: string;\n  _width = 0;\n  _height = 0;\n  _observing = false;\n  visible: boolean = true;\n  visibilityChangedAt: number | undefined;\n  pictureInPicture = false;\n  handleResize?: (() => void) | undefined;\n  handleVisibilityChanged?: (() => void) | undefined;\n  width = () => this._width;\n  height = () => this._height;\n\n  observe(): void {\n    this._observing = true;\n  }\n  stopObserving(): void {\n    this._observing = false;\n  }\n\n  onLayout(event: LayoutChangeEvent) {\n    let { width, height } = event.nativeEvent.layout;\n    this._width = width;\n    this._height = height;\n\n    if (this._observing) {\n      this.handleResize?.();\n    }\n  }\n  onVisibility(isVisible: boolean) {\n    if (this.visible !== isVisible) {\n      this.visible = isVisible;\n      this.visibilityChangedAt = Date.now();\n      if (this._observing) {\n        this.handleVisibilityChanged?.();\n      }\n    }\n  }\n}\n"]}

package/lib/commonjs/components/ViewPortDetector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ViewPortDetector.tsx"],"names":["ViewPortDetector","Component","constructor","props","state","rectTop","rectBottom","componentDidMount","disabled","startWatching","componentWillUnmount","stopWatching","UNSAFE_componentWillReceiveProps","nextProps","lastValue","interval","setInterval","view","measure","_x","_y","width","height","_pageX","_pageY","checkInViewPort","delay","clearInterval","isVisible","onChange","render","component","children"],"mappings":"AAAA;;;;;;;AAEA;;AACA;;;;;;;;;;AASA;AACA;AACA;AACA;AACA;AACe,MAAMA,gBAAN,SAA+BC,gBAA/B,CAAgD;AAK7DC,EAAAA,WAAW,CAACC,KAAD,EAAe;AACxB,UAAMA,KAAN;;AADwB,uCAJU,IAIV;;AAAA,sCAHK,IAGL;;AAAA,kCAFE,IAEF;;AAExB,SAAKC,KAAL,GAAa;AAAEC,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,UAAU,EAAE;AAA1B,KAAb;AACD;;AAEDC,EAAAA,iBAAiB,GAAG;AAClB,QAAI,CAAC,KAAKJ,KAAL,CAAWK,QAAhB,EAA0B;AACxB,WAAKC,aAAL;AACD;AACF;;AAEDC,EAAAA,oBAAoB,GAAG;AACrB,SAAKC,YAAL;AACD;;AAEDC,EAAAA,gCAAgC,CAACC,SAAD,EAAmB;AACjD,QAAIA,SAAS,CAACL,QAAd,EAAwB;AACtB,WAAKG,YAAL;AACD,KAFD,MAEO;AACL,WAAKG,SAAL,GAAiB,IAAjB;AACA,WAAKL,aAAL;AACD;AACF;;AAEOA,EAAAA,aAAa,GAAG;AACtB,QAAI,KAAKM,QAAT,EAAmB;AACjB;AACD;;AACD,SAAKA,QAAL,GAAgBC,WAAW,CAAC,MAAM;AAChC,UAAI,CAAC,KAAKC,IAAV,EAAgB;AACd;AACD;;AACD,WAAKA,IAAL,CAAUC,OAAV,CAAkB,CAACC,EAAD,EAAKC,EAAL,EAASC,KAAT,EAAgBC,MAAhB,EAAwBC,MAAxB,EAAgCC,MAAhC,KAA2C;AAC3D,aAAKC,eAAL,CAAqBJ,KAArB,EAA4BC,MAA5B;AACD,OAFD;AAGD,KAP0B,EAOxB,KAAKnB,KAAL,CAAWuB,KAAX,IAAoB,GAPI,CAA3B;AAQD;;AAEOf,EAAAA,YAAY,GAAG;AACrB,SAAKI,QAAL,GAAgBY,aAAa,CAAC,KAAKZ,QAAN,CAA7B;AACD;;AAEOU,EAAAA,eAAe,CAACJ,KAAD,EAAiBC,MAAjB,EAAkC;AACvD,QAAIM,SAAJ,CADuD,CAEvD;;AACA,QAAI,CAACP,KAAD,IAAU,CAACC,MAAf,EAAuB;AACrBM,MAAAA,SAAS,GAAG,KAAZ;AACD,KAFD,MAEO;AACLA,MAAAA,SAAS,GAAG,IAAZ;AACD;;AAED,QAAI,KAAKd,SAAL,KAAmBc,SAAvB,EAAkC;AAAA;;AAChC,WAAKd,SAAL,GAAiBc,SAAjB;AACA,kDAAKzB,KAAL,EAAW0B,QAAX,gGAAsBD,SAAtB;AACD;AACF;;AAEDE,EAAAA,MAAM,GAAG;AACP,wBACE,6BAAC,iBAAD;AACE,MAAA,WAAW,EAAE,KADf;AAEE,MAAA,GAAG,EAAGC,SAAD,IAAe;AAClB,aAAKd,IAAL,GAAYc,SAAZ;AACD;AAJH,OAKM,KAAK5B,KALX,GAOG,KAAKA,KAAL,CAAW6B,QAPd,CADF;AAWD;;AA1E4D","sourcesContent":["'use strict';\n\nimport React, { Component } from 'react';\nimport { View, ViewStyle } from 'react-native';\n\nexport type Props = {\n  disabled?: boolean;\n  style?: ViewStyle;\n  onChange?: (isVisible: boolean) => void;\n  delay?: number;\n};\n\n/**\n * Detects when this is in the viewport and visible.\n *\n * Will not fire visibility changes for zero width/height components.\n */\nexport default class ViewPortDetector extends Component<Props> {\n  private lastValue: boolean | null = null;\n  private interval: any | null = null;\n  private view: View | null = null;\n\n  constructor(props: Props) {\n    super(props);\n    this.state = { rectTop: 0, rectBottom: 0 };\n  }\n\n  componentDidMount() {\n    if (!this.props.disabled) {\n      this.startWatching();\n    }\n  }\n\n  componentWillUnmount() {\n    this.stopWatching();\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps: Props) {\n    if (nextProps.disabled) {\n      this.stopWatching();\n    } else {\n      this.lastValue = null;\n      this.startWatching();\n    }\n  }\n\n  private startWatching() {\n    if (this.interval) {\n      return;\n    }\n    this.interval = setInterval(() => {\n      if (!this.view) {\n        return;\n      }\n      this.view.measure((_x, _y, width, height, _pageX, _pageY) => {\n        this.checkInViewPort(width, height);\n      });\n    }, this.props.delay || 100);\n  }\n\n  private stopWatching() {\n    this.interval = clearInterval(this.interval);\n  }\n\n  private checkInViewPort(width?: number, height?: number) {\n    let isVisible: boolean;\n    // Not visible if any of these are missing.\n    if (!width || !height) {\n      isVisible = false;\n    } else {\n      isVisible = true;\n    }\n\n    if (this.lastValue !== isVisible) {\n      this.lastValue = isVisible;\n      this.props.onChange?.(isVisible);\n    }\n  }\n\n  render() {\n    return (\n      <View\n        collapsable={false}\n        ref={(component) => {\n          this.view = component;\n        }}\n        {...this.props}\n      >\n        {this.props.children}\n      </View>\n    );\n  }\n}\n"]}
+{"version":3,"sources":["ViewPortDetector.tsx"],"names":["ViewPortDetector","Component","constructor","props","state","rectTop","rectBottom","componentDidMount","disabled","startWatching","componentWillUnmount","stopWatching","UNSAFE_componentWillReceiveProps","nextProps","lastValue","interval","setInterval","view","measure","_x","_y","width","height","_pageX","_pageY","checkInViewPort","delay","clearInterval","isVisible","onChange","render","component","children"],"mappings":"AAAA;;;;;;;AAEA;;AACA;;;;;;;;;;AASA;AACA;AACA;AACA;AACA;AACe,MAAMA,gBAAN,SAA+BC,gBAA/B,CAEb;AAKAC,EAAAA,WAAW,CAACC,KAAD,EAAe;AACxB,UAAMA,KAAN;;AADwB,uCAJU,IAIV;;AAAA,sCAHK,IAGL;;AAAA,kCAFE,IAEF;;AAExB,SAAKC,KAAL,GAAa;AAAEC,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,UAAU,EAAE;AAA1B,KAAb;AACD;;AAEDC,EAAAA,iBAAiB,GAAG;AAClB,QAAI,CAAC,KAAKJ,KAAL,CAAWK,QAAhB,EAA0B;AACxB,WAAKC,aAAL;AACD;AACF;;AAEDC,EAAAA,oBAAoB,GAAG;AACrB,SAAKC,YAAL;AACD;;AAEDC,EAAAA,gCAAgC,CAACC,SAAD,EAAmB;AACjD,QAAIA,SAAS,CAACL,QAAd,EAAwB;AACtB,WAAKG,YAAL;AACD,KAFD,MAEO;AACL,WAAKG,SAAL,GAAiB,IAAjB;AACA,WAAKL,aAAL;AACD;AACF;;AAEOA,EAAAA,aAAa,GAAG;AACtB,QAAI,KAAKM,QAAT,EAAmB;AACjB;AACD;;AACD,SAAKA,QAAL,GAAgBC,WAAW,CAAC,MAAM;AAChC,UAAI,CAAC,KAAKC,IAAV,EAAgB;AACd;AACD;;AACD,WAAKA,IAAL,CAAUC,OAAV,CAAkB,CAACC,EAAD,EAAKC,EAAL,EAASC,KAAT,EAAgBC,MAAhB,EAAwBC,MAAxB,EAAgCC,MAAhC,KAA2C;AAC3D,aAAKC,eAAL,CAAqBJ,KAArB,EAA4BC,MAA5B;AACD,OAFD;AAGD,KAP0B,EAOxB,KAAKnB,KAAL,CAAWuB,KAAX,IAAoB,GAPI,CAA3B;AAQD;;AAEOf,EAAAA,YAAY,GAAG;AACrB,SAAKI,QAAL,GAAgBY,aAAa,CAAC,KAAKZ,QAAN,CAA7B;AACD;;AAEOU,EAAAA,eAAe,CAACJ,KAAD,EAAiBC,MAAjB,EAAkC;AACvD,QAAIM,SAAJ,CADuD,CAEvD;;AACA,QAAI,CAACP,KAAD,IAAU,CAACC,MAAf,EAAuB;AACrBM,MAAAA,SAAS,GAAG,KAAZ;AACD,KAFD,MAEO;AACLA,MAAAA,SAAS,GAAG,IAAZ;AACD;;AAED,QAAI,KAAKd,SAAL,KAAmBc,SAAvB,EAAkC;AAAA;;AAChC,WAAKd,SAAL,GAAiBc,SAAjB;AACA,kDAAKzB,KAAL,EAAW0B,QAAX,gGAAsBD,SAAtB;AACD;AACF;;AAEDE,EAAAA,MAAM,GAAG;AACP,wBACE,6BAAC,iBAAD;AACE,MAAA,WAAW,EAAE,KADf;AAEE,MAAA,GAAG,EAAGC,SAAD,IAAe;AAClB,aAAKd,IAAL,GAAYc,SAAZ;AACD;AAJH,OAKM,KAAK5B,KALX,GAOG,KAAKA,KAAL,CAAW6B,QAPd,CADF;AAWD;;AA1ED","sourcesContent":["'use strict';\n\nimport React, { Component, PropsWithChildren } from 'react';\nimport { View, ViewStyle } from 'react-native';\n\nexport type Props = {\n  disabled?: boolean;\n  style?: ViewStyle;\n  onChange?: (isVisible: boolean) => void;\n  delay?: number;\n};\n\n/**\n * Detects when this is in the viewport and visible.\n *\n * Will not fire visibility changes for zero width/height components.\n */\nexport default class ViewPortDetector extends Component<\n  PropsWithChildren<Props>\n> {\n  private lastValue: boolean | null = null;\n  private interval: any | null = null;\n  private view: View | null = null;\n\n  constructor(props: Props) {\n    super(props);\n    this.state = { rectTop: 0, rectBottom: 0 };\n  }\n\n  componentDidMount() {\n    if (!this.props.disabled) {\n      this.startWatching();\n    }\n  }\n\n  componentWillUnmount() {\n    this.stopWatching();\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps: Props) {\n    if (nextProps.disabled) {\n      this.stopWatching();\n    } else {\n      this.lastValue = null;\n      this.startWatching();\n    }\n  }\n\n  private startWatching() {\n    if (this.interval) {\n      return;\n    }\n    this.interval = setInterval(() => {\n      if (!this.view) {\n        return;\n      }\n      this.view.measure((_x, _y, width, height, _pageX, _pageY) => {\n        this.checkInViewPort(width, height);\n      });\n    }, this.props.delay || 100);\n  }\n\n  private stopWatching() {\n    this.interval = clearInterval(this.interval);\n  }\n\n  private checkInViewPort(width?: number, height?: number) {\n    let isVisible: boolean;\n    // Not visible if any of these are missing.\n    if (!width || !height) {\n      isVisible = false;\n    } else {\n      isVisible = true;\n    }\n\n    if (this.lastValue !== isVisible) {\n      this.lastValue = isVisible;\n      this.props.onChange?.(isVisible);\n    }\n  }\n\n  render() {\n    return (\n      <View\n        collapsable={false}\n        ref={(component) => {\n          this.view = component;\n        }}\n        {...this.props}\n      >\n        {this.props.children}\n      </View>\n    );\n  }\n}\n"]}

package/lib/commonjs/index.js

@@ -15,7 +15,7 @@ Object.defineProperty(exports, "AudioSession", {
 });
 exports.registerGlobals = registerGlobals;
 
-var _reactNativeWebrtc = require("react-native-webrtc");
+var _reactNativeWebrtc = require("@livekit/react-native-webrtc");
 
 var _reactNativeUrlPolyfill = require("react-native-url-polyfill");
 
@@ -78,6 +78,7 @@ function registerGlobals() {
   (0, _reactNativeUrlPolyfill.setupURLPolyfill)();
   fixWebrtcAdapter();
   shimPromiseAllSettled();
+  shimArrayAt();
 }
 
 function livekitRegisterGlobals() {
@@ -112,4 +113,13 @@ function shimPromiseAllSettled() {
 
   allSettled.shim();
 }
+
+function shimArrayAt() {
+  // Some versions of RN don't have Array.prototype.at, which is used by sdp-transform
+  if (!Array.prototype.at) {
+    var at = require('array.prototype.at');
+
+    at.shim();
+  }
+}
 //# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.tsx"],"names":["registerGlobals","livekitRegisterGlobals","fixWebrtcAdapter","shimPromiseAllSettled","lkGlobal","platform","Platform","OS","devicePixelRatio","PixelRatio","get","global","LiveKitReactNativeGlobal","window","navigator","undefined","userAgent","product","allSettled","require","shim"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AAyCA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;AAxCA;AACA;AACA;AACA;AACA;AACO,SAASA,eAAT,GAA2B;AAChC;AACAC,EAAAA,sBAAsB;AACtB;AACAC,EAAAA,gBAAgB;AAChBC,EAAAA,qBAAqB;AACtB;;AACD,SAASF,sBAAT,GAAkC;AAChC,MAAIG,QAAgC,GAAG;AACrCC,IAAAA,QAAQ,EAAEC,sBAASC,EADkB;AAErCC,IAAAA,gBAAgB,EAAEC,wBAAWC,GAAX;AAFmB,GAAvC,CADgC,CAMhC;;AACAC,EAAAA,MAAM,CAACC,wBAAP,GAAkCR,QAAlC;AACD;;AAED,SAASF,gBAAT,GAA4B;AAAA;;AAC1B;AACA,MAAI,YAAAW,MAAM,UAAN,0CAAQC,SAAR,MAAsBC,SAA1B,EAAqC;AACnC;AACA,UAAM;AAAED,MAAAA;AAAF,QAAgBD,MAAtB;;AACA,QAAIC,SAAS,CAACE,SAAV,KAAwBD,SAA5B,EAAuC;AAAA;;AACrCD,MAAAA,SAAS,CAACE,SAAV,yBAAsBF,SAAS,CAACG,OAAhC,mEAA2C,SAA3C;AACD;AACF;AACF;;AAED,SAASd,qBAAT,GAAiC;AAC/B,MAAIe,UAAU,GAAGC,OAAO,CAAC,oBAAD,CAAxB;;AACAD,EAAAA,UAAU,CAACE,IAAX;AACD","sourcesContent":["import { registerGlobals as webrtcRegisterGlobals } from 'react-native-webrtc';\nimport { setupURLPolyfill } from 'react-native-url-polyfill';\nimport AudioSession from './audio/AudioSession';\nimport type { AudioConfiguration } from './audio/AudioSession';\nimport { PixelRatio, Platform } from 'react-native';\nimport type { LiveKitReactNativeInfo } from 'livekit-client';\n\n/**\n * Registers the required globals needed for LiveKit to work.\n *\n * Must be called before using LiveKit.\n */\nexport function registerGlobals() {\n  webrtcRegisterGlobals();\n  livekitRegisterGlobals();\n  setupURLPolyfill();\n  fixWebrtcAdapter();\n  shimPromiseAllSettled();\n}\nfunction livekitRegisterGlobals() {\n  let lkGlobal: LiveKitReactNativeInfo = {\n    platform: Platform.OS,\n    devicePixelRatio: PixelRatio.get(),\n  };\n\n  // @ts-ignore\n  global.LiveKitReactNativeGlobal = lkGlobal;\n}\n\nfunction fixWebrtcAdapter() {\n  // @ts-ignore\n  if (window?.navigator !== undefined) {\n    // @ts-ignore\n    const { navigator } = window;\n    if (navigator.userAgent === undefined) {\n      navigator.userAgent = navigator.product ?? 'Unknown';\n    }\n  }\n}\n\nfunction shimPromiseAllSettled() {\n  var allSettled = require('promise.allsettled');\n  allSettled.shim();\n}\n\nexport * from './components/VideoView';\nexport * from './useParticipant';\nexport * from './useRoom';\nexport { AudioSession, AudioConfiguration };\n"]}
+{"version":3,"sources":["index.tsx"],"names":["registerGlobals","livekitRegisterGlobals","fixWebrtcAdapter","shimPromiseAllSettled","shimArrayAt","lkGlobal","platform","Platform","OS","devicePixelRatio","PixelRatio","get","global","LiveKitReactNativeGlobal","window","navigator","undefined","userAgent","product","allSettled","require","shim","Array","prototype","at"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AAkDA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;AAjDA;AACA;AACA;AACA;AACA;AACO,SAASA,eAAT,GAA2B;AAChC;AACAC,EAAAA,sBAAsB;AACtB;AACAC,EAAAA,gBAAgB;AAChBC,EAAAA,qBAAqB;AACrBC,EAAAA,WAAW;AACZ;;AACD,SAASH,sBAAT,GAAkC;AAChC,MAAII,QAAgC,GAAG;AACrCC,IAAAA,QAAQ,EAAEC,sBAASC,EADkB;AAErCC,IAAAA,gBAAgB,EAAEC,wBAAWC,GAAX;AAFmB,GAAvC,CADgC,CAMhC;;AACAC,EAAAA,MAAM,CAACC,wBAAP,GAAkCR,QAAlC;AACD;;AAED,SAASH,gBAAT,GAA4B;AAAA;;AAC1B;AACA,MAAI,YAAAY,MAAM,UAAN,0CAAQC,SAAR,MAAsBC,SAA1B,EAAqC;AACnC;AACA,UAAM;AAAED,MAAAA;AAAF,QAAgBD,MAAtB;;AACA,QAAIC,SAAS,CAACE,SAAV,KAAwBD,SAA5B,EAAuC;AAAA;;AACrCD,MAAAA,SAAS,CAACE,SAAV,yBAAsBF,SAAS,CAACG,OAAhC,mEAA2C,SAA3C;AACD;AACF;AACF;;AAED,SAASf,qBAAT,GAAiC;AAC/B,MAAIgB,UAAU,GAAGC,OAAO,CAAC,oBAAD,CAAxB;;AACAD,EAAAA,UAAU,CAACE,IAAX;AACD;;AAED,SAASjB,WAAT,GAAuB;AACrB;AACA,MAAI,CAACkB,KAAK,CAACC,SAAN,CAAgBC,EAArB,EAAyB;AACvB,QAAIA,EAAE,GAAGJ,OAAO,CAAC,oBAAD,CAAhB;;AACAI,IAAAA,EAAE,CAACH,IAAH;AACD;AACF","sourcesContent":["import { registerGlobals as webrtcRegisterGlobals } from '@livekit/react-native-webrtc';\nimport { setupURLPolyfill } from 'react-native-url-polyfill';\nimport AudioSession from './audio/AudioSession';\nimport type { AudioConfiguration } from './audio/AudioSession';\nimport { PixelRatio, Platform } from 'react-native';\nimport type { LiveKitReactNativeInfo } from 'livekit-client';\n\n/**\n * Registers the required globals needed for LiveKit to work.\n *\n * Must be called before using LiveKit.\n */\nexport function registerGlobals() {\n  webrtcRegisterGlobals();\n  livekitRegisterGlobals();\n  setupURLPolyfill();\n  fixWebrtcAdapter();\n  shimPromiseAllSettled();\n  shimArrayAt();\n}\nfunction livekitRegisterGlobals() {\n  let lkGlobal: LiveKitReactNativeInfo = {\n    platform: Platform.OS,\n    devicePixelRatio: PixelRatio.get(),\n  };\n\n  // @ts-ignore\n  global.LiveKitReactNativeGlobal = lkGlobal;\n}\n\nfunction fixWebrtcAdapter() {\n  // @ts-ignore\n  if (window?.navigator !== undefined) {\n    // @ts-ignore\n    const { navigator } = window;\n    if (navigator.userAgent === undefined) {\n      navigator.userAgent = navigator.product ?? 'Unknown';\n    }\n  }\n}\n\nfunction shimPromiseAllSettled() {\n  var allSettled = require('promise.allsettled');\n  allSettled.shim();\n}\n\nfunction shimArrayAt() {\n  // Some versions of RN don't have Array.prototype.at, which is used by sdp-transform\n  if (!Array.prototype.at) {\n    var at = require('array.prototype.at');\n    at.shim();\n  }\n}\n\nexport * from './components/VideoView';\nexport * from './useParticipant';\nexport * from './useRoom';\nexport { AudioSession, AudioConfiguration };\n"]}

package/lib/module/components/VideoView.js

@@ -3,7 +3,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 import * as React from 'react';
 import { StyleSheet, View } from 'react-native';
 import { LocalVideoTrack, TrackEvent } from 'livekit-client';
-import { RTCView } from 'react-native-webrtc';
+import { RTCView } from '@livekit/react-native-webrtc';
 import { useEffect, useState } from 'react';
 import { RemoteVideoTrack } from 'livekit-client';
 import ViewPortDetector from './ViewPortDetector';
@@ -60,8 +60,12 @@ export const VideoView = _ref => {
   }, /*#__PURE__*/React.createElement(ViewPortDetector, {
     onChange: isVisible => elementInfo.onVisibility(isVisible),
     style: styles.videoView
-  }, /*#__PURE__*/React.createElement(RTCView, {
-    style: styles.videoView,
+  }, /*#__PURE__*/React.createElement(RTCView // eslint-disable-next-line react-native/no-inline-styles
+  , {
+    style: {
+      flex: 1,
+      width: '100%'
+    },
     streamURL: (_mediaStream$toURL = mediaStream === null || mediaStream === void 0 ? void 0 : mediaStream.toURL()) !== null && _mediaStream$toURL !== void 0 ? _mediaStream$toURL : '',
     objectFit: objectFit,
     zOrder: zOrder,

package/lib/module/components/VideoView.js.map

@@ -1 +1 @@
-{"version":3,"sources":["VideoView.tsx"],"names":["React","StyleSheet","View","LocalVideoTrack","TrackEvent","RTCView","useEffect","useState","RemoteVideoTrack","ViewPortDetector","VideoView","style","videoTrack","objectFit","zOrder","mirror","elementInfo","info","VideoViewElementInfo","id","sid","something","mediaStream","setMediaStream","onRestarted","track","on","Restarted","off","isAdaptiveStream","observeElementInfo","stopObservingElementInfo","styles","container","event","onLayout","isVisible","onVisibility","videoView","toURL","create","flex","width","_width","_height","observe","_observing","stopObserving","height","nativeEvent","layout","handleResize","visible","visibilityChangedAt","Date","now","handleVisibilityChanged"],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport { LayoutChangeEvent, StyleSheet, View, ViewStyle } from 'react-native';\nimport {\n  ElementInfo,\n  LocalVideoTrack,\n  Track,\n  TrackEvent,\n  VideoTrack,\n} from 'livekit-client';\nimport { RTCView } from 'react-native-webrtc';\nimport { useEffect, useState } from 'react';\nimport { RemoteVideoTrack } from 'livekit-client';\nimport ViewPortDetector from './ViewPortDetector';\n\nexport type Props = {\n  videoTrack?: VideoTrack | undefined;\n  style?: ViewStyle;\n  objectFit?: 'cover' | 'contain' | undefined;\n  mirror?: boolean;\n  zOrder?: number;\n};\n\nexport const VideoView = ({\n  style = {},\n  videoTrack,\n  objectFit = 'cover',\n  zOrder,\n  mirror,\n}: Props) => {\n  const [elementInfo] = useState(() => {\n    let info = new VideoViewElementInfo();\n    info.id = videoTrack?.sid;\n    info.something = videoTrack;\n    return info;\n  });\n\n  const [mediaStream, setMediaStream] = useState(videoTrack?.mediaStream);\n  useEffect(() => {\n    setMediaStream(videoTrack?.mediaStream);\n    if (videoTrack instanceof LocalVideoTrack) {\n      const onRestarted = (track: Track | null) => {\n        setMediaStream(track?.mediaStream);\n      };\n      videoTrack.on(TrackEvent.Restarted, onRestarted);\n\n      return () => {\n        videoTrack.off(TrackEvent.Restarted, onRestarted);\n      };\n    } else {\n      return () => {};\n    }\n  }, [videoTrack]);\n\n  useEffect(() => {\n    if (videoTrack instanceof RemoteVideoTrack && videoTrack.isAdaptiveStream) {\n      videoTrack?.observeElementInfo(elementInfo);\n      return () => {\n        videoTrack?.stopObservingElementInfo(elementInfo);\n      };\n    } else {\n      return () => {};\n    }\n  }, [videoTrack, elementInfo]);\n\n  return (\n    <View\n      style={{ ...style, ...styles.container }}\n      onLayout={(event) => {\n        elementInfo.onLayout(event);\n      }}\n    >\n      <ViewPortDetector\n        onChange={(isVisible: boolean) => elementInfo.onVisibility(isVisible)}\n        style={styles.videoView}\n      >\n        <RTCView\n          style={styles.videoView}\n          streamURL={mediaStream?.toURL() ?? ''}\n          objectFit={objectFit}\n          zOrder={zOrder}\n          mirror={mirror}\n        />\n      </ViewPortDetector>\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {},\n  videoView: {\n    flex: 1,\n    width: '100%',\n  },\n});\n\nclass VideoViewElementInfo implements ElementInfo {\n  element: object = {};\n  something?: any;\n  id?: string;\n  _width = 0;\n  _height = 0;\n  _observing = false;\n  visible: boolean = true;\n  visibilityChangedAt: number | undefined;\n  pictureInPicture = false;\n  handleResize?: (() => void) | undefined;\n  handleVisibilityChanged?: (() => void) | undefined;\n  width = () => this._width;\n  height = () => this._height;\n\n  observe(): void {\n    this._observing = true;\n  }\n  stopObserving(): void {\n    this._observing = false;\n  }\n\n  onLayout(event: LayoutChangeEvent) {\n    let { width, height } = event.nativeEvent.layout;\n    this._width = width;\n    this._height = height;\n\n    if (this._observing) {\n      this.handleResize?.();\n    }\n  }\n  onVisibility(isVisible: boolean) {\n    if (this.visible !== isVisible) {\n      this.visible = isVisible;\n      this.visibilityChangedAt = Date.now();\n      if (this._observing) {\n        this.handleVisibilityChanged?.();\n      }\n    }\n  }\n}\n"]}
+{"version":3,"sources":["VideoView.tsx"],"names":["React","StyleSheet","View","LocalVideoTrack","TrackEvent","RTCView","useEffect","useState","RemoteVideoTrack","ViewPortDetector","VideoView","style","videoTrack","objectFit","zOrder","mirror","elementInfo","info","VideoViewElementInfo","id","sid","something","mediaStream","setMediaStream","onRestarted","track","on","Restarted","off","isAdaptiveStream","observeElementInfo","stopObservingElementInfo","styles","container","event","onLayout","isVisible","onVisibility","videoView","flex","width","toURL","create","_width","_height","observe","_observing","stopObserving","height","nativeEvent","layout","handleResize","visible","visibilityChangedAt","Date","now","handleVisibilityChanged"],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport { LayoutChangeEvent, StyleSheet, View, ViewStyle } from 'react-native';\nimport {\n  ElementInfo,\n  LocalVideoTrack,\n  Track,\n  TrackEvent,\n  VideoTrack,\n} from 'livekit-client';\nimport { RTCView } from '@livekit/react-native-webrtc';\nimport { useEffect, useState } from 'react';\nimport { RemoteVideoTrack } from 'livekit-client';\nimport ViewPortDetector from './ViewPortDetector';\n\nexport type Props = {\n  videoTrack?: VideoTrack | undefined;\n  style?: ViewStyle;\n  objectFit?: 'cover' | 'contain' | undefined;\n  mirror?: boolean;\n  zOrder?: number;\n};\n\nexport const VideoView = ({\n  style = {},\n  videoTrack,\n  objectFit = 'cover',\n  zOrder,\n  mirror,\n}: Props) => {\n  const [elementInfo] = useState(() => {\n    let info = new VideoViewElementInfo();\n    info.id = videoTrack?.sid;\n    info.something = videoTrack;\n    return info;\n  });\n\n  const [mediaStream, setMediaStream] = useState(videoTrack?.mediaStream);\n  useEffect(() => {\n    setMediaStream(videoTrack?.mediaStream);\n    if (videoTrack instanceof LocalVideoTrack) {\n      const onRestarted = (track: Track | null) => {\n        setMediaStream(track?.mediaStream);\n      };\n      videoTrack.on(TrackEvent.Restarted, onRestarted);\n\n      return () => {\n        videoTrack.off(TrackEvent.Restarted, onRestarted);\n      };\n    } else {\n      return () => {};\n    }\n  }, [videoTrack]);\n\n  useEffect(() => {\n    if (videoTrack instanceof RemoteVideoTrack && videoTrack.isAdaptiveStream) {\n      videoTrack?.observeElementInfo(elementInfo);\n      return () => {\n        videoTrack?.stopObservingElementInfo(elementInfo);\n      };\n    } else {\n      return () => {};\n    }\n  }, [videoTrack, elementInfo]);\n\n  return (\n    <View\n      style={{ ...style, ...styles.container }}\n      onLayout={(event) => {\n        elementInfo.onLayout(event);\n      }}\n    >\n      <ViewPortDetector\n        onChange={(isVisible: boolean) => elementInfo.onVisibility(isVisible)}\n        style={styles.videoView}\n      >\n        <RTCView\n          // eslint-disable-next-line react-native/no-inline-styles\n          style={{\n            flex: 1,\n            width: '100%',\n          }}\n          streamURL={mediaStream?.toURL() ?? ''}\n          objectFit={objectFit}\n          zOrder={zOrder}\n          mirror={mirror}\n        />\n      </ViewPortDetector>\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {},\n  videoView: {\n    flex: 1,\n    width: '100%',\n  },\n});\n\nclass VideoViewElementInfo implements ElementInfo {\n  element: object = {};\n  something?: any;\n  id?: string;\n  _width = 0;\n  _height = 0;\n  _observing = false;\n  visible: boolean = true;\n  visibilityChangedAt: number | undefined;\n  pictureInPicture = false;\n  handleResize?: (() => void) | undefined;\n  handleVisibilityChanged?: (() => void) | undefined;\n  width = () => this._width;\n  height = () => this._height;\n\n  observe(): void {\n    this._observing = true;\n  }\n  stopObserving(): void {\n    this._observing = false;\n  }\n\n  onLayout(event: LayoutChangeEvent) {\n    let { width, height } = event.nativeEvent.layout;\n    this._width = width;\n    this._height = height;\n\n    if (this._observing) {\n      this.handleResize?.();\n    }\n  }\n  onVisibility(isVisible: boolean) {\n    if (this.visible !== isVisible) {\n      this.visible = isVisible;\n      this.visibilityChangedAt = Date.now();\n      if (this._observing) {\n        this.handleVisibilityChanged?.();\n      }\n    }\n  }\n}\n"]}

package/lib/module/components/ViewPortDetector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ViewPortDetector.tsx"],"names":["React","Component","View","ViewPortDetector","constructor","props","state","rectTop","rectBottom","componentDidMount","disabled","startWatching","componentWillUnmount","stopWatching","UNSAFE_componentWillReceiveProps","nextProps","lastValue","interval","setInterval","view","measure","_x","_y","width","height","_pageX","_pageY","checkInViewPort","delay","clearInterval","isVisible","onChange","render","component","children"],"mappings":"AAAA;;;;;;AAEA,OAAOA,KAAP,IAAgBC,SAAhB,QAAiC,OAAjC;AACA,SAASC,IAAT,QAAgC,cAAhC;;AASA;AACA;AACA;AACA;AACA;AACA,eAAe,MAAMC,gBAAN,SAA+BF,SAA/B,CAAgD;AAK7DG,EAAAA,WAAW,CAACC,KAAD,EAAe;AACxB,UAAMA,KAAN;;AADwB,uCAJU,IAIV;;AAAA,sCAHK,IAGL;;AAAA,kCAFE,IAEF;;AAExB,SAAKC,KAAL,GAAa;AAAEC,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,UAAU,EAAE;AAA1B,KAAb;AACD;;AAEDC,EAAAA,iBAAiB,GAAG;AAClB,QAAI,CAAC,KAAKJ,KAAL,CAAWK,QAAhB,EAA0B;AACxB,WAAKC,aAAL;AACD;AACF;;AAEDC,EAAAA,oBAAoB,GAAG;AACrB,SAAKC,YAAL;AACD;;AAEDC,EAAAA,gCAAgC,CAACC,SAAD,EAAmB;AACjD,QAAIA,SAAS,CAACL,QAAd,EAAwB;AACtB,WAAKG,YAAL;AACD,KAFD,MAEO;AACL,WAAKG,SAAL,GAAiB,IAAjB;AACA,WAAKL,aAAL;AACD;AACF;;AAEOA,EAAAA,aAAa,GAAG;AACtB,QAAI,KAAKM,QAAT,EAAmB;AACjB;AACD;;AACD,SAAKA,QAAL,GAAgBC,WAAW,CAAC,MAAM;AAChC,UAAI,CAAC,KAAKC,IAAV,EAAgB;AACd;AACD;;AACD,WAAKA,IAAL,CAAUC,OAAV,CAAkB,CAACC,EAAD,EAAKC,EAAL,EAASC,KAAT,EAAgBC,MAAhB,EAAwBC,MAAxB,EAAgCC,MAAhC,KAA2C;AAC3D,aAAKC,eAAL,CAAqBJ,KAArB,EAA4BC,MAA5B;AACD,OAFD;AAGD,KAP0B,EAOxB,KAAKnB,KAAL,CAAWuB,KAAX,IAAoB,GAPI,CAA3B;AAQD;;AAEOf,EAAAA,YAAY,GAAG;AACrB,SAAKI,QAAL,GAAgBY,aAAa,CAAC,KAAKZ,QAAN,CAA7B;AACD;;AAEOU,EAAAA,eAAe,CAACJ,KAAD,EAAiBC,MAAjB,EAAkC;AACvD,QAAIM,SAAJ,CADuD,CAEvD;;AACA,QAAI,CAACP,KAAD,IAAU,CAACC,MAAf,EAAuB;AACrBM,MAAAA,SAAS,GAAG,KAAZ;AACD,KAFD,MAEO;AACLA,MAAAA,SAAS,GAAG,IAAZ;AACD;;AAED,QAAI,KAAKd,SAAL,KAAmBc,SAAvB,EAAkC;AAAA;;AAChC,WAAKd,SAAL,GAAiBc,SAAjB;AACA,kDAAKzB,KAAL,EAAW0B,QAAX,gGAAsBD,SAAtB;AACD;AACF;;AAEDE,EAAAA,MAAM,GAAG;AACP,wBACE,oBAAC,IAAD;AACE,MAAA,WAAW,EAAE,KADf;AAEE,MAAA,GAAG,EAAGC,SAAD,IAAe;AAClB,aAAKd,IAAL,GAAYc,SAAZ;AACD;AAJH,OAKM,KAAK5B,KALX,GAOG,KAAKA,KAAL,CAAW6B,QAPd,CADF;AAWD;;AA1E4D","sourcesContent":["'use strict';\n\nimport React, { Component } from 'react';\nimport { View, ViewStyle } from 'react-native';\n\nexport type Props = {\n  disabled?: boolean;\n  style?: ViewStyle;\n  onChange?: (isVisible: boolean) => void;\n  delay?: number;\n};\n\n/**\n * Detects when this is in the viewport and visible.\n *\n * Will not fire visibility changes for zero width/height components.\n */\nexport default class ViewPortDetector extends Component<Props> {\n  private lastValue: boolean | null = null;\n  private interval: any | null = null;\n  private view: View | null = null;\n\n  constructor(props: Props) {\n    super(props);\n    this.state = { rectTop: 0, rectBottom: 0 };\n  }\n\n  componentDidMount() {\n    if (!this.props.disabled) {\n      this.startWatching();\n    }\n  }\n\n  componentWillUnmount() {\n    this.stopWatching();\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps: Props) {\n    if (nextProps.disabled) {\n      this.stopWatching();\n    } else {\n      this.lastValue = null;\n      this.startWatching();\n    }\n  }\n\n  private startWatching() {\n    if (this.interval) {\n      return;\n    }\n    this.interval = setInterval(() => {\n      if (!this.view) {\n        return;\n      }\n      this.view.measure((_x, _y, width, height, _pageX, _pageY) => {\n        this.checkInViewPort(width, height);\n      });\n    }, this.props.delay || 100);\n  }\n\n  private stopWatching() {\n    this.interval = clearInterval(this.interval);\n  }\n\n  private checkInViewPort(width?: number, height?: number) {\n    let isVisible: boolean;\n    // Not visible if any of these are missing.\n    if (!width || !height) {\n      isVisible = false;\n    } else {\n      isVisible = true;\n    }\n\n    if (this.lastValue !== isVisible) {\n      this.lastValue = isVisible;\n      this.props.onChange?.(isVisible);\n    }\n  }\n\n  render() {\n    return (\n      <View\n        collapsable={false}\n        ref={(component) => {\n          this.view = component;\n        }}\n        {...this.props}\n      >\n        {this.props.children}\n      </View>\n    );\n  }\n}\n"]}
+{"version":3,"sources":["ViewPortDetector.tsx"],"names":["React","Component","View","ViewPortDetector","constructor","props","state","rectTop","rectBottom","componentDidMount","disabled","startWatching","componentWillUnmount","stopWatching","UNSAFE_componentWillReceiveProps","nextProps","lastValue","interval","setInterval","view","measure","_x","_y","width","height","_pageX","_pageY","checkInViewPort","delay","clearInterval","isVisible","onChange","render","component","children"],"mappings":"AAAA;;;;;;AAEA,OAAOA,KAAP,IAAgBC,SAAhB,QAAoD,OAApD;AACA,SAASC,IAAT,QAAgC,cAAhC;;AASA;AACA;AACA;AACA;AACA;AACA,eAAe,MAAMC,gBAAN,SAA+BF,SAA/B,CAEb;AAKAG,EAAAA,WAAW,CAACC,KAAD,EAAe;AACxB,UAAMA,KAAN;;AADwB,uCAJU,IAIV;;AAAA,sCAHK,IAGL;;AAAA,kCAFE,IAEF;;AAExB,SAAKC,KAAL,GAAa;AAAEC,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,UAAU,EAAE;AAA1B,KAAb;AACD;;AAEDC,EAAAA,iBAAiB,GAAG;AAClB,QAAI,CAAC,KAAKJ,KAAL,CAAWK,QAAhB,EAA0B;AACxB,WAAKC,aAAL;AACD;AACF;;AAEDC,EAAAA,oBAAoB,GAAG;AACrB,SAAKC,YAAL;AACD;;AAEDC,EAAAA,gCAAgC,CAACC,SAAD,EAAmB;AACjD,QAAIA,SAAS,CAACL,QAAd,EAAwB;AACtB,WAAKG,YAAL;AACD,KAFD,MAEO;AACL,WAAKG,SAAL,GAAiB,IAAjB;AACA,WAAKL,aAAL;AACD;AACF;;AAEOA,EAAAA,aAAa,GAAG;AACtB,QAAI,KAAKM,QAAT,EAAmB;AACjB;AACD;;AACD,SAAKA,QAAL,GAAgBC,WAAW,CAAC,MAAM;AAChC,UAAI,CAAC,KAAKC,IAAV,EAAgB;AACd;AACD;;AACD,WAAKA,IAAL,CAAUC,OAAV,CAAkB,CAACC,EAAD,EAAKC,EAAL,EAASC,KAAT,EAAgBC,MAAhB,EAAwBC,MAAxB,EAAgCC,MAAhC,KAA2C;AAC3D,aAAKC,eAAL,CAAqBJ,KAArB,EAA4BC,MAA5B;AACD,OAFD;AAGD,KAP0B,EAOxB,KAAKnB,KAAL,CAAWuB,KAAX,IAAoB,GAPI,CAA3B;AAQD;;AAEOf,EAAAA,YAAY,GAAG;AACrB,SAAKI,QAAL,GAAgBY,aAAa,CAAC,KAAKZ,QAAN,CAA7B;AACD;;AAEOU,EAAAA,eAAe,CAACJ,KAAD,EAAiBC,MAAjB,EAAkC;AACvD,QAAIM,SAAJ,CADuD,CAEvD;;AACA,QAAI,CAACP,KAAD,IAAU,CAACC,MAAf,EAAuB;AACrBM,MAAAA,SAAS,GAAG,KAAZ;AACD,KAFD,MAEO;AACLA,MAAAA,SAAS,GAAG,IAAZ;AACD;;AAED,QAAI,KAAKd,SAAL,KAAmBc,SAAvB,EAAkC;AAAA;;AAChC,WAAKd,SAAL,GAAiBc,SAAjB;AACA,kDAAKzB,KAAL,EAAW0B,QAAX,gGAAsBD,SAAtB;AACD;AACF;;AAEDE,EAAAA,MAAM,GAAG;AACP,wBACE,oBAAC,IAAD;AACE,MAAA,WAAW,EAAE,KADf;AAEE,MAAA,GAAG,EAAGC,SAAD,IAAe;AAClB,aAAKd,IAAL,GAAYc,SAAZ;AACD;AAJH,OAKM,KAAK5B,KALX,GAOG,KAAKA,KAAL,CAAW6B,QAPd,CADF;AAWD;;AA1ED","sourcesContent":["'use strict';\n\nimport React, { Component, PropsWithChildren } from 'react';\nimport { View, ViewStyle } from 'react-native';\n\nexport type Props = {\n  disabled?: boolean;\n  style?: ViewStyle;\n  onChange?: (isVisible: boolean) => void;\n  delay?: number;\n};\n\n/**\n * Detects when this is in the viewport and visible.\n *\n * Will not fire visibility changes for zero width/height components.\n */\nexport default class ViewPortDetector extends Component<\n  PropsWithChildren<Props>\n> {\n  private lastValue: boolean | null = null;\n  private interval: any | null = null;\n  private view: View | null = null;\n\n  constructor(props: Props) {\n    super(props);\n    this.state = { rectTop: 0, rectBottom: 0 };\n  }\n\n  componentDidMount() {\n    if (!this.props.disabled) {\n      this.startWatching();\n    }\n  }\n\n  componentWillUnmount() {\n    this.stopWatching();\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps: Props) {\n    if (nextProps.disabled) {\n      this.stopWatching();\n    } else {\n      this.lastValue = null;\n      this.startWatching();\n    }\n  }\n\n  private startWatching() {\n    if (this.interval) {\n      return;\n    }\n    this.interval = setInterval(() => {\n      if (!this.view) {\n        return;\n      }\n      this.view.measure((_x, _y, width, height, _pageX, _pageY) => {\n        this.checkInViewPort(width, height);\n      });\n    }, this.props.delay || 100);\n  }\n\n  private stopWatching() {\n    this.interval = clearInterval(this.interval);\n  }\n\n  private checkInViewPort(width?: number, height?: number) {\n    let isVisible: boolean;\n    // Not visible if any of these are missing.\n    if (!width || !height) {\n      isVisible = false;\n    } else {\n      isVisible = true;\n    }\n\n    if (this.lastValue !== isVisible) {\n      this.lastValue = isVisible;\n      this.props.onChange?.(isVisible);\n    }\n  }\n\n  render() {\n    return (\n      <View\n        collapsable={false}\n        ref={(component) => {\n          this.view = component;\n        }}\n        {...this.props}\n      >\n        {this.props.children}\n      </View>\n    );\n  }\n}\n"]}

package/lib/module/index.js

@@ -1,4 +1,4 @@
-import { registerGlobals as webrtcRegisterGlobals } from 'react-native-webrtc';
+import { registerGlobals as webrtcRegisterGlobals } from '@livekit/react-native-webrtc';
 import { setupURLPolyfill } from 'react-native-url-polyfill';
 import AudioSession from './audio/AudioSession';
 import { PixelRatio, Platform } from 'react-native';
@@ -14,6 +14,7 @@ export function registerGlobals() {
   setupURLPolyfill();
   fixWebrtcAdapter();
   shimPromiseAllSettled();
+  shimArrayAt();
 }
 
 function livekitRegisterGlobals() {
@@ -49,6 +50,15 @@ function shimPromiseAllSettled() {
   allSettled.shim();
 }
 
+function shimArrayAt() {
+  // Some versions of RN don't have Array.prototype.at, which is used by sdp-transform
+  if (!Array.prototype.at) {
+    var at = require('array.prototype.at');
+
+    at.shim();
+  }
+}
+
 export * from './components/VideoView';
 export * from './useParticipant';
 export * from './useRoom';

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.tsx"],"names":["registerGlobals","webrtcRegisterGlobals","setupURLPolyfill","AudioSession","PixelRatio","Platform","livekitRegisterGlobals","fixWebrtcAdapter","shimPromiseAllSettled","lkGlobal","platform","OS","devicePixelRatio","get","global","LiveKitReactNativeGlobal","window","navigator","undefined","userAgent","product","allSettled","require","shim"],"mappings":"AAAA,SAASA,eAAe,IAAIC,qBAA5B,QAAyD,qBAAzD;AACA,SAASC,gBAAT,QAAiC,2BAAjC;AACA,OAAOC,YAAP,MAAyB,sBAAzB;AAEA,SAASC,UAAT,EAAqBC,QAArB,QAAqC,cAArC;;AAGA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASL,eAAT,GAA2B;AAChCC,EAAAA,qBAAqB;AACrBK,EAAAA,sBAAsB;AACtBJ,EAAAA,gBAAgB;AAChBK,EAAAA,gBAAgB;AAChBC,EAAAA,qBAAqB;AACtB;;AACD,SAASF,sBAAT,GAAkC;AAChC,MAAIG,QAAgC,GAAG;AACrCC,IAAAA,QAAQ,EAAEL,QAAQ,CAACM,EADkB;AAErCC,IAAAA,gBAAgB,EAAER,UAAU,CAACS,GAAX;AAFmB,GAAvC,CADgC,CAMhC;;AACAC,EAAAA,MAAM,CAACC,wBAAP,GAAkCN,QAAlC;AACD;;AAED,SAASF,gBAAT,GAA4B;AAAA;;AAC1B;AACA,MAAI,YAAAS,MAAM,UAAN,0CAAQC,SAAR,MAAsBC,SAA1B,EAAqC;AACnC;AACA,UAAM;AAAED,MAAAA;AAAF,QAAgBD,MAAtB;;AACA,QAAIC,SAAS,CAACE,SAAV,KAAwBD,SAA5B,EAAuC;AAAA;;AACrCD,MAAAA,SAAS,CAACE,SAAV,yBAAsBF,SAAS,CAACG,OAAhC,mEAA2C,SAA3C;AACD;AACF;AACF;;AAED,SAASZ,qBAAT,GAAiC;AAC/B,MAAIa,UAAU,GAAGC,OAAO,CAAC,oBAAD,CAAxB;;AACAD,EAAAA,UAAU,CAACE,IAAX;AACD;;AAED,cAAc,wBAAd;AACA,cAAc,kBAAd;AACA,cAAc,WAAd;AACA,SAASpB,YAAT","sourcesContent":["import { registerGlobals as webrtcRegisterGlobals } from 'react-native-webrtc';\nimport { setupURLPolyfill } from 'react-native-url-polyfill';\nimport AudioSession from './audio/AudioSession';\nimport type { AudioConfiguration } from './audio/AudioSession';\nimport { PixelRatio, Platform } from 'react-native';\nimport type { LiveKitReactNativeInfo } from 'livekit-client';\n\n/**\n * Registers the required globals needed for LiveKit to work.\n *\n * Must be called before using LiveKit.\n */\nexport function registerGlobals() {\n  webrtcRegisterGlobals();\n  livekitRegisterGlobals();\n  setupURLPolyfill();\n  fixWebrtcAdapter();\n  shimPromiseAllSettled();\n}\nfunction livekitRegisterGlobals() {\n  let lkGlobal: LiveKitReactNativeInfo = {\n    platform: Platform.OS,\n    devicePixelRatio: PixelRatio.get(),\n  };\n\n  // @ts-ignore\n  global.LiveKitReactNativeGlobal = lkGlobal;\n}\n\nfunction fixWebrtcAdapter() {\n  // @ts-ignore\n  if (window?.navigator !== undefined) {\n    // @ts-ignore\n    const { navigator } = window;\n    if (navigator.userAgent === undefined) {\n      navigator.userAgent = navigator.product ?? 'Unknown';\n    }\n  }\n}\n\nfunction shimPromiseAllSettled() {\n  var allSettled = require('promise.allsettled');\n  allSettled.shim();\n}\n\nexport * from './components/VideoView';\nexport * from './useParticipant';\nexport * from './useRoom';\nexport { AudioSession, AudioConfiguration };\n"]}
+{"version":3,"sources":["index.tsx"],"names":["registerGlobals","webrtcRegisterGlobals","setupURLPolyfill","AudioSession","PixelRatio","Platform","livekitRegisterGlobals","fixWebrtcAdapter","shimPromiseAllSettled","shimArrayAt","lkGlobal","platform","OS","devicePixelRatio","get","global","LiveKitReactNativeGlobal","window","navigator","undefined","userAgent","product","allSettled","require","shim","Array","prototype","at"],"mappings":"AAAA,SAASA,eAAe,IAAIC,qBAA5B,QAAyD,8BAAzD;AACA,SAASC,gBAAT,QAAiC,2BAAjC;AACA,OAAOC,YAAP,MAAyB,sBAAzB;AAEA,SAASC,UAAT,EAAqBC,QAArB,QAAqC,cAArC;;AAGA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASL,eAAT,GAA2B;AAChCC,EAAAA,qBAAqB;AACrBK,EAAAA,sBAAsB;AACtBJ,EAAAA,gBAAgB;AAChBK,EAAAA,gBAAgB;AAChBC,EAAAA,qBAAqB;AACrBC,EAAAA,WAAW;AACZ;;AACD,SAASH,sBAAT,GAAkC;AAChC,MAAII,QAAgC,GAAG;AACrCC,IAAAA,QAAQ,EAAEN,QAAQ,CAACO,EADkB;AAErCC,IAAAA,gBAAgB,EAAET,UAAU,CAACU,GAAX;AAFmB,GAAvC,CADgC,CAMhC;;AACAC,EAAAA,MAAM,CAACC,wBAAP,GAAkCN,QAAlC;AACD;;AAED,SAASH,gBAAT,GAA4B;AAAA;;AAC1B;AACA,MAAI,YAAAU,MAAM,UAAN,0CAAQC,SAAR,MAAsBC,SAA1B,EAAqC;AACnC;AACA,UAAM;AAAED,MAAAA;AAAF,QAAgBD,MAAtB;;AACA,QAAIC,SAAS,CAACE,SAAV,KAAwBD,SAA5B,EAAuC;AAAA;;AACrCD,MAAAA,SAAS,CAACE,SAAV,yBAAsBF,SAAS,CAACG,OAAhC,mEAA2C,SAA3C;AACD;AACF;AACF;;AAED,SAASb,qBAAT,GAAiC;AAC/B,MAAIc,UAAU,GAAGC,OAAO,CAAC,oBAAD,CAAxB;;AACAD,EAAAA,UAAU,CAACE,IAAX;AACD;;AAED,SAASf,WAAT,GAAuB;AACrB;AACA,MAAI,CAACgB,KAAK,CAACC,SAAN,CAAgBC,EAArB,EAAyB;AACvB,QAAIA,EAAE,GAAGJ,OAAO,CAAC,oBAAD,CAAhB;;AACAI,IAAAA,EAAE,CAACH,IAAH;AACD;AACF;;AAED,cAAc,wBAAd;AACA,cAAc,kBAAd;AACA,cAAc,WAAd;AACA,SAASrB,YAAT","sourcesContent":["import { registerGlobals as webrtcRegisterGlobals } from '@livekit/react-native-webrtc';\nimport { setupURLPolyfill } from 'react-native-url-polyfill';\nimport AudioSession from './audio/AudioSession';\nimport type { AudioConfiguration } from './audio/AudioSession';\nimport { PixelRatio, Platform } from 'react-native';\nimport type { LiveKitReactNativeInfo } from 'livekit-client';\n\n/**\n * Registers the required globals needed for LiveKit to work.\n *\n * Must be called before using LiveKit.\n */\nexport function registerGlobals() {\n  webrtcRegisterGlobals();\n  livekitRegisterGlobals();\n  setupURLPolyfill();\n  fixWebrtcAdapter();\n  shimPromiseAllSettled();\n  shimArrayAt();\n}\nfunction livekitRegisterGlobals() {\n  let lkGlobal: LiveKitReactNativeInfo = {\n    platform: Platform.OS,\n    devicePixelRatio: PixelRatio.get(),\n  };\n\n  // @ts-ignore\n  global.LiveKitReactNativeGlobal = lkGlobal;\n}\n\nfunction fixWebrtcAdapter() {\n  // @ts-ignore\n  if (window?.navigator !== undefined) {\n    // @ts-ignore\n    const { navigator } = window;\n    if (navigator.userAgent === undefined) {\n      navigator.userAgent = navigator.product ?? 'Unknown';\n    }\n  }\n}\n\nfunction shimPromiseAllSettled() {\n  var allSettled = require('promise.allsettled');\n  allSettled.shim();\n}\n\nfunction shimArrayAt() {\n  // Some versions of RN don't have Array.prototype.at, which is used by sdp-transform\n  if (!Array.prototype.at) {\n    var at = require('array.prototype.at');\n    at.shim();\n  }\n}\n\nexport * from './components/VideoView';\nexport * from './useParticipant';\nexport * from './useRoom';\nexport { AudioSession, AudioConfiguration };\n"]}

package/lib/typescript/components/VideoView.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { ViewStyle } from 'react-native';
 import { VideoTrack } from 'livekit-client';
 export declare type Props = {
@@ -7,4 +8,4 @@ export declare type Props = {
     mirror?: boolean;
     zOrder?: number;
 };
-export declare const VideoView: ({ style, videoTrack, objectFit, zOrder, mirror, }: Props) => JSX.Element;
+export declare const VideoView: ({ style, videoTrack, objectFit, zOrder, mirror, }: Props) => React.JSX.Element;

package/lib/typescript/components/ViewPortDetector.d.ts

@@ -1,4 +1,4 @@
-import { Component } from 'react';
+import React, { Component, PropsWithChildren } from 'react';
 import { ViewStyle } from 'react-native';
 export declare type Props = {
     disabled?: boolean;
@@ -11,7 +11,7 @@ export declare type Props = {
  *
  * Will not fire visibility changes for zero width/height components.
  */
-export default class ViewPortDetector extends Component<Props> {
+export default class ViewPortDetector extends Component<PropsWithChildren<Props>> {
     private lastValue;
     private interval;
     private view;
@@ -22,5 +22,5 @@ export default class ViewPortDetector extends Component<Props> {
     private startWatching;
     private stopWatching;
     private checkInViewPort;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/livekit-react-native.podspec

@@ -18,5 +18,5 @@ Pod::Spec.new do |s|
   s.framework    = 'AVFAudio'
 
   s.dependency "React-Core"
-  s.dependency "react-native-webrtc"
+  s.dependency "livekit-react-native-webrtc"
 end

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@livekit/react-native",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "LiveKit for React Native",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -39,27 +39,30 @@
     "android"
   ],
   "dependencies": {
+    "array.prototype.at": "^1.1.1",
     "livekit-client": "^1.8.0",
     "promise.allsettled": "^1.0.5",
     "react-native-url-polyfill": "^1.3.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.12.10",
-    "@babel/preset-env": "^7.1.6",
-    "@babel/runtime": "^7.12.5",
+    "@babel/core": "^7.20.0",
+    "@babel/preset-env": "^7.20.0",
+    "@babel/runtime": "^7.20.0",
     "@commitlint/config-conventional": "^16.2.1",
-    "@react-native-community/eslint-config": "^3.1.0",
+    "@livekit/react-native-webrtc": "^104.0.0-beta.0",
+    "@react-native-community/eslint-config": "^3.2.0",
     "@release-it/conventional-changelog": "^4.2.0",
-    "@types/jest": "^26.0.0",
-    "@types/react": "^17.0.0",
-    "@types/react-native": "0.66.16",
-    "@types/react-native-webrtc": "^1.75.5",
+    "@tsconfig/react-native": "^2.0.2",
+    "@types/jest": "^29.2.1",
+    "@types/react": "^18.0.24",
+    "@types/react-native": "^0.71.3",
     "commitlint": "^16.2.1",
     "eslint": "^8.23.0",
     "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-ft-flow": "^2.0.3",
     "eslint-plugin-prettier": "^4.2.1",
     "husky": "^7.0.4",
-    "jest": "^27.5.1",
+    "jest": "^29.2.1",
     "pod-install": "^0.1.0",
     "prettier": "^2.5.1",
     "react": "18.0.0",
@@ -67,12 +70,12 @@
     "react-native-builder-bob": "^0.18.2",
     "release-it": "^14.2.2",
     "typedoc": "^0.23.14",
-    "typescript": "^4.8.2"
+    "typescript": "4.8.4"
   },
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
-    "react-native-webrtc": "^111.0.0"
+    "@livekit/react-native-webrtc": "^104.0.0"
   },
   "scripts": {
     "test": "jest",

package/src/components/VideoView.tsx

@@ -8,7 +8,7 @@ import {
   TrackEvent,
   VideoTrack,
 } from 'livekit-client';
-import { RTCView } from 'react-native-webrtc';
+import { RTCView } from '@livekit/react-native-webrtc';
 import { useEffect, useState } from 'react';
 import { RemoteVideoTrack } from 'livekit-client';
 import ViewPortDetector from './ViewPortDetector';
@@ -75,7 +75,11 @@ export const VideoView = ({
         style={styles.videoView}
       >
         <RTCView
-          style={styles.videoView}
+          // eslint-disable-next-line react-native/no-inline-styles
+          style={{
+            flex: 1,
+            width: '100%',
+          }}
           streamURL={mediaStream?.toURL() ?? ''}
           objectFit={objectFit}
           zOrder={zOrder}

package/src/components/ViewPortDetector.tsx

@@ -1,6 +1,6 @@
 'use strict';
 
-import React, { Component } from 'react';
+import React, { Component, PropsWithChildren } from 'react';
 import { View, ViewStyle } from 'react-native';
 
 export type Props = {
@@ -15,7 +15,9 @@ export type Props = {
  *
  * Will not fire visibility changes for zero width/height components.
  */
-export default class ViewPortDetector extends Component<Props> {
+export default class ViewPortDetector extends Component<
+  PropsWithChildren<Props>
+> {
   private lastValue: boolean | null = null;
   private interval: any | null = null;
   private view: View | null = null;

package/src/index.tsx

@@ -1,4 +1,4 @@
-import { registerGlobals as webrtcRegisterGlobals } from 'react-native-webrtc';
+import { registerGlobals as webrtcRegisterGlobals } from '@livekit/react-native-webrtc';
 import { setupURLPolyfill } from 'react-native-url-polyfill';
 import AudioSession from './audio/AudioSession';
 import type { AudioConfiguration } from './audio/AudioSession';
@@ -16,6 +16,7 @@ export function registerGlobals() {
   setupURLPolyfill();
   fixWebrtcAdapter();
   shimPromiseAllSettled();
+  shimArrayAt();
 }
 function livekitRegisterGlobals() {
   let lkGlobal: LiveKitReactNativeInfo = {
@@ -43,6 +44,14 @@ function shimPromiseAllSettled() {
   allSettled.shim();
 }
 
+function shimArrayAt() {
+  // Some versions of RN don't have Array.prototype.at, which is used by sdp-transform
+  if (!Array.prototype.at) {
+    var at = require('array.prototype.at');
+    at.shim();
+  }
+}
+
 export * from './components/VideoView';
 export * from './useParticipant';
 export * from './useRoom';