react-native-theoplayer 2.4.0 → 2.6.0

package/CHANGELOG.md

@@ -5,7 +5,31 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-## [unreleased]
+## [2.6.0] - 23-05-05
+
+### Fixed
+
+- Fixed an issue on Android where the `currentProgramDateTime` property of `TimeUpdateEvent` would not be formatted in milliseconds.
+- Fixed an issue on Android where the order of text and media tracks would change when adding tracks.
+- Fixed an issue on Web where an exception would be thrown when accessing the player API after the player had been destroyed.
+- Fixed an issue with Google IMA where the main content wasn't resumed after a pre-roll ended.
+
+### Changed
+
+- Use `enum` instead of a string union for `ABRStrategyType`.
+- Changed the way artwork is fetched for NowPlayingInfo on the iOS Lockscreen, to prevent a crash caused by threading issues.
+
+## [2.5.0] - 23-04-26
+
+### Added
+
+- Added an `aspectRatio` property on the `THEOplayer` instance that can be either `FIT` (default), `FILL` or `ASPECT_FILL`.
+
+### Changed
+
+- Set `theoplayer` Web SDK as optional peer dependency.
+
+## [2.4.0] - 23-04-21
 
 ### Fixed
 

package/android/src/main/java/com/theoplayer/PlayerEventEmitter.kt

@@ -338,7 +338,7 @@ class PlayerEventEmitter internal constructor(
 
     // Limit update rate.
     val dt = now - lastTimeUpdate
-    return timeUpdateRate == TimeUpdateRate.LIMITED_ONE_HZ && dt < 1e03 ||
+    return timeUpdateRate == TimeUpdateRate.LIMITED_ONE_HZ && dt < 1e3 ||
       timeUpdateRate == TimeUpdateRate.LIMITED_TWO_HZ && dt < 500 ||
       timeUpdateRate == TimeUpdateRate.LIMITED_THREE_HZ && dt < 333
   }
@@ -481,24 +481,17 @@ class PlayerEventEmitter internal constructor(
   }
 
   private fun activeAudioTrack(): MediaTrack<AudioQuality>? {
-    return if (playerView.player != null) activeTrack(
-      playerView.player!!.audioTracks
-    ) else null
+    return activeTrack(playerView.player?.audioTracks)
   }
 
   private fun activeVideoTrack(): MediaTrack<VideoQuality>? {
-    return if (playerView.player != null) activeTrack(
-      playerView.player!!.videoTracks
-    ) else null
+    return activeTrack(playerView.player?.videoTracks)
   }
 
   private fun <T : Quality?> activeTrack(tracks: MediaTrackList<T>?): MediaTrack<T>? {
-    tracks?.forEach { track ->
-      if (track.isEnabled) {
-        return track
-      }
+    return tracks?.first { track ->
+      track.isEnabled
     }
-    return null
   }
 
   private val onActiveQualityChanged = EventListener<QualityChangedEvent<*, *>> { event ->
@@ -642,13 +635,14 @@ class PlayerEventEmitter internal constructor(
           }
         })
     }
-    if (BuildConfig.EXTENSION_CAST && playerView.castApi != null) {
-      castEventAdapter = CastEventAdapter(playerView.castApi!!,
-        object : CastEventAdapter.Emitter {
+    if (BuildConfig.EXTENSION_CAST) {
+      castEventAdapter = playerView.castApi?.let {
+        CastEventAdapter(it, object : CastEventAdapter.Emitter {
           override fun emit(payload: WritableMap?) {
             receiveEvent(EVENT_CAST_EVENT, payload)
           }
         })
+      }
     }
   }
 

package/android/src/main/java/com/theoplayer/player/PlayerModule.kt

@@ -3,6 +3,7 @@ package com.theoplayer.player
 import com.facebook.react.bridge.*
 import com.theoplayer.*
 import com.theoplayer.abr.ABRConfigurationAdapter
+import com.theoplayer.android.api.player.AspectRatio
 import com.theoplayer.android.api.player.PreloadType
 import com.theoplayer.android.api.player.PresentationMode
 import com.theoplayer.android.api.player.track.mediatrack.MediaTrack
@@ -175,4 +176,15 @@ class PlayerModule(context: ReactApplicationContext) : ReactContextBaseJavaModul
       view?.playerContext?.backgroundAudioConfig = BackgroundAudioConfigAdapter.fromProps(config)
     }
   }
+
+  @ReactMethod
+  fun setAspectRatio(tag: Int, ratio: String) {
+    viewResolver.resolveViewByTag(tag) { view: ReactTHEOplayerView? ->
+      view?.player?.setAspectRatio(when (ratio) {
+        "fill" -> AspectRatio.FILL
+        "aspectFill" -> AspectRatio.ASPECT_FILL
+        else -> AspectRatio.FIT
+      })
+    }
+  }
 }

package/android/src/main/java/com/theoplayer/util/PayloadBuilder.kt

@@ -74,7 +74,8 @@ class PayloadBuilder {
     currentProgramDateTime?.let {
       payload.putDouble(
         EVENT_PROP_CURRENT_PROGRAM_DATE_TIME,
-        (1e03 * currentProgramDateTime.time).toLong().toDouble()
+        // Date.time is already formatted in msecs.
+        currentProgramDateTime.time.toDouble()
       )
     }
   }

package/ios/THEOplayerRCTBridge.m

