Merge branch 'master' into cr-android-improvements

2022-05-23 11:59:22 +03:00
parent 87472ebd4a 424b703fe8
commit 8b317ed398
148 changed files with 9108 additions and 6242 deletions
--- a/examples/basic/.buckconfig
+++ b/examples/basic/.buckconfig
@@ -1,6 +0,0 @@
-
-[android]
-  target = Google Inc.:Google APIs:23
-
-[maven_repositories]
-  central = https://repo1.maven.org/maven2
--- a/examples/basic/.flowconfig
+++ b/examples/basic/.flowconfig
@@ -1,58 +0,0 @@
-[ignore]
-; We fork some components by platform
-.*/*[.]android.js
-
-# We fork some components by platform.
-.*/*[.]android.js
-
-# Ignore templates with `@flow` in header
-.*/local-cli/generator.*
-
-# Ignore malformed json
-.*/node_modules/y18n/test/.*\.json
-
-# Ignore the website subdir
-<PROJECT_ROOT>/website/.*
-
-# Ignore BUCK generated dirs
-
-<PROJECT_ROOT>/\.buckd/
-
-; Ignore unexpected extra "@providesModule"
-.*/node_modules/.*/node_modules/fbjs/.*
-
-; Ignore duplicate module providers
-; For RN Apps installed via npm, "Libraries" folder is inside
-; "node_modules/react-native" but in the source repo it is in the root
-.*/Libraries/react-native/React.js
-.*/Libraries/react-native/ReactNative.js
-
-[include]
-
-[libs]
-node_modules/react-native/Libraries/react-native/react-native-interface.js
-node_modules/react-native/flow
-flow/
-
-[options]
-module.system=haste
-
-experimental.strict_type_args=true
-
-munge_underscores=true
-
-module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
-
-suppress_type=$FlowIssue
-suppress_type=$FlowFixMe
-suppress_type=$FixMe
-
-suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(3[0-6]\\|[1-2][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
-suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(3[0-6]\\|1[0-9]\\|[1-2][0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
-suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
-
-unsafe.enable_getters_and_setters=true
-
-[version]
-
-^0.36.0
--- a/examples/basic/.gitattributes
+++ b/examples/basic/.gitattributes
@@ -1 +0,0 @@
-*.pbxproj -text
--- a/examples/basic/.gitignore
+++ b/examples/basic/.gitignore
@@ -1,53 +0,0 @@
-# OSX
-#
-.DS_Store
-
-# Xcode
-#
-build/
-*.pbxuser
-!default.pbxuser
-*.mode1v3
-!default.mode1v3
-*.mode2v3
-!default.mode2v3
-*.perspectivev3
-!default.perspectivev3
-xcuserdata
-*.xccheckout
-*.moved-aside
-DerivedData
-*.hmap
-*.ipa
-*.xcuserstate
-project.xcworkspace
-
-# Android/IntelliJ
-#
-build/
-.idea
-.gradle
-local.properties
-*.iml
-
-# node.js
-#
-node_modules/
-npm-debug.log
-
-# BUCK
-buck-out/
-\.buckd/
-android/app/libs
-*.keystore
-
-# fastlane
-#
-# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
-# screenshots whenever they are needed.
-# For more information about the recommended setup visit:
-# https://github.com/fastlane/fastlane/blob/master/fastlane/docs/Gitignore.md
-
-fastlane/report.xml
-fastlane/Preview.html
-fastlane/screenshots
--- a/examples/basic/.watchmanconfig
+++ b/examples/basic/.watchmanconfig
@@ -1 +0,0 @@
-{}
--- a/examples/basic/tests/App-test.js
+++ b/examples/basic/tests/App-test.js
@@ -0,0 +1,14 @@
+/**
+ * @format
+ */
+
+import 'react-native';
+import React from 'react';
+import VideoPlayer from '../src/VideoPlayer';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+  renderer.create(<VideoPlayer />);
+});
--- a/examples/basic/android/app/BUCK
+++ b/examples/basic/android/app/BUCK
@@ -1,5 +1,3 @@
-import re
-
 # To learn about Buck see [Docs](https://buckbuild.com/).
 # To run your application with Buck:
 # - install Buck
@@ -10,57 +8,48 @@ import re
 # - `buck install -r android/app` - compile, install and run application
 #

-lib_deps = []
-for jarfile in glob(['libs/*.jar']):
-  name = 'jars__' + re.sub(r'^.*/([^/]+)\.jar$', r'\1', jarfile)
-  lib_deps.append(':' + name)
-  prebuilt_jar(
-    name = name,
-    binary_jar = jarfile,
-  )
+load(":build_defs.bzl", "create_aar_targets", "create_jar_targets")

-for aarfile in glob(['libs/*.aar']):
-  name = 'aars__' + re.sub(r'^.*/([^/]+)\.aar$', r'\1', aarfile)
-  lib_deps.append(':' + name)
-  android_prebuilt_aar(
-    name = name,
-    aar = aarfile,
-  )
+lib_deps = []
+
+create_aar_targets(glob(["libs/*.aar"]))
+
+create_jar_targets(glob(["libs/*.jar"]))

 android_library(
-  name = 'all-libs',
-  exported_deps = lib_deps
+    name = "all-libs",
+    exported_deps = lib_deps,
 )

 android_library(
-  name = 'app-code',
-  srcs = glob([
-    'src/main/java/**/*.java',
-  ]),
-  deps = [
-    ':all-libs',
-    ':build_config',
-    ':res',
-  ],
+    name = "app-code",
+    srcs = glob([
+        "src/main/java/**/*.java",
+    ]),
+    deps = [
+        ":all-libs",
+        ":build_config",
+        ":res",
+    ],
 )

 android_build_config(
-  name = 'build_config',
-  package = 'com.videoplayer',
+    name = "build_config",
+    package = "com.videoplayer",
 )

 android_resource(
-  name = 'res',
-  res = 'src/main/res',
-  package = 'com.videoplayer',
+    name = "res",
+    package = "com.videoplayer",
+    res = "src/main/res",
 )

 android_binary(
-  name = 'app',
-  package_type = 'debug',
-  manifest = 'src/main/AndroidManifest.xml',
-  keystore = '//android/keystores:debug',
-  deps = [
-    ':app-code',
-  ],
+    name = "app",
+    keystore = "//android/keystores:debug",
+    manifest = "src/main/AndroidManifest.xml",
+    package_type = "debug",
+    deps = [
+        ":app-code",
+    ],
 )
--- a/examples/basic/android/app/build.gradle
+++ b/examples/basic/android/app/build.gradle
@@ -15,9 +15,14 @@ import com.android.build.OutputFile
 *   // the name of the generated asset file containing your JS bundle
 *   bundleAssetName: "index.android.bundle",
 *
- *   // the entry file for bundle generation
+ *   // the entry file for bundle generation. If none specified and
+ *   // "index.android.js" exists, it will be used. Otherwise "index.js" is
+ *   // default. Can be overridden with ENTRY_FILE environment variable.
 *   entryFile: "index.android.js",
 *
+ *   // https://reactnative.dev/docs/performance#enable-the-ram-format
+ *   bundleCommand: "ram-bundle",
+ *
 *   // whether to bundle JS and assets in debug mode
 *   bundleInDebug: false,
 *
@@ -33,6 +38,13 @@ import com.android.build.OutputFile
 *   // bundleInPaidRelease: true,
 *   // bundleInBeta: true,
 *
+ *   // whether to disable dev mode in custom build variants (by default only disabled in release)
+ *   // for example: to disable dev mode in the staging build type (if configured)
+ *   devDisabledInStaging: true,
+ *   // The configuration property can be in the following formats
+ *   //         'devDisabledIn${productFlavor}${buildType}'
+ *   //         'devDisabledIn${buildType}'
+ *
 *   // the root of your project, i.e. where "package.json" lives
 *   root: "../../",
 *
@@ -58,7 +70,7 @@ import com.android.build.OutputFile
 *   inputExcludes: ["android/**", "ios/**"],
 *
 *   // override which node gets called and with what additional arguments
- *   nodeExecutableAndArgs: ["node"]
+ *   nodeExecutableAndArgs: ["node"],
 *
 *   // supply additional arguments to the packager
 *   extraPackagerArgs: []
@@ -66,9 +78,9 @@ import com.android.build.OutputFile
 */

 project.ext.react = [
-    entryFile: "index.android.js",
-    enableHermes: false,
+    enableHermes: false,  // clean and rebuild if changing
 ]
+
 apply from: "../../node_modules/react-native/react.gradle"

 /**
@@ -86,58 +98,117 @@ def enableSeparateBuildPerCPUArchitecture = false
 */
 def enableProguardInReleaseBuilds = false

+/**
+ * The preferred build flavor of JavaScriptCore.
+ *
+ * For example, to use the international variant, you can use:
+ * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
+ *
+ * The international variant includes ICU i18n library and necessary data
+ * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
+ * give correct results when using with locales other than en-US.  Note that
+ * this variant is about 6MiB larger per architecture than default.
+ */
+def jscFlavor = 'org.webkit:android-jsc:+'
+
+/**
+ * Whether to enable the Hermes VM.
+ *
+ * This should be set on project.ext.react and mirrored here.  If it is not set
+ * on project.ext.react, JavaScript will not be compiled to Hermes Bytecode
+ * and the benefits of using Hermes will therefore be sharply reduced.
+ */
+def enableHermes = project.ext.react.get("enableHermes", false);
+
 android {
    compileSdkVersion rootProject.ext.compileSdkVersion
-    buildToolsVersion rootProject.ext.buildToolsVersion
+
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
+
    defaultConfig {
        applicationId "com.videoplayer"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
-        ndk {
-            abiFilters "armeabi-v7a", "x86"
-        }
+        multiDexEnabled true 
+
    }
    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
-            include "armeabi-v7a", "x86"
+            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
+        }
+    }
+    signingConfigs {
+        debug {
+            storeFile file('debug.keystore')
+            storePassword 'android'
+            keyAlias 'androiddebugkey'
+            keyPassword 'android'
        }
    }
    buildTypes {
+        debug {
+            signingConfig signingConfigs.debug
+        }
        release {
+            // Caution! In production, you need to generate your own keystore file.
+            // see https://reactnative.dev/docs/signed-apk-android.
            signingConfig signingConfigs.debug
            minifyEnabled enableProguardInReleaseBuilds
-            matchingFallbacks = ['release', 'debug']
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
+
    // applicationVariants are e.g. debug, release
    applicationVariants.all { variant ->
        variant.outputs.each { output ->
            // For each separate APK per architecture, set a unique version code as described here:
-            // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
-            def versionCodes = ["armeabi-v7a":1, "x86":2]
+            // https://developer.android.com/studio/build/configure-apk-splits.html
+            def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
            def abi = output.getFilter(OutputFile.ABI)
            if (abi != null) {  // null for the universal-debug, universal-release variants
                output.versionCodeOverride =
                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
            }
+
        }
    }
 }

 dependencies {
-    implementation project(':react-native-video')
+    implementation fileTree(dir: "libs", include: ["*.jar"])
+    //noinspection GradleDynamicVersion
    implementation "com.facebook.react:react-native:+"  // From node_modules
-    implementation 'org.webkit:android-jsc:+'
+
+    implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
+
+    debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
+      exclude group:'com.facebook.fbjni'
+    }
+
+    debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
+        exclude group:'com.facebook.flipper'
+        exclude group:'com.squareup.okhttp3', module:'okhttp'
+    }
+
+    debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {
+        exclude group:'com.facebook.flipper'
+    }
+
+    if (enableHermes) {
+        def hermesPath = "../../node_modules/hermes-engine/android/";
+        debugImplementation files(hermesPath + "hermes-debug.aar")
+        releaseImplementation files(hermesPath + "hermes-release.aar")
+    } else {
+        implementation jscFlavor
+    }
 }

 // Run this once to be able to run the application with BUCK
@@ -146,3 +217,5 @@ task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into 'libs'
 }
+
+apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
--- a/examples/basic/android/app/build_defs.bzl
+++ b/examples/basic/android/app/build_defs.bzl
@@ -0,0 +1,19 @@
+"""Helper definitions to glob .aar and .jar targets"""
+
+def create_aar_targets(aarfiles):
+    for aarfile in aarfiles:
+        name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")]
+        lib_deps.append(":" + name)
+        android_prebuilt_aar(
+            name = name,
+            aar = aarfile,
+        )
+
+def create_jar_targets(jarfiles):
+    for jarfile in jarfiles:
+        name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")]
+        lib_deps.append(":" + name)
+        prebuilt_jar(
+            name = name,
+            binary_jar = jarfile,
+        )
--- a/examples/basic/android/app/debug.keystore
+++ b/examples/basic/android/app/debug.keystore
--- a/examples/basic/android/app/proguard-rules.pro
+++ b/examples/basic/android/app/proguard-rules.pro
@@ -63,4 +63,4 @@
 -keep class sun.misc.Unsafe { *; }
 -dontwarn java.nio.file.*
 -dontwarn org.codehaus.mojo.animal_sniffer.IgnoreJRERequirement
-dontwarn okio.**
+-dontwarn okio.**
--- a/examples/basic/android/app/src/debug/AndroidManifest.xml
+++ b/examples/basic/android/app/src/debug/AndroidManifest.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
+
+    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" />
+</manifest>
--- a/examples/basic/android/app/src/debug/java/com/videoplayer/ReactNativeFlipper.java
+++ b/examples/basic/android/app/src/debug/java/com/videoplayer/ReactNativeFlipper.java
@@ -0,0 +1,72 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * <p>This source code is licensed under the MIT license found in the LICENSE file in the root
+ * directory of this source tree.
+ */
+package com.videoplayer;
+
+import android.content.Context;
+import com.facebook.flipper.android.AndroidFlipperClient;
+import com.facebook.flipper.android.utils.FlipperUtils;
+import com.facebook.flipper.core.FlipperClient;
+import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
+import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
+import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
+import com.facebook.flipper.plugins.inspector.DescriptorMapping;
+import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
+import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
+import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
+import com.facebook.flipper.plugins.react.ReactFlipperPlugin;
+import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
+import com.facebook.react.ReactInstanceManager;
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.modules.network.NetworkingModule;
+import okhttp3.OkHttpClient;
+
+public class ReactNativeFlipper {
+  public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
+    if (FlipperUtils.shouldEnableFlipper(context)) {
+      final FlipperClient client = AndroidFlipperClient.getInstance(context);
+
+      client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
+      client.addPlugin(new ReactFlipperPlugin());
+      client.addPlugin(new DatabasesFlipperPlugin(context));
+      client.addPlugin(new SharedPreferencesFlipperPlugin(context));
+      client.addPlugin(CrashReporterPlugin.getInstance());
+
+      NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
+      NetworkingModule.setCustomClientBuilder(
+          new NetworkingModule.CustomClientBuilder() {
+            @Override
+            public void apply(OkHttpClient.Builder builder) {
+              builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
+            }
+          });
+      client.addPlugin(networkFlipperPlugin);
+      client.start();
+
+      // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
+      // Hence we run if after all native modules have been initialized
+      ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
+      if (reactContext == null) {
+        reactInstanceManager.addReactInstanceEventListener(
+            new ReactInstanceManager.ReactInstanceEventListener() {
+              @Override
+              public void onReactContextInitialized(ReactContext reactContext) {
+                reactInstanceManager.removeReactInstanceEventListener(this);
+                reactContext.runOnNativeModulesQueueThread(
+                    new Runnable() {
+                      @Override
+                      public void run() {
+                        client.addPlugin(new FrescoFlipperPlugin());
+                      }
+                    });
+              }
+            });
+      } else {
+        client.addPlugin(new FrescoFlipperPlugin());
+      }
+    }
+  }
+}
--- a/examples/basic/android/app/src/main/AndroidManifest.xml
+++ b/examples/basic/android/app/src/main/AndroidManifest.xml
@@ -1,21 +1,23 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    package="com.videoplayer"
-    android:versionCode="1"
-    android:versionName="1.0">
+  package="com.videoplayer">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

-  <application
+    <application
      android:name=".MainApplication"
      android:allowBackup="true"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
+      android:usesCleartextTraffic="true"
+      android:roundIcon="@mipmap/ic_launcher_round"
      android:theme="@style/AppTheme">
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
-        android:configChanges="keyboard|keyboardHidden|orientation|screenSize">
+        android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
+        android:launchMode="singleTask"
+        android:windowSoftInputMode="adjustResize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
--- a/examples/basic/android/app/src/main/java/com/videoplayer/MainActivity.java
+++ b/examples/basic/android/app/src/main/java/com/videoplayer/MainActivity.java
@@ -4,12 +4,12 @@ import com.facebook.react.ReactActivity;

 public class MainActivity extends ReactActivity {

-    /**
-     * Returns the name of the main component registered from JavaScript.
-     * This is used to schedule rendering of the component.
-     */
-    @Override
-    protected String getMainComponentName() {
-        return "VideoPlayer";
-    }
+  /**
+   * Returns the name of the main component registered from JavaScript. This is used to schedule
+   * rendering of the component.
+   */
+  @Override
+  protected String getMainComponentName() {
+    return "VideoPlayer";
+  }
 }
--- a/examples/basic/android/app/src/main/java/com/videoplayer/MainApplication.java
+++ b/examples/basic/android/app/src/main/java/com/videoplayer/MainApplication.java
@@ -1,15 +1,14 @@
 package com.videoplayer;

 import android.app.Application;
-
+import android.content.Context;
+import com.facebook.react.PackageList;
 import com.facebook.react.ReactApplication;
-import com.brentvatne.react.ReactVideoPackage;
+import com.facebook.react.ReactInstanceManager;
 import com.facebook.react.ReactNativeHost;
 import com.facebook.react.ReactPackage;
-import com.facebook.react.shell.MainReactPackage;
 import com.facebook.soloader.SoLoader;
-
-import java.util.Arrays;
+import java.lang.reflect.InvocationTargetException;
 import java.util.List;

 public class MainApplication extends Application implements ReactApplication {
@@ -22,10 +21,17 @@ public class MainApplication extends Application implements ReactApplication {

    @Override
    protected List<ReactPackage> getPackages() {
-      return Arrays.asList(
-        new MainReactPackage(),
-        new ReactVideoPackage()
-      );
+      @SuppressWarnings("UnnecessaryLocalVariable")
+      List<ReactPackage> packages = new PackageList(this).getPackages();
+      // Packages that cannot be autolinked yet can be added manually here, for
+      // example:
+      // packages.add(new MyReactNativePackage());
+      return packages;
+    }
+
+    @Override
+    protected String getJSMainModuleName() {
+      return "src/index";
    }
  };

--- a/examples/basic/android/app/src/main/res/mipmap-hdpi/ic_launcher.png
+++ b/examples/basic/android/app/src/main/res/mipmap-hdpi/ic_launcher.png
--- a/examples/basic/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png
+++ b/examples/basic/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png
--- a/examples/basic/android/app/src/main/res/mipmap-mdpi/ic_launcher.png
+++ b/examples/basic/android/app/src/main/res/mipmap-mdpi/ic_launcher.png
--- a/examples/basic/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png
+++ b/examples/basic/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png
--- a/examples/basic/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
+++ b/examples/basic/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
--- a/examples/basic/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png
+++ b/examples/basic/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png
--- a/examples/basic/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
+++ b/examples/basic/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
--- a/examples/basic/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png
+++ b/examples/basic/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png
--- a/examples/basic/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png
+++ b/examples/basic/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png
--- a/examples/basic/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png
+++ b/examples/basic/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png
--- a/examples/basic/android/app/src/main/res/values/styles.xml
+++ b/examples/basic/android/app/src/main/res/values/styles.xml
@@ -3,6 +3,7 @@
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
+        <item name="android:textColor">#000000</item>
    </style>

 </resources>
--- a/examples/basic/android/build.gradle
+++ b/examples/basic/android/build.gradle
@@ -2,20 +2,17 @@

 buildscript {
    ext {
-    buildToolsVersion = "28.0.3"
-    minSdkVersion = 16
-    compileSdkVersion = 28
-    targetSdkVersion = 28
-    supportLibVersion = "28.0.0"
-
-}
+        buildToolsVersion = "29.0.2"
+        minSdkVersion = 16
+        compileSdkVersion = 29
+        targetSdkVersion = 29
+    }
    repositories {
-        jcenter()
        google()
+        jcenter()
    }
    dependencies {
-        classpath 'com.android.tools.build:gradle:3.4.1'
-
+        classpath("com.android.tools.build:gradle:4.2.2")
        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
@@ -24,18 +21,17 @@ buildscript {
 allprojects {
    repositories {
        mavenLocal()
-        google()
-        maven {
-           url "https://jitpack.io"
-        }
-        jcenter()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
-            url "$rootDir/../node_modules/react-native/android"
+            url("$rootDir/../node_modules/react-native/android")
        }
        maven {
            // Android JSC is installed from npm
            url("$rootDir/../node_modules/jsc-android/dist")
        }
+
+        google()
+        jcenter()
+        maven { url 'https://www.jitpack.io' }
    }
 }
--- a/examples/basic/android/gradle.properties
+++ b/examples/basic/android/gradle.properties
@@ -17,5 +17,12 @@
 # http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
 # org.gradle.parallel=true

+# AndroidX package structure to make it clearer which packages are bundled with the
+# Android operating system, and which are packaged with your app's APK
+# https://developer.android.com/topic/libraries/support-library/androidx-rn
 android.useAndroidX=true
-android.enableJetifier=true
+# Automatically convert third-party libraries to use AndroidX
+android.enableJetifier=true
+
+# Version of flipper SDK to use with React Native
+FLIPPER_VERSION=0.54.0
--- a/examples/basic/android/gradle/wrapper/gradle-wrapper.jar
+++ b/examples/basic/android/gradle/wrapper/gradle-wrapper.jar
--- a/examples/basic/android/gradle/wrapper/gradle-wrapper.properties
+++ b/examples/basic/android/gradle/wrapper/gradle-wrapper.properties
@@ -1,6 +1,5 @@
-#Thu Mar 09 08:03:03 PST 2017
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
+distributionUrl=https\://services.gradle.org/distributions/gradle-6.9.2-all.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-5.1.1-all.zip
--- a/examples/basic/android/gradlew
+++ b/examples/basic/android/gradlew
@@ -1,4 +1,20 @@
-#!/usr/bin/env bash
+#!/usr/bin/env sh
+
+#
+# Copyright 2015 the original author or authors.
+#
+# 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
+#
+#      https://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.
+#

 ##############################################################################
 ##
@@ -6,47 +22,6 @@
 ##
 ##############################################################################

-# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
-DEFAULT_JVM_OPTS=""
-
-APP_NAME="Gradle"
-APP_BASE_NAME=`basename "$0"`
-
-# Use the maximum available, or set MAX_FD != -1 to use that value.
-MAX_FD="maximum"
-
-warn ( ) {
-    echo "$*"
-}
-
-die ( ) {
-    echo
-    echo "$*"
-    echo
-    exit 1
-}
-
-# OS specific support (must be 'true' or 'false').
-cygwin=false
-msys=false
-darwin=false
-case "`uname`" in
-  CYGWIN* )
-    cygwin=true
-    ;;
-  Darwin* )
-    darwin=true
-    ;;
-  MINGW* )
-    msys=true
-    ;;
-esac
-
-# For Cygwin, ensure paths are in UNIX format before anything is touched.
-if $cygwin ; then
-    [ -n "$JAVA_HOME" ] && JAVA_HOME=`cygpath --unix "$JAVA_HOME"`
-fi
-
 # Attempt to set APP_HOME
 # Resolve links: $0 may be a link
 PRG="$0"
