bitmovin-player-react-native 0.2.0 → 0.3.0

package/README.md

@@ -3,23 +3,42 @@
 Official React Native bindings for Bitmovin's mobile Player SDKs.
 
 [![npm](https://img.shields.io/npm/v/bitmovin-player-react-native)](https://www.npmjs.com/package/bitmovin-player-react-native)
-![Supports Android and iOS](https://img.shields.io/badge/platforms-android%20%7C%20ios-lightgrey.svg)
+![Platforms](https://img.shields.io/badge/platforms-iOS%20%7C%20tvOS%20%7C%20Android%20%7C%20Android%20TV-lightgrey.svg)
 [![MIT License](https://img.shields.io/badge/license-MIT-brightgreen.svg)](LICENSE)
 [![Bitmovin Community](https://img.shields.io/discourse/users?label=community&server=https%3A%2F%2Fcommunity.bitmovin.com)](https://community.bitmovin.com/?utm_source=github&utm_medium=bitmovin-player-react-native&utm_campaign=dev-community)
 
-> :warning: **Beta Version**: The library is under active development.
-
-- [Installation](#installation)
-  - [Add package dependency](#add-package-dependency)
-  - [Setup iOS Player SDK](#setup-ios-player-sdk)
-  - [Setup Android Player SDK](#setup-android-player-sdk)
-- [Getting Started](#getting-started)
-  - [Setting up a license key](#setting-up-a-license-key)
-  - [Accessing native `Player` instances](#accessing-native-player-instances)
-  - [Listening to events](#listening-to-events)
-  - [Enabling DRM protection](#enabling-drm-protection)
-  - [Adding external subtitle tracks](#adding-subtitle-tracks)
-- [Contributing](#contributing)
+> The library is under active development.
+
+- [Bitmovin Player React Native](#bitmovin-player-react-native)
+  - [Platform Support](#platform-support)
+  - [Installation](#installation)
+    - [Add package dependency](#add-package-dependency)
+    - [Setup iOS Player SDK](#setup-ios-player-sdk)
+    - [Setup Android Player SDK](#setup-android-player-sdk)
+  - [Getting Started](#getting-started)
+    - [Setting up a license key](#setting-up-a-license-key)
+      - [Configuring through code](#configuring-through-code)
+    - [Setting up a playback configurations](#setting-up-a-playback-configurations)
+      - [Configuring `Info.plist`](#configuring-infoplist)
+      - [Configuring `AndroidManifest.xml`](#configuring-androidmanifestxml)
+    - [Accessing native `Player` instances](#accessing-native-player-instances)
+    - [Listening to events](#listening-to-events)
+    - [Enabling DRM protection](#enabling-drm-protection)
+      - [Prepare hooks](#prepare-hooks)
+    - [Adding external subtitle tracks](#adding-external-subtitle-tracks)
+  - [Contributing](#contributing)
+
+## Platform Support
+
+This library requires at least React Native 0.64+ and React 17+ to work properly. The currently supported platforms are:
+
+- iOS 12.0+
+- tvOS 12.0+
+- Android API 16+
+- Android TV API 17+
+- Fire TV (just make sure the Android API level is at least 17+)
+
+Please note that browsers and other browser-like environments such as webOS and Tizen are not supported.
 
 ## Installation
 
@@ -200,6 +219,42 @@ const player = new Player({
 });
 ```
 
+### Setting up a playback configurations
+
+If needed, the default player behavior can be configured through the `playbackConfig` key when initialized.
+
+```typescript
+// Simply pass the `playbackConfig` property to `PlayerConfig` when instantiating a player.
+
+// With hooks
+import { usePlayer } from 'bitmovin-player-react-native';
+const player = usePlayer({
+  playbackConfig: {
+    // Specifies whether the playback starts immediately after loading a source or not. Default is false.
+    isAutoplayEnabled: true,
+    // Specifies if playback starts muted. Default is false.
+    isMuted: true,
+    // Specifies if time shift for live streams should be enabled. Default is true.
+    isTimeShiftEnabled: true,
+    // Whether background playback is enabled or not. Default is false.
+    // Only available for iOS.
+    isBackgroundPlaybackEnabled: true,
+  },
+});
+
+// Without hooks
+import { Player } from 'bitmovin-player-react-native';
+const player = new Player({
+  // Make sure to use React.createRef if instantiating inside a component.
+  playbackConfig: {
+    isAutoplayEnabled: true,
+    isMuted: true,
+    isTimeShiftEnabled: true,
+    isBackgroundPlaybackEnabled: true,
+  },
+});
+```
+
 #### Configuring `Info.plist`
 
 Add the following lines to the `<dict>` section of your `ios/Info.plist`:

package/RNBitmovinPlayer.podspec

@@ -10,7 +10,7 @@ Pod::Spec.new do |s|
   s.license      = package["license"]
   s.authors      = package["author"]
 
-  s.platforms    = { :ios => "12.4" }
+  s.platforms    = { :ios => "12.4", :tvos => "12.4" }
   s.source       = {
     :git => "https://github.com/bitmovin/bitmovin-player-react-native.git",
     :tag => "v#{s.version}"
@@ -19,5 +19,5 @@ Pod::Spec.new do |s|
   s.source_files = "ios/**/*.{h,m,mm,swift}"
 
   s.dependency "React-Core"
-  s.dependency "BitmovinPlayer", "3.23.0"
+  s.dependency "BitmovinPlayer", "3.28.0"
 end

package/android/build.gradle

@@ -50,6 +50,6 @@ android {
 
 dependencies {
     implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk8:$kotlinVersion"
-    implementation 'com.bitmovin.player:player:3.20.0'
+    implementation 'com.bitmovin.player:player:3.24.2'
     implementation 'com.facebook.react:react-native:+'
 }

package/android/src/main/java/com/bitmovin/player/reactnative/converter/JsonConverter.kt

@@ -1,5 +1,6 @@
 package com.bitmovin.player.reactnative.converter
 
+import com.bitmovin.player.api.PlaybackConfig
 import com.bitmovin.player.api.PlayerConfig
 import com.bitmovin.player.api.drm.WidevineConfig
 import com.bitmovin.player.api.event.PlayerEvent
@@ -25,10 +26,25 @@ class JsonConverter {
          */
         @JvmStatic
         fun toPlayerConfig(json: ReadableMap?): PlayerConfig {
-            if (json != null && json.hasKey("licenseKey")) {
-                return PlayerConfig(key = json.getString("licenseKey"))
+            if (json == null) return PlayerConfig()
+            val playerConfig = if (json.hasKey("licenseKey")) {
+                PlayerConfig(key = json.getString("licenseKey"))
+            } else {
+                PlayerConfig()
+            }
+            if (json.hasKey("playbackConfig")) {
+                var playbackConfigJson = json.getMap("playbackConfig")
+                if (playbackConfigJson?.hasKey("isAutoplayEnabled") == true) {
+                    playerConfig.playbackConfig.isAutoplayEnabled = playbackConfigJson.getBoolean("isAutoplayEnabled")
+                }
+                if(playbackConfigJson?.hasKey("isMuted") == true) {
+                    playerConfig.playbackConfig.isMuted = playbackConfigJson.getBoolean("isMuted")
+                }
+                if(playbackConfigJson?.hasKey("isTimeShiftEnabled") == true) {
+                    playerConfig.playbackConfig.isTimeShiftEnabled = playbackConfigJson.getBoolean("isTimeShiftEnabled")
+                }
             }
-            return PlayerConfig()
+            return playerConfig
         }
 
         /**

package/ios/RCTConvert+BitmovinPlayer.swift

@@ -15,6 +15,23 @@ extension RCTConvert {
         if let licenseKey = json["licenseKey"] as? String {
             playerConfig.key = licenseKey
         }
+        if let playbackConfig = json["playbackConfig"] as? [String: Any?] {
+            if let isAutoplayEnabled = playbackConfig["isAutoplayEnabled"] as? Bool {
+                playerConfig.playbackConfig.isAutoplayEnabled = isAutoplayEnabled
+            }
+            if let isMuted = playbackConfig["isMuted"] as? Bool {
+                playerConfig.playbackConfig.isMuted = isMuted
+            }
+            if let isTimeShiftEnabled = playbackConfig["isTimeShiftEnabled"] as? Bool {
+                playerConfig.playbackConfig.isTimeShiftEnabled = isTimeShiftEnabled
+            }
+            if let isBackgroundPlaybackEnabled = playbackConfig["isBackgroundPlaybackEnabled"] as? Bool {
+                playerConfig.playbackConfig.isBackgroundPlaybackEnabled = isBackgroundPlaybackEnabled
+            }
+            if let isPictureInPictureEnabled = playbackConfig["isPictureInPictureEnabled"] as? Bool {
+                playerConfig.playbackConfig.isPictureInPictureEnabled = isPictureInPictureEnabled
+            }
+        }
         return playerConfig
     }
 

package/lib/index.d.ts

@@ -570,7 +570,7 @@ declare class Drm extends NativeInstance<DrmConfig> {
      * @param message - Base64 encoded message data.
      * @param assetId - Optional asset ID. Only sent by iOS.
      */
-    onPrepareMessage: (message: string, assetId?: string | undefined) => void;
+    onPrepareMessage: (message: string, assetId?: string) => void;
     /**
      * iOS only.
      *
@@ -763,6 +763,86 @@ interface PlayerConfig extends NativeInstanceConfig {
      * ```
      */
     licenseKey?: string;
+    /**
+     * Configures playback behaviour. A default PlaybackConfig is set initially.
+     */
+    playbackConfig?: PlaybackConfig;
+}
+/**
+ * Configures the playback behaviour of the player.
+ */
+interface PlaybackConfig {
+    /**
+     * Whether the player starts playing automatically after loading a source or not. Default is `false`.
+     * @example
+     * ```
+     * const player = new Player({
+     *   playbackConfig: {
+     *     isAutoplayEnabled: true,
+     *   },
+     * });
+     * ```
+     */
+    isAutoplayEnabled?: boolean;
+    /**
+     * Whether the sound is muted on startup or not. Default value is `false`.
+     * @example
+     * ```
+     * const player = new Player({
+     *   playbackConfig: {
+     *     isMuted: true,
+     *   },
+     * });
+     * ```
+     */
+    isMuted?: boolean;
+    /**
+     * Whether time shift / DVR for live streams is enabled or not. Default is `true`.
+     *  @example
+     * ```
+     * const player = new Player({
+     *   playbackConfig: {
+     *     isTimeShiftEnabled: false,
+     *   },
+     * });
+     * ```
+     */
+    isTimeShiftEnabled?: boolean;
+    /**
+     * Whether background playback is enabled or not.
+     * Default is `false`.
+     *
+     * When set to `true`, playback is not automatically paused
+     * anymore when the app moves to the background.
+     * When set to `true`, also make sure to properly configure your app to allow
+     * background playback.
+     *
+     * On tvOS, background playback is only supported for audio-only content.
+     *
+     * Default is `false`.
+     *
+     *  @example
+     * ```
+     * const player = new Player({
+     *   {
+     *     isBackgroundPlaybackEnabled: true,
+     *   }
+     * })
+     * ```
+     */
+    isBackgroundPlaybackEnabled?: boolean;
+    /**
+     * Whether the picture-in-picture mode option is enabled for iOS or not. Default is `false`.
+     *  @example
+     * ```
+     * const player = new Player({
+     *   playbackConfig: {
+     *     isPictureInPictureEnabled: true,
+     *   },
+     * });
+     * ```
+     */
+    isPictureInPictureEnabled?: boolean;
 }
 /**
  * Loads, controls and renders audio and video content represented through `Source`s. A player
@@ -850,7 +930,7 @@ declare class Player extends NativeInstance<PlayerConfig> {
      *
      * @param mode - The time mode to specify: an absolute UNIX timestamp ('absolute') or relative time ('relative').
      */
-    getCurrentTime: (mode?: "relative" | "absolute" | undefined) => Promise<number>;
+    getCurrentTime: (mode?: 'relative' | 'absolute') => Promise<number>;
     /**
      * @returns The total duration in seconds of the current video or INFINITY if it’s a live stream.
      */
@@ -918,4 +998,4 @@ declare function PlayerView(props: PlayerViewProps): JSX.Element;
  */
 declare function usePlayer(config?: PlayerConfig): Player;
 
-export { BasePlayerViewProps, DestroyEvent, Drm, DrmConfig, ErrorEvent, Event, EventSource, FairplayConfig, LoadingState, MutedEvent, PausedEvent, PlayEvent, PlaybackFinishedEvent, Player, PlayerActiveEvent, PlayerConfig, PlayerErrorEvent, PlayerView, PlayerViewProps, PlayerWarningEvent, PlayingEvent, ReadyEvent, SeekEvent, SeekedEvent, SideLoadedSubtitleTrack, Source, SourceConfig, SourceErrorEvent, SourceLoadEvent, SourceLoadedEvent, SourceType, SourceUnloadedEvent, SourceWarningEvent, SubtitleAddedEvent, SubtitleChangedEvent, SubtitleFormat, SubtitleRemovedEvent, SubtitleTrack, TimeChangedEvent, UnmutedEvent, WidevineConfig, usePlayer };
+export { BasePlayerViewProps, DestroyEvent, Drm, DrmConfig, ErrorEvent, Event, EventSource, FairplayConfig, LoadingState, MutedEvent, PausedEvent, PlayEvent, PlaybackConfig, PlaybackFinishedEvent, Player, PlayerActiveEvent, PlayerConfig, PlayerErrorEvent, PlayerView, PlayerViewProps, PlayerWarningEvent, PlayingEvent, ReadyEvent, SeekEvent, SeekedEvent, SideLoadedSubtitleTrack, Source, SourceConfig, SourceErrorEvent, SourceLoadEvent, SourceLoadedEvent, SourceType, SourceUnloadedEvent, SourceWarningEvent, SubtitleAddedEvent, SubtitleChangedEvent, SubtitleFormat, SubtitleRemovedEvent, SubtitleTrack, TimeChangedEvent, UnmutedEvent, WidevineConfig, usePlayer };

package/lib/index.js

@@ -18,7 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
@@ -55,12 +58,15 @@ function unwrapNativeEvent(event) {
   return (0, import_lodash.default)(event.nativeEvent, ["target"]);
 }
 function useProxy(viewRef) {
-  return (0, import_react.useCallback)((callback) => (event) => {
-    const node = event.target._nativeTag;
-    if (node === (0, import_react_native2.findNodeHandle)(viewRef.current)) {
-      callback?.(unwrapNativeEvent(event));
-    }
-  }, [viewRef]);
+  return (0, import_react.useCallback)(
+    (callback) => (event) => {
+      const node = event.target._nativeTag;
+      if (node === (0, import_react_native2.findNodeHandle)(viewRef.current)) {
+        callback?.(unwrapNativeEvent(event));
+      }
+    },
+    [viewRef]
+  );
 }
 
 // src/components/PlayerView/index.tsx
@@ -71,10 +77,14 @@ var styles = import_react_native3.StyleSheet.create({
 });
 function dispatch(command, node, playerId) {
   const commandId = import_react_native3.Platform.OS === "android" ? import_react_native3.UIManager.NativePlayerView.Commands[command].toString() : import_react_native3.UIManager.getViewManagerConfig("NativePlayerView").Commands[command];
-  import_react_native3.UIManager.dispatchViewManagerCommand(node, commandId, import_react_native3.Platform.select({
-    ios: [playerId],
-    android: [node, playerId]
-  }));
+  import_react_native3.UIManager.dispatchViewManagerCommand(
+    node,
+    commandId,
+    import_react_native3.Platform.select({
+      ios: [playerId],
+      android: [node, playerId]
+    })
+  );
 }
 function PlayerView(props) {
   const nativeView = (0, import_react2.useRef)(null);
@@ -152,18 +162,27 @@ var Drm = class extends NativeInstance {
     });
     __publicField(this, "onPrepareCertificate", (certificate) => {
       if (this.config?.fairplay?.prepareCertificate) {
-        DrmModule.setPreparedCertificate(this.nativeId, this.config?.fairplay?.prepareCertificate?.(certificate));
+        DrmModule.setPreparedCertificate(
+          this.nativeId,
+          this.config?.fairplay?.prepareCertificate?.(certificate)
+        );
       }
     });
     __publicField(this, "onPrepareMessage", (message, assetId) => {
       const config = import_react_native5.Platform.OS === "ios" ? this.config?.fairplay : this.config?.widevine;
       if (config && config.prepareMessage) {
-        DrmModule.setPreparedMessage(this.nativeId, import_react_native5.Platform.OS === "ios" ? config.prepareMessage?.(message, assetId) : config.prepareMessage?.(message));
+        DrmModule.setPreparedMessage(
+          this.nativeId,
+          import_react_native5.Platform.OS === "ios" ? config.prepareMessage?.(message, assetId) : config.prepareMessage?.(message)
+        );
       }
     });
     __publicField(this, "onPrepareSyncMessage", (syncMessage, assetId) => {
       if (this.config?.fairplay?.prepareSyncMessage) {
-        DrmModule.setPreparedSyncMessage(this.nativeId, this.config?.fairplay?.prepareSyncMessage?.(syncMessage, assetId));
+        DrmModule.setPreparedSyncMessage(
+          this.nativeId,
+          this.config?.fairplay?.prepareSyncMessage?.(syncMessage, assetId)
+        );
       }
     });
     __publicField(this, "onPrepareLicense", (license) => {
@@ -174,12 +193,18 @@ var Drm = class extends NativeInstance {
     });
     __publicField(this, "onPrepareLicenseServerUrl", (licenseServerUrl) => {
       if (this.config?.fairplay?.prepareLicenseServerUrl) {
-        DrmModule.setPreparedLicenseServerUrl(this.nativeId, this.config?.fairplay?.prepareLicenseServerUrl?.(licenseServerUrl));
+        DrmModule.setPreparedLicenseServerUrl(
+          this.nativeId,
+          this.config?.fairplay?.prepareLicenseServerUrl?.(licenseServerUrl)
+        );
       }
     });
     __publicField(this, "onPrepareContentId", (contentId) => {
       if (this.config?.fairplay?.prepareContentId) {
-        DrmModule.setPreparedContentId(this.nativeId, this.config?.fairplay?.prepareContentId?.(contentId));
+        DrmModule.setPreparedContentId(
+          this.nativeId,
+          this.config?.fairplay?.prepareContentId?.(contentId)
+        );
       }
     });
   }
@@ -218,7 +243,11 @@ var Source = class extends NativeInstance {
         if (this.config?.drmConfig) {
           this.drm = new Drm(this.config.drmConfig);
           this.drm.initialize();
-          SourceModule.initWithDrmConfig(this.nativeId, this.drm.nativeId, this.config);
+          SourceModule.initWithDrmConfig(
+            this.nativeId,
+            this.drm.nativeId,
+            this.config
+          );
         } else {
           SourceModule.initWithConfig(this.nativeId, this.config);
         }
@@ -326,14 +355,18 @@ var Player = class extends NativeInstance {
     });
     __publicField(this, "isAirPlayActive", async () => {
       if (import_react_native7.Platform.OS === "android") {
-        console.warn(`[Player ${this.nativeId}] Method isAirPlayActive is not available for Android. Only iOS devices.`);
+        console.warn(
+          `[Player ${this.nativeId}] Method isAirPlayActive is not available for Android. Only iOS devices.`
+        );
         return false;
       }
       return PlayerModule.isAirPlayActive(this.nativeId);
     });
     __publicField(this, "isAirPlayAvailable", async () => {
       if (import_react_native7.Platform.OS === "android") {
-        console.warn(`[Player ${this.nativeId}] Method isAirPlayAvailable is not available for Android. Only iOS devices.`);
+        console.warn(
+          `[Player ${this.nativeId}] Method isAirPlayAvailable is not available for Android. Only iOS devices.`
+        );
         return false;
       }
       return PlayerModule.isAirPlayAvailable(this.nativeId);

package/lib/index.mjs

@@ -26,12 +26,15 @@ function unwrapNativeEvent(event) {
   return omit(event.nativeEvent, ["target"]);
 }
 function useProxy(viewRef) {
-  return useCallback((callback) => (event) => {
-    const node = event.target._nativeTag;
-    if (node === findNodeHandle(viewRef.current)) {
-      callback?.(unwrapNativeEvent(event));
-    }
-  }, [viewRef]);
+  return useCallback(
+    (callback) => (event) => {
+      const node = event.target._nativeTag;
+      if (node === findNodeHandle(viewRef.current)) {
+        callback?.(unwrapNativeEvent(event));
+      }
+    },
+    [viewRef]
+  );
 }
 
 // src/components/PlayerView/index.tsx
@@ -42,10 +45,14 @@ var styles = StyleSheet.create({
 });
 function dispatch(command, node, playerId) {
   const commandId = Platform.OS === "android" ? UIManager.NativePlayerView.Commands[command].toString() : UIManager.getViewManagerConfig("NativePlayerView").Commands[command];
-  UIManager.dispatchViewManagerCommand(node, commandId, Platform.select({
-    ios: [playerId],
-    android: [node, playerId]
-  }));
+  UIManager.dispatchViewManagerCommand(
+    node,
+    commandId,
+    Platform.select({
+      ios: [playerId],
+      android: [node, playerId]
+    })
+  );
 }
 function PlayerView(props) {
   const nativeView = useRef(null);
@@ -123,18 +130,27 @@ var Drm = class extends NativeInstance {
     });
     __publicField(this, "onPrepareCertificate", (certificate) => {
       if (this.config?.fairplay?.prepareCertificate) {
-        DrmModule.setPreparedCertificate(this.nativeId, this.config?.fairplay?.prepareCertificate?.(certificate));
+        DrmModule.setPreparedCertificate(
+          this.nativeId,
+          this.config?.fairplay?.prepareCertificate?.(certificate)
+        );
       }
     });
     __publicField(this, "onPrepareMessage", (message, assetId) => {
       const config = Platform2.OS === "ios" ? this.config?.fairplay : this.config?.widevine;
       if (config && config.prepareMessage) {
-        DrmModule.setPreparedMessage(this.nativeId, Platform2.OS === "ios" ? config.prepareMessage?.(message, assetId) : config.prepareMessage?.(message));
+        DrmModule.setPreparedMessage(
+          this.nativeId,
+          Platform2.OS === "ios" ? config.prepareMessage?.(message, assetId) : config.prepareMessage?.(message)
+        );
       }
     });
     __publicField(this, "onPrepareSyncMessage", (syncMessage, assetId) => {
       if (this.config?.fairplay?.prepareSyncMessage) {
-        DrmModule.setPreparedSyncMessage(this.nativeId, this.config?.fairplay?.prepareSyncMessage?.(syncMessage, assetId));
+        DrmModule.setPreparedSyncMessage(
+          this.nativeId,
+          this.config?.fairplay?.prepareSyncMessage?.(syncMessage, assetId)
+        );
       }
     });
     __publicField(this, "onPrepareLicense", (license) => {
@@ -145,12 +161,18 @@ var Drm = class extends NativeInstance {
     });
     __publicField(this, "onPrepareLicenseServerUrl", (licenseServerUrl) => {
       if (this.config?.fairplay?.prepareLicenseServerUrl) {
-        DrmModule.setPreparedLicenseServerUrl(this.nativeId, this.config?.fairplay?.prepareLicenseServerUrl?.(licenseServerUrl));
+        DrmModule.setPreparedLicenseServerUrl(
+          this.nativeId,
+          this.config?.fairplay?.prepareLicenseServerUrl?.(licenseServerUrl)
+        );
       }
     });
     __publicField(this, "onPrepareContentId", (contentId) => {
       if (this.config?.fairplay?.prepareContentId) {
-        DrmModule.setPreparedContentId(this.nativeId, this.config?.fairplay?.prepareContentId?.(contentId));
+        DrmModule.setPreparedContentId(
+          this.nativeId,
+          this.config?.fairplay?.prepareContentId?.(contentId)
+        );
       }
     });
   }
@@ -189,7 +211,11 @@ var Source = class extends NativeInstance {
         if (this.config?.drmConfig) {
           this.drm = new Drm(this.config.drmConfig);
           this.drm.initialize();
-          SourceModule.initWithDrmConfig(this.nativeId, this.drm.nativeId, this.config);
+          SourceModule.initWithDrmConfig(
+            this.nativeId,
+            this.drm.nativeId,
+            this.config
+          );
         } else {
           SourceModule.initWithConfig(this.nativeId, this.config);
         }
@@ -297,14 +323,18 @@ var Player = class extends NativeInstance {
     });
     __publicField(this, "isAirPlayActive", async () => {
       if (Platform3.OS === "android") {
-        console.warn(`[Player ${this.nativeId}] Method isAirPlayActive is not available for Android. Only iOS devices.`);
+        console.warn(
+          `[Player ${this.nativeId}] Method isAirPlayActive is not available for Android. Only iOS devices.`
+        );
         return false;
       }
       return PlayerModule.isAirPlayActive(this.nativeId);
     });
     __publicField(this, "isAirPlayAvailable", async () => {
       if (Platform3.OS === "android") {
-        console.warn(`[Player ${this.nativeId}] Method isAirPlayAvailable is not available for Android. Only iOS devices.`);
+        console.warn(
+          `[Player ${this.nativeId}] Method isAirPlayAvailable is not available for Android. Only iOS devices.`
+        );
         return false;
       }
       return PlayerModule.isAirPlayAvailable(this.nativeId);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bitmovin-player-react-native",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Official React Native bindings for Bitmovin's mobile Player SDKs.",
   "main": "lib/index.js",
   "module": "lib/index.mjs",
@@ -30,7 +30,7 @@
     "example": "yarn --cwd example",
     "pods": "cd example && pod-install --quiet",
     "bootstrap": "yarn && yarn example && yarn pods",
-    "postinstall": "husky install"
+    "prepare": "husky install"
   },
   "keywords": [
     "react-native",
@@ -45,24 +45,28 @@
   "homepage": "https://github.com/bitmovin/bitmovin-player-react-native",
   "repository": "https://github.com/bitmovin/bitmovin-player-react-native",
   "devDependencies": {
+    "@babel/core": "7.19.3",
+    "@babel/runtime": "7.19.0",
     "@commitlint/config-conventional": "11.0.0",
-    "@react-native-community/eslint-config": "3.0.2",
+    "@react-native-community/eslint-config": "3.1.0",
     "@types/jest": "26.0.24",
     "@types/lodash.omit": "4.5.0",
     "@types/react": "18.0.15",
     "@types/react-native": "0.69.2",
-    "commitlint": "11.0.0",
-    "eslint": "8.18.0",
+    "babel-plugin-module-resolver": "4.1.0",
+    "commitlint": "17.1.2",
+    "eslint": "8.24.0",
     "eslint-config-prettier": "8.5.0",
-    "eslint-plugin-prettier": "4.0.0",
+    "eslint-plugin-prettier": "4.2.1",
     "husky": "8.0.1",
     "jest": "26.6.3",
     "lint-staged": "13.0.3",
-    "pod-install": "0.1.37",
+    "metro-config": "0.72.3",
+    "metro-react-native-babel-preset": "0.72.3",
+    "pod-install": "0.1.38",
     "prettier": "2.7.1",
-    "react": "17.0.2",
-    "tsup": "5.12.9",
-    "typescript": "4.5.5"
+    "tsup": "6.2.3",
+    "typescript": "4.8.4"
   },
   "dependencies": {
     "lodash.omit": "4.5.0"

package/src/player.ts

@@ -28,6 +28,87 @@ export interface PlayerConfig extends NativeInstanceConfig {
    * ```
    */
   licenseKey?: string;
+  /**
+   * Configures playback behaviour. A default PlaybackConfig is set initially.
+   */
+  playbackConfig?: PlaybackConfig;
+}
+
+/**
+ * Configures the playback behaviour of the player.
+ */
+export interface PlaybackConfig {
+  /**
+   * Whether the player starts playing automatically after loading a source or not. Default is `false`.
+   * @example
+   * ```
+   * const player = new Player({
+   *   playbackConfig: {
+   *     isAutoplayEnabled: true,
+   *   },
+   * });
+   * ```
+   */
+  isAutoplayEnabled?: boolean;
+  /**
+   * Whether the sound is muted on startup or not. Default value is `false`.
+   * @example
+   * ```
+   * const player = new Player({
+   *   playbackConfig: {
+   *     isMuted: true,
+   *   },
+   * });
+   * ```
+   */
+  isMuted?: boolean;
+  /**
+   * Whether time shift / DVR for live streams is enabled or not. Default is `true`.
+   *  @example
+   * ```
+   * const player = new Player({
+   *   playbackConfig: {
+   *     isTimeShiftEnabled: false,
+   *   },
+   * });
+   * ```
+   */
+  isTimeShiftEnabled?: boolean;
+  /**
+   * Whether background playback is enabled or not.
+   * Default is `false`.
+   *
+   * When set to `true`, playback is not automatically paused
+   * anymore when the app moves to the background.
+   * When set to `true`, also make sure to properly configure your app to allow
+   * background playback.
+   *
+   * On tvOS, background playback is only supported for audio-only content.
+   *
+   * Default is `false`.
+   *
+   *  @example
+   * ```
+   * const player = new Player({
+   *   {
+   *     isBackgroundPlaybackEnabled: true,
+   *   }
+   * })
+   * ```
+   */
+  isBackgroundPlaybackEnabled?: boolean;
+  /**
+   * Whether the picture-in-picture mode option is enabled for iOS or not. Default is `false`.
+   *  @example
+   * ```
+   * const player = new Player({
+   *   playbackConfig: {
+   *     isPictureInPictureEnabled: true,
+   *   },
+   * });
+   * ```
+   */
+  isPictureInPictureEnabled?: boolean;
 }
 
 /**