@@ -84,6 +84,9 @@ RCT_EXTERN_METHOD(setPlaybackRate:(nonnull NSNumber *)node
 RCT_EXTERN_METHOD(setPresentationMode:(nonnull NSNumber *)node
                   presentationMode:(nonnull NSString *)presentationMode)
 
+RCT_EXTERN_METHOD(setAspectRatio:(nonnull NSNumber *)node
+                  ratio:(nonnull NSString *)ratio)
+
 RCT_EXTERN_METHOD(setPipConfig:(nonnull NSNumber *)node
                   pipConfig:(NSDictionary)pipConfig)
 

package/ios/THEOplayerRCTMainEventHandler.swift

@@ -113,7 +113,7 @@ public class THEOplayerRCTMainEventHandler {
         self.readyStateChangeListener = player.addEventListener(type: PlayerEventTypes.READY_STATE_CHANGE) { [weak self] event in
             if DEBUG_THEOPLAYER_EVENTS { print("[NATIVE] Received READY_STATE_CHANGE event from THEOplayer") }
             if let forwardedReadyStateChangeEvent = self?.onNativeReadyStateChange {
-                forwardedReadyStateChangeEvent(["readyState": event.readyState.rawValue])
+                forwardedReadyStateChangeEvent(["readyState": event.readyState.rawValue - 1]) // [1-5] (iOS only) => [0-4] (other platforms + RN)
             }
         }
         if DEBUG_EVENTHANDLER { print("[NATIVE] ReadyStateChange listener attached to THEOplayer") }

package/ios/THEOplayerRCTPlayerAPI.swift

@@ -121,6 +121,21 @@ class THEOplayerRCTPlayerAPI: NSObject, RCTBridgeModule {
         return
     }
     
+    @objc(setAspectRatio:ratio:)
+        func setAspectRatio(_ node: NSNumber, ratio: String) -> Void {
+            DispatchQueue.main.async {
+                let newAspectRatio: AspectRatio = THEOplayerRCTTypeUtils.aspectRatioFromString(ratio)
+                if let theView = self.bridge.uiManager.view(forReactTag: node) as? THEOplayerRCTView,
+                   let player = theView.player {
+                    if player.fullscreen.aspectRatio != newAspectRatio {
+                        if DEBUG_PLAYER_API { print("[NATIVE] Changing TheoPlayer's aspectRatio to \(ratio)") }
+                        player.fullscreen.setAspectRatio(aspectRatio: newAspectRatio)
+                    }
+                }
+            }
+            return
+        }
+    
     @objc(setPipConfig:pipConfig:)
     func setPipConfig(_ node: NSNumber, pipConfig: NSDictionary) -> Void {
         DispatchQueue.main.async {

package/ios/THEOplayerRCTTypeUtils.swift

@@ -57,4 +57,30 @@ class THEOplayerRCTTypeUtils {
             return "inline"
         }
     }
+    
+    class func aspectRatioFromString(_ ratio: String) -> AspectRatio {
+        switch ratio {
+        case "fit":
+            return AspectRatio.fit
+        case "fill":
+            return AspectRatio.fill
+        case "aspectFill":
+            return AspectRatio.aspectFill
+        default:
+            return AspectRatio.fit
+        }
+    }
+    
+    class func aspectRatioToString(_ ratio: AspectRatio) -> String {
+        switch ratio {
+        case AspectRatio.fit:
+            return "fit"
+        case AspectRatio.fill:
+            return "fill"
+        case AspectRatio.aspectFill:
+            return "aspectFill"
+        default:
+            return "fit"
+        }
+    }
 }

package/ios/backgroundAudio/THEOplayerRCTNowPlayingManager.swift

@@ -1,4 +1,4 @@
-// THEOplayerRCTView+BackgroundAudioConfig.swift
+// THEOplayerRCTNowPlayingManager.swift
 
 import Foundation
 import THEOplayerSDK
@@ -41,32 +41,47 @@ class THEOplayerRCTNowPlayingManager {
            let sourceDescription = player.source,
            let metadata = sourceDescription.metadata {
             let artWorkUrlString = self.getArtWorkUrlStringFromSourceDescription(sourceDescription)
-            DispatchQueue.global().async {
-                self.nowPlayingInfo = [String : Any]()
-                self.updatePlaybackState()
-                self.updateTitle(metadata.title)
-                self.updateSubtitle(metadata.metadataKeys?["subtitle"] as? String)
-                self.updateDuration(player.duration)
-                self.updateMediaType() // video
-                self.updateArtWork(artWorkUrlString)
-                self.updatePlaybackRate(player.playbackRate)
-                self.updateServiceIdentifier(metadata.metadataKeys?["nowPlayingServiceIdentifier"] as? String)
-                self.updateContentIdentifier(metadata.metadataKeys?["nowPlayingContentIdentifier"] as? String)
-                self.updateCurrentTime { [weak self] in
-                    if let welf = self {
-                        MPNowPlayingInfoCenter.default().nowPlayingInfo = welf.nowPlayingInfo
-                        if DEBUG_NOWINFO { print("[NATIVE] NowPlayingInfoCenter Updated.") }
-                    }
+            self.updatePlaybackState()
+            self.nowPlayingInfo = [String : Any]()
+            self.updateTitle(metadata.title)
+            self.updateSubtitle(metadata.metadataKeys?["subtitle"] as? String)
+            self.updateDuration(player.duration)
+            self.updateMediaType() // video
+            self.updatePlaybackRate(player.playbackRate)
+            self.updateServiceIdentifier(metadata.metadataKeys?["nowPlayingServiceIdentifier"] as? String)
+            self.updateContentIdentifier(metadata.metadataKeys?["nowPlayingContentIdentifier"] as? String)
+            self.updateArtWork(artWorkUrlString) { [weak self] in
+                self?.updateCurrentTime { [weak self] in
+                    self?.processNowPlayingToInfoCenter()
                 }
             }
         }
     }
     
+    private func processNowPlayingToInfoCenter() {
+        DispatchQueue.main.async {
+            MPNowPlayingInfoCenter.default().nowPlayingInfo = self.nowPlayingInfo
+        }
+    }
+
+    private func clearNowPlayingOnInfoCenter() {
+        DispatchQueue.main.async {
+            MPNowPlayingInfoCenter.default().nowPlayingInfo = nil
+        }
+    }
+    
+    private func processPlaybackStateToInfoCenter(paused: Bool) {
+        if #available(iOS 13.0, tvOS 13.0, *) {
+            DispatchQueue.main.async {
+                MPNowPlayingInfoCenter.default().playbackState = paused ? MPNowPlayingPlaybackState.paused : MPNowPlayingPlaybackState.playing
+            }
+        }
+    }
+    
     private func getArtWorkUrlStringFromSourceDescription(_ sourceDescription: SourceDescription) -> String? {
         if let posterUrlString = sourceDescription.poster?.absoluteString {
             return posterUrlString
         }
-        
         if let metadata = sourceDescription.metadata,
            let displayIconUrlString = metadata.metadataKeys?["displayIconUri"] as? String {
             return displayIconUrlString
@@ -120,14 +135,24 @@ class THEOplayerRCTNowPlayingManager {
         }
     }
     
-    private func updateArtWork(_ urlString: String?) {
+    private func updateArtWork(_ urlString: String?, completion: (() -> Void)?) {
         if let artUrlString = urlString,
-           let artUrl = URL(string: artUrlString),
-           let displayIconData = try? Data(contentsOf: artUrl),
-           let displayIcon = UIImage(data: displayIconData) {
-            self.nowPlayingInfo[MPMediaItemPropertyArtwork] = MPMediaItemArtwork(boundsSize: displayIcon.size) { size in
-                return displayIcon
+           let artUrl = URL(string: artUrlString) {
+            let dataTask = URLSession.shared.dataTask(with: artUrl) { [weak self] (data, _, _) in
+                if let displayIconData = data,
+                   let displayIcon = UIImage(data: displayIconData) {
+                    self?.nowPlayingInfo[MPMediaItemPropertyArtwork] = MPMediaItemArtwork(boundsSize: displayIcon.size) { size in
+                        return displayIcon
+                    }
+                    if DEBUG_NOWINFO { print("[NATIVE] Artwork updated in nowPlayingInfo.") }
+                } else {
+                    if DEBUG_NOWINFO { print("[NATIVE] Failed to update artwork in nowPlayingInfo.") }
+                }
+                completion?()
             }
+            dataTask.resume()
+        } else {
+            completion?()
         }
     }
     

package/lib/commonjs/api/abr/ABRConfiguration.js

@@ -1,2 +1,27 @@
 "use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ABRStrategyType = void 0;
+/**
+ * The adaptive bitrate strategy of the first segment, represented by a value from the following list:
+ * <br/> - `'performance'`: The player will optimize ABR behavior to focus on the performance of the player. This strategy initiates playback with the lowest quality suitable for the device which means faster start-up time.
+ * <br/> - `'quality'`: The player will optimize ABR behavior to focus displaying the best visual quality to the end-user. This strategy initiates playback with the highest bit rate suitable for the device.
+ * <br/> - `'bandwidth'`: The player will optimize the ABR behavior to focus on displaying the most optimal quality based on historic data of available bandwidth and knowledge of the network conditions.
+ *
+ * @public
+ */
+let ABRStrategyType;
+/**
+ * Describes the metadata of the adaptive bitrate strategy.
+ *
+ * @public
+ */
+exports.ABRStrategyType = ABRStrategyType;
+(function (ABRStrategyType) {
+  ABRStrategyType["performance"] = "performance";
+  ABRStrategyType["quality"] = "quality";
+  ABRStrategyType["bandwidth"] = "bandwidth";
+})(ABRStrategyType || (exports.ABRStrategyType = ABRStrategyType = {}));
 //# sourceMappingURL=ABRConfiguration.js.map

package/lib/commonjs/api/abr/ABRConfiguration.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["ABRConfiguration.ts"],"sourcesContent":["/**\n * The adaptive bitrate strategy of the first segment, represented by a value from the following list:\n * <br/> - `'performance'`: The player will optimize ABR behavior to focus on the performance of the player. This strategy initiates playback with the lowest quality suitable for the device which means faster start-up time.\n * <br/> - `'quality'`: The player will optimize ABR behavior to focus displaying the best visual quality to the end-user. This strategy initiates playback with the highest bit rate suitable for the device.\n * <br/> - `'bandwidth'`: The player will optimize the ABR behavior to focus on displaying the most optimal quality based on historic data of available bandwidth and knowledge of the network conditions.\n *\n * @public\n */\nexport type ABRStrategyType = 'performance' | 'quality' | 'bandwidth';\n\n/**\n * Describes the metadata of the adaptive bitrate strategy.\n *\n * @public\n */\nexport interface ABRMetadata {\n  /**\n   * The initial bitrate, in bits per second.\n   *\n   * @defaultValue Bitrate available to the browser.\n   */\n  bitrate?: number;\n}\n\n/**\n * Describes the configuration of the adaptive bitrate strategy.\n *\n * @public\n */\nexport interface ABRStrategyConfiguration {\n  /**\n   * The strategy for initial playback.\n   */\n  type: ABRStrategyType;\n\n  /**\n   * The metadata for the initial playback strategy.\n   *\n   * @defaultValue A {@link ABRMetadata} object with default values.\n   */\n  metadata?: ABRMetadata;\n}\n\n/**\n * The adaptive bitrate stratey.\n *\n * @public\n */\nexport type ABRStrategy = ABRStrategyConfiguration | ABRStrategyType;\n\n/**\n * Describes the adaptive bitrate configuration.\n *\n * @public\n */\nexport interface ABRConfiguration {\n  /**\n   * The adaptive bitrate strategy.\n   *\n   * @defaultValue `'bandwidth'`\n   */\n  strategy?: ABRStrategy;\n\n  /**\n   * The amount which the player should buffer ahead of the current playback position, in seconds.\n   *\n   * @remarks\n   * <br/> - Before v4.3.0: This duration has a maximum of 60 seconds.\n   * <br/> - After v4.3.0: This duration has no maximum.\n   * <br/> - The player might reduce or ignore the configured amount because of device or performance constraints.\n   *\n   * @defaultValue `20`\n   */\n  targetBuffer?: number;\n\n  /**\n   * The amount of data which the player should keep in its buffer before the current playback position, in seconds.\n   * This configuration option can be used to reduce the memory footprint on memory restricted devices or on devices\n   * which don't automatically prune decoder buffers.\n   *\n   * Note that the player can decide to keep less data in the decoder buffer in case memory is running low.\n   * A value of 0 or lower is not accepted and will be treated as default.\n   *\n   * @defaultValue `30`\n   *\n   * @remarks\n   * <br/> - This property is currently supported on Web platforms only.\n   */\n  bufferLookbackWindow?: number;\n\n  /**\n   * The maximum length of the player's buffer, in seconds.\n   *\n   * The player will initially buffer up to {@link ABRConfiguration.targetBuffer} seconds of media data.\n   * If the player detects that the decoder is unable to hold so much data,\n   * it will reduce `maxBufferLength` and restrict `targetBuffer` to be less than\n   * this maximum.\n   *\n   * @remarks\n   * <br/> - This property is currently supported on Web platforms only.\n   */\n  readonly maxBufferLength?: number;\n}\n"],"mappings":""}
+{"version":3,"names":["ABRStrategyType","exports"],"sources":["ABRConfiguration.ts"],"sourcesContent":["/**\n * The adaptive bitrate strategy of the first segment, represented by a value from the following list:\n * <br/> - `'performance'`: The player will optimize ABR behavior to focus on the performance of the player. This strategy initiates playback with the lowest quality suitable for the device which means faster start-up time.\n * <br/> - `'quality'`: The player will optimize ABR behavior to focus displaying the best visual quality to the end-user. This strategy initiates playback with the highest bit rate suitable for the device.\n * <br/> - `'bandwidth'`: The player will optimize the ABR behavior to focus on displaying the most optimal quality based on historic data of available bandwidth and knowledge of the network conditions.\n *\n * @public\n */\nexport enum ABRStrategyType {\n  performance = 'performance',\n  quality = 'quality',\n  bandwidth = 'bandwidth',\n}\n\n/**\n * Describes the metadata of the adaptive bitrate strategy.\n *\n * @public\n */\nexport interface ABRMetadata {\n  /**\n   * The initial bitrate, in bits per second.\n   *\n   * @defaultValue Bitrate available to the browser.\n   */\n  bitrate?: number;\n}\n\n/**\n * Describes the configuration of the adaptive bitrate strategy.\n *\n * @public\n */\nexport interface ABRStrategyConfiguration {\n  /**\n   * The strategy for initial playback.\n   */\n  type: ABRStrategyType;\n\n  /**\n   * The metadata for the initial playback strategy.\n   *\n   * @defaultValue A {@link ABRMetadata} object with default values.\n   */\n  metadata?: ABRMetadata;\n}\n\n/**\n * The adaptive bitrate stratey.\n *\n * @public\n */\nexport type ABRStrategy = ABRStrategyConfiguration | ABRStrategyType;\n\n/**\n * Describes the adaptive bitrate configuration.\n *\n * @public\n */\nexport interface ABRConfiguration {\n  /**\n   * The adaptive bitrate strategy.\n   *\n   * @defaultValue `'bandwidth'`\n   */\n  strategy?: ABRStrategy;\n\n  /**\n   * The amount which the player should buffer ahead of the current playback position, in seconds.\n   *\n   * @remarks\n   * <br/> - Before v4.3.0: This duration has a maximum of 60 seconds.\n   * <br/> - After v4.3.0: This duration has no maximum.\n   * <br/> - The player might reduce or ignore the configured amount because of device or performance constraints.\n   *\n   * @defaultValue `20`\n   */\n  targetBuffer?: number;\n\n  /**\n   * The amount of data which the player should keep in its buffer before the current playback position, in seconds.\n   * This configuration option can be used to reduce the memory footprint on memory restricted devices or on devices\n   * which don't automatically prune decoder buffers.\n   *\n   * Note that the player can decide to keep less data in the decoder buffer in case memory is running low.\n   * A value of 0 or lower is not accepted and will be treated as default.\n   *\n   * @defaultValue `30`\n   *\n   * @remarks\n   * <br/> - This property is currently supported on Web platforms only.\n   */\n  bufferLookbackWindow?: number;\n\n  /**\n   * The maximum length of the player's buffer, in seconds.\n   *\n   * The player will initially buffer up to {@link ABRConfiguration.targetBuffer} seconds of media data.\n   * If the player detects that the decoder is unable to hold so much data,\n   * it will reduce `maxBufferLength` and restrict `targetBuffer` to be less than\n   * this maximum.\n   *\n   * @remarks\n   * <br/> - This property is currently supported on Web platforms only.\n   */\n  readonly maxBufferLength?: number;\n}\n"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA,IAQYA,eAAe;AAM3B;AACA;AACA;AACA;AACA;AAJAC,OAAA,CAAAD,eAAA,GAAAA,eAAA;AAAA,WANYA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;AAAA,GAAfA,eAAe,KAAAC,OAAA,CAAAD,eAAA,GAAfA,eAAe"}

package/lib/commonjs/api/player/THEOplayer.js

@@ -3,4 +3,22 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.AspectRatio = void 0;
+/**
+ * Specifies an aspect ratio for the player.
+ *
+ * <br/> - `FIT` (default): Scales the player so that all content fits inside its bounding box, keeping the original aspect ratio of the content..
+ * <br/> - `FILL`: Scales the player so that all content fits inside the bounding box, which will be stretched to fill it entirely.
+ * <br/> - `ASPECT_FILL`: Scales the player so that the content fills up the entire bounding box, keeping the original aspect ratio of the content.
+ *
+ * @public
+ * @defaultValue `'FIT'`
+ */
+let AspectRatio;
+exports.AspectRatio = AspectRatio;
+(function (AspectRatio) {
+  AspectRatio["FIT"] = "fit";
+  AspectRatio["FILL"] = "fill";
+  AspectRatio["ASPECT_FILL"] = "aspectFill";
+})(AspectRatio || (exports.AspectRatio = AspectRatio = {}));
 //# sourceMappingURL=THEOplayer.js.map

package/lib/commonjs/api/player/THEOplayer.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["THEOplayer.ts"],"sourcesContent":["import type { EventDispatcher } from '../event/EventDispatcher';\nimport type { PlayerEventMap } from './PlayerEventMap';\nimport type { ABRConfiguration } from '../abr/ABRConfiguration';\nimport type { SourceDescription } from '../source/SourceDescription';\nimport type { AdsAPI } from '../ads/AdsAPI';\nimport type { CastAPI } from '../cast/CastAPI';\nimport type { MediaTrack } from '../track/MediaTrack';\nimport type { TextTrack } from '../track/TextTrack';\nimport type { TimeRange } from '../timeranges/TimeRange';\nimport type { TextTrackStyle } from '../track/TextTrackStyle';\nimport type { PresentationMode } from '../presentation/PresentationMode';\nimport type { PiPConfiguration } from '../pip/PiPConfiguration';\nimport type { BackgroundAudioConfiguration } from '../backgroundAudio/BackgroundAudioConfiguration';\n\nexport type PreloadType = 'none' | 'metadata' | 'auto' | '';\n\nexport type NativeHandleType = unknown;\n\n/**\n * The THEOplayer API.\n */\nexport interface THEOplayer extends EventDispatcher<PlayerEventMap> {\n  /**\n   * The player's adaptive bitrate (ABR) configuration.\n   *\n   * @remarks\n   * <br/> - This property is supported on Android & Web platforms only.\n   */\n  readonly abr: ABRConfiguration | undefined;\n\n  /**\n   * A source description that determines the current media resource.\n   */\n  source: SourceDescription | undefined;\n\n  /**\n   * Start or resume playback.\n   */\n  play(): void;\n\n  /**\n   * Pause playback.\n   */\n  pause(): void;\n\n  /**\n   * Whether the player is paused.\n   */\n  readonly paused: boolean;\n\n  /**\n   * Whether the player should immediately start playback after source change.\n   */\n  autoplay: boolean;\n\n  /**\n   * The preload setting of the player.\n   */\n  preload: PreloadType;\n\n  /**\n   * Returns a list of TimeRanges that represents the ranges of the media resource that are seekable by the player.\n   */\n  seekable: TimeRange[];\n\n  /**\n   * Returns a list of TimeRanges that represents the ranges of the media resource that are buffered by the player.\n   */\n  buffered: TimeRange[];\n\n  /**\n   * Used to set the playback rate of the media.\n   *\n   * @example\n   * <br/> - `playbackRate = 0.70` will slow down the playback rate of the media by 30%.\n   * <br/> - `playbackRate = 1.25` will speed up the playback rate of the media by 25%.\n   *\n   * @remarks\n   * <br/> - Playback rate is represented by a number where `1` is default playback speed.\n   * <br/> - Playback rate must be a positive number.\n   * <br/> - It is recommended that you limit the range to between 0.5 and 4.\n   */\n  playbackRate: number;\n\n  /**\n   * Used to set the volume of the audio.\n   *\n   * @remarks\n   * <br/> - Volume is represented by a floating point number between `0.0` and `1.0`.\n   */\n  volume: number;\n\n  /**\n   * Determines whether audio is muted.\n   */\n  muted: boolean;\n\n  /**\n   * Whether the player is seeking.\n   */\n  readonly seeking: boolean;\n\n  /**\n   * The PresentationMode of the player. Can be switched to: `picture-in-picture`, `fullscreen` or `inline`\n   */\n  presentationMode: PresentationMode;\n\n  /**\n   * List of audio tracks of the current source.\n   */\n  audioTracks: MediaTrack[];\n\n  /**\n   * List of video tracks of the current source.\n   */\n  videoTracks: MediaTrack[];\n\n  /**\n   * List of text tracks of the current source.\n   */\n  textTracks: TextTrack[];\n\n  /**\n   * Used to set the current selected text track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedTextTrack: number | undefined;\n\n  /**\n   * The text track style API.\n   *\n   * @remarks\n   * Only available for Web.\n   */\n  readonly textTrackStyle: TextTrackStyle;\n\n  /**\n   * Used to set the current selected video track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedVideoTrack: number | undefined;\n\n  /**\n   * Used to set the current selected video quality by passing its `uid`, or `undefined` to select none.\n   */\n  targetVideoQuality: number | number[] | undefined;\n\n  /**\n   * Used to set the current selected audio track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedAudioTrack: number | undefined;\n\n  /**\n   * The current playback position of the media, in milliseconds.\n   */\n  currentTime: number;\n\n  /**\n   * The active configuration for PiP.\n   */\n  pipConfiguration: PiPConfiguration;\n\n  /**\n   * The active configuration for PiP.\n   */\n  backgroundAudioConfiguration: BackgroundAudioConfiguration;\n\n  /**\n   * The duration of the media, in milliseconds.\n   */\n  readonly duration: number;\n\n  /**\n   * The API for advertisements.\n   */\n  readonly ads: AdsAPI;\n\n  /**\n   * The API for casting devices.\n   */\n  readonly cast: CastAPI;\n\n  /**\n   * Native player handle.\n   */\n  readonly nativeHandle: NativeHandleType;\n}\n"],"mappings":""}
+{"version":3,"names":["AspectRatio","exports"],"sources":["THEOplayer.ts"],"sourcesContent":["import type { EventDispatcher } from '../event/EventDispatcher';\nimport type { PlayerEventMap } from './PlayerEventMap';\nimport type { ABRConfiguration } from '../abr/ABRConfiguration';\nimport type { SourceDescription } from '../source/SourceDescription';\nimport type { AdsAPI } from '../ads/AdsAPI';\nimport type { CastAPI } from '../cast/CastAPI';\nimport type { MediaTrack } from '../track/MediaTrack';\nimport type { TextTrack } from '../track/TextTrack';\nimport type { TimeRange } from '../timeranges/TimeRange';\nimport type { TextTrackStyle } from '../track/TextTrackStyle';\nimport type { PresentationMode } from '../presentation/PresentationMode';\nimport type { PiPConfiguration } from '../pip/PiPConfiguration';\nimport type { BackgroundAudioConfiguration } from '../backgroundAudio/BackgroundAudioConfiguration';\n\nexport type PreloadType = 'none' | 'metadata' | 'auto' | '';\n\n/**\n * Specifies an aspect ratio for the player.\n *\n * <br/> - `FIT` (default): Scales the player so that all content fits inside its bounding box, keeping the original aspect ratio of the content..\n * <br/> - `FILL`: Scales the player so that all content fits inside the bounding box, which will be stretched to fill it entirely.\n * <br/> - `ASPECT_FILL`: Scales the player so that the content fills up the entire bounding box, keeping the original aspect ratio of the content.\n *\n * @public\n * @defaultValue `'FIT'`\n */\nexport enum AspectRatio {\n  FIT = 'fit',\n  FILL = 'fill',\n  ASPECT_FILL = 'aspectFill',\n}\n\nexport type NativeHandleType = unknown;\n\n/**\n * The THEOplayer API.\n */\nexport interface THEOplayer extends EventDispatcher<PlayerEventMap> {\n  /**\n   * The player's adaptive bitrate (ABR) configuration.\n   *\n   * @remarks\n   * <br/> - This property is supported on Android & Web platforms only.\n   */\n  readonly abr: ABRConfiguration | undefined;\n\n  /**\n   * A source description that determines the current media resource.\n   */\n  source: SourceDescription | undefined;\n\n  /**\n   * Start or resume playback.\n   */\n  play(): void;\n\n  /**\n   * Pause playback.\n   */\n  pause(): void;\n\n  /**\n   * Whether the player is paused.\n   */\n  readonly paused: boolean;\n\n  /**\n   * Whether the player should immediately start playback after source change.\n   */\n  autoplay: boolean;\n\n  /**\n   * The preload setting of the player.\n   */\n  preload: PreloadType;\n\n  /**\n   * Returns a list of TimeRanges that represents the ranges of the media resource that are seekable by the player.\n   */\n  seekable: TimeRange[];\n\n  /**\n   * Returns a list of TimeRanges that represents the ranges of the media resource that are buffered by the player.\n   */\n  buffered: TimeRange[];\n\n  /**\n   * Used to set the playback rate of the media.\n   *\n   * @example\n   * <br/> - `playbackRate = 0.70` will slow down the playback rate of the media by 30%.\n   * <br/> - `playbackRate = 1.25` will speed up the playback rate of the media by 25%.\n   *\n   * @remarks\n   * <br/> - Playback rate is represented by a number where `1` is default playback speed.\n   * <br/> - Playback rate must be a positive number.\n   * <br/> - It is recommended that you limit the range to between 0.5 and 4.\n   */\n  playbackRate: number;\n\n  /**\n   * Used to set the volume of the audio.\n   *\n   * @remarks\n   * <br/> - Volume is represented by a floating point number between `0.0` and `1.0`.\n   */\n  volume: number;\n\n  /**\n   * Determines whether audio is muted.\n   */\n  muted: boolean;\n\n  /**\n   * Whether the player is seeking.\n   */\n  readonly seeking: boolean;\n\n  /**\n   * The PresentationMode of the player. Can be switched to: `picture-in-picture`, `fullscreen` or `inline`\n   */\n  presentationMode: PresentationMode;\n\n  /**\n   * List of audio tracks of the current source.\n   */\n  audioTracks: MediaTrack[];\n\n  /**\n   * List of video tracks of the current source.\n   */\n  videoTracks: MediaTrack[];\n\n  /**\n   * List of text tracks of the current source.\n   */\n  textTracks: TextTrack[];\n\n  /**\n   * Used to set the current selected text track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedTextTrack: number | undefined;\n\n  /**\n   * The text track style API.\n   *\n   * @remarks\n   * Only available for Web.\n   */\n  readonly textTrackStyle: TextTrackStyle;\n\n  /**\n   * Used to set the current selected video track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedVideoTrack: number | undefined;\n\n  /**\n   * Used to set the current selected video quality by passing its `uid`, or `undefined` to select none.\n   */\n  targetVideoQuality: number | number[] | undefined;\n\n  /**\n   * Used to set the current selected audio track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedAudioTrack: number | undefined;\n\n  /**\n   * The current playback position of the media, in milliseconds.\n   */\n  currentTime: number;\n\n  /**\n   * Used to set the aspect ratio of the player.\n   *\n   * @remarks\n   * Only available for iOS and Android.\n   */\n  aspectRatio: AspectRatio;\n\n  /**\n   * The active configuration for PiP.\n   */\n  pipConfiguration: PiPConfiguration;\n\n  /**\n   * The active configuration for PiP.\n   */\n  backgroundAudioConfiguration: BackgroundAudioConfiguration;\n\n  /**\n   * The duration of the media, in milliseconds.\n   */\n  readonly duration: number;\n\n  /**\n   * The API for advertisements.\n   */\n  readonly ads: AdsAPI;\n\n  /**\n   * The API for casting devices.\n   */\n  readonly cast: CastAPI;\n\n  /**\n   * Native player handle.\n   */\n  readonly nativeHandle: NativeHandleType;\n}\n"],"mappings":";;;;;;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA,IAUYA,WAAW;AAAAC,OAAA,CAAAD,WAAA,GAAAA,WAAA;AAAA,WAAXA,WAAW;EAAXA,WAAW;EAAXA,WAAW;EAAXA,WAAW;AAAA,GAAXA,WAAW,KAAAC,OAAA,CAAAD,WAAA,GAAXA,WAAW"}

package/lib/commonjs/api/track/Track.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.addTrack = addTrack;
 exports.hasTrack = hasTrack;
 exports.removeTrack = removeTrack;
+exports.sortTracks = sortTracks;
 /**
  * Represents a track of a media resource.
  *
@@ -22,6 +23,9 @@ function removeTrack(trackList, track) {
   return trackList && track ? trackList.filter(t => t.uid !== track.uid) : trackList;
 }
 function addTrack(trackList, track) {
-  return trackList && track && !hasTrack(trackList, track) ? [...trackList, track] : trackList;
+  return trackList && track && !hasTrack(trackList, track) ? sortTracks([...trackList, track]) : trackList;
+}
+function sortTracks(trackList) {
+  return (trackList === null || trackList === void 0 ? void 0 : trackList.sort((t1, t2) => t1.uid - t2.uid)) || [];
 }
 //# sourceMappingURL=Track.js.map

package/lib/commonjs/api/track/Track.js.map

@@ -1 +1 @@
-{"version":3,"names":["hasTrack","trackList","track","find","t","uid","removeTrack","filter","addTrack"],"sources":["Track.ts"],"sourcesContent":["/**\n * Represents a track of a media resource.\n *\n * @remarks\n * <br/> - A specific track type (e.g. {@link TextTrack}) will always be used.\n *\n * @public\n */\nexport interface Track {\n  /**\n   * The kind of the track.\n   *\n   * @remarks\n   * <br/> - The values for this property depend on the specific type of the track.\n   */\n  readonly kind: string;\n\n  /**\n   * The label of the track.\n   */\n  label: string;\n\n  /**\n   * The identifier of the track.\n   *\n   * @remarks\n   * <br/> - This identifier can be used to distinguish between related tracks, e.g. tracks in the same list.\n   *\n   * @privateRemarks\n   * <br/> - This identifier is a randomly generated string.\n   */\n  readonly id: string;\n\n  /**\n   * A unique identifier of the track.\n   *\n   * @remarks\n   * <br/> - This identifier is unique across tracks of a THEOplayer instance and can be used to distinguish between tracks.\n   * <br/> - This identifier is a randomly generated number.\n   */\n  readonly uid: number;\n\n  /**\n   * The language of the track.\n   */\n  readonly language: string;\n}\n\nexport function hasTrack<TTrack extends Track>(trackList: TTrack[], track: TTrack): boolean {\n  return !!(trackList && track && trackList.find((t) => t.uid === track.uid));\n}\n\nexport function removeTrack<TTrack extends Track>(trackList: TTrack[], track: TTrack): TTrack[] {\n  return trackList && track ? trackList.filter((t) => t.uid !== track.uid) : trackList;\n}\n\nexport function addTrack<TTrack extends Track>(trackList: TTrack[], track: TTrack): TTrack[] {\n  return trackList && track && !hasTrack(trackList, track) ? [...trackList, track] : trackList;\n}\n"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAyCO,SAASA,QAAQA,CAAuBC,SAAmB,EAAEC,KAAa,EAAW;EAC1F,OAAO,CAAC,EAAED,SAAS,IAAIC,KAAK,IAAID,SAAS,CAACE,IAAI,CAAEC,CAAC,IAAKA,CAAC,CAACC,GAAG,KAAKH,KAAK,CAACG,GAAG,CAAC,CAAC;AAC7E;AAEO,SAASC,WAAWA,CAAuBL,SAAmB,EAAEC,KAAa,EAAY;EAC9F,OAAOD,SAAS,IAAIC,KAAK,GAAGD,SAAS,CAACM,MAAM,CAAEH,CAAC,IAAKA,CAAC,CAACC,GAAG,KAAKH,KAAK,CAACG,GAAG,CAAC,GAAGJ,SAAS;AACtF;AAEO,SAASO,QAAQA,CAAuBP,SAAmB,EAAEC,KAAa,EAAY;EAC3F,OAAOD,SAAS,IAAIC,KAAK,IAAI,CAACF,QAAQ,CAACC,SAAS,EAAEC,KAAK,CAAC,GAAG,CAAC,GAAGD,SAAS,EAAEC,KAAK,CAAC,GAAGD,SAAS;AAC9F"}
+{"version":3,"names":["hasTrack","trackList","track","find","t","uid","removeTrack","filter","addTrack","sortTracks","sort","t1","t2"],"sources":["Track.ts"],"sourcesContent":["/**\n * Represents a track of a media resource.\n *\n * @remarks\n * <br/> - A specific track type (e.g. {@link TextTrack}) will always be used.\n *\n * @public\n */\nexport interface Track {\n  /**\n   * The kind of the track.\n   *\n   * @remarks\n   * <br/> - The values for this property depend on the specific type of the track.\n   */\n  readonly kind: string;\n\n  /**\n   * The label of the track.\n   */\n  label: string;\n\n  /**\n   * The identifier of the track.\n   *\n   * @remarks\n   * <br/> - This identifier can be used to distinguish between related tracks, e.g. tracks in the same list.\n   *\n   * @privateRemarks\n   * <br/> - This identifier is a randomly generated string.\n   */\n  readonly id: string;\n\n  /**\n   * A unique identifier of the track.\n   *\n   * @remarks\n   * <br/> - This identifier is unique across tracks of a THEOplayer instance and can be used to distinguish between tracks.\n   * <br/> - This identifier is a randomly generated number.\n   */\n  readonly uid: number;\n\n  /**\n   * The language of the track.\n   */\n  readonly language: string;\n}\n\nexport function hasTrack<TTrack extends Track>(trackList: TTrack[], track: TTrack): boolean {\n  return !!(trackList && track && trackList.find((t) => t.uid === track.uid));\n}\n\nexport function removeTrack<TTrack extends Track>(trackList: TTrack[], track: TTrack): TTrack[] {\n  return trackList && track ? trackList.filter((t) => t.uid !== track.uid) : trackList;\n}\n\nexport function addTrack<TTrack extends Track>(trackList: TTrack[], track: TTrack): TTrack[] {\n  return trackList && track && !hasTrack(trackList, track) ? sortTracks([...trackList, track]) : trackList;\n}\n\nexport function sortTracks<TTrack extends Track>(trackList?: TTrack[]): TTrack[] {\n  return trackList?.sort((t1: TTrack, t2: TTrack) => t1.uid - t2.uid) || [];\n}\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAyCO,SAASA,QAAQA,CAAuBC,SAAmB,EAAEC,KAAa,EAAW;EAC1F,OAAO,CAAC,EAAED,SAAS,IAAIC,KAAK,IAAID,SAAS,CAACE,IAAI,CAAEC,CAAC,IAAKA,CAAC,CAACC,GAAG,KAAKH,KAAK,CAACG,GAAG,CAAC,CAAC;AAC7E;AAEO,SAASC,WAAWA,CAAuBL,SAAmB,EAAEC,KAAa,EAAY;EAC9F,OAAOD,SAAS,IAAIC,KAAK,GAAGD,SAAS,CAACM,MAAM,CAAEH,CAAC,IAAKA,CAAC,CAACC,GAAG,KAAKH,KAAK,CAACG,GAAG,CAAC,GAAGJ,SAAS;AACtF;AAEO,SAASO,QAAQA,CAAuBP,SAAmB,EAAEC,KAAa,EAAY;EAC3F,OAAOD,SAAS,IAAIC,KAAK,IAAI,CAACF,QAAQ,CAACC,SAAS,EAAEC,KAAK,CAAC,GAAGO,UAAU,CAAC,CAAC,GAAGR,SAAS,EAAEC,KAAK,CAAC,CAAC,GAAGD,SAAS;AAC1G;AAEO,SAASQ,UAAUA,CAAuBR,SAAoB,EAAY;EAC/E,OAAO,CAAAA,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAES,IAAI,CAAC,CAACC,EAAU,EAAEC,EAAU,KAAKD,EAAE,CAACN,GAAG,GAAGO,EAAE,CAACP,GAAG,CAAC,KAAI,EAAE;AAC3E"}

package/lib/commonjs/internal/THEOplayerView.web.js

@@ -7,8 +7,6 @@ exports.THEOplayerView = THEOplayerView;
 var _react = _interopRequireWildcard(require("react"));
 var THEOplayer = _interopRequireWildcard(require("theoplayer"));
 var _THEOplayerWebAdapter = require("./adapter/THEOplayerWebAdapter");
-var _BaseEvent = require("./adapter/event/BaseEvent");
-var _reactNativeTheoplayer = require("react-native-theoplayer");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function THEOplayerView(props) {
@@ -55,7 +53,7 @@ function THEOplayerView(props) {
 
     // Clean-up
     return () => {
-      var _adapter$current, _adapter$current2, _player$current;
+      var _adapter$current;
       // Notify the player will be destroyed.
       const {
         onPlayerDestroy
@@ -63,9 +61,7 @@ function THEOplayerView(props) {
       if (adapter !== null && adapter !== void 0 && adapter.current && onPlayerDestroy) {
         onPlayerDestroy(adapter === null || adapter === void 0 ? void 0 : adapter.current);
       }
-      adapter === null || adapter === void 0 ? void 0 : (_adapter$current = adapter.current) === null || _adapter$current === void 0 ? void 0 : _adapter$current.dispatchEvent(new _BaseEvent.BaseEvent(_reactNativeTheoplayer.PlayerEventType.DESTROY));
-      adapter === null || adapter === void 0 ? void 0 : (_adapter$current2 = adapter.current) === null || _adapter$current2 === void 0 ? void 0 : _adapter$current2.destroy();
-      player === null || player === void 0 ? void 0 : (_player$current = player.current) === null || _player$current === void 0 ? void 0 : _player$current.destroy();
+      adapter === null || adapter === void 0 ? void 0 : (_adapter$current = adapter.current) === null || _adapter$current === void 0 ? void 0 : _adapter$current.destroy();
     };
   }, [container]);
   const chromeless = (config === null || config === void 0 ? void 0 : config.chromeless) === undefined || (config === null || config === void 0 ? void 0 : config.chromeless) === true;

package/lib/commonjs/internal/THEOplayerView.web.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","THEOplayer","_THEOplayerWebAdapter","_BaseEvent","_reactNativeTheoplayer","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","THEOplayerView","props","config","children","player","useRef","adapter","container","useEffect","current","_props$onPlayerReady","chromeless","undefined","updatedConfig","allowNativeFullscreen","ChromelessPlayer","Player","ui","fluid","THEOplayerWebAdapter","window","nativePlayer","onPlayerReady","_adapter$current","_adapter$current2","_player$current","onPlayerDestroy","dispatchEvent","BaseEvent","PlayerEventType","DESTROY","destroy","createElement","Fragment","ref","style","styles","className","display","position","width","height","maxHeight","maxWidth","aspectRatio"],"sources":["THEOplayerView.web.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport type { THEOplayerViewProps } from 'react-native-theoplayer';\nimport * as THEOplayer from 'theoplayer';\nimport { THEOplayerWebAdapter } from './adapter/THEOplayerWebAdapter';\nimport { BaseEvent } from './adapter/event/BaseEvent';\nimport { PlayerEventType } from 'react-native-theoplayer';\n\nexport function THEOplayerView(props: React.PropsWithChildren<THEOplayerViewProps>) {\n  const { config, children } = props;\n  const player = useRef<THEOplayer.ChromelessPlayer | null>(null);\n  const adapter = useRef<THEOplayerWebAdapter | null>(null);\n  const container = useRef<null | HTMLDivElement>(null);\n\n  useEffect(() => {\n    // Create player inside container.\n    if (container.current) {\n      const chromeless = config?.chromeless === true || config?.chromeless === undefined;\n      const updatedConfig = {...config, allowNativeFullscreen: true};\n      if (chromeless) {\n        player.current = new THEOplayer.ChromelessPlayer(container.current, updatedConfig);\n      } else {\n        player.current = new THEOplayer.Player(container.current, {\n          ...updatedConfig,\n          ui: {\n            fluid: true,\n          }\n        } as THEOplayer.PlayerConfiguration);\n      }\n\n      // Adapt native player to react-native player.\n      adapter.current = new THEOplayerWebAdapter(player.current, config);\n\n      // Expose players for easy access\n      // @ts-ignore\n      window.player = adapter.current;\n\n      // @ts-ignore\n      window.nativePlayer = player;\n\n      // Notify the player is ready\n      props.onPlayerReady?.(adapter.current);\n    }\n\n    // Clean-up\n    return () => {\n      // Notify the player will be destroyed.\n      const { onPlayerDestroy } = props;\n      if (adapter?.current && onPlayerDestroy) {\n        onPlayerDestroy(adapter?.current);\n      }\n      adapter?.current?.dispatchEvent(new BaseEvent(PlayerEventType.DESTROY));\n      adapter?.current?.destroy();\n      player?.current?.destroy();\n    };\n  }, [container]);\n\n  const chromeless = config?.chromeless === undefined || config?.chromeless === true;\n  return (\n    <>\n      <div\n        ref={container}\n        style={styles.container}\n        className={chromeless ? 'theoplayer-container' : 'theoplayer-container video-js theoplayer-skin'}\n      />\n      {children}\n    </>\n  );\n}\n\nconst styles = {\n  // by default stretch the video to cover the container.\n  // Override using the 'theoplayer-container' class.\n  container: {\n    display: 'flex',\n    position: 'relative',\n    width: '100%',\n    height: '100%',\n    maxHeight: '100vh',\n    maxWidth: '100vw',\n    aspectRatio: '16 / 9',\n  } as React.CSSProperties,\n};\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireWildcard","require","THEOplayer","_THEOplayerWebAdapter","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","THEOplayerView","props","config","children","player","useRef","adapter","container","useEffect","current","_props$onPlayerReady","chromeless","undefined","updatedConfig","allowNativeFullscreen","ChromelessPlayer","Player","ui","fluid","THEOplayerWebAdapter","window","nativePlayer","onPlayerReady","_adapter$current","onPlayerDestroy","destroy","createElement","Fragment","ref","style","styles","className","display","position","width","height","maxHeight","maxWidth","aspectRatio"],"sources":["THEOplayerView.web.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport type { THEOplayerViewProps } from 'react-native-theoplayer';\nimport * as THEOplayer from 'theoplayer';\nimport { THEOplayerWebAdapter } from './adapter/THEOplayerWebAdapter';\n\nexport function THEOplayerView(props: React.PropsWithChildren<THEOplayerViewProps>) {\n  const { config, children } = props;\n  const player = useRef<THEOplayer.ChromelessPlayer | null>(null);\n  const adapter = useRef<THEOplayerWebAdapter | null>(null);\n  const container = useRef<null | HTMLDivElement>(null);\n\n  useEffect(() => {\n    // Create player inside container.\n    if (container.current) {\n      const chromeless = config?.chromeless === true || config?.chromeless === undefined;\n      const updatedConfig = { ...config, allowNativeFullscreen: true };\n      if (chromeless) {\n        player.current = new THEOplayer.ChromelessPlayer(container.current, updatedConfig);\n      } else {\n        player.current = new THEOplayer.Player(container.current, {\n          ...updatedConfig,\n          ui: {\n            fluid: true,\n          },\n        } as THEOplayer.PlayerConfiguration);\n      }\n\n      // Adapt native player to react-native player.\n      adapter.current = new THEOplayerWebAdapter(player.current, config);\n\n      // Expose players for easy access\n      // @ts-ignore\n      window.player = adapter.current;\n\n      // @ts-ignore\n      window.nativePlayer = player;\n\n      // Notify the player is ready\n      props.onPlayerReady?.(adapter.current);\n    }\n\n    // Clean-up\n    return () => {\n      // Notify the player will be destroyed.\n      const { onPlayerDestroy } = props;\n      if (adapter?.current && onPlayerDestroy) {\n        onPlayerDestroy(adapter?.current);\n      }\n      adapter?.current?.destroy();\n    };\n  }, [container]);\n\n  const chromeless = config?.chromeless === undefined || config?.chromeless === true;\n  return (\n    <>\n      <div\n        ref={container}\n        style={styles.container}\n        className={chromeless ? 'theoplayer-container' : 'theoplayer-container video-js theoplayer-skin'}\n      />\n      {children}\n    </>\n  );\n}\n\nconst styles = {\n  // by default stretch the video to cover the container.\n  // Override using the 'theoplayer-container' class.\n  container: {\n    display: 'flex',\n    position: 'relative',\n    width: '100%',\n    height: '100%',\n    maxHeight: '100vh',\n    maxWidth: '100vw',\n    aspectRatio: '16 / 9',\n  } as React.CSSProperties,\n};\n"],"mappings":"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"}

package/lib/commonjs/internal/adapter/NativePlayerState.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["NativePlayerState.ts"],"sourcesContent":["import type { MediaTrack, PreloadType, PresentationMode, SourceDescription, TextTrack, TimeRange } from 'react-native-theoplayer';\nimport type { BackgroundAudioConfiguration } from '../../api/backgroundAudio/BackgroundAudioConfiguration';\nimport type { PiPConfiguration } from 'react-native-theoplayer';\n\nexport interface NativePlayerState {\n  source: SourceDescription | undefined;\n  autoplay: boolean;\n  paused: boolean;\n  seekable: TimeRange[];\n  buffered: TimeRange[];\n  pipConfig: PiPConfiguration;\n  backgroundAudioConfig: BackgroundAudioConfiguration;\n  presentationMode: PresentationMode;\n  muted: boolean;\n  seeking: boolean;\n  volume: number;\n  currentTime: number;\n  duration: number;\n  playbackRate: number;\n  preload: PreloadType;\n  audioTracks: MediaTrack[];\n  videoTracks: MediaTrack[];\n  textTracks: TextTrack[];\n  targetVideoQuality: number | number[] | undefined;\n  selectedVideoTrack: number | undefined;\n  selectedAudioTrack: number | undefined;\n  selectedTextTrack: number | undefined;\n}\n"],"mappings":""}
+{"version":3,"names":[],"sources":["NativePlayerState.ts"],"sourcesContent":["import type { MediaTrack, PreloadType, PresentationMode, SourceDescription, TextTrack, TimeRange } from 'react-native-theoplayer';\nimport type { BackgroundAudioConfiguration } from '../../api/backgroundAudio/BackgroundAudioConfiguration';\nimport type { PiPConfiguration } from 'react-native-theoplayer';\nimport type { AspectRatio } from 'react-native-theoplayer';\n\nexport interface NativePlayerState {\n  source: SourceDescription | undefined;\n  autoplay: boolean;\n  paused: boolean;\n  seekable: TimeRange[];\n  buffered: TimeRange[];\n  pipConfig: PiPConfiguration;\n  backgroundAudioConfig: BackgroundAudioConfiguration;\n  presentationMode: PresentationMode;\n  muted: boolean;\n  seeking: boolean;\n  volume: number;\n  currentTime: number;\n  duration: number;\n  playbackRate: number;\n  preload: PreloadType;\n  aspectRatio: AspectRatio;\n  audioTracks: MediaTrack[];\n  videoTracks: MediaTrack[];\n  textTracks: TextTrack[];\n  targetVideoQuality: number | number[] | undefined;\n  selectedVideoTrack: number | undefined;\n  selectedAudioTrack: number | undefined;\n  selectedTextTrack: number | undefined;\n}\n"],"mappings":""}

package/lib/commonjs/internal/adapter/THEOplayerAdapter.js

@@ -34,6 +34,7 @@ const defaultPlayerState = {
   duration: NaN,
   playbackRate: 1,
   preload: 'none',
+  aspectRatio: _reactNativeTheoplayer.AspectRatio.FIT,
   audioTracks: [],
   videoTracks: [],
   textTracks: [],
@@ -372,6 +373,13 @@ class THEOplayerAdapter extends _DefaultEventDispatcher.DefaultEventDispatcher {
     this._state.volume = volume;
     _reactNative.NativeModules.PlayerModule.setVolume(this._view.nativeHandle, volume);
   }
+  get aspectRatio() {
+    return this._state.aspectRatio;
+  }
+  set aspectRatio(ratio) {
+    this._state.aspectRatio = ratio;
+    _reactNative.NativeModules.PlayerModule.setAspectRatio(this._view.nativeHandle, ratio);
+  }
   pause() {
     this._state.paused = true;
     _reactNative.NativeModules.PlayerModule.setPaused(this._view.nativeHandle, true);