@@ -61,9 +36,49 @@ while [ -h "$PRG" ] ; do
    fi
 done
 SAVED="`pwd`"
-cd "`dirname \"$PRG\"`/" >&-
+cd "`dirname \"$PRG\"`/" >/dev/null
 APP_HOME="`pwd -P`"
-cd "$SAVED" >&-
+cd "$SAVED" >/dev/null
+
+APP_NAME="Gradle"
+APP_BASE_NAME=`basename "$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"
+
+warn () {
+    echo "$*"
+}
+
+die () {
+    echo
+    echo "$*"
+    echo
+    exit 1
+}
+
+# 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
+    ;;
+esac

 CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar

@@ -90,7 +105,7 @@ location of your Java installation."
 fi

 # Increase the maximum file descriptors if we can.
-if [ "$cygwin" = "false" -a "$darwin" = "false" ] ; then
+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
@@ -110,10 +125,11 @@ if $darwin; then
    GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\""
 fi

-# For Cygwin, switch paths to Windows format before running java
-if $cygwin ; then
+# 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`
@@ -138,27 +154,30 @@ if $cygwin ; then
        else
            eval `echo args$i`="\"$arg\""
        fi
-        i=$((i+1))
+        i=`expr $i + 1`
    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" ;;
+        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

-# Split up the JVM_OPTS And GRADLE_OPTS values into an array, following the shell quoting and substitution rules
-function splitJvmOpts() {
-    JVM_OPTS=("$@")
+# Escape application args
+save () {
+    for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done
+    echo " "
 }
-eval splitJvmOpts $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS
-JVM_OPTS[${#JVM_OPTS[*]}]="-Dorg.gradle.appname=$APP_BASE_NAME"
+APP_ARGS=`save "$@"`

-exec "$JAVACMD" "${JVM_OPTS[@]}" -classpath "$CLASSPATH" org.gradle.wrapper.GradleWrapperMain "$@"
+# 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"
+
+exec "$JAVACMD" "$@"
--- a/examples/basic/android/gradlew.bat
+++ b/examples/basic/android/gradlew.bat
@@ -1,90 +1,103 @@
-@if "%DEBUG%" == "" @echo off
-@rem ##########################################################################
-@rem
-@rem  Gradle startup script for Windows
-@rem
-@rem ##########################################################################
-
-@rem Set local scope for the variables with windows NT shell
-if "%OS%"=="Windows_NT" setlocal
-
-@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
-set DEFAULT_JVM_OPTS=
-
-set DIRNAME=%~dp0
-if "%DIRNAME%" == "" set DIRNAME=.
-set APP_BASE_NAME=%~n0
-set APP_HOME=%DIRNAME%
-
-@rem Find java.exe
-if defined JAVA_HOME goto findJavaFromJavaHome
-
-set JAVA_EXE=java.exe
-%JAVA_EXE% -version >NUL 2>&1
-if "%ERRORLEVEL%" == "0" goto init
-
-echo.
-echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
-echo.
-echo Please set the JAVA_HOME variable in your environment to match the
-echo location of your Java installation.
-
-goto fail
-
-:findJavaFromJavaHome
-set JAVA_HOME=%JAVA_HOME:"=%
-set JAVA_EXE=%JAVA_HOME%/bin/java.exe
-
-if exist "%JAVA_EXE%" goto init
-
-echo.
-echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
-echo.
-echo Please set the JAVA_HOME variable in your environment to match the
-echo location of your Java installation.
-
-goto fail
-
-:init
-@rem Get command-line arguments, handling Windowz variants
-
-if not "%OS%" == "Windows_NT" goto win9xME_args
-if "%@eval[2+2]" == "4" goto 4NT_args
-
-:win9xME_args
-@rem Slurp the command line arguments.
-set CMD_LINE_ARGS=
-set _SKIP=2
-
-:win9xME_args_slurp
-if "x%~1" == "x" goto execute
-
-set CMD_LINE_ARGS=%*
-goto execute
-
-:4NT_args
-@rem Get arguments from the 4NT Shell from JP Software
-set CMD_LINE_ARGS=%$
-
-:execute
-@rem Setup the command line
-
-set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
-
-@rem Execute Gradle
-"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS%
-
-:end
-@rem End local scope for the variables with windows NT shell
-if "%ERRORLEVEL%"=="0" goto mainEnd
-
-:fail
-rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
-rem the _cmd.exe /c_ return code!
-if  not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
-exit /b 1
-
-:mainEnd
-if "%OS%"=="Windows_NT" endlocal
-
-:omega
+@rem
+@rem Copyright 2015 the original author or authors.
+@rem
+@rem Licensed under the Apache License, Version 2.0 (the "License");
+@rem you may not use this file except in compliance with the License.
+@rem You may obtain a copy of the License at
+@rem
+@rem      https://www.apache.org/licenses/LICENSE-2.0
+@rem
+@rem Unless required by applicable law or agreed to in writing, software
+@rem distributed under the License is distributed on an "AS IS" BASIS,
+@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+@rem See the License for the specific language governing permissions and
+@rem limitations under the License.
+@rem
+
+@if "%DEBUG%" == "" @echo off
+@rem ##########################################################################
+@rem
+@rem  Gradle startup script for Windows
+@rem
+@rem ##########################################################################
+
+@rem Set local scope for the variables with windows NT shell
+if "%OS%"=="Windows_NT" setlocal
+
+set DIRNAME=%~dp0
+if "%DIRNAME%" == "" set DIRNAME=.
+set APP_BASE_NAME=%~n0
+set APP_HOME=%DIRNAME%
+
+@rem Resolve any "." and ".." in APP_HOME to make it shorter.
+for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
+
+@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
+
+@rem Find java.exe
+if defined JAVA_HOME goto findJavaFromJavaHome
+
+set JAVA_EXE=java.exe
+%JAVA_EXE% -version >NUL 2>&1
+if "%ERRORLEVEL%" == "0" goto init
+
+echo.
+echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+echo.
+echo Please set the JAVA_HOME variable in your environment to match the
+echo location of your Java installation.
+
+goto fail
+
+:findJavaFromJavaHome
+set JAVA_HOME=%JAVA_HOME:"=%
+set JAVA_EXE=%JAVA_HOME%/bin/java.exe
+
+if exist "%JAVA_EXE%" goto init
+
+echo.
+echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
+echo.
+echo Please set the JAVA_HOME variable in your environment to match the
+echo location of your Java installation.
+
+goto fail
+
+:init
+@rem Get command-line arguments, handling Windows variants
+
+if not "%OS%" == "Windows_NT" goto win9xME_args
+
+:win9xME_args
+@rem Slurp the command line arguments.
+set CMD_LINE_ARGS=
+set _SKIP=2
+
+:win9xME_args_slurp
+if "x%~1" == "x" goto execute
+
+set CMD_LINE_ARGS=%*
+
+:execute
+@rem Setup the command line
+
+set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
+
+@rem Execute Gradle
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS%
+
+:end
+@rem End local scope for the variables with windows NT shell
+if "%ERRORLEVEL%"=="0" goto mainEnd
+
+:fail
+rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
+rem the _cmd.exe /c_ return code!
+if  not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
+exit /b 1
+
+:mainEnd
+if "%OS%"=="Windows_NT" endlocal
+
+:omega
--- a/examples/basic/android/keystores/BUCK
+++ b/examples/basic/android/keystores/BUCK
@@ -1,8 +0,0 @@
-keystore(
-  name = 'debug',
-  store = 'debug.keystore',
-  properties = 'debug.keystore.properties',
-  visibility = [
-    'PUBLIC',
-  ],
-)
--- a/examples/basic/android/keystores/debug.keystore.properties
+++ b/examples/basic/android/keystores/debug.keystore.properties
@@ -1,4 +0,0 @@
-key.store=debug.keystore
-key.alias=androiddebugkey
-key.store.password=android
-key.alias.password=android
--- a/examples/basic/android/settings.gradle
+++ b/examples/basic/android/settings.gradle
@@ -1,6 +1,5 @@
 rootProject.name = 'VideoPlayer'
-
+apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
 include ':react-native-video'
 project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android-exoplayer')
-
 include ':app'
--- a/examples/basic/app.json
+++ b/examples/basic/app.json
@@ -0,0 +1,4 @@
+{
+  "name": "VideoPlayer",
+  "displayName": "VideoPlayer"
+}
--- a/examples/basic/babel.config.js
+++ b/examples/basic/babel.config.js
@@ -1,3 +1,16 @@
 module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
-};
+  plugins: [
+    [
+      'module-resolver',
+        {
+            extensions: ['.js', '.tsx', '.ts'],
+            root: ['./src'],
+
+            alias: {
+              src: './src',
+          },
+        },
+    ],
+  ],
+};
--- a/examples/basic/index.android.js
+++ b/examples/basic/index.android.js
@@ -1,230 +0,0 @@
-'use strict';
-
-import React, {
-  Component
-} from 'react';
-
-import {
-  AppRegistry,
-  StyleSheet,
-  Text,
-  TouchableOpacity,
-  View,
-} from 'react-native';
-
-import Video from 'react-native-video';
-
-class VideoPlayer extends Component {
-
-  state = {
-    rate: 1,
-    volume: 1,
-    muted: false,
-    resizeMode: 'contain',
-    duration: 0.0,
-    currentTime: 0.0,
-    paused: true,
-  };
-
-  video: Video;
-
-  onLoad = (data) => {
-    this.setState({ duration: data.duration });
-  };
-
-  onProgress = (data) => {
-    this.setState({ currentTime: data.currentTime });
-  };
-
-  onEnd = () => {
-    this.setState({ paused: true })
-    this.video.seek(0)
-  };
-
-  onAudioBecomingNoisy = () => {
-    this.setState({ paused: true })
-  };
-
-  onAudioFocusChanged = (event: { hasAudioFocus: boolean }) => {
-    this.setState({ paused: !event.hasAudioFocus })
-  };
-
-  getCurrentTimePercentage() {
-    if (this.state.currentTime > 0) {
-      return parseFloat(this.state.currentTime) / parseFloat(this.state.duration);
-    }
-    return 0;
-  };
-
-  renderRateControl(rate) {
-    const isSelected = (this.state.rate === rate);
-
-    return (
-      <TouchableOpacity onPress={() => { this.setState({ rate }) }}>
-        <Text style={[styles.controlOption, { fontWeight: isSelected ? 'bold' : 'normal' }]}>
-          {rate}x
-        </Text>
-      </TouchableOpacity>
-    );
-  }
-
-  renderResizeModeControl(resizeMode) {
-    const isSelected = (this.state.resizeMode === resizeMode);
-
-    return (
-      <TouchableOpacity onPress={() => { this.setState({ resizeMode }) }}>
-        <Text style={[styles.controlOption, { fontWeight: isSelected ? 'bold' : 'normal' }]}>
-          {resizeMode}
-        </Text>
-      </TouchableOpacity>
-    )
-  }
-
-  renderVolumeControl(volume) {
-    const isSelected = (this.state.volume === volume);
-
-    return (
-      <TouchableOpacity onPress={() => { this.setState({ volume }) }}>
-        <Text style={[styles.controlOption, { fontWeight: isSelected ? 'bold' : 'normal' }]}>
-          {volume * 100}%
-        </Text>
-      </TouchableOpacity>
-    )
-  }
-
-  render() {
-    const flexCompleted = this.getCurrentTimePercentage() * 100;
-    const flexRemaining = (1 - this.getCurrentTimePercentage()) * 100;
-
-    return (
-      <View style={styles.container}>
-        <TouchableOpacity
-          style={styles.fullScreen}
-          onPress={() => this.setState({ paused: !this.state.paused })}
-        >
-          <Video
-            ref={(ref: Video) => { this.video = ref }}
-            /* For ExoPlayer */
-            /* source={{ uri: 'http://www.youtube.com/api/manifest/dash/id/bf5bb2419360daf1/source/youtube?as=fmp4_audio_clear,fmp4_sd_hd_clear&sparams=ip,ipbits,expire,source,id,as&ip=0.0.0.0&ipbits=0&expire=19000000000&signature=51AF5F39AB0CEC3E5497CD9C900EBFEAECCCB5C7.8506521BFC350652163895D4C26DEE124209AA9E&key=ik0', type: 'mpd' }} */
-            source={require('./broadchurch.mp4')}
-            style={styles.fullScreen}
-            rate={this.state.rate}
-            paused={this.state.paused}
-            volume={this.state.volume}
-            muted={this.state.muted}
-            resizeMode={this.state.resizeMode}
-            onLoad={this.onLoad}
-            onProgress={this.onProgress}
-            onEnd={this.onEnd}
-            onAudioBecomingNoisy={this.onAudioBecomingNoisy}
-            onAudioFocusChanged={this.onAudioFocusChanged}
-            repeat={false}
-          />
-        </TouchableOpacity>
-
-        <View style={styles.controls}>
-          <View style={styles.generalControls}>
-            <View style={styles.rateControl}>
-              {this.renderRateControl(0.25)}
-              {this.renderRateControl(0.5)}
-              {this.renderRateControl(1.0)}
-              {this.renderRateControl(1.5)}
-              {this.renderRateControl(2.0)}
-            </View>
-
-            <View style={styles.volumeControl}>
-              {this.renderVolumeControl(0.5)}
-              {this.renderVolumeControl(1)}
-              {this.renderVolumeControl(1.5)}
-            </View>
-
-            <View style={styles.resizeModeControl}>
-              {this.renderResizeModeControl('cover')}
-              {this.renderResizeModeControl('contain')}
-              {this.renderResizeModeControl('stretch')}
-            </View>
-          </View>
-
-          <View style={styles.trackingControls}>
-            <View style={styles.progress}>
-              <View style={[styles.innerProgressCompleted, { flex: flexCompleted }]} />
-              <View style={[styles.innerProgressRemaining, { flex: flexRemaining }]} />
-            </View>
-          </View>
-        </View>
-      </View>
-    );
-  }
-}
-
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: 'black',
-  },
-  fullScreen: {
-    position: 'absolute',
-    top: 0,
-    left: 0,
-    bottom: 0,
-    right: 0,
-  },
-  controls: {
-    backgroundColor: 'transparent',
-    borderRadius: 5,
-    position: 'absolute',
-    bottom: 20,
-    left: 20,
-    right: 20,
-  },
-  progress: {
-    flex: 1,
-    flexDirection: 'row',
-    borderRadius: 3,
-    overflow: 'hidden',
-  },
-  innerProgressCompleted: {
-    height: 20,
-    backgroundColor: '#cccccc',
-  },
-  innerProgressRemaining: {
-    height: 20,
-    backgroundColor: '#2C2C2C',
-  },
-  generalControls: {
-    flex: 1,
-    flexDirection: 'row',
-    borderRadius: 4,
-    overflow: 'hidden',
-    paddingBottom: 10,
-  },
-  rateControl: {
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'center',
-  },
-  volumeControl: {
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'center',
-  },
-  resizeModeControl: {
-    flex: 1,
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  controlOption: {
-    alignSelf: 'center',
-    fontSize: 11,
-    color: 'white',
-    paddingLeft: 2,
-    paddingRight: 2,
-    lineHeight: 12,
-  },
-});
-
-AppRegistry.registerComponent('VideoPlayer', () => VideoPlayer);
--- a/examples/basic/ios/AppDelegate.h
+++ b/examples/basic/ios/AppDelegate.h
@@ -1,16 +0,0 @@
-/**
- * Copyright (c) 2015-present, Facebook, Inc.
- * All rights reserved.
- *
- * This source code is licensed under the BSD-style license found in the
- * LICENSE file in the root directory of this source tree. An additional grant
- * of patent rights can be found in the PATENTS file in the same directory.
- */
-
-#import <UIKit/UIKit.h>
-
-@interface AppDelegate : UIResponder <UIApplicationDelegate>
-
-@property (nonatomic, strong) UIWindow *window;
-
-@end
--- a/examples/basic/ios/AppDelegate.m
+++ b/examples/basic/ios/AppDelegate.m
@@ -1,52 +0,0 @@
-/**
- * Copyright (c) 2015-present, Facebook, Inc.
- * All rights reserved.
- *
- * This source code is licensed under the BSD-style license found in the
- * LICENSE file in the root directory of this source tree. An additional grant
- * of patent rights can be found in the PATENTS file in the same directory.
- */
-
-#import "AppDelegate.h"
-
-#import "RCTRootView.h"
-
-@implementation AppDelegate
-
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
-{
-  NSURL *jsCodeLocation;
-
-  // Loading JavaScript code - uncomment the one you want.
-
-  // OPTION 1
-  // Load from development server. Start the server from the repository root:
-  //
-  // $ npm start
-  //
-  // To run on device, change `localhost` to the IP address of your computer, and make sure your computer and
-  // iOS device are on the same Wi-Fi network.
-  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
-
-  // OPTION 2
-  // Load from pre-bundled file on disk. To re-generate the static bundle, run
-  //
-  // $ curl 'http://localhost:8081/index.ios.bundle?dev=false&minify=true' -o iOS/main.jsbundle
-  //
-  // and uncomment the next following line
-  // jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
-
-  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
-                                                      moduleName:@"VideoPlayer"
-                                               initialProperties: nil
-                                                   launchOptions:launchOptions];
-
-  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
-  UIViewController *rootViewController = [[UIViewController alloc] init];
-  rootViewController.view = rootView;
-  self.window.rootViewController = rootViewController;
-  [self.window makeKeyAndVisible];
-  return YES;
-}
-
-@end
--- a/examples/basic/ios/Base.lproj/LaunchScreen.xib
+++ b/examples/basic/ios/Base.lproj/LaunchScreen.xib
@@ -1,42 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="6751" systemVersion="14C1510" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES">
-    <dependencies>
-        <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="6736"/>
-        <capability name="Constraints with non-1.0 multipliers" minToolsVersion="5.1"/>
-    </dependencies>
-    <objects>
-        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
-        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
-        <view contentMode="scaleToFill" id="iN0-l3-epB">
-            <rect key="frame" x="0.0" y="0.0" width="480" height="480"/>
-            <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-            <subviews>
-                <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Powered by React Native" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" minimumFontSize="9" translatesAutoresizingMaskIntoConstraints="NO" id="8ie-xW-0ye">
-                    <rect key="frame" x="20" y="439" width="441" height="21"/>
-                    <fontDescription key="fontDescription" type="system" pointSize="17"/>
-                    <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
-                    <nil key="highlightedColor"/>
-                </label>
-                <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="VideoPlayer" textAlignment="center" lineBreakMode="middleTruncation" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="kId-c2-rCX">
-                    <rect key="frame" x="20" y="140" width="441" height="43"/>
-                    <fontDescription key="fontDescription" type="boldSystem" pointSize="36"/>
-                    <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
-                    <nil key="highlightedColor"/>
-                </label>
-            </subviews>
-            <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
-            <constraints>
-                <constraint firstItem="kId-c2-rCX" firstAttribute="centerY" secondItem="iN0-l3-epB" secondAttribute="bottom" multiplier="1/3" constant="1" id="5cJ-9S-tgC"/>
-                <constraint firstAttribute="centerX" secondItem="kId-c2-rCX" secondAttribute="centerX" id="Koa-jz-hwk"/>
-                <constraint firstAttribute="bottom" secondItem="8ie-xW-0ye" secondAttribute="bottom" constant="20" id="Kzo-t9-V3l"/>
-                <constraint firstItem="8ie-xW-0ye" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" constant="20" symbolic="YES" id="MfP-vx-nX0"/>
-                <constraint firstAttribute="centerX" secondItem="8ie-xW-0ye" secondAttribute="centerX" id="ZEH-qu-HZ9"/>
-                <constraint firstItem="kId-c2-rCX" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" constant="20" symbolic="YES" id="fvb-Df-36g"/>
-            </constraints>
-            <nil key="simulatedStatusBarMetrics"/>
-            <freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
-            <point key="canvasLocation" x="548" y="455"/>
-        </view>
-    </objects>
-</document>
--- a/examples/basic/ios/Images.xcassets/AppIcon.appiconset/Contents.json
+++ b/examples/basic/ios/Images.xcassets/AppIcon.appiconset/Contents.json
@@ -1,38 +0,0 @@
-{
-  "images" : [
-    {
-      "idiom" : "iphone",
-      "size" : "29x29",
-      "scale" : "2x"
-    },
-    {
-      "idiom" : "iphone",
-      "size" : "29x29",
-      "scale" : "3x"
-    },
-    {
-      "idiom" : "iphone",
-      "size" : "40x40",
-      "scale" : "2x"
-    },
-    {
-      "idiom" : "iphone",
-      "size" : "40x40",
-      "scale" : "3x"
-    },
-    {
-      "idiom" : "iphone",
-      "size" : "60x60",
-      "scale" : "2x"
-    },
-    {
-      "idiom" : "iphone",
-      "size" : "60x60",
-      "scale" : "3x"
-    }
-  ],
-  "info" : {
-    "version" : 1,
-    "author" : "xcode"
-  }
-}
--- a/examples/basic/ios/Info.plist
+++ b/examples/basic/ios/Info.plist
@@ -1,47 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-<dict>
-	<key>CFBundleDevelopmentRegion</key>
-	<string>en</string>
-	<key>CFBundleExecutable</key>
-	<string>$(EXECUTABLE_NAME)</string>
-	<key>CFBundleIdentifier</key>
-	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
-	<key>CFBundleInfoDictionaryVersion</key>
-	<string>6.0</string>
-	<key>CFBundleName</key>
-	<string>$(PRODUCT_NAME)</string>
-	<key>CFBundlePackageType</key>
-	<string>APPL</string>
-	<key>CFBundleShortVersionString</key>
-	<string>1.0.0</string>
-	<key>CFBundleSignature</key>
-	<string>????</string>
-	<key>CFBundleVersion</key>
-	<string>2</string>
-	<key>LSApplicationCategoryType</key>
-	<string></string>
-	<key>LSRequiresIPhoneOS</key>
-	<true/>
-	<key>NSAppTransportSecurity</key>
-	<dict>
-		<key>NSAllowsArbitraryLoads</key>
-		<true/>
-	</dict>
-	<key>UILaunchStoryboardName</key>
-	<string>LaunchScreen</string>
-	<key>UIRequiredDeviceCapabilities</key>
-	<array>
-		<string>armv7</string>
-	</array>
-	<key>UISupportedInterfaceOrientations</key>
-	<array>
-		<string>UIInterfaceOrientationPortrait</string>
-		<string>UIInterfaceOrientationLandscapeLeft</string>
-		<string>UIInterfaceOrientationLandscapeRight</string>
-	</array>
-	<key>UIViewControllerBasedStatusBarAppearance</key>
-	<false/>
-</dict>
-</plist>
--- a/examples/basic/ios/Podfile
+++ b/examples/basic/ios/Podfile
@@ -0,0 +1,26 @@
+require_relative '../node_modules/react-native/scripts/react_native_pods'
+require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
+
+platform :ios, '10.0'
+use_frameworks! :linkage => :static
+
+target 'VideoPlayer' do
+  config = use_native_modules!
+
+  use_react_native!(:path => config["reactNativePath"])
+
+  target 'VideoPlayerTests' do
+    inherit! :complete
+    # Pods for testing
+  end
+
+end
+
+target 'VideoPlayer-tvOS' do
+  # Pods for VideoPlayer-tvOS
+
+  target 'VideoPlayer-tvOSTests' do
+    inherit! :search_paths
+    # Pods for testing
+  end
+end
--- a/examples/basic/ios/Podfile.lock
+++ b/examples/basic/ios/Podfile.lock
@@ -0,0 +1,392 @@
+PODS:
+  - boost-for-react-native (1.63.0)
+  - DoubleConversion (1.1.6)
+  - FBLazyVector (0.63.4)
+  - FBReactNativeSpec (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - RCTRequired (= 0.63.4)
+    - RCTTypeSafety (= 0.63.4)
+    - React-Core (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - ReactCommon/turbomodule/core (= 0.63.4)
+  - Folly (2020.01.13.00):
+    - boost-for-react-native
+    - DoubleConversion
+    - Folly/Default (= 2020.01.13.00)
+    - glog
+  - Folly/Default (2020.01.13.00):
+    - boost-for-react-native
+    - DoubleConversion
+    - glog
+  - glog (0.3.5)
+  - PromisesObjC (2.0.0)
+  - PromisesSwift (2.0.0):
+    - PromisesObjC (= 2.0.0)
+  - RCTRequired (0.63.4)
+  - RCTTypeSafety (0.63.4):
+    - FBLazyVector (= 0.63.4)
+    - Folly (= 2020.01.13.00)
+    - RCTRequired (= 0.63.4)
+    - React-Core (= 0.63.4)
+  - React (0.63.4):
+    - React-Core (= 0.63.4)
+    - React-Core/DevSupport (= 0.63.4)
+    - React-Core/RCTWebSocket (= 0.63.4)
+    - React-RCTActionSheet (= 0.63.4)
+    - React-RCTAnimation (= 0.63.4)
+    - React-RCTBlob (= 0.63.4)
+    - React-RCTImage (= 0.63.4)
+    - React-RCTLinking (= 0.63.4)
+    - React-RCTNetwork (= 0.63.4)
+    - React-RCTSettings (= 0.63.4)
+    - React-RCTText (= 0.63.4)
+    - React-RCTVibration (= 0.63.4)
+  - React-callinvoker (0.63.4)
+  - React-Core (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default (= 0.63.4)
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/CoreModulesHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/Default (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/DevSupport (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default (= 0.63.4)
+    - React-Core/RCTWebSocket (= 0.63.4)
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - React-jsinspector (= 0.63.4)
+    - Yoga
+  - React-Core/RCTActionSheetHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/RCTAnimationHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/RCTBlobHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/RCTImageHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/RCTLinkingHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/RCTNetworkHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/RCTSettingsHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/RCTTextHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/RCTVibrationHeaders (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-Core/RCTWebSocket (0.63.4):
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-Core/Default (= 0.63.4)
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-jsiexecutor (= 0.63.4)
+    - Yoga
+  - React-CoreModules (0.63.4):
+    - FBReactNativeSpec (= 0.63.4)
+    - Folly (= 2020.01.13.00)
+    - RCTTypeSafety (= 0.63.4)
+    - React-Core/CoreModulesHeaders (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-RCTImage (= 0.63.4)
+    - ReactCommon/turbomodule/core (= 0.63.4)
+  - React-cxxreact (0.63.4):
+    - boost-for-react-native (= 1.63.0)
+    - DoubleConversion
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-callinvoker (= 0.63.4)
+    - React-jsinspector (= 0.63.4)
+  - React-jsi (0.63.4):
+    - boost-for-react-native (= 1.63.0)
+    - DoubleConversion
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-jsi/Default (= 0.63.4)
+  - React-jsi/Default (0.63.4):
+    - boost-for-react-native (= 1.63.0)
+    - DoubleConversion
+    - Folly (= 2020.01.13.00)
+    - glog
+  - React-jsiexecutor (0.63.4):
+    - DoubleConversion
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+  - React-jsinspector (0.63.4)
+  - react-native-video (6.0.0-alpha1):
+    - React-Core
+    - react-native-video/Video (= 6.0.0-alpha1)
+  - react-native-video/Video (6.0.0-alpha1):
+    - PromisesSwift
+    - React-Core
+  - React-RCTActionSheet (0.63.4):
+    - React-Core/RCTActionSheetHeaders (= 0.63.4)
+  - React-RCTAnimation (0.63.4):
+    - FBReactNativeSpec (= 0.63.4)
+    - Folly (= 2020.01.13.00)
+    - RCTTypeSafety (= 0.63.4)
+    - React-Core/RCTAnimationHeaders (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - ReactCommon/turbomodule/core (= 0.63.4)
+  - React-RCTBlob (0.63.4):
+    - FBReactNativeSpec (= 0.63.4)
+    - Folly (= 2020.01.13.00)
+    - React-Core/RCTBlobHeaders (= 0.63.4)
+    - React-Core/RCTWebSocket (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-RCTNetwork (= 0.63.4)
+    - ReactCommon/turbomodule/core (= 0.63.4)
+  - React-RCTImage (0.63.4):
+    - FBReactNativeSpec (= 0.63.4)
+    - Folly (= 2020.01.13.00)
+    - RCTTypeSafety (= 0.63.4)
+    - React-Core/RCTImageHeaders (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - React-RCTNetwork (= 0.63.4)
+    - ReactCommon/turbomodule/core (= 0.63.4)
+  - React-RCTLinking (0.63.4):
+    - FBReactNativeSpec (= 0.63.4)
+    - React-Core/RCTLinkingHeaders (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - ReactCommon/turbomodule/core (= 0.63.4)
+  - React-RCTNetwork (0.63.4):
+    - FBReactNativeSpec (= 0.63.4)
+    - Folly (= 2020.01.13.00)
+    - RCTTypeSafety (= 0.63.4)
+    - React-Core/RCTNetworkHeaders (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - ReactCommon/turbomodule/core (= 0.63.4)
+  - React-RCTSettings (0.63.4):
+    - FBReactNativeSpec (= 0.63.4)
+    - Folly (= 2020.01.13.00)
+    - RCTTypeSafety (= 0.63.4)
+    - React-Core/RCTSettingsHeaders (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - ReactCommon/turbomodule/core (= 0.63.4)
+  - React-RCTText (0.63.4):
+    - React-Core/RCTTextHeaders (= 0.63.4)
+  - React-RCTVibration (0.63.4):
+    - FBReactNativeSpec (= 0.63.4)
+    - Folly (= 2020.01.13.00)
+    - React-Core/RCTVibrationHeaders (= 0.63.4)
+    - React-jsi (= 0.63.4)
+    - ReactCommon/turbomodule/core (= 0.63.4)
+  - ReactCommon/turbomodule/core (0.63.4):
+    - DoubleConversion
+    - Folly (= 2020.01.13.00)
+    - glog
+    - React-callinvoker (= 0.63.4)
+    - React-Core (= 0.63.4)
+    - React-cxxreact (= 0.63.4)
+    - React-jsi (= 0.63.4)
+  - RNCPicker (1.16.8):
+    - React-Core
+  - Yoga (1.14.0)
+
+DEPENDENCIES:
+  - DoubleConversion (from `../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec`)
+  - FBLazyVector (from `../node_modules/react-native/Libraries/FBLazyVector`)
+  - FBReactNativeSpec (from `../node_modules/react-native/Libraries/FBReactNativeSpec`)
+  - Folly (from `../node_modules/react-native/third-party-podspecs/Folly.podspec`)
+  - glog (from `../node_modules/react-native/third-party-podspecs/glog.podspec`)
+  - RCTRequired (from `../node_modules/react-native/Libraries/RCTRequired`)
+  - RCTTypeSafety (from `../node_modules/react-native/Libraries/TypeSafety`)
+  - React (from `../node_modules/react-native/`)
+  - React-callinvoker (from `../node_modules/react-native/ReactCommon/callinvoker`)
+  - React-Core (from `../node_modules/react-native/`)
+  - React-Core/DevSupport (from `../node_modules/react-native/`)
+  - React-Core/RCTWebSocket (from `../node_modules/react-native/`)
+  - React-CoreModules (from `../node_modules/react-native/React/CoreModules`)
+  - React-cxxreact (from `../node_modules/react-native/ReactCommon/cxxreact`)
+  - React-jsi (from `../node_modules/react-native/ReactCommon/jsi`)
+  - React-jsiexecutor (from `../node_modules/react-native/ReactCommon/jsiexecutor`)
+  - React-jsinspector (from `../node_modules/react-native/ReactCommon/jsinspector`)
+  - react-native-video (from `../node_modules/react-native-video`)
+  - React-RCTActionSheet (from `../node_modules/react-native/Libraries/ActionSheetIOS`)
+  - React-RCTAnimation (from `../node_modules/react-native/Libraries/NativeAnimation`)
+  - React-RCTBlob (from `../node_modules/react-native/Libraries/Blob`)
+  - React-RCTImage (from `../node_modules/react-native/Libraries/Image`)
+  - React-RCTLinking (from `../node_modules/react-native/Libraries/LinkingIOS`)
+  - React-RCTNetwork (from `../node_modules/react-native/Libraries/Network`)
+  - React-RCTSettings (from `../node_modules/react-native/Libraries/Settings`)
+  - React-RCTText (from `../node_modules/react-native/Libraries/Text`)
+  - React-RCTVibration (from `../node_modules/react-native/Libraries/Vibration`)
+  - ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
+  - "RNCPicker (from `../node_modules/@react-native-picker/picker`)"
+  - Yoga (from `../node_modules/react-native/ReactCommon/yoga`)
+
+SPEC REPOS:
+  trunk:
+    - boost-for-react-native
+    - PromisesObjC
+    - PromisesSwift
+
+EXTERNAL SOURCES:
+  DoubleConversion:
+    :podspec: "../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec"
+  FBLazyVector:
+    :path: "../node_modules/react-native/Libraries/FBLazyVector"
+  FBReactNativeSpec:
+    :path: "../node_modules/react-native/Libraries/FBReactNativeSpec"
+  Folly:
+    :podspec: "../node_modules/react-native/third-party-podspecs/Folly.podspec"
+  glog:
+    :podspec: "../node_modules/react-native/third-party-podspecs/glog.podspec"
+  RCTRequired:
+    :path: "../node_modules/react-native/Libraries/RCTRequired"
+  RCTTypeSafety:
+    :path: "../node_modules/react-native/Libraries/TypeSafety"
+  React:
+    :path: "../node_modules/react-native/"
+  React-callinvoker:
+    :path: "../node_modules/react-native/ReactCommon/callinvoker"
+  React-Core:
+    :path: "../node_modules/react-native/"
+  React-CoreModules:
+    :path: "../node_modules/react-native/React/CoreModules"
+  React-cxxreact:
+    :path: "../node_modules/react-native/ReactCommon/cxxreact"
+  React-jsi:
+    :path: "../node_modules/react-native/ReactCommon/jsi"
+  React-jsiexecutor:
+    :path: "../node_modules/react-native/ReactCommon/jsiexecutor"
+  React-jsinspector:
+    :path: "../node_modules/react-native/ReactCommon/jsinspector"
+  react-native-video:
+    :path: "../node_modules/react-native-video"
+  React-RCTActionSheet:
+    :path: "../node_modules/react-native/Libraries/ActionSheetIOS"
+  React-RCTAnimation:
+    :path: "../node_modules/react-native/Libraries/NativeAnimation"
+  React-RCTBlob:
+    :path: "../node_modules/react-native/Libraries/Blob"
+  React-RCTImage:
+    :path: "../node_modules/react-native/Libraries/Image"
+  React-RCTLinking:
+    :path: "../node_modules/react-native/Libraries/LinkingIOS"
+  React-RCTNetwork:
+    :path: "../node_modules/react-native/Libraries/Network"
+  React-RCTSettings:
+    :path: "../node_modules/react-native/Libraries/Settings"
+  React-RCTText:
+    :path: "../node_modules/react-native/Libraries/Text"
+  React-RCTVibration:
+    :path: "../node_modules/react-native/Libraries/Vibration"
+  ReactCommon:
+    :path: "../node_modules/react-native/ReactCommon"
+  RNCPicker:
+    :path: "../node_modules/@react-native-picker/picker"
+  Yoga:
+    :path: "../node_modules/react-native/ReactCommon/yoga"
+
+SPEC CHECKSUMS:
+  boost-for-react-native: 39c7adb57c4e60d6c5479dd8623128eb5b3f0f2c
+  DoubleConversion: cde416483dac037923206447da6e1454df403714
+  FBLazyVector: 3bb422f41b18121b71783a905c10e58606f7dc3e
+  FBReactNativeSpec: f2c97f2529dd79c083355182cc158c9f98f4bd6e
+  Folly: b73c3869541e86821df3c387eb0af5f65addfab4
+  glog: 40a13f7840415b9a77023fbcae0f1e6f43192af3
+  PromisesObjC: 68159ce6952d93e17b2dfe273b8c40907db5ba58
+  PromisesSwift: e0b2a6433469efb0b83a2b84c62a2abab8e5e5d4
+  RCTRequired: 082f10cd3f905d6c124597fd1c14f6f2655ff65e
+  RCTTypeSafety: 8c9c544ecbf20337d069e4ae7fd9a377aadf504b
+  React: b0a957a2c44da4113b0c4c9853d8387f8e64e615
+  React-callinvoker: c3f44dd3cb195b6aa46621fff95ded79d59043fe
+  React-Core: d3b2a1ac9a2c13c3bcde712d9281fc1c8a5b315b
+  React-CoreModules: 0581ff36cb797da0943d424f69e7098e43e9be60
+  React-cxxreact: c1480d4fda5720086c90df537ee7d285d4c57ac3
+  React-jsi: a0418934cf48f25b485631deb27c64dc40fb4c31
+  React-jsiexecutor: 93bd528844ad21dc07aab1c67cb10abae6df6949
+  React-jsinspector: 58aef7155bc9a9683f5b60b35eccea8722a4f53a
+  react-native-video: 7ce6d16e47b8a6a1ccdc5d9f4f3ce50e42acaf3b
+  React-RCTActionSheet: 89a0ca9f4a06c1f93c26067af074ccdce0f40336
+  React-RCTAnimation: 1bde3ecc0c104c55df246eda516e0deb03c4e49b
+  React-RCTBlob: a97d378b527740cc667e03ebfa183a75231ab0f0
+  React-RCTImage: c1b1f2d3f43a4a528c8946d6092384b5c880d2f0
+  React-RCTLinking: 35ae4ab9dc0410d1fcbdce4d7623194a27214fb2
+  React-RCTNetwork: 29ec2696f8d8cfff7331fac83d3e893c95ef43ae
+  React-RCTSettings: 60f0691bba2074ef394f95d4c2265ec284e0a46a
+  React-RCTText: 5c51df3f08cb9dedc6e790161195d12bac06101c
+  React-RCTVibration: ae4f914cfe8de7d4de95ae1ea6cc8f6315d73d9d
+  ReactCommon: 73d79c7039f473b76db6ff7c6b159c478acbbb3b
+  RNCPicker: 0991c56da7815c0cf946d6f63cf920b25296e5f6
+  Yoga: 4bd86afe9883422a7c4028c00e34790f560923d6
+
+PODFILE CHECKSUM: 51ba394e28c02b1e60e7686b5b2926921af36c49
+
+COCOAPODS: 1.11.2
--- a/examples/basic/ios/VideoPlayer-Bridging-Header.h
+++ b/examples/basic/ios/VideoPlayer-Bridging-Header.h
@@ -0,0 +1,12 @@
+//
+//  VideoPlayer-Bridging-Header.h
+//  VideoPlayer
+//
+//  Created by nick fujita on 2/1/22.
+//
+
+#ifndef VideoPlayer_Bridging_Header_h
+#define VideoPlayer_Bridging_Header_h
+
+
+#endif /* VideoPlayer_Bridging_Header_h */
--- a/examples/basic/ios/VideoPlayer-tvOS/Info.plist
+++ b/examples/basic/ios/VideoPlayer-tvOS/Info.plist
--- a/examples/basic/ios/VideoPlayer-tvOSTests/Info.plist
+++ b/examples/basic/ios/VideoPlayer-tvOSTests/Info.plist
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>en</string>
+	<key>CFBundleExecutable</key>
+	<string>$(EXECUTABLE_NAME)</string>
+	<key>CFBundleIdentifier</key>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>$(PRODUCT_NAME)</string>
+	<key>CFBundlePackageType</key>
+	<string>BNDL</string>
+	<key>CFBundleShortVersionString</key>
+	<string>1.0</string>
+	<key>CFBundleSignature</key>
+	<string>????</string>
+	<key>CFBundleVersion</key>
+	<string>1</string>
+</dict>
+</plist>
--- a/examples/basic/ios/VideoPlayer.xcodeproj/project.pbxproj
+++ b/examples/basic/ios/VideoPlayer.xcodeproj/project.pbxproj
--- a/examples/basic/ios/VideoPlayer.xcodeproj/xcshareddata/xcschemes/VideoPlayer-tvOS.xcscheme
+++ b/examples/basic/ios/VideoPlayer.xcodeproj/xcshareddata/xcschemes/VideoPlayer-tvOS.xcscheme
@@ -1,9 +1,9 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <Scheme
-   LastUpgradeVersion = "1000"
+   LastUpgradeVersion = "1130"
   version = "1.3">
   <BuildAction
-      parallelizeBuildables = "NO"
+      parallelizeBuildables = "YES"
      buildImplicitDependencies = "YES">
      <BuildActionEntries>
         <BuildActionEntry
@@ -14,21 +14,7 @@
            buildForAnalyzing = "YES">
            <BuildableReference
               BuildableIdentifier = "primary"
-               BlueprintIdentifier = "2D2A28121D9B038B00D4039D"
-               BuildableName = "libReact.a"
-               BlueprintName = "React-tvOS"
-               ReferencedContainer = "container:../node_modules/react-native/React/React.xcodeproj">
-            </BuildableReference>
-         </BuildActionEntry>
-         <BuildActionEntry
-            buildForTesting = "YES"
-            buildForRunning = "YES"
-            buildForProfiling = "YES"
-            buildForArchiving = "YES"
-            buildForAnalyzing = "YES">
-            <BuildableReference
-               BuildableIdentifier = "primary"
-               BlueprintIdentifier = "FA8681B6216D5C6D0010C92A"
+               BlueprintIdentifier = "2D02E47A1E0B4A5D006451C7"
               BuildableName = "VideoPlayer-tvOS.app"
               BlueprintName = "VideoPlayer-tvOS"
               ReferencedContainer = "container:VideoPlayer.xcodeproj">
@@ -42,18 +28,17 @@
      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
      shouldUseLaunchSchemeArgsEnv = "YES">
      <Testables>
+         <TestableReference
+            skipped = "NO">
+            <BuildableReference
+               BuildableIdentifier = "primary"
+               BlueprintIdentifier = "2D02E48F1E0B4A5D006451C7"
+               BuildableName = "VideoPlayer-tvOSTests.xctest"
+               BlueprintName = "VideoPlayer-tvOSTests"
+               ReferencedContainer = "container:VideoPlayer.xcodeproj">
+            </BuildableReference>
+         </TestableReference>
      </Testables>
-      <MacroExpansion>
-         <BuildableReference
-            BuildableIdentifier = "primary"
-            BlueprintIdentifier = "FA8681B6216D5C6D0010C92A"
-            BuildableName = "VideoPlayer-tvOS.app"
-            BlueprintName = "VideoPlayer-tvOS"
-            ReferencedContainer = "container:VideoPlayer.xcodeproj">
-         </BuildableReference>
-      </MacroExpansion>
-      <AdditionalOptions>
-      </AdditionalOptions>
   </TestAction>
   <LaunchAction
      buildConfiguration = "Debug"
@@ -69,14 +54,12 @@
         runnableDebuggingMode = "0">
         <BuildableReference
            BuildableIdentifier = "primary"
-            BlueprintIdentifier = "FA8681B6216D5C6D0010C92A"
+            BlueprintIdentifier = "2D02E47A1E0B4A5D006451C7"
            BuildableName = "VideoPlayer-tvOS.app"
            BlueprintName = "VideoPlayer-tvOS"
            ReferencedContainer = "container:VideoPlayer.xcodeproj">
         </BuildableReference>
      </BuildableProductRunnable>
-      <AdditionalOptions>
-      </AdditionalOptions>
   </LaunchAction>
   <ProfileAction
      buildConfiguration = "Release"
@@ -88,7 +71,7 @@
         runnableDebuggingMode = "0">
         <BuildableReference
            BuildableIdentifier = "primary"
-            BlueprintIdentifier = "FA8681B6216D5C6D0010C92A"
+            BlueprintIdentifier = "2D02E47A1E0B4A5D006451C7"
            BuildableName = "VideoPlayer-tvOS.app"
            BlueprintName = "VideoPlayer-tvOS"
            ReferencedContainer = "container:VideoPlayer.xcodeproj">
--- a/examples/basic/ios/VideoPlayer.xcodeproj/xcshareddata/xcschemes/VideoPlayer.xcscheme
+++ b/examples/basic/ios/VideoPlayer.xcodeproj/xcshareddata/xcschemes/VideoPlayer.xcscheme
@@ -1,25 +1,11 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <Scheme
-   LastUpgradeVersion = "0620"
+   LastUpgradeVersion = "1130"
   version = "1.3">
   <BuildAction
-      parallelizeBuildables = "NO"
+      parallelizeBuildables = "YES"
      buildImplicitDependencies = "YES">
      <BuildActionEntries>
-         <BuildActionEntry
-            buildForTesting = "YES"
-            buildForRunning = "YES"
-            buildForProfiling = "YES"
-            buildForArchiving = "YES"
-            buildForAnalyzing = "YES">
-            <BuildableReference
-               BuildableIdentifier = "primary"
-               BlueprintIdentifier = "83CBBA2D1A601D0E00E9B192"
-               BuildableName = "libReact.a"
-               BlueprintName = "React"
-               ReferencedContainer = "container:../node_modules/react-native/React/React.xcodeproj">
-            </BuildableReference>
-         </BuildActionEntry>
         <BuildActionEntry
            buildForTesting = "YES"
            buildForRunning = "YES"
@@ -42,18 +28,17 @@
      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
      shouldUseLaunchSchemeArgsEnv = "YES">
      <Testables>
+         <TestableReference
+            skipped = "NO">
+            <BuildableReference
+               BuildableIdentifier = "primary"
+               BlueprintIdentifier = "00E356ED1AD99517003FC87E"
+               BuildableName = "VideoPlayerTests.xctest"
+               BlueprintName = "VideoPlayerTests"
+               ReferencedContainer = "container:VideoPlayer.xcodeproj">
+            </BuildableReference>
+         </TestableReference>
      </Testables>
-      <MacroExpansion>
-         <BuildableReference
-            BuildableIdentifier = "primary"
-            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
-            BuildableName = "VideoPlayer.app"
-            BlueprintName = "VideoPlayer"
-            ReferencedContainer = "container:VideoPlayer.xcodeproj">
-         </BuildableReference>
-      </MacroExpansion>
-      <AdditionalOptions>
-      </AdditionalOptions>
   </TestAction>
   <LaunchAction
      buildConfiguration = "Debug"
@@ -75,8 +60,6 @@
            ReferencedContainer = "container:VideoPlayer.xcodeproj">
         </BuildableReference>
      </BuildableProductRunnable>
-      <AdditionalOptions>
-      </AdditionalOptions>
   </LaunchAction>
   <ProfileAction
      buildConfiguration = "Release"
--- a/examples/basic/ios/VideoPlayer.xcworkspace/contents.xcworkspacedata
+++ b/examples/basic/ios/VideoPlayer.xcworkspace/contents.xcworkspacedata
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<Workspace
+   version = "1.0">
+   <FileRef
+      location = "group:VideoPlayer.xcodeproj">
+   </FileRef>
+   <FileRef
+      location = "group:Pods/Pods.xcodeproj">
+   </FileRef>
+</Workspace>
--- a/examples/basic/ios/VideoPlayer.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist
+++ b/examples/basic/ios/VideoPlayer.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>IDEDidComputeMac32BitWarning</key>
+	<true/>
+</dict>
+</plist>
--- a/examples/basic/ios/VideoPlayer/AppDelegate.h
+++ b/examples/basic/ios/VideoPlayer/AppDelegate.h
@@ -7,9 +7,10 @@
 * of patent rights can be found in the PATENTS file in the same directory.
 */

+#import <React/RCTBridgeDelegate.h>
 #import <UIKit/UIKit.h>

-@interface AppDelegate : UIResponder <UIApplicationDelegate>
+@interface AppDelegate : UIResponder <UIApplicationDelegate, RCTBridgeDelegate>

@property (nonatomic, strong) UIWindow *window;

--- a/examples/basic/ios/VideoPlayer/AppDelegate.m
+++ b/examples/basic/ios/VideoPlayer/AppDelegate.m
@@ -9,21 +9,42 @@

 #import "AppDelegate.h"

+#import <React/RCTBridge.h>
 #import <React/RCTBundleURLProvider.h>
 #import <React/RCTRootView.h>

+#ifdef FB_SONARKIT_ENABLED
+#import <FlipperKit/FlipperClient.h>
+#import <FlipperKitLayoutPlugin/FlipperKitLayoutPlugin.h>
+#import <FlipperKitUserDefaultsPlugin/FKUserDefaultsPlugin.h>
+#import <FlipperKitNetworkPlugin/FlipperKitNetworkPlugin.h>
+#import <SKIOSNetworkPlugin/SKIOSNetworkAdapter.h>
+#import <FlipperKitReactPlugin/FlipperKitReactPlugin.h>
+
+static void InitializeFlipper(UIApplication *application) {
+  FlipperClient *client = [FlipperClient sharedClient];
+  SKDescriptorMapper *layoutDescriptorMapper = [[SKDescriptorMapper alloc] initWithDefaults];
+  [client addPlugin:[[FlipperKitLayoutPlugin alloc] initWithRootNode:application withDescriptorMapper:layoutDescriptorMapper]];
+  [client addPlugin:[[FKUserDefaultsPlugin alloc] initWithSuiteName:nil]];
+  [client addPlugin:[FlipperKitReactPlugin new]];
+  [client addPlugin:[[FlipperKitNetworkPlugin alloc] initWithNetworkAdapter:[SKIOSNetworkAdapter new]]];
+  [client start];
+}
+#endif
+
@implementation AppDelegate

 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
 {
-  NSURL *jsCodeLocation;
+#ifdef FB_SONARKIT_ENABLED
+  InitializeFlipper(application);
+#endif

-  jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
+  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
+  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
+                                                   moduleName:@"VideoPlayer"
+                                            initialProperties:nil];

-  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
-                                                      moduleName:@"VideoPlayer"
-                                               initialProperties:nil
-                                                   launchOptions:launchOptions];
  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];

  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
@@ -34,4 +55,13 @@
  return YES;
 }

+- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
+{
+#if DEBUG
+  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"src/index" fallbackResource:nil];
+#else
+  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
+#endif
+}
+
@end
--- a/examples/basic/ios/VideoPlayer/Base.lproj/LaunchScreen.xib
+++ b/examples/basic/ios/VideoPlayer/Base.lproj/LaunchScreen.xib
@@ -1,42 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="7702" systemVersion="14D136" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES">
-    <dependencies>
-        <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="7701"/>
-        <capability name="Constraints with non-1.0 multipliers" minToolsVersion="5.1"/>
-    </dependencies>
-    <objects>
-        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
-        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
-        <view contentMode="scaleToFill" id="iN0-l3-epB">
-            <rect key="frame" x="0.0" y="0.0" width="480" height="480"/>
-            <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-            <subviews>
-                <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Powered by React Native" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" minimumFontSize="9" translatesAutoresizingMaskIntoConstraints="NO" id="8ie-xW-0ye">
-                    <rect key="frame" x="20" y="439" width="441" height="21"/>
-                    <fontDescription key="fontDescription" type="system" pointSize="17"/>
-                    <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
-                    <nil key="highlightedColor"/>
-                </label>
-                <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="VideoPlayer" textAlignment="center" lineBreakMode="middleTruncation" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="kId-c2-rCX">
-                    <rect key="frame" x="20" y="140" width="441" height="43"/>
-                    <fontDescription key="fontDescription" type="boldSystem" pointSize="36"/>
-                    <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
-                    <nil key="highlightedColor"/>
-                </label>
-            </subviews>
-            <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
-            <constraints>
-                <constraint firstItem="kId-c2-rCX" firstAttribute="centerY" secondItem="iN0-l3-epB" secondAttribute="bottom" multiplier="1/3" constant="1" id="5cJ-9S-tgC"/>
-                <constraint firstAttribute="centerX" secondItem="kId-c2-rCX" secondAttribute="centerX" id="Koa-jz-hwk"/>
-                <constraint firstAttribute="bottom" secondItem="8ie-xW-0ye" secondAttribute="bottom" constant="20" id="Kzo-t9-V3l"/>
-                <constraint firstItem="8ie-xW-0ye" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" constant="20" symbolic="YES" id="MfP-vx-nX0"/>
-                <constraint firstAttribute="centerX" secondItem="8ie-xW-0ye" secondAttribute="centerX" id="ZEH-qu-HZ9"/>
-                <constraint firstItem="kId-c2-rCX" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" constant="20" symbolic="YES" id="fvb-Df-36g"/>
-            </constraints>
-            <nil key="simulatedStatusBarMetrics"/>
-            <freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
-            <point key="canvasLocation" x="548" y="455"/>
-        </view>
-    </objects>
-</document>
--- a/examples/basic/ios/VideoPlayer/File.swift
+++ b/examples/basic/ios/VideoPlayer/File.swift
@@ -0,0 +1 @@
+import Foundation
--- a/examples/basic/ios/VideoPlayer/Images.xcassets/Contents.json
+++ b/examples/basic/ios/VideoPlayer/Images.xcassets/Contents.json
@@ -0,0 +1,6 @@
+{
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}
--- a/examples/basic/ios/VideoPlayer/Info.plist
+++ b/examples/basic/ios/VideoPlayer/Info.plist
@@ -4,10 +4,12 @@
 <dict>
 	<key>CFBundleDevelopmentRegion</key>
 	<string>en</string>
+	<key>CFBundleDisplayName</key>
+	<string>VideoPlayer</string>
 	<key>CFBundleExecutable</key>
 	<string>$(EXECUTABLE_NAME)</string>
 	<key>CFBundleIdentifier</key>
-	<string>org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)</string>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
 	<key>CFBundleInfoDictionaryVersion</key>
 	<string>6.0</string>
 	<key>CFBundleName</key>
@@ -22,6 +24,21 @@
 	<string>1</string>
 	<key>LSRequiresIPhoneOS</key>
 	<true/>
+	<key>NSAppTransportSecurity</key>
+	<dict>
+		<key>NSAllowsArbitraryLoads</key>
+		<true/>
+		<key>NSExceptionDomains</key>
+		<dict>
+			<key>localhost</key>
+			<dict>
+				<key>NSExceptionAllowsInsecureHTTPLoads</key>
+				<true/>
+			</dict>
+		</dict>
+	</dict>
+	<key>NSLocationWhenInUseUsageDescription</key>
+	<string></string>
 	<key>UILaunchStoryboardName</key>
 	<string>LaunchScreen</string>
 	<key>UIRequiredDeviceCapabilities</key>
@@ -36,19 +53,5 @@
 	</array>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
 	<false/>
-	<key>NSLocationWhenInUseUsageDescription</key>
-	<string></string>
-	<key>NSAppTransportSecurity</key>
-	<!--See http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/ -->
-	<dict>
-		<key>NSExceptionDomains</key>
-		<dict>
-			<key>localhost</key>
-			<dict>
-				<key>NSExceptionAllowsInsecureHTTPLoads</key>
-				<true/>
-			</dict>
-		</dict>
-	</dict>
 </dict>
 </plist>
--- a/examples/basic/ios/VideoPlayer/LaunchScreen.storyboard
+++ b/examples/basic/ios/VideoPlayer/LaunchScreen.storyboard
@@ -0,0 +1,58 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="15702" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
+    <device id="retina4_7" orientation="portrait" appearance="light"/>
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="15704"/>
+        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
+        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
+    </dependencies>
+    <scenes>
+        <!--View Controller-->
+        <scene sceneID="EHf-IW-A2E">
+            <objects>
+                <viewController id="01J-lp-oVM" sceneMemberID="viewController">
+                    <view key="view" contentMode="scaleToFill" id="Ze5-6b-2t3">
+                        <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
+                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
+                        <subviews>
+                            <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" minimumFontSize="9" translatesAutoresizingMaskIntoConstraints="NO" id="obG-Y5-kRd">
+                                <rect key="frame" x="0.0" y="647" width="375" height="0.0"/>
+                                <fontDescription key="fontDescription" type="system" pointSize="17"/>
+                                <color key="textColor" red="0.0" green="0.0" blue="0.0" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                                <nil key="highlightedColor"/>
+                            </label>
+                            <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="VideoPlayer" textAlignment="center" lineBreakMode="middleTruncation" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="GJd-Yh-RWb">
+                                <rect key="frame" x="0.0" y="202" width="375" height="43"/>
+                                <fontDescription key="fontDescription" type="boldSystem" pointSize="36"/>
+                                <color key="textColor" red="0.0" green="0.0" blue="0.0" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                                <nil key="highlightedColor"/>
+                            </label>
+                            <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Powered by React Native" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" minimumFontSize="9" translatesAutoresizingMaskIntoConstraints="NO" id="MN2-I3-ftu">
+                                <rect key="frame" x="0.0" y="626" width="375" height="21"/>
+                                <fontDescription key="fontDescription" type="system" pointSize="17"/>
+                                <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
+                                <nil key="highlightedColor"/>
+                            </label>
+                        </subviews>
+                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <constraints>
+                            <constraint firstItem="Bcu-3y-fUS" firstAttribute="centerX" secondItem="obG-Y5-kRd" secondAttribute="centerX" id="5cz-MP-9tL"/>
+                            <constraint firstItem="Bcu-3y-fUS" firstAttribute="bottom" secondItem="MN2-I3-ftu" secondAttribute="bottom" constant="20" id="OZV-Vh-mqD"/>
+                            <constraint firstItem="Bcu-3y-fUS" firstAttribute="centerX" secondItem="GJd-Yh-RWb" secondAttribute="centerX" id="Q3B-4B-g5h"/>
+                            <constraint firstItem="obG-Y5-kRd" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" symbolic="YES" id="SfN-ll-jLj"/>
+                            <constraint firstAttribute="bottom" secondItem="obG-Y5-kRd" secondAttribute="bottom" constant="20" id="Y44-ml-fuU"/>
+                            <constraint firstItem="MN2-I3-ftu" firstAttribute="centerX" secondItem="Bcu-3y-fUS" secondAttribute="centerX" id="akx-eg-2ui"/>
+                            <constraint firstItem="MN2-I3-ftu" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" id="i1E-0Y-4RG"/>
+                            <constraint firstItem="GJd-Yh-RWb" firstAttribute="centerY" secondItem="Ze5-6b-2t3" secondAttribute="bottom" multiplier="1/3" constant="1" id="moa-c2-u7t"/>
+                            <constraint firstItem="GJd-Yh-RWb" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" symbolic="YES" id="x7j-FC-K8j"/>
+                        </constraints>
+                        <viewLayoutGuide key="safeArea" id="Bcu-3y-fUS"/>
+                    </view>
+                </viewController>
+                <placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>
+            </objects>
+            <point key="canvasLocation" x="52.173913043478265" y="375"/>
+        </scene>
+    </scenes>
+</document>
--- a/examples/basic/ios/VideoPlayerTests/Info.plist
+++ b/examples/basic/ios/VideoPlayerTests/Info.plist
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>en</string>
+	<key>CFBundleExecutable</key>
+	<string>$(EXECUTABLE_NAME)</string>
+	<key>CFBundleIdentifier</key>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>$(PRODUCT_NAME)</string>
+	<key>CFBundlePackageType</key>
+	<string>BNDL</string>
+	<key>CFBundleShortVersionString</key>
+	<string>1.0</string>
+	<key>CFBundleSignature</key>
+	<string>????</string>
+	<key>CFBundleVersion</key>
+	<string>1</string>
+</dict>
+</plist>
--- a/examples/basic/ios/VideoPlayerTests/VideoPlayerTests.m
+++ b/examples/basic/ios/VideoPlayerTests/VideoPlayerTests.m
@@ -0,0 +1,65 @@
+#import <UIKit/UIKit.h>
+#import <XCTest/XCTest.h>
+
+#import <React/RCTLog.h>
+#import <React/RCTRootView.h>
+
+#define TIMEOUT_SECONDS 600
+#define TEXT_TO_LOOK_FOR @"Welcome to React"
+
+@interface VideoPlayerTests : XCTestCase
+
+@end
+
+@implementation VideoPlayerTests
+
+- (BOOL)findSubviewInView:(UIView *)view matching:(BOOL(^)(UIView *view))test
+{
+  if (test(view)) {
+    return YES;
+  }
+  for (UIView *subview in [view subviews]) {
+    if ([self findSubviewInView:subview matching:test]) {
+      return YES;
+    }
+  }
+  return NO;
+}
+
+- (void)testRendersWelcomeScreen
+{
+  UIViewController *vc = [[[RCTSharedApplication() delegate] window] rootViewController];
+  NSDate *date = [NSDate dateWithTimeIntervalSinceNow:TIMEOUT_SECONDS];
+  BOOL foundElement = NO;
+
+  __block NSString *redboxError = nil;
+#ifdef DEBUG
+  RCTSetLogFunction(^(RCTLogLevel level, RCTLogSource source, NSString *fileName, NSNumber *lineNumber, NSString *message) {
+    if (level >= RCTLogLevelError) {
+      redboxError = message;
+    }
+  });
+#endif
+
+  while ([date timeIntervalSinceNow] > 0 && !foundElement && !redboxError) {
+    [[NSRunLoop mainRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
+    [[NSRunLoop mainRunLoop] runMode:NSRunLoopCommonModes beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
+
+    foundElement = [self findSubviewInView:vc.view matching:^BOOL(UIView *view) {
+      if ([view.accessibilityLabel isEqualToString:TEXT_TO_LOOK_FOR]) {
+        return YES;
+      }
+      return NO;
+    }];
+  }
+
+#ifdef DEBUG
+  RCTSetLogFunction(RCTDefaultLogFunction);
+#endif
+
+  XCTAssertNil(redboxError, @"RedBox error: %@", redboxError);
+  XCTAssertTrue(foundElement, @"Couldn't find element with text '%@' in %d seconds", TEXT_TO_LOOK_FOR, TIMEOUT_SECONDS);
+}
+
+
+@end
--- a/examples/basic/ios/main.jsbundle
+++ b/examples/basic/ios/main.jsbundle
@@ -1,5 +0,0 @@
-// Offline JS
-// To re-generate the offline bundle, run this from root of your project
-// $ curl 'http://localhost:8081/index.ios.bundle?dev=false&minify=true' -o iOS/main.jsbundle
-
-throw new Error('Offline JS file is empty. See iOS/main.jsbundle for instructions');
--- a/examples/basic/ios/main.m
+++ b/examples/basic/ios/main.m
@@ -1,19 +0,0 @@
-/**
- * Copyright (c) 2015-present, Facebook, Inc.
- * All rights reserved.
- *
- * This source code is licensed under the BSD-style license found in the
- * LICENSE file in the root directory of this source tree. An additional grant
- * of patent rights can be found in the PATENTS file in the same directory.
- */
-
-#import <UIKit/UIKit.h>
-
-#import "AppDelegate.h"
-
-int main(int argc, char * argv[]) {
-  @autoreleasepool {
-    return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
-  }
-}
-
--- a/examples/basic/metro.config.js
+++ b/examples/basic/metro.config.js
@@ -1,4 +1,24 @@
+/**
+ * Metro configuration for React Native
+ * https://github.com/facebook/react-native
+ *
+ * @format
+ */
+const path = require('path');
+const blacklist = require('metro-config/src/defaults/blacklist');
+
 module.exports = {
+  resolver: {
+    blacklistRE: blacklist([
+      // This stops "react-native run-windows" from causing the metro server to crash if its already running
+      new RegExp(
+        `${path.resolve(__dirname, 'windows').replace(/[/\\]/g, '/')}.*`,
+      ),
+      // This prevents "react-native run-windows" from hitting: EBUSY: resource busy or locked, open msbuild.ProjectImports.zip
+      /.*\.ProjectImports\.zip/,
+      /(.*\/react-native-video\/node_modules\/.*)$/,
+    ]),
+  },
  transformer: {
    getTransformOptions: async () => ({
      transform: {
@@ -7,4 +27,4 @@ module.exports = {
      },
    }),
  },
-};
+};
--- a/examples/basic/package.json
+++ b/examples/basic/package.json
@@ -3,24 +3,34 @@
  "version": "1.0.0",
  "private": true,
  "scripts": {
+    "android": "react-native run-android",
+    "ios": "cd ios && pod install && cd .. && react-native run-ios",
+    "windows": "react-native run-windows",
    "start": "node node_modules/react-native/local-cli/cli.js start",
-    "postinstall": "rm -rf node_modules/react-native-video/{examples,node_modules}",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
-    "react": "16.9.0",
-    "react-native": "0.60.5",
-    "react-native-video": "file:../.."
+    "@react-native-picker/picker": "^1.9.11",
+    "babel-plugin-module-resolver": "^4.1.0",
+    "react": "16.13.1",
+    "react-native": "0.63.4",
+    "react-native-video": "../..",
+    "react-native-windows": "0.63.41"
  },
  "devDependencies": {
-    "@babel/core": "^7.6.0",
-    "@babel/runtime": "^7.6.0",
-    "@react-native-community/eslint-config": "^0.0.5",
-    "babel-jest": "^24.9.0",
-    "eslint": "^6.4.0",
-    "jest": "^24.9.0",
-    "metro-react-native-babel-preset": "^0.56.0",
-    "react-test-renderer": "16.8.6"
+    "@babel/core": "^7.8.4",
+    "@babel/runtime": "^7.8.4",
+    "@react-native-community/eslint-config": "^1.1.0",
+    "@types/react": "^18.0.6",
+    "@types/react-native": "^0.67.6",
+    "babel-jest": "^25.1.0",
+    "eslint": "^6.5.1",
+    "jest": "^25.1.0",
+    "metro-react-native-babel-preset": "^0.59.0",
+    "react-test-renderer": "16.13.1"
+  },
+  "jest": {
+    "preset": "react-native"
  }
-}
+}
--- a/examples/basic/src/VideoPlayer.android.tsx
+++ b/examples/basic/src/VideoPlayer.android.tsx
@@ -0,0 +1,818 @@
+'use strict';
+
+import React, {
+  Component
+} from 'react';
+
+import {
+  StyleSheet,
+  Text,
+  TouchableOpacity,
+  View,
+  ActivityIndicator,
+  PanResponder,
+  ToastAndroid,
+} from 'react-native';
+
+import { Picker } from '@react-native-picker/picker'
+
+import Video, { TextTrackType } from 'react-native-video';
+
+class VideoPlayer extends Component {
+
+  state = {
+    rate: 1,
+    volume: 1,
+    muted: false,
+    resizeMode: 'contain',
+    duration: 0.0,
+    currentTime: 0.0,
+    videoWidth: 0,
+    videoHeight: 0,
+    paused: false,
+    fullscreen: true,
+    decoration: true,
+    isLoading: false,
+    seekerFillWidth: 0,
+    seekerPosition: 0,
+    seekerOffset: 0,
+    seeking: false,
+    audioTracks: [],
+    textTracks: [],
+    selectedAudioTrack: undefined,
+    selectedTextTrack: undefined,
+    srcListId: 0,
+    loop: false,
+  };
+
+  seekerWidth = 0
+
+  srcList = [
+    require('./broadchurch.mp4'),
+    {
+      description: 'subtitles',
+      uri: 'https://bitmovin-a.akamaihd.net/content/sintel/sintel.mpd',
+    },
+    {
+      description: 'demo with sintel Subtitles',
+      uri:
+        'http://www.youtube.com/api/manifest/dash/id/bf5bb2419360daf1/source/youtube?as=fmp4_audio_clear,fmp4_sd_hd_clear&sparams=ip,ipbits,expire,source,id,as&ip=0.0.0.0&ipbits=0&expire=19000000000&signature=51AF5F39AB0CEC3E5497CD9C900EBFEAECCCB5C7.8506521BFC350652163895D4C26DEE124209AA9E&key=ik0',
+      type: 'mpd',
+    },
+    { description: 'Stopped playback', uri: undefined },
+    {
+      description: 'no View',
+      noView: true,
+    },
+  ]
+
+  video: Video;
+  seekPanResponder: PanResponder | undefined;
+
+  onLoad = (data: any) => {
+    this.setState({ duration: data.duration, loading: false, });
+    this.onAudioTracks(data.audioTracks)
+    this.onTextTracks(data.textTracks)
+  };
+
+  onProgress = (data: any) => {
+    if (!this.state.seeking) {
+      const position = this.calculateSeekerPosition()
+      this.setSeekerPosition(position)
+    }
+    this.setState({ currentTime: data.currentTime })
+  };
+
+
+  onVideoLoadStart = () => {
+    console.log('onVideoLoadStart')
+    this.setState({ isLoading: true })
+  }
+
+
+  onAudioTracks = (data: any) => {
+    const selectedTrack = data.audioTracks?.find((x: any) => {
+      return x.selected
+    })
+    this.setState({
+      audioTracks: data,
+    })
+    if (selectedTrack?.language) {
+      this.setState({
+        selectedAudioTrack: {
+          type: 'language',
+          value: selectedTrack?.language,
+        },
+      })
+
+    }
+  }
+
+  onTextTracks = (data: any) => {
+    const selectedTrack = data.textTracks?.find((x: any) => {
+      return x.selected
+    })
+
+    this.setState({
+      textTracks: data,
+    })
+    if (selectedTrack?.language) {
+      this.setState({
+        textTracks: data,
+        selectedTextTrack: {
+          type: 'language',
+          value: selectedTrack?.language,
+        },
+      })
+    }
+  }
+
+  onAspectRatio = (data: any) => {
+    console.log('onAspectRadio called ' + JSON.stringify(data))
+    this.setState({
+      videoWidth: data.width,
+      videoHeight: data.height,
+    })
+  }
+
+  onVideoBuffer = (param: any) => {
+    console.log('onVideoBuffer')
+
+    this.setState({ isLoading: param.isBuffering })
+  }
+
+
+  onReadyForDisplay = () => {
+    console.log('onReadyForDisplay')
+
+    this.setState({ isLoading: false })
+  }
+
+
+  onAudioBecomingNoisy = () => {
+    this.setState({ paused: true })
+  };
+
+  onAudioFocusChanged = (event: { hasAudioFocus: boolean }) => {
+    this.setState({ paused: !event.hasAudioFocus })
+  };
+
+  getCurrentTimePercentage = () => {
+    if (this.state.currentTime > 0 && this.state.duration !== 0) {
+      return this.state.currentTime / this.state.duration;
+    }
+    return 0;
+  };
+
+  renderRateControl(rate: number) {
+    const isSelected = (this.state.rate === rate);
+
+    return (
+      <TouchableOpacity onPress={() => { this.setState({ rate }) }}>
+        <Text style={[styles.controlOption, { fontWeight: isSelected ? 'bold' : 'normal' }]}>
+          {rate}
+        </Text>
+      </TouchableOpacity>
+    );
+  }
+
+  renderResizeModeControl(resizeMode: string) {
+    const isSelected = (this.state.resizeMode === resizeMode);
+
+    return (
+      <TouchableOpacity onPress={() => { this.setState({ resizeMode }) }}>
+        <Text style={[styles.controlOption, { fontWeight: isSelected ? 'bold' : 'normal' }]}>
+          {resizeMode}
+        </Text>
+      </TouchableOpacity>
+    )
+  }
+
+  renderVolumeControl(volume: number) {
+    const isSelected = (this.state.volume === volume);
+
+    return (
+      <TouchableOpacity onPress={() => { this.setState({ volume }) }}>
+        <Text style={[styles.controlOption, { fontWeight: isSelected ? 'bold' : 'normal' }]}>
+          {volume * 100}%
+        </Text>
+      </TouchableOpacity>
+    )
+  }
+
+
+  toast = (visible: boolean, message: string) => {
+    if (visible) {
+      ToastAndroid.showWithGravityAndOffset(
+        message,
+        ToastAndroid.LONG,
+        ToastAndroid.BOTTOM,
+        25,
+        50,
+      )
+      return null
+    }
+    return null
+  }
+
+  onError = (err: any) => {
+    console.log(JSON.stringify(err))
+    this.toast(true, 'error: ' + err?.error?.code)
+  }
+
+  onEnd = () => {
+    this.channelUp()
+  };
+
+
+  toggleFullscreen() {
+    this.setState({ fullscreen: !this.state.fullscreen })
+  }
+
+  toggleDecoration() {
+    this.setState({ decoration: !this.state.decoration })
+    if (this.state.decoration) {
+      this.video.dismissFullscreenPlayer()
+    } else {
+      this.video.presentFullscreenPlayer()
+    }
+  }
+
+  goToChannel(channel: any) {
+    this.setState({
+      srcListId: channel,
+      duration: 0.0,
+      currentTime: 0.0,
+      videoWidth: 0,
+      videoHeight: 0,
+      isLoading: false,
+      audioTracks: [],
+      textTracks: [],
+      selectedAudioTrack: undefined,
+      selectedTextTrack: undefined,
+    })
+  }
+
+
+  channelUp() {
+    console.log('channel up')
+    this.goToChannel((this.state.srcListId + 1) % this.srcList.length)
+  }
+
+  channelDown() {
+    console.log('channel down')
+    this.goToChannel((this.state.srcListId + this.srcList.length - 1) % this.srcList.length)
+  }
+
+  componentDidMount() {
+    this.initSeekPanResponder()
+  }
+
+  renderDecorationsControl() {
+    return (
+      <TouchableOpacity
+        onPress={() => {
+          this.toggleDecoration()
+        }}
+      >
+        <Text style={[styles.controlOption]}>{'decoration'}</Text>
+      </TouchableOpacity>
+    )
+  }
+
+  renderFullScreenControl() {
+    return (
+      <TouchableOpacity
+        onPress={() => {
+          this.toggleFullscreen()
+        }}
+      >
+        <Text style={[styles.controlOption]}>{'fullscreen'}</Text>
+      </TouchableOpacity>
+    )
+  }
+
+  renderPause() {
+    return (
+      <TouchableOpacity
+        onPress={() => {
+          this.setState({ paused: !this.state.paused })
+        }}
+      >
+        <Text style={[styles.controlOption]}>
+          {this.state.paused ? 'pause' : 'playing'}
+        </Text>
+      </TouchableOpacity>
+    )
+  }
+
+  renderRepeatModeControl() {
+    return (
+      <TouchableOpacity
+        onPress={() => {
+          this.setState({ loop: !this.state.loop })
+        }}
+      >
+        <Text style={[styles.controlOption]}>
+          {this.state.loop ? 'loop enable' : 'loop disable'}
+        </Text>
+      </TouchableOpacity>
+    )
+  }
+
+  renderLeftControl() {
+    return (
+      <View>
+        <TouchableOpacity
+          onPress={() => {
+            this.channelDown()
+          }}
+        >
+          <Text style={[styles.leftRightControlOption]}>{'ChDown'}</Text>
+        </TouchableOpacity>
+      </View>
+      // onTimelineUpdated
+    )
+  }
+
+  renderRightControl() {
+    return (
+      <View>
+        <TouchableOpacity
+          onPress={() => {
+            this.channelUp()
+          }}
+        >
+          <Text style={[styles.leftRightControlOption]}>{'ChUp'}</Text>
+        </TouchableOpacity>
+      </View>
+    )
+  }
+
+  /**
+   * Render the seekbar and attach its handlers
+   */
+
+  /**
+   * Constrain the location of the seeker to the
+   * min/max value based on how big the
+   * seeker is.
+   *
+   * @param {float} val position of seeker handle in px
+   * @return {float} constrained position of seeker handle in px
+   */
+  constrainToSeekerMinMax(val = 0) {
+    if (val <= 0) {
+      return 0
+    } else if (val >= this.seekerWidth) {
+      return this.seekerWidth
+    }
+    return val
+  }
+
+  /**
+   * Set the position of the seekbar's components
+   * (both fill and handle) according to the
+   * position supplied.
+   *
+   * @param {float} position position in px of seeker handle}
+   */
+  setSeekerPosition(position = 0) {
+    const state = this.state
+    position = this.constrainToSeekerMinMax(position)
+
+    state.seekerFillWidth = position
+    state.seekerPosition = position
+
+    if (!state.seeking) {
+      state.seekerOffset = position
+    }
+
+    this.setState(state)
+  }
+
+  /**
+   * Calculate the position that the seeker should be
+   * at along its track.
+   *
+   * @return {float} position of seeker handle in px based on currentTime
+   */
+  calculateSeekerPosition() {
+    const percent = this.state.currentTime / this.state.duration
+    return this.seekerWidth * percent
+  }
+
+  /**
+   * Return the time that the video should be at
+   * based on where the seeker handle is.
+   *
+   * @return {float} time in ms based on seekerPosition.
+   */
+  calculateTimeFromSeekerPosition() {
+    const percent = this.state.seekerPosition / this.seekerWidth
+    return this.state.duration * percent
+  }
+
+  /**
+   * Get our seekbar responder going
+   */
+  initSeekPanResponder() {
+    this.seekPanResponder = PanResponder.create({
+      // Ask to be the responder.
+      onStartShouldSetPanResponder: (evt, gestureState) => true,
+      onMoveShouldSetPanResponder: (evt, gestureState) => true,
+
+      /**
+       * When we start the pan tell the machine that we're
+       * seeking. This stops it from updating the seekbar
+       * position in the onProgress listener.
+       */
+      onPanResponderGrant: (evt, gestureState) => {
+        const state = this.state
+        // this.clearControlTimeout()
+        const position = evt.nativeEvent.locationX
+        this.setSeekerPosition(position)
+        state.seeking = true
+        this.setState(state)
+      },
+
+      /**
+       * When panning, update the seekbar position, duh.
+       */
+      onPanResponderMove: (evt, gestureState) => {
+        const position = this.state.seekerOffset + gestureState.dx
+        this.setSeekerPosition(position)
+      },
+
+      /**
+       * On release we update the time and seek to it in the video.
+       * If you seek to the end of the video we fire the
+       * onEnd callback
+       */
+      onPanResponderRelease: (evt, gestureState) => {
+        const time = this.calculateTimeFromSeekerPosition()
+        const state = this.state
+        if (time >= state.duration && !state.isLoading) {
+          state.paused = true
+          this.onEnd()
+        } else {
+          this.video?.seek(time)
+          state.seeking = false
+        }
+        this.setState(state)
+      },
+    })
+  }
+
+  renderSeekBar() {
+    if (!this.seekPanResponder) {
+      return null
+    }
+    return (
+      <View
+        style={styles.seekbarContainer}
+        {...this.seekPanResponder.panHandlers}
+        {...styles.generalControls}
+      >
+        <View
+          style={styles.seekbarTrack}
+          onLayout={(event) => (this.seekerWidth = event.nativeEvent.layout.width)}
+          pointerEvents={'none'}
+        >
+          <View
+            style={[
+              styles.seekbarFill,
+              {
+                width:
+                  this.state.seekerFillWidth > 0 ? this.state.seekerFillWidth : 0,
+                backgroundColor: '#FFF',
+              },
+            ]}
+            pointerEvents={'none'}
+          />
+        </View>
+        <View
+          style={[
+            styles.seekbarHandle,
+            { left: this.state.seekerPosition > 0 ? this.state.seekerPosition : 0 },
+          ]}
+          pointerEvents={'none'}
+        >
+          <View
+            style={[
+              styles.seekbarCircle,
+              { backgroundColor: '#FFF' },
+            ]}
+            pointerEvents={'none'}
+          />
+        </View>
+      </View>
+    )
+  }
+
+  IndicatorLoadingView() {
+    if (this.state.isLoading)
+      return <ActivityIndicator color="#3235fd" size="large" style={styles.IndicatorStyle} />
+    else return <View />
+  }
+
+  renderOverlay() {
+    return (
+      <>
+        {this.IndicatorLoadingView()}
+        <View style={styles.topControls}>
+          <Text style={[styles.controlOption]}>
+            {this.srcList[this.state.srcListId]?.description || 'local file'}
+          </Text>
+        </View>
+        <View style={styles.leftControls}>
+          <View style={styles.resizeModeControl}>{this.renderLeftControl()}</View>
+        </View>
+        <View style={styles.rightControls}>
+          <View style={styles.resizeModeControl}>{this.renderRightControl()}</View>
+        </View>
+        <View style={styles.bottomControls}>
+          <View style={styles.generalControls}>
+            <View style={styles.resizeModeControl}>{this.renderPause()}</View>
+            <View style={styles.resizeModeControl}>
+              {this.renderRepeatModeControl()}
+            </View>
+            <View style={styles.resizeModeControl}>
+              {this.renderFullScreenControl()}
+            </View>
+            <View style={styles.resizeModeControl}>
+              {this.renderDecorationsControl()}
+            </View>
+          </View>
+          <View style={styles.generalControls}>
+            <View style={styles.rateControl}>
+              {this.renderRateControl(0.25)}
+              {this.renderRateControl(0.5)}
+              {this.renderRateControl(1.0)}
+              {this.renderRateControl(1.5)}
+              {this.renderRateControl(2.0)}
+            </View>
+
+            <View style={styles.volumeControl}>
+              {this.renderVolumeControl(0.5)}
+              {this.renderVolumeControl(1)}
+              {this.renderVolumeControl(1.5)}
+            </View>
+
+            <View style={styles.resizeModeControl}>
+              {this.renderResizeModeControl('cover')}
+              {this.renderResizeModeControl('contain')}
+              {this.renderResizeModeControl('stretch')}
+            </View>
+          </View>
+          {this.renderSeekBar()}
+          <View style={styles.generalControls}>
+            <Text style={styles.controlOption}>AudioTrack</Text>
+            {this.state.audioTracks?.length <= 0 ? (
+              <Text style={styles.controlOption}>empty</Text>
+            ) : (
+              <Picker
+                style={styles.picker}
+                selectedValue={this.state.selectedAudioTrack?.value}
+                onValueChange={(itemValue, itemIndex) => {
+                  console.log('on audio value change ' + itemValue)
+                  this.setState({
+                    selectedAudioTrack: {
+                      type: 'language',
+                      value: itemValue,
+                    },
+                  })
+                }}
+              >
+                {this.state.audioTracks.map((track) => {
+                  return (
+                    <Picker.Item
+                      label={track.language}
+                      value={track.language}
+                      key={track.language}
+                    />
+                  )
+                })}
+              </Picker>
+            )}
+            <Text style={styles.controlOption}>TextTrack</Text>
+            {this.state.textTracks?.length <= 0 ? (
+              <Text style={styles.controlOption}>empty</Text>
+            ) : (
+              <Picker
+                style={styles.picker}
+                selectedValue={this.state.selectedTextTrack?.value}
+                onValueChange={(itemValue, itemIndex) => {
+                  console.log('on value change ' + itemValue)
+                  this.setState({
+                    selectedTextTrack: {
+                      type: 'language',
+                      value: itemValue,
+                    },
+                  })
+                }}
+              >
+                <Picker.Item label={'none'} value={'none'} key={'none'} />
+
+                {this.state.textTracks.map((track) => (
+                  <Picker.Item
+                    label={track.language}
+                    value={track.language}
+                    key={track.language}
+                  />
+                ))}
+              </Picker>
+            )}
+          </View>
+        </View>
+      </>
+    )
+  }
+
+  renderVideoView() {
+    const viewStyle = this.state.fullscreen ? styles.fullScreen : styles.halfScreen
+
+    return (
+      <TouchableOpacity style={viewStyle}>
+        <Video
+          ref={(ref: Video) => {
+            this.video = ref
+          }}
+          source={this.srcList[this.state.srcListId]}
+          style={viewStyle}
+          rate={this.state.rate}
+          paused={this.state.paused}
+          volume={this.state.volume}
+          muted={this.state.muted}
+          resizeMode={this.state.resizeMode}
+          onLoad={this.onLoad}
+          onProgress={this.onProgress}
+          onEnd={this.onEnd}
+          progressUpdateInterval={1000}
+          onError={this.onError}
+          onAudioBecomingNoisy={this.onAudioBecomingNoisy}
+          onAudioFocusChanged={this.onAudioFocusChanged}
+          onLoadStart={this.onVideoLoadStart}
+          onVideoAspectRatio={this.onAspectRatio}
+          onReadyForDisplay={this.onReadyForDisplay}
+          onBuffer={this.onVideoBuffer}
+          repeat={this.state.loop}
+          selectedTextTrack={this.state.selectedTextTrack}
+          selectedAudioTrack={this.state.selectedAudioTrack}
+        />
+      </TouchableOpacity>
+    )
+  }
+
+  render() {
+    return (
+      <View style={styles.container}>
+        {this.srcList[this.state.srcListId]?.noView ? null : this.renderVideoView()}
+        {this.renderOverlay()}
+      </View>
+    )
+  }
+
+}
+
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: 'black',
+  },
+  halfScreen: {
+    position: 'absolute',
+    top: 50,
+    left: 50,
+    bottom: 100,
+    right: 100,
+  },
+  fullScreen: {
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    bottom: 0,
+    right: 0,
+  },
+  bottomControls: {
+    backgroundColor: 'transparent',
+    borderRadius: 5,
+    position: 'absolute',
+    bottom: 20,
+    left: 20,
+    right: 20,
+  },
+  leftControls: {
+    backgroundColor: 'transparent',
+    borderRadius: 5,
+    position: 'absolute',
+    top: 20,
+    bottom: 20,
+    left: 20,
+  },
+  rightControls: {
+    backgroundColor: 'transparent',
+    borderRadius: 5,
+    position: 'absolute',
+    top: 20,
+    bottom: 20,
+    right: 20,
+  },
+  topControls: {
+    backgroundColor: 'transparent',
+    borderRadius: 4,
+    position: 'absolute',
+    top: 20,
+    left: 20,
+    right: 20,
+    flex: 1,
+    flexDirection: 'row',
+    overflow: 'hidden',
+    paddingBottom: 10,
+  },
+  generalControls: {
+    flex: 1,
+    flexDirection: 'row',
+    borderRadius: 4,
+    overflow: 'hidden',
+    paddingBottom: 10,
+  },
+  rateControl: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'center',
+  },
+  volumeControl: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'center',
+  },
+  resizeModeControl: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  leftRightControlOption: {
+    alignSelf: 'center',
+    fontSize: 11,
+    color: 'white',
+    padding: 10,
+    lineHeight: 12,
+  },
+  controlOption: {
+    alignSelf: 'center',
+    fontSize: 11,
+    color: 'white',
+    paddingLeft: 2,
+    paddingRight: 2,
+    lineHeight: 12,
+  },
+  IndicatorStyle: {
+    flex: 1,
+    justifyContent: 'center',
+  },
+  seekbarContainer: {
+    flex: 1,
+    flexDirection: 'row',
+    borderRadius: 4,
+    height: 30,
+  },
+  seekbarTrack: {
+    backgroundColor: '#333',
+    height: 1,
+    position: 'relative',
+    top: 14,
+    width: '100%',
+  },
+  seekbarFill: {
+    backgroundColor: '#FFF',
+    height: 1,
+    width: '100%',
+  },
+  seekbarHandle: {
+    position: 'absolute',
+    marginLeft: -7,
+    height: 28,
+    width: 28,
+  },
+  seekbarCircle: {
+    borderRadius: 12,
+    position: 'relative',
+    top: 8,
+    left: 8,
+    height: 12,
+    width: 12,
+  },
+  picker: {
+    color: 'white',
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'center',
+  },
+});
+
+export default VideoPlayer
--- a/examples/basic/src/VideoPlayer.ios.tsx
+++ b/examples/basic/src/VideoPlayer.ios.tsx
@@ -4,8 +4,7 @@ import React, {
 } from 'react';

 import {
-  AlertIOS,
-  AppRegistry,
+  Alert,
  Platform,
  StyleSheet,
  Text,
@@ -35,7 +34,7 @@ const filterTypes = [
 ];

 class VideoPlayer extends Component {
-  constructor(props) {
+  constructor(props: any) {
    super(props);
    this.onLoad = this.onLoad.bind(this);
    this.onProgress = this.onProgress.bind(this);
@@ -58,12 +57,12 @@ class VideoPlayer extends Component {
    filterEnabled: true
  };

-  onLoad(data) {
+  onLoad(data: any) {
    console.log('On load fired!');
    this.setState({duration: data.duration});
  }

-  onProgress(data) {
+  onProgress(data: any) {
    this.setState({currentTime: data.currentTime});
  }

@@ -72,14 +71,14 @@ class VideoPlayer extends Component {
  }

  getCurrentTimePercentage() {
-    if (this.state.currentTime > 0) {
-      return parseFloat(this.state.currentTime) / parseFloat(this.state.duration);
+    if (this.state.currentTime > 0 && this.state.duration !== 0) {
+      return this.state.currentTime / this.state.duration;
    } else {
      return 0;
    }
  }

-  setFilter(step) {
+  setFilter(step: number) {
    let index = filterTypes.indexOf(this.state.filter) + step;

    if (index === filterTypes.length) {
@@ -108,7 +107,7 @@ class VideoPlayer extends Component {
    );
  }

-  renderRateControl(rate) {
+  renderRateControl(rate: number) {
    const isSelected = (this.state.rate == rate);

    return (
@@ -120,7 +119,7 @@ class VideoPlayer extends Component {
    )
  }

-  renderResizeModeControl(resizeMode) {
+  renderResizeModeControl(resizeMode: string) {
    const isSelected = (this.state.resizeMode == resizeMode);

    return (
@@ -132,7 +131,7 @@ class VideoPlayer extends Component {
    )
  }

-  renderVolumeControl(volume) {
+  renderVolumeControl(volume: number) {
    const isSelected = (this.state.volume == volume);

    return (
@@ -144,7 +143,7 @@ class VideoPlayer extends Component {
    )
  }

-  renderIgnoreSilentSwitchControl(ignoreSilentSwitch) {
+  renderIgnoreSilentSwitchControl(ignoreSilentSwitch: string) {
    const isSelected = (this.state.ignoreSilentSwitch == ignoreSilentSwitch);

    return (
@@ -156,7 +155,7 @@ class VideoPlayer extends Component {
    )
  }

-  renderMixWithOthersControl(mixWithOthers) {
+  renderMixWithOthersControl(mixWithOthers: string) {
    const isSelected = (this.state.mixWithOthers == mixWithOthers);

    return (
@@ -188,7 +187,7 @@ class VideoPlayer extends Component {
            onLoad={this.onLoad}
            onBuffer={this.onBuffer}
            onProgress={this.onProgress}
-            onEnd={() => { AlertIOS.alert('Done!') }}
+            onEnd={() => { Alert.alert('Done!') }}
            repeat={true}
            filter={this.state.filter}
            filterEnabled={this.state.filterEnabled}
@@ -282,7 +281,7 @@ class VideoPlayer extends Component {
            onLoad={this.onLoad}
            onBuffer={this.onBuffer}
            onProgress={this.onProgress}
-            onEnd={() => { AlertIOS.alert('Done!') }}
+            onEnd={() => { Alert.alert('Done!') }}
            repeat={true}
            controls={this.state.controls}
            filter={this.state.filter}
@@ -442,8 +441,13 @@ const styles = StyleSheet.create({
  },
  nativeVideoControls: {
    top: 184,
-    height: 300
-  }
+    height: 300,
+  },
+  trackingControls: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
 });
-
-AppRegistry.registerComponent('VideoPlayer', () => VideoPlayer);
+export default VideoPlayer
--- a/examples/basic/src/VideoPlayer.windows.tsx
+++ b/examples/basic/src/VideoPlayer.windows.tsx
@@ -5,7 +5,6 @@ import React, {
 } from 'react';

 import {
-  AppRegistry,
  StyleSheet,
  Text,
  TouchableOpacity,
@@ -15,7 +14,7 @@ import {
 import Video from 'react-native-video';

 class VideoPlayer extends Component {
-  constructor(props) {
+  constructor(props: any) {
    super(props);
    this.onLoad = this.onLoad.bind(this);
    this.onProgress = this.onProgress.bind(this);
@@ -28,25 +27,26 @@ class VideoPlayer extends Component {
    resizeMode: 'contain',
    duration: 0.0,
    currentTime: 0.0,
+    paused: 0,
  };

-  onLoad(data) {
+  onLoad(data: any) {
    this.setState({duration: data.duration});
  }

-  onProgress(data) {
+  onProgress(data: any) {
    this.setState({currentTime: data.currentTime});
  }

  getCurrentTimePercentage() {
-    if (this.state.currentTime > 0) {
-      return parseFloat(this.state.currentTime) / parseFloat(this.state.duration);
+    if (this.state.currentTime > 0 && this.state.duration !== 0) {
+      return this.state.currentTime / this.state.duration;
    } else {
      return 0;
    }
  }

-  renderRateControl(rate) {
+  renderRateControl(rate: number) {
    const isSelected = (this.state.rate == rate);

    return (
@@ -58,7 +58,7 @@ class VideoPlayer extends Component {
    )
  }

-  renderResizeModeControl(resizeMode) {
+  renderResizeModeControl(resizeMode: string) {
    const isSelected = (this.state.resizeMode == resizeMode);

    return (
@@ -70,7 +70,7 @@ class VideoPlayer extends Component {
    )
  }

-  renderVolumeControl(volume) {
+  renderVolumeControl(volume: number) {
    const isSelected = (this.state.volume == volume);

    return (
@@ -205,6 +205,11 @@ const styles = StyleSheet.create({
    paddingRight: 2,
    lineHeight: 12,
  },
+  trackingControls: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
 });
-
-AppRegistry.registerComponent('VideoPlayer', () => VideoPlayer);
+export default VideoPlayer
--- a/examples/basic/src/broadchurch.mp4
+++ b/examples/basic/src/broadchurch.mp4
--- a/examples/basic/src/index.js
+++ b/examples/basic/src/index.js
@@ -0,0 +1,5 @@
+import {AppRegistry} from 'react-native';
+import VideoPlayer from './VideoPlayer';
+import {name as appName} from '../app.json';
+
+AppRegistry.registerComponent(appName, () => VideoPlayer);
--- a/examples/basic/tsconfig.json
+++ b/examples/basic/tsconfig.json
@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "allowJs": true,
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true,
+    "isolatedModules": true,
+    "jsx": "react-native",
+    "lib": ["es2017"],
+    "moduleResolution": "node",
+    "noEmit": true,
+    "strict": true,
+    "target": "esnext"
+  },
+  "exclude": [
+    "node_modules",
+    "babel.config.js",
+    "metro.config.js",
+    "jest.config.js"
+  ]
+}
--- a/examples/basic/windows/.gitignore
+++ b/examples/basic/windows/.gitignore
@@ -1,89 +1,92 @@
-*AppPackages*
-*BundleArtifacts*
-*ReactAssets*
-
-#OS junk files
-[Tt]humbs.db
-*.DS_Store
-
-#Visual Studio files
-*.[Oo]bj
-*.user
-*.aps
-*.pch
-*.vspscc
-*.vssscc
-*_i.c
-*_p.c
-*.ncb
-*.suo
-*.tlb
-*.tlh
-*.bak
-*.[Cc]ache
-*.ilk
-*.log
-*.lib
-*.sbr
-*.sdf
-*.opensdf
-*.opendb
-*.unsuccessfulbuild
-ipch/
-[Oo]bj/
-[Bb]in
-[Dd]ebug*/
-[Rr]elease*/
-Ankh.NoLoad
-
-# Visual C++ cache files
-ipch/
-*.aps
-*.ncb
-*.opendb
-*.opensdf
-*.sdf
-*.cachefile
-*.VC.db
-*.VC.VC.opendb
-
-#MonoDevelop
-*.pidb
-*.userprefs
-
-#Tooling
-_ReSharper*/
-*.resharper
-[Tt]est[Rr]esult*
-*.sass-cache
-
-#Project files
-[Bb]uild/
-
-#Subversion files
-.svn
-
-# Office Temp Files
-~$*
-
-# vim Temp Files
-*~
-
-#NuGet
-packages/
-*.nupkg
-
-#ncrunch
-*ncrunch*
-*crunch*.local.xml
-
-# visual studio database projects
-*.dbmdl
-
-#Test files
-*.testsettings
-
-#Other files
-*.DotSettings
-.vs/
-*project.lock.json
+*AppPackages*
+*BundleArtifacts*
+
+#OS junk files
+[Tt]humbs.db
+*.DS_Store
+
+#Visual Studio files
+*.[Oo]bj
+*.user
+*.aps
+*.pch
+*.vspscc
+*.vssscc
+*_i.c
+*_p.c
+*.ncb
+*.suo
+*.tlb
+*.tlh
+*.bak
+*.[Cc]ache
+*.ilk
+*.log
+*.lib
+*.sbr
+*.sdf
+*.opensdf
+*.opendb
+*.unsuccessfulbuild
+ipch/
+[Oo]bj/
+[Bb]in
+[Dd]ebug*/
+[Rr]elease*/
+Ankh.NoLoad
+
+# Visual C++ cache files
+ipch/
+*.aps
+*.ncb
+*.opendb
+*.opensdf
+*.sdf
+*.cachefile
+*.VC.db
+*.VC.VC.opendb
+
+#MonoDevelop
+*.pidb
+*.userprefs
+
+#Tooling
+_ReSharper*/
+*.resharper
+[Tt]est[Rr]esult*
+*.sass-cache
+
+#Project files
+[Bb]uild/
+
+#Subversion files
+.svn
+
+# Office Temp Files
+~$*
+
+# vim Temp Files
+*~
+
+#NuGet
+packages/
+*.nupkg
+
+#ncrunch
+*ncrunch*
+*crunch*.local.xml
+
+# visual studio database projects
+*.dbmdl
+
+#Test files
+*.testsettings
+
+#Other files
+*.DotSettings
+.vs/
+*project.lock.json
+
+#Files generated by the VS build
+**/Generated Files/**
+
--- a/examples/basic/windows/VideoPlayer.sln
+++ b/examples/basic/windows/VideoPlayer.sln
@@ -1,141 +1,205 @@
-Microsoft Visual Studio Solution File, Format Version 12.00
-# Visual Studio 14
-VisualStudioVersion = 14.0.25420.1
-MinimumVisualStudioVersion = 10.0.40219.1
-Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "VideoPlayer", "VideoPlayer\VideoPlayer.csproj", "{A027BE54-D118-49A4-8D84-0666A2A93E64}"
-EndProject
-Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "ReactNative", "..\node_modules\react-native-windows\ReactWindows\ReactNative\ReactNative.csproj", "{C7673AD5-E3AA-468C-A5FD-FA38154E205C}"
-EndProject
-Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "ChakraBridge", "..\node_modules\react-native-windows\ReactWindows\ChakraBridge\ChakraBridge.vcxproj", "{4B72C796-16D5-4E3A-81C0-3E36F531E578}"
-EndProject
-Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "ReactNativeVideo", "..\node_modules\react-native-video\windows\ReactNativeVideo\ReactNativeVideo.csproj", "{E8F5F57F-757E-4237-AD23-F7A8755427CD}"
-EndProject
-Global
-	GlobalSection(SolutionConfigurationPlatforms) = preSolution
-		Debug|ARM = Debug|ARM
-		Debug|x64 = Debug|x64
-		Debug|x86 = Debug|x86
-		DebugBundle|ARM = DebugBundle|ARM
-		DebugBundle|x64 = DebugBundle|x64
-		DebugBundle|x86 = DebugBundle|x86
-		Release|ARM = Release|ARM
-		Release|x64 = Release|x64
-		Release|x86 = Release|x86
-		ReleaseBundle|ARM = ReleaseBundle|ARM
-		ReleaseBundle|x64 = ReleaseBundle|x64
-		ReleaseBundle|x86 = ReleaseBundle|x86
-	EndGlobalSection
-	GlobalSection(ProjectConfigurationPlatforms) = postSolution
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Debug|ARM.ActiveCfg = Debug|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Debug|ARM.Build.0 = Debug|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Debug|ARM.Deploy.0 = Debug|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Debug|x64.ActiveCfg = Debug|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Debug|x64.Build.0 = Debug|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Debug|x64.Deploy.0 = Debug|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Debug|x86.ActiveCfg = Debug|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Debug|x86.Build.0 = Debug|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Debug|x86.Deploy.0 = Debug|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.DebugBundle|ARM.ActiveCfg = DebugBundle|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.DebugBundle|ARM.Build.0 = DebugBundle|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.DebugBundle|ARM.Deploy.0 = DebugBundle|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.DebugBundle|x64.ActiveCfg = DebugBundle|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.DebugBundle|x64.Build.0 = DebugBundle|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.DebugBundle|x64.Deploy.0 = DebugBundle|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.DebugBundle|x86.ActiveCfg = DebugBundle|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.DebugBundle|x86.Build.0 = DebugBundle|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.DebugBundle|x86.Deploy.0 = DebugBundle|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Release|ARM.ActiveCfg = Release|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Release|ARM.Build.0 = Release|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Release|ARM.Deploy.0 = Release|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Release|x64.ActiveCfg = Release|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Release|x64.Build.0 = Release|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Release|x64.Deploy.0 = Release|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Release|x86.ActiveCfg = Release|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Release|x86.Build.0 = Release|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.Release|x86.Deploy.0 = Release|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.ReleaseBundle|ARM.ActiveCfg = ReleaseBundle|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.ReleaseBundle|ARM.Build.0 = ReleaseBundle|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.ReleaseBundle|ARM.Deploy.0 = ReleaseBundle|ARM
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.ReleaseBundle|x64.ActiveCfg = ReleaseBundle|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.ReleaseBundle|x64.Build.0 = ReleaseBundle|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.ReleaseBundle|x64.Deploy.0 = ReleaseBundle|x64
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.ReleaseBundle|x86.ActiveCfg = ReleaseBundle|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.ReleaseBundle|x86.Build.0 = ReleaseBundle|x86
-		{A027BE54-D118-49A4-8D84-0666A2A93E64}.ReleaseBundle|x86.Deploy.0 = ReleaseBundle|x86
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Debug|ARM.ActiveCfg = Debug|ARM
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Debug|ARM.Build.0 = Debug|ARM
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Debug|x64.ActiveCfg = Debug|x64
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Debug|x64.Build.0 = Debug|x64
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Debug|x86.ActiveCfg = Debug|x86
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Debug|x86.Build.0 = Debug|x86
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.DebugBundle|ARM.ActiveCfg = Debug|ARM
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.DebugBundle|ARM.Build.0 = Debug|ARM
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.DebugBundle|x64.ActiveCfg = Debug|x64
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.DebugBundle|x64.Build.0 = Debug|x64
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.DebugBundle|x86.ActiveCfg = Debug|x86
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.DebugBundle|x86.Build.0 = Debug|x86
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Release|ARM.ActiveCfg = Release|ARM
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Release|ARM.Build.0 = Release|ARM
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Release|x64.ActiveCfg = Release|x64
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Release|x64.Build.0 = Release|x64
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Release|x86.ActiveCfg = Release|x86
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.Release|x86.Build.0 = Release|x86
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.ReleaseBundle|ARM.ActiveCfg = Release|ARM
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.ReleaseBundle|ARM.Build.0 = Release|ARM
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.ReleaseBundle|x64.ActiveCfg = Release|x64
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.ReleaseBundle|x64.Build.0 = Release|x64
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.ReleaseBundle|x86.ActiveCfg = Release|x86
-		{C7673AD5-E3AA-468C-A5FD-FA38154E205C}.ReleaseBundle|x86.Build.0 = Release|x86
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Debug|ARM.ActiveCfg = Debug|ARM
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Debug|ARM.Build.0 = Debug|ARM
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Debug|x64.ActiveCfg = Debug|x64
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Debug|x64.Build.0 = Debug|x64
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Debug|x86.ActiveCfg = Debug|Win32
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Debug|x86.Build.0 = Debug|Win32
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.DebugBundle|ARM.ActiveCfg = Debug|ARM
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.DebugBundle|ARM.Build.0 = Debug|ARM
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.DebugBundle|x64.ActiveCfg = Debug|x64
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.DebugBundle|x64.Build.0 = Debug|x64
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.DebugBundle|x86.ActiveCfg = Debug|Win32
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.DebugBundle|x86.Build.0 = Debug|Win32
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Release|ARM.ActiveCfg = Release|ARM
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Release|ARM.Build.0 = Release|ARM
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Release|x64.ActiveCfg = Release|x64
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Release|x64.Build.0 = Release|x64
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Release|x86.ActiveCfg = Release|Win32
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.Release|x86.Build.0 = Release|Win32
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.ReleaseBundle|ARM.ActiveCfg = Release|ARM
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.ReleaseBundle|ARM.Build.0 = Release|ARM
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.ReleaseBundle|x64.ActiveCfg = Release|x64
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.ReleaseBundle|x64.Build.0 = Release|x64
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.ReleaseBundle|x86.ActiveCfg = Release|Win32
-		{4B72C796-16D5-4E3A-81C0-3E36F531E578}.ReleaseBundle|x86.Build.0 = Release|Win32
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Debug|ARM.ActiveCfg = Debug|ARM
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Debug|ARM.Build.0 = Debug|ARM
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Debug|x64.ActiveCfg = Debug|x64
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Debug|x64.Build.0 = Debug|x64
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Debug|x86.ActiveCfg = Debug|x86
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Debug|x86.Build.0 = Debug|x86
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.DebugBundle|ARM.ActiveCfg = Debug|ARM
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.DebugBundle|ARM.Build.0 = Debug|ARM
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.DebugBundle|x64.ActiveCfg = Debug|x64
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.DebugBundle|x64.Build.0 = Debug|x64
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.DebugBundle|x86.ActiveCfg = Debug|x86
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.DebugBundle|x86.Build.0 = Debug|x86
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Release|ARM.ActiveCfg = Release|ARM
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Release|ARM.Build.0 = Release|ARM
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Release|x64.ActiveCfg = Release|x64
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Release|x64.Build.0 = Release|x64
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Release|x86.ActiveCfg = Release|x86
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.Release|x86.Build.0 = Release|x86
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.ReleaseBundle|ARM.ActiveCfg = Release|ARM
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.ReleaseBundle|ARM.Build.0 = Release|ARM
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.ReleaseBundle|x64.ActiveCfg = Release|x64
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.ReleaseBundle|x64.Build.0 = Release|x64
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.ReleaseBundle|x86.ActiveCfg = Release|x86
-		{E8F5F57F-757E-4237-AD23-F7A8755427CD}.ReleaseBundle|x86.Build.0 = Release|x86
-	EndGlobalSection
-	GlobalSection(SolutionProperties) = preSolution
-		HideSolutionNode = FALSE
-	EndGlobalSection
-EndGlobal
+
+Microsoft Visual Studio Solution File, Format Version 12.00
+# Visual Studio Version 16
+VisualStudioVersion = 16.0.29215.179
+MinimumVisualStudioVersion = 10.0.40219.1
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "videoplayer", "videoplayer\videoplayer.vcxproj", "{BF9FF035-B976-4990-86FE-09D015E91C20}"
+	ProjectSection(ProjectDependencies) = postProject
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136} = {F7D32BD0-2749-483E-9A0D-1635EF7E3136}
+	EndProjectSection
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Folly", "..\node_modules\react-native-windows\Folly\Folly.vcxproj", "{A990658C-CE31-4BCC-976F-0FC6B1AF693D}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "ReactCommon", "..\node_modules\react-native-windows\ReactCommon\ReactCommon.vcxproj", "{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}"
+	ProjectSection(ProjectDependencies) = postProject
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D} = {A990658C-CE31-4BCC-976F-0FC6B1AF693D}
+	EndProjectSection
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Chakra", "..\node_modules\react-native-windows\Chakra\Chakra.vcxitems", "{C38970C0-5FBF-4D69-90D8-CBAC225AE895}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Microsoft.ReactNative", "..\node_modules\react-native-windows\Microsoft.ReactNative\Microsoft.ReactNative.vcxproj", "{F7D32BD0-2749-483E-9A0D-1635EF7E3136}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "JSI.Shared", "..\node_modules\react-native-windows\JSI\Shared\JSI.Shared.vcxitems", "{0CC28589-39E4-4288-B162-97B959F8B843}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "JSI.Universal", "..\node_modules\react-native-windows\JSI\Universal\JSI.Universal.vcxproj", "{A62D504A-16B8-41D2-9F19-E2E86019E5E4}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Microsoft.ReactNative.Cxx", "..\node_modules\react-native-windows\Microsoft.ReactNative.Cxx\Microsoft.ReactNative.Cxx.vcxitems", "{DA8B35B3-DA00-4B02-BDE6-6A397B3FD46B}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Common", "..\node_modules\react-native-windows\Common\Common.vcxproj", "{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}"
+EndProject
+Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "ReactNative", "ReactNative", "{5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Microsoft.ReactNative.Shared", "..\node_modules\react-native-windows\Shared\Shared.vcxitems", "{2049DBE9-8D13-42C9-AE4B-413AE38FFFD0}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Mso", "..\node_modules\react-native-windows\Mso\Mso.vcxitems", "{84E05BFA-CBAF-4F0D-BFB6-4CE85742A57E}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "Include", "..\node_modules\react-native-windows\include\Include.vcxitems", "{EF074BA1-2D54-4D49-A28E-5E040B47CD2E}"
+EndProject
+Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "ReactNativeVideoCPP", "..\node_modules\react-native-video\windows\ReactNativeVideoCPP\ReactNativeVideoCPP.vcxproj", "{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}"
+EndProject
+Global
+	GlobalSection(SharedMSBuildProjectFiles) = preSolution
+		..\node_modules\react-native-windows\JSI\Shared\JSI.Shared.vcxitems*{0cc28589-39e4-4288-b162-97b959f8b843}*SharedItemsImports = 9
+		..\node_modules\react-native-windows\Shared\Shared.vcxitems*{2049dbe9-8d13-42c9-ae4b-413ae38fffd0}*SharedItemsImports = 9
+		..\node_modules\react-native-windows\Mso\Mso.vcxitems*{84e05bfa-cbaf-4f0d-bfb6-4ce85742a57e}*SharedItemsImports = 9
+		..\node_modules\react-native-windows\JSI\Shared\JSI.Shared.vcxitems*{a62d504a-16b8-41d2-9f19-e2e86019e5e4}*SharedItemsImports = 4
+		..\node_modules\react-native-windows\Chakra\Chakra.vcxitems*{c38970c0-5fbf-4d69-90d8-cbac225ae895}*SharedItemsImports = 9
+		..\node_modules\react-native-windows\Microsoft.ReactNative.Cxx\Microsoft.ReactNative.Cxx.vcxitems*{da8b35b3-da00-4b02-bde6-6a397b3fd46b}*SharedItemsImports = 9
+		..\node_modules\react-native-windows\include\Include.vcxitems*{ef074ba1-2d54-4d49-a28e-5e040b47cd2e}*SharedItemsImports = 9
+		..\node_modules\react-native-windows\Chakra\Chakra.vcxitems*{f7d32bd0-2749-483e-9a0d-1635ef7e3136}*SharedItemsImports = 4
+		..\node_modules\react-native-windows\Microsoft.ReactNative.Cxx\Microsoft.ReactNative.Cxx.vcxitems*{f7d32bd0-2749-483e-9a0d-1635ef7e3136}*SharedItemsImports = 4
+		..\node_modules\react-native-windows\Mso\Mso.vcxitems*{f7d32bd0-2749-483e-9a0d-1635ef7e3136}*SharedItemsImports = 4
+		..\node_modules\react-native-windows\Shared\Shared.vcxitems*{f7d32bd0-2749-483e-9a0d-1635ef7e3136}*SharedItemsImports = 4
+	EndGlobalSection
+	GlobalSection(SolutionConfigurationPlatforms) = preSolution
+		Debug|ARM = Debug|ARM
+		Debug|ARM64 = Debug|ARM64
+		Debug|x64 = Debug|x64
+		Debug|x86 = Debug|x86
+		Release|ARM = Release|ARM
+		Release|ARM64 = Release|ARM64
+		Release|x64 = Release|x64
+		Release|x86 = Release|x86
+	EndGlobalSection
+	GlobalSection(ProjectConfigurationPlatforms) = postSolution
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|ARM.ActiveCfg = Debug|ARM
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|ARM.Build.0 = Debug|ARM
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|ARM.Deploy.0 = Debug|ARM
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|ARM64.Build.0 = Debug|ARM64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|ARM64.Deploy.0 = Debug|ARM64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|x64.ActiveCfg = Debug|x64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|x64.Build.0 = Debug|x64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|x64.Deploy.0 = Debug|x64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|x86.ActiveCfg = Debug|Win32
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|x86.Build.0 = Debug|Win32
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Debug|x86.Deploy.0 = Debug|Win32
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|ARM.ActiveCfg = Release|ARM
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|ARM.Build.0 = Release|ARM
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|ARM.Deploy.0 = Release|ARM
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|ARM64.ActiveCfg = Release|ARM64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|ARM64.Build.0 = Release|ARM64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|ARM64.Deploy.0 = Release|ARM64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|x64.ActiveCfg = Release|x64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|x64.Build.0 = Release|x64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|x64.Deploy.0 = Release|x64
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|x86.ActiveCfg = Release|Win32
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|x86.Build.0 = Release|Win32
+		{BF9FF035-B976-4990-86FE-09D015E91C20}.Release|x86.Deploy.0 = Release|Win32
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|ARM.ActiveCfg = Debug|ARM
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|ARM.Build.0 = Debug|ARM
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|ARM64.Build.0 = Debug|ARM64
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|x64.ActiveCfg = Debug|x64
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|x64.Build.0 = Debug|x64
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|x86.ActiveCfg = Debug|Win32
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|x86.Build.0 = Debug|Win32
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|ARM.ActiveCfg = Release|ARM
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|ARM.Build.0 = Release|ARM
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|ARM64.ActiveCfg = Release|ARM64
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|ARM64.Build.0 = Release|ARM64
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|x64.ActiveCfg = Release|x64
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|x64.Build.0 = Release|x64
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|x86.ActiveCfg = Release|Win32
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|x86.Build.0 = Release|Win32
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|ARM.ActiveCfg = Debug|ARM
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|ARM.Build.0 = Debug|ARM
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|ARM64.Build.0 = Debug|ARM64
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|x64.ActiveCfg = Debug|x64
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|x64.Build.0 = Debug|x64
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|x86.ActiveCfg = Debug|Win32
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|x86.Build.0 = Debug|Win32
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|ARM.ActiveCfg = Release|ARM
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|ARM.Build.0 = Release|ARM
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|ARM64.ActiveCfg = Release|ARM64
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|ARM64.Build.0 = Release|ARM64
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|x64.ActiveCfg = Release|x64
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|x64.Build.0 = Release|x64
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|x86.ActiveCfg = Release|Win32
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|x86.Build.0 = Release|Win32
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|ARM.ActiveCfg = Debug|ARM
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|ARM.Build.0 = Debug|ARM
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|ARM64.Build.0 = Debug|ARM64
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|x64.ActiveCfg = Debug|x64
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|x64.Build.0 = Debug|x64
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|x86.ActiveCfg = Debug|Win32
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|x86.Build.0 = Debug|Win32
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|ARM.ActiveCfg = Release|ARM
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|ARM.Build.0 = Release|ARM
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|ARM64.ActiveCfg = Release|ARM64
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|ARM64.Build.0 = Release|ARM64
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|x64.ActiveCfg = Release|x64
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|x64.Build.0 = Release|x64
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|x86.ActiveCfg = Release|Win32
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|x86.Build.0 = Release|Win32
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|ARM.ActiveCfg = Debug|ARM
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|ARM.Build.0 = Debug|ARM
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|ARM64.Build.0 = Debug|ARM64
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|x64.ActiveCfg = Debug|x64
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|x64.Build.0 = Debug|x64
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|x86.ActiveCfg = Debug|Win32
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|x86.Build.0 = Debug|Win32
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|ARM.ActiveCfg = Release|ARM
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|ARM.Build.0 = Release|ARM
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|ARM64.ActiveCfg = Release|ARM64
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|ARM64.Build.0 = Release|ARM64
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|x64.ActiveCfg = Release|x64
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|x64.Build.0 = Release|x64
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|x86.ActiveCfg = Release|Win32
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|x86.Build.0 = Release|Win32
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|ARM.ActiveCfg = Debug|ARM
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|ARM.Build.0 = Debug|ARM
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|ARM64.Build.0 = Debug|ARM64
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|x64.ActiveCfg = Debug|x64
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|x64.Build.0 = Debug|x64
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|x86.ActiveCfg = Debug|Win32
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|x86.Build.0 = Debug|Win32
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|ARM.ActiveCfg = Release|ARM
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|ARM.Build.0 = Release|ARM
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|ARM64.ActiveCfg = Release|ARM64
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|ARM64.Build.0 = Release|ARM64
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|x64.ActiveCfg = Release|x64
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|x64.Build.0 = Release|x64
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|x86.ActiveCfg = Release|Win32
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|x86.Build.0 = Release|Win32
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Debug|ARM.ActiveCfg = Debug|ARM
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Debug|ARM.Build.0 = Debug|ARM
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Debug|ARM64.ActiveCfg = Debug|ARM64
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Debug|ARM64.Build.0 = Debug|ARM64
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Debug|x64.ActiveCfg = Debug|x64
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Debug|x64.Build.0 = Debug|x64
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Debug|x86.ActiveCfg = Debug|Win32
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Debug|x86.Build.0 = Debug|Win32
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Release|ARM.ActiveCfg = Release|ARM
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Release|ARM.Build.0 = Release|ARM
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Release|ARM64.ActiveCfg = Release|ARM64
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Release|ARM64.Build.0 = Release|ARM64
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Release|x64.ActiveCfg = Release|x64
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Release|x64.Build.0 = Release|x64
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Release|x86.ActiveCfg = Release|Win32
+		{0D1E54D3-4BE1-4DAF-98BF-124C28C85014}.Release|x86.Build.0 = Release|Win32
+	EndGlobalSection
+	GlobalSection(SolutionProperties) = preSolution
+		HideSolutionNode = FALSE
+	EndGlobalSection
+	GlobalSection(NestedProjects) = preSolution
+		{A990658C-CE31-4BCC-976F-0FC6B1AF693D} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{C38970C0-5FBF-4D69-90D8-CBAC225AE895} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{F7D32BD0-2749-483E-9A0D-1635EF7E3136} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{0CC28589-39E4-4288-B162-97B959F8B843} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{A62D504A-16B8-41D2-9F19-E2E86019E5E4} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{DA8B35B3-DA00-4B02-BDE6-6A397B3FD46B} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{2049DBE9-8D13-42C9-AE4B-413AE38FFFD0} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{84E05BFA-CBAF-4F0D-BFB6-4CE85742A57E} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+		{EF074BA1-2D54-4D49-A28E-5E040B47CD2E} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}
+	EndGlobalSection
+	GlobalSection(ExtensibilityGlobals) = postSolution
+		SolutionGuid = {D43FAD39-F619-437D-BB40-04A3982ACB6A}
+	EndGlobalSection
+EndGlobal
--- a/examples/basic/windows/VideoPlayer/.gitignore
+++ b/examples/basic/windows/VideoPlayer/.gitignore
@@ -0,0 +1 @@
+/Bundle
--- a/examples/basic/windows/VideoPlayer/App.cpp
+++ b/examples/basic/windows/VideoPlayer/App.cpp
@@ -0,0 +1,79 @@
+#include "pch.h"
+
+#include "App.h"
+
+#include "AutolinkedNativeModules.g.h"
+#include "ReactPackageProvider.h"
+
+using namespace winrt::videoplayer;
+using namespace winrt::videoplayer::implementation;
+using namespace winrt;
+using namespace Windows::UI::Xaml;
+using namespace Windows::UI::Xaml::Controls;
+using namespace Windows::UI::Xaml::Navigation;
+using namespace Windows::ApplicationModel;
+
+/// <summary>
+/// Initializes the singleton application object.  This is the first line of
+/// authored code executed, and as such is the logical equivalent of main() or
+/// WinMain().
+/// </summary>
+App::App() noexcept
+{
+#if BUNDLE
+    JavaScriptBundleFile(L"src/index.windows");
+    InstanceSettings().UseWebDebugger(false);
+    InstanceSettings().UseFastRefresh(false);
+#else
+    JavaScriptMainModuleName(L"src/index");
+    InstanceSettings().UseWebDebugger(true);
+    InstanceSettings().UseFastRefresh(true);
+#endif
+
+#if _DEBUG
+    InstanceSettings().UseDeveloperSupport(true);
+#else
+    InstanceSettings().UseDeveloperSupport(false);
+#endif
+
+    RegisterAutolinkedNativeModulePackages(PackageProviders()); // Includes any autolinked modules
+
+    PackageProviders().Append(make<ReactPackageProvider>()); // Includes all modules in this project
+
+    InitializeComponent();
+}
+
+/// <summary>
+/// Invoked when the application is launched normally by the end user.  Other entry points
+/// will be used such as when the application is launched to open a specific file.
+/// </summary>
+/// <param name="e">Details about the launch request and process.</param>
+void App::OnLaunched(activation::LaunchActivatedEventArgs const& e)
+{
+    super::OnLaunched(e);
+
+    Frame rootFrame = Window::Current().Content().as<Frame>();
+    rootFrame.Navigate(xaml_typename<videoplayer::MainPage>(), box_value(e.Arguments()));
+}
+
+/// <summary>
+/// Invoked when application execution is being suspended.  Application state is saved
+/// without knowing whether the application will be terminated or resumed with the contents
+/// of memory still intact.
+/// </summary>
+/// <param name="sender">The source of the suspend request.</param>
+/// <param name="e">Details about the suspend request.</param>
+void App::OnSuspending([[maybe_unused]] IInspectable const& sender, [[maybe_unused]] SuspendingEventArgs const& e)
+{
+    // Save application state and stop any background activity
+}
+
+/// <summary>
+/// Invoked when Navigation to a certain page fails
+/// </summary>
+/// <param name="sender">The Frame which failed navigation</param>
+/// <param name="e">Details about the navigation failure</param>
+void App::OnNavigationFailed(IInspectable const&, NavigationFailedEventArgs const& e)
+{
+    throw hresult_error(E_FAIL, hstring(L"Failed to load Page ") + e.SourcePageType().Name);
+}
--- a/examples/basic/windows/VideoPlayer/App.h
+++ b/examples/basic/windows/VideoPlayer/App.h
@@ -0,0 +1,18 @@
+#pragma once
+
+#include "App.xaml.g.h"
+
+namespace activation = winrt::Windows::ApplicationModel::Activation;
+
+namespace winrt::videoplayer::implementation
+{
+    struct App : AppT<App>
+    {
+        App() noexcept;
+        void OnLaunched(activation::LaunchActivatedEventArgs const&);
+        void OnSuspending(IInspectable const&, Windows::ApplicationModel::SuspendingEventArgs const&);
+        void OnNavigationFailed(IInspectable const&, Windows::UI::Xaml::Navigation::NavigationFailedEventArgs const&);
+      private:
+        using super = AppT<App>;
+    };
+} // namespace winrt::videoplayer::implementation
--- a/examples/basic/windows/VideoPlayer/App.idl
+++ b/examples/basic/windows/VideoPlayer/App.idl
@@ -0,0 +1,3 @@
+namespace videoplayer
+{
+}
--- a/examples/basic/windows/VideoPlayer/App.xaml
+++ b/examples/basic/windows/VideoPlayer/App.xaml
@@ -1,8 +1,10 @@
-<Application
-    x:Class="VideoPlayer.App"
-    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:local="using:VideoPlayer"
-    RequestedTheme="Light">
-
-</Application>
+<react:ReactApplication
+    x:Class="videoplayer.App"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:videoplayer"
+    xmlns:react="using:Microsoft.ReactNative">
+    <Application.Resources>
+        <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
+    </Application.Resources>
+</react:ReactApplication>
--- a/examples/basic/windows/VideoPlayer/App.xaml.cs
+++ b/examples/basic/windows/VideoPlayer/App.xaml.cs
@@ -1,112 +0,0 @@
-using ReactNative;
-using System;
-using Windows.ApplicationModel;
-using Windows.ApplicationModel.Activation;
-using Windows.UI.Core;
-using Windows.UI.Xaml;
-using Windows.UI.Xaml.Controls;
-using Windows.UI.Xaml.Navigation;
-
-namespace VideoPlayer
-{
-    /// <summary>
-    /// Provides application-specific behavior to supplement the default Application class.
-    /// </summary>
-    sealed partial class App : Application
-    {
-        private readonly ReactPage _reactPage;
-
-        /// <summary>
-        /// Initializes the singleton application object.  This is the first line of authored code
-        /// executed, and as such is the logical equivalent of main() or WinMain().
-        /// </summary>
-        public App()
-        {
-            this.InitializeComponent();
-            this.Suspending += OnSuspending;
-            this.Resuming += OnResuming;
-
-            _reactPage = new MainPage();
-        }
-
-        /// <summary>
-        /// Invoked when the application is launched normally by the end user.  Other entry points
-        /// will be used such as when the application is launched to open a specific file.
-        /// </summary>
-        /// <param name="e">Details about the launch request and process.</param>
-        protected override void OnLaunched(LaunchActivatedEventArgs e)
-        {
-            _reactPage.OnResume(Exit);
-
-#if DEBUG
-            if (System.Diagnostics.Debugger.IsAttached)
-            {
-                this.DebugSettings.EnableFrameRateCounter = true;
-            }
-
-            SystemNavigationManager.GetForCurrentView().AppViewBackButtonVisibility =
-                AppViewBackButtonVisibility.Visible;
-#endif
-
-            Frame rootFrame = Window.Current.Content as Frame;
-
-            // Do not repeat app initialization when the Window already has content,
-            // just ensure that the window is active
-            if (rootFrame == null)
-            {
-                _reactPage.OnCreate(e.Arguments);
-
-                // Create a Frame to act as the navigation context and navigate to the first page
-                rootFrame = new Frame();
-
-                rootFrame.NavigationFailed += OnNavigationFailed;
-
-                // Place the frame in the current Window
-                Window.Current.Content = rootFrame;
-            }
-
-            if (rootFrame.Content == null)
-            {
-                // When the navigation stack isn't restored navigate to the first page,
-                // configuring the new page by passing required information as a navigation
-                // parameter
-                rootFrame.Content = _reactPage;
-            }
-
-            // Ensure the current window is active
-            Window.Current.Activate();
-        }
-
-        /// <summary>
-        /// Invoked when Navigation to a certain page fails
-        /// </summary>
-        /// <param name="sender">The Frame which failed navigation</param>
-        /// <param name="e">Details about the navigation failure</param>
-        void OnNavigationFailed(object sender, NavigationFailedEventArgs e)
-        {
-            throw new Exception("Failed to load Page " + e.SourcePageType.FullName);
-        }
-
-        /// <summary>
-        /// Invoked when application execution is being suspended.  Application state is saved
-        /// without knowing whether the application will be terminated or resumed with the contents
-        /// of memory still intact.
-        /// </summary>
-        /// <param name="sender">The source of the suspend request.</param>
-        /// <param name="e">Details about the suspend request.</param>
-        private void OnSuspending(object sender, SuspendingEventArgs e)
-        {
-            _reactPage.OnSuspend();
-        }
-
-        /// <summary>
-        /// Invoked when application execution is being resumed.
-        /// </summary>
-        /// <param name="sender">The source of the resume request.</param>
-        /// <param name="e">Details about the resume request.</param>
-        private void OnResuming(object sender, object e)
-        {
-            _reactPage.OnResume(Exit);
-        }
-    }
-}
--- a/examples/basic/windows/VideoPlayer/AutolinkedNativeModules.g.cpp
+++ b/examples/basic/windows/VideoPlayer/AutolinkedNativeModules.g.cpp
@@ -0,0 +1,18 @@
+// AutolinkedNativeModules.g.cpp contents generated by "react-native autolink-windows"
+// clang-format off
+#include "pch.h"
+#include "AutolinkedNativeModules.g.h"
+
+// Includes from react-native-video
+#include <winrt/ReactNativeVideoCPP.h>
+
+namespace winrt::Microsoft::ReactNative
+{
+
+void RegisterAutolinkedNativeModulePackages(winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const& packageProviders)
+{ 
+    // IReactPackageProviders from react-native-video
+    packageProviders.Append(winrt::ReactNativeVideoCPP::ReactPackageProvider());
+}
+
+}
--- a/examples/basic/windows/VideoPlayer/AutolinkedNativeModules.g.h
+++ b/examples/basic/windows/VideoPlayer/AutolinkedNativeModules.g.h
@@ -0,0 +1,10 @@
+// AutolinkedNativeModules.g.h contents generated by "react-native autolink-windows"
+// clang-format off
+#pragma once
+
+namespace winrt::Microsoft::ReactNative
+{
+
+void RegisterAutolinkedNativeModulePackages(winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const& packageProviders);
+
+}
--- a/examples/basic/windows/VideoPlayer/AutolinkedNativeModules.g.props
+++ b/examples/basic/windows/VideoPlayer/AutolinkedNativeModules.g.props
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <!-- AutolinkedNativeModules.g.props contents generated by "react-native autolink-windows" -->
+  <PropertyGroup>
+  </PropertyGroup>
+</Project>
--- a/examples/basic/windows/VideoPlayer/AutolinkedNativeModules.g.targets
+++ b/examples/basic/windows/VideoPlayer/AutolinkedNativeModules.g.targets
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <!-- AutolinkedNativeModules.g.targets contents generated by "react-native autolink-windows" -->
+  <ItemGroup>
+    <!-- Projects from react-native-video -->
+    <ProjectReference Include="$(ProjectDir)..\..\node_modules\react-native-video\windows\ReactNativeVideoCPP\ReactNativeVideoCPP.vcxproj">
+      <Project>{0d1e54d3-4be1-4daf-98bf-124c28c85014}</Project>
+    </ProjectReference>
+  </ItemGroup>
+</Project>
--- a/examples/basic/windows/VideoPlayer/MainPage.cpp
+++ b/examples/basic/windows/VideoPlayer/MainPage.cpp
@@ -0,0 +1,20 @@
+#include "pch.h"
+#include "MainPage.h"
+#if __has_include("MainPage.g.cpp")
+#include "MainPage.g.cpp"
+#endif
+
+#include "App.h"
+
+using namespace winrt;
+using namespace Windows::UI::Xaml;
+
+namespace winrt::videoplayer::implementation
+{
+    MainPage::MainPage()
+    {
+        InitializeComponent();
+        auto app = Application::Current().as<App>();
+        ReactRootView().ReactNativeHost(app->Host());
+    }
+}
--- a/examples/basic/windows/VideoPlayer/MainPage.cs
+++ b/examples/basic/windows/VideoPlayer/MainPage.cs
@@ -1,55 +0,0 @@
-using ReactNative;
-using ReactNative.Modules.Core;
-using ReactNative.Shell;
-using ReactNativeVideo;
-using System.Collections.Generic;
-using Windows.UI.Xaml.Media.Imaging;
-
-namespace VideoPlayer
-{
-    class MainPage : ReactPage
-    {
-        public override string MainComponentName
-        {
-            get
-            {
-                return "VideoPlayer";
-            }
-        }
-
-#if BUNDLE
-        public override string JavaScriptBundleFile
-        {
-            get
-            {
-                return "ms-appx:///ReactAssets/index.windows.bundle";
-            }
-        }
-#endif
-
-        public override List<IReactPackage> Packages
-        {
-            get
-            {
-                return new List<IReactPackage>
-                {
-                    new MainReactPackage(),
-                    new ReactVideoPackage(),
-                };
-            }
-        }
-
-        public override bool UseDeveloperSupport
-        {
-            get
-            {
-#if !BUNDLE || DEBUG
-                return true;
-#else
-                return false;
-#endif
-            }
-        }
-    }
-
-}
--- a/examples/basic/windows/VideoPlayer/MainPage.h
+++ b/examples/basic/windows/VideoPlayer/MainPage.h
@@ -0,0 +1,19 @@
+#pragma once
+#include "MainPage.g.h"
+#include <winrt/Microsoft.ReactNative.h>
+
+namespace winrt::videoplayer::implementation
+{
+    struct MainPage : MainPageT<MainPage>
+    {
+        MainPage();
+    };
+}
+
+namespace winrt::videoplayer::factory_implementation
+{
+    struct MainPage : MainPageT<MainPage, implementation::MainPage>
+    {
+    };
+}
+
--- a/examples/basic/windows/VideoPlayer/MainPage.idl
+++ b/examples/basic/windows/VideoPlayer/MainPage.idl
@@ -0,0 +1,8 @@
+namespace videoplayer
+{
+    [default_interface]
+    runtimeclass MainPage : Windows.UI.Xaml.Controls.Page
+    {
+        MainPage();
+    }
+}
--- a/examples/basic/windows/VideoPlayer/MainPage.xaml
+++ b/examples/basic/windows/VideoPlayer/MainPage.xaml
@@ -0,0 +1,16 @@
+<Page
+    x:Class="videoplayer.MainPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:videoplayer"
+    xmlns:react="using:Microsoft.ReactNative"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d"
+    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+    <react:ReactRootView 
+        x:Name="ReactRootView"
+        ComponentName="VideoPlayer"
+        Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
+        MinHeight="400"/>
+</Page>
--- a/examples/basic/windows/VideoPlayer/Package.appxmanifest
+++ b/examples/basic/windows/VideoPlayer/Package.appxmanifest
@@ -1,49 +1,50 @@
-<?xml version="1.0" encoding="utf-8"?>
-
-<Package
-  xmlns="http://schemas.microsoft.com/appx/manifest/foundation/windows10"
-  xmlns:mp="http://schemas.microsoft.com/appx/2014/phone/manifest"
-  xmlns:uap="http://schemas.microsoft.com/appx/manifest/uap/windows10"
-  IgnorableNamespaces="uap mp">
-
-  <Identity
-    Name="176c1514-b49e-4277-ad47-c17d9b8f034b"
-    Publisher="CN=publisher"
-    Version="1.0.0.0" />
-
-  <mp:PhoneIdentity PhoneProductId="176c1514-b49e-4277-ad47-c17d9b8f034b" PhonePublisherId="00000000-0000-0000-0000-000000000000"/>
-
-  <Properties>
-    <DisplayName>VideoPlayer</DisplayName>
-    <PublisherDisplayName>React Native for UWP</PublisherDisplayName>
-    <Logo>Assets\StoreLogo.png</Logo>
-  </Properties>
-
-  <Dependencies>
-    <TargetDeviceFamily Name="Windows.Universal" MinVersion="10.0.0.0" MaxVersionTested="10.0.0.0" />
-  </Dependencies>
-
-  <Resources>
-    <Resource Language="x-generate"/>
-  </Resources>
-
-  <Applications>
-    <Application Id="App"
-      Executable="$targetnametoken$.exe"
-      EntryPoint="VideoPlayer.App">
-      <uap:VisualElements
-        DisplayName="VideoPlayer"
-        Square150x150Logo="Assets\Square150x150Logo.png"
-        Square44x44Logo="Assets\Square44x44Logo.png"
-        Description="VideoPlayer"
-        BackgroundColor="transparent">
-        <uap:DefaultTile Wide310x150Logo="Assets\Wide310x150Logo.png"/>
-        <uap:SplashScreen Image="Assets\SplashScreen.png" />
-      </uap:VisualElements>
-    </Application>
-  </Applications>
-
-  <Capabilities>
-    <Capability Name="internetClient" />
-  </Capabilities>
+<?xml version="1.0" encoding="utf-8"?>
+
+<Package
+  xmlns="http://schemas.microsoft.com/appx/manifest/foundation/windows10"
+  xmlns:mp="http://schemas.microsoft.com/appx/2014/phone/manifest"
+  xmlns:uap="http://schemas.microsoft.com/appx/manifest/uap/windows10"
+  IgnorableNamespaces="uap mp">
+
+  <Identity
+    Name="03e5ea38-79e9-4edf-b08f-ceebd0c5aaff"
+    Publisher="CN=nickf"
+    Version="1.0.0.0" />
+
+  <mp:PhoneIdentity PhoneProductId="03e5ea38-79e9-4edf-b08f-ceebd0c5aaff" PhonePublisherId="00000000-0000-0000-0000-000000000000"/>
+
+  <Properties>
+    <DisplayName>videoplayer</DisplayName>
+    <PublisherDisplayName>nickf</PublisherDisplayName>
+    <Logo>Assets\StoreLogo.png</Logo>
+  </Properties>
+
+  <Dependencies>
+    <TargetDeviceFamily Name="Windows.Universal" MinVersion="10.0.0.0" MaxVersionTested="10.0.0.0" />
+  </Dependencies>
+
+  <Resources>
+    <Resource Language="x-generate"/>
+  </Resources>
+
+  <Applications>
+    <Application
+      Id="App"
+      Executable="$targetnametoken$.exe"
+      EntryPoint="videoplayer.App">
+      <uap:VisualElements
+        DisplayName="videoplayer"
+        Square150x150Logo="Assets\Square150x150Logo.png"
+        Square44x44Logo="Assets\Square44x44Logo.png"
+        Description="videoplayer"
+        BackgroundColor="transparent">
+        <uap:DefaultTile Wide310x150Logo="Assets\Wide310x150Logo.png"/>
+        <uap:SplashScreen Image="Assets\SplashScreen.png" />
+      </uap:VisualElements>
+    </Application>
+  </Applications>
+
+  <Capabilities>
+    <Capability Name="internetClient" />
+  </Capabilities>
 </Package>
--- a/examples/basic/windows/VideoPlayer/Properties/AssemblyInfo.cs
+++ b/examples/basic/windows/VideoPlayer/Properties/AssemblyInfo.cs
@@ -1,29 +0,0 @@
-using System.Reflection;
-using System.Runtime.CompilerServices;
-using System.Runtime.InteropServices;
-
-// General Information about an assembly is controlled through the following 
-// set of attributes. Change these attribute values to modify the information
-// associated with an assembly.
-[assembly: AssemblyTitle("VideoPlayer")]
-[assembly: AssemblyDescription("")]
-[assembly: AssemblyConfiguration("")]
-[assembly: AssemblyCompany("")]
-[assembly: AssemblyProduct("VideoPlayer")]
-[assembly: AssemblyCopyright("Copyright ©  2016")]
-[assembly: AssemblyTrademark("")]
-[assembly: AssemblyCulture("")]
-
-// Version information for an assembly consists of the following four values:
-//
-//      Major Version
-//      Minor Version 
-//      Build Number
-//      Revision
-//
-// You can specify all the values or you can default the Build and Revision Numbers 
-// by using the '*' as shown below:
-// [assembly: AssemblyVersion("1.0.*")]
-[assembly: AssemblyVersion("1.0.0.0")]
-[assembly: AssemblyFileVersion("1.0.0.0")]
-[assembly: ComVisible(false)]
--- a/examples/basic/windows/VideoPlayer/Properties/Default.rd.xml
+++ b/examples/basic/windows/VideoPlayer/Properties/Default.rd.xml
@@ -1,31 +0,0 @@
-<!--
-    This file contains Runtime Directives used by .NET Native. The defaults here are suitable for most
-    developers. However, you can modify these parameters to modify the behavior of the .NET Native
-    optimizer.
-
-    Runtime Directives are documented at http://go.microsoft.com/fwlink/?LinkID=391919
-
-    To fully enable reflection for VideoPlayer.MyClass and all of its public/private members
-    <Type Name="VideoPlayer.MyClass" Dynamic="Required All"/>
-
-    To enable dynamic creation of the specific instantiation of AppClass<T> over System.Int32
-    <TypeInstantiation Name="VideoPlayer.AppClass" Arguments="System.Int32" Activate="Required Public" />
-
-    Using the Namespace directive to apply reflection policy to all the types in a particular namespace
-    <Namespace Name="DataClasses.ViewModels" Seralize="All" />
-->
-
-<Directives xmlns="http://schemas.microsoft.com/netfx/2013/01/metadata">
-  <Application>
-    <!--
-      An Assembly element with Name="*Application*" applies to all assemblies in
-      the application package. The asterisks are not wildcards.
-    -->
-    <Assembly Name="*Application*" Dynamic="Required All" />
-    
-    
-    <!-- Add your application specific runtime directives here. -->
-
-
-  </Application>
-</Directives>
--- a/examples/basic/windows/VideoPlayer/PropertySheet.props
+++ b/examples/basic/windows/VideoPlayer/PropertySheet.props
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project ToolsVersion="4.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <ImportGroup Label="PropertySheets" />
+  <PropertyGroup Label="UserMacros" />
+  <!--
+    To customize common C++/WinRT project properties: 
+    * right-click the project node
+    * expand the Common Properties item
+    * select the C++/WinRT property page
+
+    For more advanced scenarios, and complete documentation, please see:
+    https://github.com/Microsoft/xlang/tree/master/src/package/cppwinrt/nuget 
+    -->
+  <PropertyGroup />
+  <ItemDefinitionGroup />
+</Project>
--- a/examples/basic/windows/VideoPlayer/ReactPackageProvider.cpp
+++ b/examples/basic/windows/VideoPlayer/ReactPackageProvider.cpp
@@ -0,0 +1,15 @@
+#include "pch.h"
+#include "ReactPackageProvider.h"
+#include "NativeModules.h"
+
+using namespace winrt::Microsoft::ReactNative;
+
+namespace winrt::videoplayer::implementation
+{
+
+void ReactPackageProvider::CreatePackage(IReactPackageBuilder const &packageBuilder) noexcept
+{
+    AddAttributedModules(packageBuilder);
+}
+
+} // namespace winrt::videoplayer::implementation
--- a/examples/basic/windows/VideoPlayer/ReactPackageProvider.h
+++ b/examples/basic/windows/VideoPlayer/ReactPackageProvider.h
@@ -0,0 +1,13 @@
+#pragma once
+
+#include "winrt/Microsoft.ReactNative.h"
+
+namespace winrt::videoplayer::implementation
+{
+    struct ReactPackageProvider : winrt::implements<ReactPackageProvider, winrt::Microsoft::ReactNative::IReactPackageProvider>
+    {
+    public: // IReactPackageProvider
+        void CreatePackage(winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder) noexcept;
+    };
+} // namespace winrt::videoplayer::implementation
+
--- a/examples/basic/windows/VideoPlayer/VideoPlayer.csproj
+++ b/examples/basic/windows/VideoPlayer/VideoPlayer.csproj
@@ -1,230 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<Project ToolsVersion="14.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
-  <Import Project="$(MSBuildExtensionsPath)\$(MSBuildToolsVersion)\Microsoft.Common.props" Condition="Exists('$(MSBuildExtensionsPath)\$(MSBuildToolsVersion)\Microsoft.Common.props')" />
-  <PropertyGroup>
-    <Configuration Condition=" '$(Configuration)' == '' ">Debug</Configuration>
-    <Platform Condition=" '$(Platform)' == '' ">x86</Platform>
-    <ProjectGuid>{A027BE54-D118-49A4-8D84-0666A2A93E64}</ProjectGuid>
-    <OutputType>AppContainerExe</OutputType>
-    <AppDesignerFolder>Properties</AppDesignerFolder>
-    <RootNamespace>VideoPlayer</RootNamespace>
-    <AssemblyName>VideoPlayer</AssemblyName>
-    <DefaultLanguage>en-US</DefaultLanguage>
-    <TargetPlatformIdentifier>UAP</TargetPlatformIdentifier>
-    <TargetPlatformVersion>10.0.14393.0</TargetPlatformVersion>
-    <TargetPlatformMinVersion>10.0.10586.0</TargetPlatformMinVersion>
-    <MinimumVisualStudioVersion>14</MinimumVisualStudioVersion>
-    <FileAlignment>512</FileAlignment>
-    <ProjectTypeGuids>{A5A43C5B-DE2A-4C0C-9213-0A381AF9435A};{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}</ProjectTypeGuids>
-    <PackageCertificateKeyFile>VideoPlayer_TemporaryKey.pfx</PackageCertificateKeyFile>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'Debug|x86'">
-    <DebugSymbols>true</DebugSymbols>
-    <OutputPath>bin\x86\Debug\</OutputPath>
-    <DefineConstants>DEBUG;TRACE;NETFX_CORE;WINDOWS_UWP</DefineConstants>
-    <NoWarn>;2008</NoWarn>
-    <DebugType>full</DebugType>
-    <PlatformTarget>x86</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <Prefer32Bit>true</Prefer32Bit>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'DebugBundle|x86'">
-    <DebugSymbols>true</DebugSymbols>
-    <OutputPath>bin\x86\DebugBundle\</OutputPath>
-    <DefineConstants>DEBUG;TRACE;NETFX_CORE;WINDOWS_UWP;CODE_ANALYSIS;BUNDLE</DefineConstants>
-    <NoWarn>;2008</NoWarn>
-    <NoStdLib>true</NoStdLib>
-    <DebugType>full</DebugType>
-    <PlatformTarget>x86</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <CodeAnalysisRuleSet>MinimumRecommendedRules.ruleset</CodeAnalysisRuleSet>
-    <Prefer32Bit>true</Prefer32Bit>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'Release|x86'">
-    <OutputPath>bin\x86\Release\</OutputPath>
-    <DefineConstants>TRACE;NETFX_CORE;WINDOWS_UWP</DefineConstants>
-    <Optimize>true</Optimize>
-    <NoWarn>;2008</NoWarn>
-    <DebugType>pdbonly</DebugType>
-    <PlatformTarget>x86</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <Prefer32Bit>true</Prefer32Bit>
-    <UseDotNetNativeToolchain>true</UseDotNetNativeToolchain>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'ReleaseBundle|x86'">
-    <OutputPath>bin\x86\ReleaseBundle\</OutputPath>
-    <DefineConstants>TRACE;NETFX_CORE;WINDOWS_UWP;CODE_ANALYSIS;BUNDLE</DefineConstants>
-    <Optimize>true</Optimize>
-    <NoWarn>;2008</NoWarn>
-    <NoStdLib>true</NoStdLib>
-    <DebugType>pdbonly</DebugType>
-    <PlatformTarget>x86</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <CodeAnalysisRuleSet>MinimumRecommendedRules.ruleset</CodeAnalysisRuleSet>
-    <Prefer32Bit>true</Prefer32Bit>
-    <UseDotNetNativeToolchain>true</UseDotNetNativeToolchain>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'Debug|ARM'">
-    <DebugSymbols>true</DebugSymbols>
-    <OutputPath>bin\ARM\Debug\</OutputPath>
-    <DefineConstants>DEBUG;TRACE;NETFX_CORE;WINDOWS_UWP</DefineConstants>
-    <NoWarn>;2008</NoWarn>
-    <DebugType>full</DebugType>
-    <PlatformTarget>ARM</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <Prefer32Bit>true</Prefer32Bit>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'DebugBundle|ARM'">
-    <DebugSymbols>true</DebugSymbols>
-    <OutputPath>bin\ARM\DebugBundle\</OutputPath>
-    <DefineConstants>DEBUG;TRACE;NETFX_CORE;WINDOWS_UWP;CODE_ANALYSIS;BUNDLE</DefineConstants>
-    <NoWarn>;2008</NoWarn>
-    <NoStdLib>true</NoStdLib>
-    <DebugType>full</DebugType>
-    <PlatformTarget>ARM</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <CodeAnalysisRuleSet>MinimumRecommendedRules.ruleset</CodeAnalysisRuleSet>
-    <Prefer32Bit>true</Prefer32Bit>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'Release|ARM'">
-    <OutputPath>bin\ARM\Release\</OutputPath>
-    <DefineConstants>TRACE;NETFX_CORE;WINDOWS_UWP</DefineConstants>
-    <Optimize>true</Optimize>
-    <NoWarn>;2008</NoWarn>
-    <DebugType>pdbonly</DebugType>
-    <PlatformTarget>ARM</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <Prefer32Bit>true</Prefer32Bit>
-    <UseDotNetNativeToolchain>true</UseDotNetNativeToolchain>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'ReleaseBundle|ARM'">
-    <OutputPath>bin\ARM\ReleaseBundle\</OutputPath>
-    <DefineConstants>TRACE;NETFX_CORE;WINDOWS_UWP;CODE_ANALYSIS;BUNDLE</DefineConstants>
-    <Optimize>true</Optimize>
-    <NoWarn>;2008</NoWarn>
-    <NoStdLib>true</NoStdLib>
-    <DebugType>pdbonly</DebugType>
-    <PlatformTarget>ARM</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <CodeAnalysisRuleSet>MinimumRecommendedRules.ruleset</CodeAnalysisRuleSet>
-    <Prefer32Bit>true</Prefer32Bit>
-    <UseDotNetNativeToolchain>true</UseDotNetNativeToolchain>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'Debug|x64'">
-    <DebugSymbols>true</DebugSymbols>
-    <OutputPath>bin\x64\Debug\</OutputPath>
-    <DefineConstants>DEBUG;TRACE;NETFX_CORE;WINDOWS_UWP</DefineConstants>
-    <NoWarn>;2008</NoWarn>
-    <DebugType>full</DebugType>
-    <PlatformTarget>x64</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <Prefer32Bit>true</Prefer32Bit>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'DebugBundle|x64'">
-    <DebugSymbols>true</DebugSymbols>
-    <OutputPath>bin\x64\DebugBundle\</OutputPath>
-    <DefineConstants>DEBUG;TRACE;NETFX_CORE;WINDOWS_UWP;CODE_ANALYSIS;BUNDLE</DefineConstants>
-    <NoWarn>;2008</NoWarn>
-    <NoStdLib>true</NoStdLib>
-    <DebugType>full</DebugType>
-    <PlatformTarget>x64</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <CodeAnalysisRuleSet>MinimumRecommendedRules.ruleset</CodeAnalysisRuleSet>
-    <Prefer32Bit>true</Prefer32Bit>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'Release|x64'">
-    <OutputPath>bin\x64\Release\</OutputPath>
-    <DefineConstants>TRACE;NETFX_CORE;WINDOWS_UWP</DefineConstants>
-    <Optimize>true</Optimize>
-    <NoWarn>;2008</NoWarn>
-    <DebugType>pdbonly</DebugType>
-    <PlatformTarget>x64</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <Prefer32Bit>true</Prefer32Bit>
-    <UseDotNetNativeToolchain>true</UseDotNetNativeToolchain>
-  </PropertyGroup>
-  <PropertyGroup Condition="'$(Configuration)|$(Platform)' == 'ReleaseBundle|x64'">
-    <OutputPath>bin\x64\ReleaseBundle\</OutputPath>
-    <DefineConstants>TRACE;NETFX_CORE;WINDOWS_UWP;CODE_ANALYSIS;BUNDLE</DefineConstants>
-    <Optimize>true</Optimize>
-    <NoWarn>;2008</NoWarn>
-    <NoStdLib>true</NoStdLib>
-    <DebugType>pdbonly</DebugType>
-    <PlatformTarget>x64</PlatformTarget>
-    <UseVSHostingProcess>false</UseVSHostingProcess>
-    <ErrorReport>prompt</ErrorReport>
-    <CodeAnalysisRuleSet>MinimumRecommendedRules.ruleset</CodeAnalysisRuleSet>
-    <Prefer32Bit>true</Prefer32Bit>
-    <UseDotNetNativeToolchain>true</UseDotNetNativeToolchain>
-  </PropertyGroup>
-  <ItemGroup>
-    <!-- A reference to the entire .Net Framework and Windows SDK are automatically included -->
-    <None Include="project.json" />
-  </ItemGroup>
-  <ItemGroup>
-    <Compile Include="App.xaml.cs">
-      <DependentUpon>App.xaml</DependentUpon>
-    </Compile>
-    <Compile Include="MainPage.cs" />
-    <Compile Include="Properties\AssemblyInfo.cs" />
-  </ItemGroup>
-  <ItemGroup>
-    <AppxManifest Include="Package.appxmanifest">
-      <SubType>Designer</SubType>
-    </AppxManifest>
-    <None Include="VideoPlayer_TemporaryKey.pfx" />
-  </ItemGroup>
-  <ItemGroup>
-    <Content Include="Properties\Default.rd.xml" />
-    <Content Include="Assets\LockScreenLogo.scale-200.png" />
-    <Content Include="Assets\SplashScreen.scale-200.png" />
-    <Content Include="Assets\Square150x150Logo.scale-200.png" />
-    <Content Include="Assets\Square44x44Logo.scale-200.png" />
-    <Content Include="Assets\Square44x44Logo.targetsize-24_altform-unplated.png" />
-    <Content Include="Assets\StoreLogo.png" />
-    <Content Include="Assets\Wide310x150Logo.scale-200.png" />
-  </ItemGroup>
-  <ItemGroup>
-    <ApplicationDefinition Include="App.xaml">
-      <Generator>MSBuild:Compile</Generator>
-      <SubType>Designer</SubType>
-    </ApplicationDefinition>
-  </ItemGroup>
-  <ItemGroup>
-    <ProjectReference Include="..\..\node_modules\react-native-video\windows\ReactNativeVideo\ReactNativeVideo.csproj">
-      <Project>{e8f5f57f-757e-4237-ad23-f7a8755427cd}</Project>
-      <Name>ReactNativeVideo</Name>
-    </ProjectReference>
-    <ProjectReference Include="..\..\node_modules\react-native-windows\ReactWindows\ReactNative\ReactNative.csproj">
-      <Project>{c7673ad5-e3aa-468c-a5fd-fa38154e205c}</Project>
-      <Name>ReactNative</Name>
-    </ProjectReference>
-  </ItemGroup>
-  <ItemGroup Condition="'$(Configuration)' == 'ReleaseBundle' or '$(Configuration)' == 'DebugBundle'">
-    <Content Include="ReactAssets\**\*">
-      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
-    </Content>
-  </ItemGroup>
-  <PropertyGroup Condition=" '$(VisualStudioVersion)' == '' or '$(VisualStudioVersion)' &lt; '14.0' ">
-    <VisualStudioVersion>14.0</VisualStudioVersion>
-  </PropertyGroup>
-  <Import Project="$(MSBuildExtensionsPath)\Microsoft\WindowsXaml\v$(VisualStudioVersion)\Microsoft.Windows.UI.Xaml.CSharp.targets" />
-  <!-- To modify your build process, add your task inside one of the targets below and uncomment it.
-       Other similar extension points exist, see Microsoft.Common.targets.
-  <Target Name="BeforeBuild">
-  </Target>
-  <Target Name="AfterBuild">
-  </Target>
-  -->
-</Project>
--- a/examples/basic/windows/VideoPlayer/VideoPlayer_TemporaryKey.pfx
+++ b/examples/basic/windows/VideoPlayer/VideoPlayer_TemporaryKey.pfx
--- a/examples/basic/windows/VideoPlayer/packages.config
+++ b/examples/basic/windows/VideoPlayer/packages.config
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<packages>
+  <package id="Microsoft.Windows.CppWinRT" version="2.0.200615.7" targetFramework="native" />
+  <package id="Microsoft.UI.Xaml" version="2.3.191129002" targetFramework="native" />
+</packages>
--- a/examples/basic/windows/VideoPlayer/pch.cpp
+++ b/examples/basic/windows/VideoPlayer/pch.cpp
@@ -0,0 +1 @@
+#include "pch.h"
--- a/Show More
+++ b/Show More