react-native-tpstreams 0.2.0 → 0.2.2

package/README.md

@@ -2,24 +2,33 @@
 
 Video player component for TPStreams
 
+---
+
 ## Installation
 
 ```sh
 npm install react-native-tpstreams
 ```
 
-## Usage
+---
+
+## Getting Started
+
+### Initialize TPStreams
 
-Initialize TPStreams with your organization ID:
+First, initialize TPStreams with your organization ID. This should be done **only once** at your app's entry point (e.g., App.js or index.js):
 
 ```js
 import { TPStreams } from "react-native-tpstreams";
 
 // Initialize with your organization ID
+// Do this only once at your app's entry point
 TPStreams.initialize('YOUR_ORGANIZATION_ID');
 ```
 
-Then use the player component:
+### Add the Player Component
+
+Then add the player component to your app:
 
 ```js
 import { TPStreamsPlayerView } from "react-native-tpstreams";
@@ -32,6 +41,100 @@ import { TPStreamsPlayerView } from "react-native-tpstreams";
 />
 ```
 
+---
+
+## Player Methods
+
+- `play()`: Starts video playback.
+
+- `pause()`: Pauses video playback.
+
+- `seekTo(positionMs: number)`: Seeks to position in milliseconds.
+
+- `setPlaybackSpeed(speed: number)`: Sets playback speed (e.g., 0.5, 1.0, 2.0).
+
+- `getCurrentPosition()`: Gets current position in milliseconds. Returns `Promise<number>`.
+
+- `getDuration()`: Gets video duration in milliseconds. Returns `Promise<number>`.
+
+- `isPlaying()`: Checks if video is currently playing. Returns `Promise<boolean>`.
+
+- `getPlaybackSpeed()`: Gets current playback speed. Returns `Promise<number>`.
+
+---
+
+## Player Events
+
+- `onPlayerStateChanged(state: number)`: Fires when player state changes.
+
+- `onIsPlayingChanged(isPlaying: boolean)`: Fires when playing state changes.
+
+- `onPlaybackSpeedChanged(speed: number)`: Fires when playback speed changes.
+
+- `onIsLoadingChanged(isLoading: boolean)`: Fires when loading state changes.
+
+- `onError(error: {message: string, code: number, details?: string})`: Fires when an error occurs.
+
+---
+
+## Example
+
+```js
+import { useRef } from 'react';
+import { View, Button } from 'react-native';
+import { TPStreamsPlayerView } from 'react-native-tpstreams';
+import type { TPStreamsPlayerRef } from 'react-native-tpstreams';
+
+function TPStreamsPlayerExample() {
+  const playerRef = useRef<TPStreamsPlayerRef>(null);
+  
+  const handlePlay = () => {
+    playerRef.current?.play();
+  };
+  
+  const handlePause = () => {
+    playerRef.current?.pause();
+  };
+  
+  const handleSeek = () => {
+    playerRef.current?.seekTo(30000); // 30 seconds
+  };
+  
+  const checkPosition = async () => {
+    try {
+      const position = await playerRef.current?.getCurrentPosition();
+      console.log(`Current position: ${position}ms`);
+    } catch (error) {
+      console.error('Error getting position:', error);
+    }
+  };
+  
+  return (
+    <View>
+      <TPStreamsPlayerView
+        ref={playerRef}
+        videoId="YOUR_VIDEO_ID"
+        accessToken="YOUR_ACCESS_TOKEN"
+        style={{ height: 250 }}
+        onPlayerStateChanged={(state) => console.log(`Player state: ${state}`)}
+        onIsPlayingChanged={(isPlaying) => console.log(`Is playing: ${isPlaying}`)}
+        onPlaybackSpeedChanged={(speed) => console.log(`Speed changed: ${speed}x`)}
+        onIsLoadingChanged={(isLoading) => console.log(`Loading: ${isLoading}`)}
+        onError={(error) => console.error('Player error:', error)}
+      />
+      
+      <Button title="Play" onPress={handlePlay} />
+      <Button title="Pause" onPress={handlePause} />
+      <Button title="Seek to 30s" onPress={handleSeek} />
+      <Button title="2x Speed" onPress={() => playerRef.current?.setPlaybackSpeed(2.0)} />
+      <Button title="Get Position" onPress={checkPosition} />
+    </View>
+  );
+}
+```
+
+---
+
 ## Contributing
 
 See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
@@ -40,6 +143,4 @@ See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the
 
 MIT
 
----
-
-Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
+---

package/android/build.gradle

@@ -84,7 +84,7 @@ def kotlin_version = getExtOrDefault("kotlinVersion")
 dependencies {
   implementation "com.facebook.react:react-android"
   implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
-  implementation "com.tpstreams:tpstreams-player:0.0.1"
+  implementation "com.tpstreams:tpstreams-player:0.0.2"
 }
 
 react {

package/android/src/main/java/com/tpstreams/TPStreamsRNPlayerView.kt

@@ -2,14 +2,20 @@ package com.tpstreams
 
 import android.util.Log
 import android.widget.FrameLayout
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.ReactContext
 import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.events.RCTEventEmitter
 import com.tpstreams.player.TPStreamsPlayer
 import com.tpstreams.player.TPStreamsPlayerView
+import androidx.media3.common.Player
+import androidx.media3.common.PlaybackParameters
+import androidx.media3.common.PlaybackException
 
 class TPStreamsRNPlayerView(context: ThemedReactContext) : FrameLayout(context) {
-
     private val playerView: TPStreamsPlayerView = TPStreamsPlayerView(context)
     private var player: TPStreamsPlayer? = null
+    private val reactContext: ReactContext = context
 
     private var videoId: String? = null
     private var accessToken: String? = null
@@ -18,6 +24,31 @@ class TPStreamsRNPlayerView(context: ThemedReactContext) : FrameLayout(context)
         addView(playerView, LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT))
     }
 
+    // Emit React Native events
+    private fun emitEvent(eventName: String, data: Map<String, Any>) {
+        val event = Arguments.createMap()
+        data.forEach { (key, value) ->
+            when (value) {
+                is Int -> event.putInt(key, value)
+                is Double -> event.putDouble(key, value)
+                is Boolean -> event.putBoolean(key, value)
+                is String -> event.putString(key, value)
+                else -> Log.w("TPStreamsRN", "Unsupported type for event data: ${value::class.java}")
+            }
+        }
+        reactContext.getJSModule(RCTEventEmitter::class.java)
+            .receiveEvent(id, eventName, event)
+    }
+
+    private fun sendErrorEvent(message: String, code: Int = 0, details: String? = null) {
+        val event = Arguments.createMap()
+        event.putString("message", message)
+        event.putInt("code", code)
+        details?.let { event.putString("details", it) }
+        reactContext.getJSModule(RCTEventEmitter::class.java)
+            .receiveEvent(id, "onError", event)
+    }
+
     fun setVideoId(videoId: String?) {
         this.videoId = videoId
         tryCreatePlayer()
@@ -34,13 +65,91 @@ class TPStreamsRNPlayerView(context: ThemedReactContext) : FrameLayout(context)
 
         try {
             player = TPStreamsPlayer.create(context, videoId!!, accessToken!!)
+            
+            // Add player event listeners
+            player?.addListener(createPlayerListener())
+            
             playerView.player = player
             playerView.showController()
+            
+            // Send initial events
+            emitEvent("onPlayerStateChanged", mapOf("playbackState" to 0))
+            emitEvent("onIsPlayingChanged", mapOf("isPlaying" to false))
+            emitEvent("onPlaybackSpeedChanged", mapOf("speed" to 1.0))
+            emitEvent("onIsLoadingChanged", mapOf("isLoading" to false))
         } catch (e: Exception) {
             Log.e("TPStreamsRN", "Error creating player", e)
+            sendErrorEvent("Error creating player", 1001, e.message)
         }
     }
 
+    private fun createPlayerListener(): Player.Listener {
+        return object : Player.Listener {
+            override fun onPlaybackStateChanged(playbackState: Int) {
+                emitEvent("onPlayerStateChanged", mapOf("playbackState" to playbackState))
+            }
+            
+            override fun onIsPlayingChanged(isPlaying: Boolean) {
+                emitEvent("onIsPlayingChanged", mapOf("isPlaying" to isPlaying))
+            }
+            
+            override fun onPlaybackParametersChanged(playbackParameters: PlaybackParameters) {
+                emitEvent("onPlaybackSpeedChanged", mapOf("speed" to playbackParameters.speed.toDouble()))
+            }
+            
+            override fun onIsLoadingChanged(isLoading: Boolean) {
+                emitEvent("onIsLoadingChanged", mapOf("isLoading" to isLoading))
+            }
+            
+            override fun onPlayerError(error: PlaybackException) {
+                Log.e("TPStreamsRN", "Player error", error)
+                sendErrorEvent("Playback error", error.errorCode, error.message)
+            }
+        }
+    }
+
+    // Player control methods
+    fun play() {
+        player?.play()
+    }
+    
+    fun pause() {
+        player?.pause()
+    }
+    
+    fun seekTo(positionMs: Long) {
+        player?.seekTo(positionMs)
+    }
+    
+    fun setPlaybackSpeed(speed: Float) {
+        player?.setPlaybackSpeed(speed)
+    }
+
+    // Player information methods with event emission
+    fun getCurrentPosition(): Long {
+        val position = player?.currentPosition ?: 0L
+        emitEvent("onCurrentPosition", mapOf("position" to position.toDouble()))
+        return position
+    }
+
+    fun getDuration(): Long {
+        val duration = player?.duration ?: 0L
+        emitEvent("onDuration", mapOf("duration" to duration.toDouble()))
+        return duration
+    }
+
+    fun isPlaying(): Boolean {
+        val playing = player?.isPlaying ?: false
+        emitEvent("onIsPlaying", mapOf("isPlaying" to playing))
+        return playing
+    }
+
+    fun getPlaybackSpeed(): Float {
+        val speed = player?.playbackParameters?.speed ?: 1.0f
+        emitEvent("onPlaybackSpeed", mapOf("speed" to speed.toDouble()))
+        return speed
+    }
+
     override fun onDetachedFromWindow() {
         super.onDetachedFromWindow()
         try {

package/android/src/main/java/com/tpstreams/TPStreamsRNPlayerViewManager.kt

@@ -1,6 +1,5 @@
 package com.tpstreams
 
-import com.facebook.react.bridge.ReadableMap
 import com.facebook.react.module.annotations.ReactModule
 import com.facebook.react.uimanager.SimpleViewManager
 import com.facebook.react.uimanager.ThemedReactContext
@@ -8,39 +7,91 @@ import com.facebook.react.uimanager.ViewManagerDelegate
 import com.facebook.react.uimanager.annotations.ReactProp
 import com.facebook.react.viewmanagers.TPStreamsRNPlayerViewManagerInterface
 import com.facebook.react.viewmanagers.TPStreamsRNPlayerViewManagerDelegate
+import com.facebook.react.common.MapBuilder
 
 @ReactModule(name = TPStreamsRNPlayerViewManager.NAME)
 class TPStreamsRNPlayerViewManager : SimpleViewManager<TPStreamsRNPlayerView>(),
   TPStreamsRNPlayerViewManagerInterface<TPStreamsRNPlayerView> {
-  private val mDelegate: ViewManagerDelegate<TPStreamsRNPlayerView>
-
-  init {
-    mDelegate = TPStreamsRNPlayerViewManagerDelegate(this)
+  
+  companion object {
+    const val NAME = "TPStreamsRNPlayerView"
+    
+    // Event names
+    private const val EVENT_CURRENT_POSITION = "onCurrentPosition"
+    private const val EVENT_DURATION = "onDuration"
+    private const val EVENT_IS_PLAYING = "onIsPlaying"
+    private const val EVENT_PLAYBACK_SPEED = "onPlaybackSpeed"
+    private const val EVENT_PLAYER_STATE_CHANGED = "onPlayerStateChanged"
+    private const val EVENT_IS_PLAYING_CHANGED = "onIsPlayingChanged"
+    private const val EVENT_PLAYBACK_SPEED_CHANGED = "onPlaybackSpeedChanged"
+    private const val EVENT_IS_LOADING_CHANGED = "onIsLoadingChanged"
+    private const val EVENT_ERROR = "onError"
   }
+  
+  private val mDelegate: ViewManagerDelegate<TPStreamsRNPlayerView> = 
+    TPStreamsRNPlayerViewManagerDelegate(this)
 
-  override fun getDelegate(): ViewManagerDelegate<TPStreamsRNPlayerView>? {
-    return mDelegate
-  }
+  override fun getDelegate(): ViewManagerDelegate<TPStreamsRNPlayerView>? = mDelegate
 
-  override fun getName(): String {
-    return NAME
-  }
+  override fun getName(): String = NAME
 
-  public override fun createViewInstance(context: ThemedReactContext): TPStreamsRNPlayerView {
-    return TPStreamsRNPlayerView(context)
+  override fun getExportedCustomDirectEventTypeConstants(): Map<String, Any> {
+    return MapBuilder.builder<String, Any>()
+      .put(EVENT_CURRENT_POSITION, MapBuilder.of("registrationName", EVENT_CURRENT_POSITION))
+      .put(EVENT_DURATION, MapBuilder.of("registrationName", EVENT_DURATION))
+      .put(EVENT_IS_PLAYING, MapBuilder.of("registrationName", EVENT_IS_PLAYING))
+      .put(EVENT_PLAYBACK_SPEED, MapBuilder.of("registrationName", EVENT_PLAYBACK_SPEED))
+      .put(EVENT_PLAYER_STATE_CHANGED, MapBuilder.of("registrationName", EVENT_PLAYER_STATE_CHANGED))
+      .put(EVENT_IS_PLAYING_CHANGED, MapBuilder.of("registrationName", EVENT_IS_PLAYING_CHANGED))
+      .put(EVENT_PLAYBACK_SPEED_CHANGED, MapBuilder.of("registrationName", EVENT_PLAYBACK_SPEED_CHANGED))
+      .put(EVENT_IS_LOADING_CHANGED, MapBuilder.of("registrationName", EVENT_IS_LOADING_CHANGED))
+      .put(EVENT_ERROR, MapBuilder.of("registrationName", EVENT_ERROR))
+      .build()
   }
 
+  public override fun createViewInstance(context: ThemedReactContext): TPStreamsRNPlayerView =
+    TPStreamsRNPlayerView(context)
+
   @ReactProp(name = "videoId")
   override fun setVideoId(view: TPStreamsRNPlayerView, videoId: String?) {
-      view.setVideoId(videoId)
+    view.setVideoId(videoId)
   }
 
   @ReactProp(name = "accessToken")
   override fun setAccessToken(view: TPStreamsRNPlayerView, accessToken: String?) {
-      view.setAccessToken(accessToken)
+    view.setAccessToken(accessToken)
   }
 
-  companion object {
-    const val NAME = "TPStreamsRNPlayerView"
+  // Command implementations
+  override fun play(view: TPStreamsRNPlayerView) {
+    view.play()
+  }
+  
+  override fun pause(view: TPStreamsRNPlayerView) {
+    view.pause()
+  }
+  
+  override fun seekTo(view: TPStreamsRNPlayerView, positionMs: Double) {
+    view.seekTo(positionMs.toLong())
+  }
+  
+  override fun setPlaybackSpeed(view: TPStreamsRNPlayerView, speed: Float) {
+    view.setPlaybackSpeed(speed)
+  }
+  
+  override fun getCurrentPosition(view: TPStreamsRNPlayerView) {
+    view.getCurrentPosition()
+  }
+  
+  override fun getDuration(view: TPStreamsRNPlayerView) {
+    view.getDuration()
+  }
+  
+  override fun isPlaying(view: TPStreamsRNPlayerView) {
+    view.isPlaying()
+  }
+  
+  override fun getPlaybackSpeed(view: TPStreamsRNPlayerView) {
+    view.getPlaybackSpeed()
   }
 }

package/lib/module/TPStreamsPlayer.js

@@ -0,0 +1,159 @@
+"use strict";
+
+import { forwardRef, useImperativeHandle, useRef, useCallback } from 'react';
+import TPStreamsPlayerNative, { Commands } from './TPStreamsPlayerViewNativeComponent';
+import { jsx as _jsx } from "react/jsx-runtime";
+// Create a unique ID for each instance to track promises
+let nextInstanceId = 0;
+
+// Type for tracking promises waiting to be resolved
+
+// Return type for player API methods
+
+// Prop types for the player component
+
+/**
+ * TPStreamsPlayerView - React component wrapper for TPStreamsPlayerNative
+ * Provides a simple imperative API for controlling the player
+ */
+const TPStreamsPlayerView = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+    videoId,
+    accessToken,
+    style,
+    onPlayerStateChanged,
+    onIsPlayingChanged,
+    onPlaybackSpeedChanged,
+    onIsLoadingChanged,
+    onError,
+    ...restProps
+  } = props;
+  const nativeRef = useRef(null);
+  const instanceId = useRef(nextInstanceId++);
+  const promiseMap = useRef({});
+
+  // Event handlers that resolve promises
+  const onCurrentPosition = useCallback(event => {
+    const key = `position-${instanceId.current}`;
+    const handler = promiseMap.current[key];
+    if (handler) {
+      handler.resolve(event.nativeEvent.position);
+      delete promiseMap.current[key];
+    }
+  }, []);
+  const onDuration = useCallback(event => {
+    const key = `duration-${instanceId.current}`;
+    const handler = promiseMap.current[key];
+    if (handler) {
+      handler.resolve(event.nativeEvent.duration);
+      delete promiseMap.current[key];
+    }
+  }, []);
+  const onIsPlaying = useCallback(event => {
+    const key = `isPlaying-${instanceId.current}`;
+    const handler = promiseMap.current[key];
+    if (handler) {
+      handler.resolve(event.nativeEvent.isPlaying);
+      delete promiseMap.current[key];
+    }
+  }, []);
+  const onPlaybackSpeed = useCallback(event => {
+    const key = `playbackSpeed-${instanceId.current}`;
+    const handler = promiseMap.current[key];
+    if (handler) {
+      handler.resolve(event.nativeEvent.speed);
+      delete promiseMap.current[key];
+    }
+  }, []);
+
+  // Player event handlers
+  const handlePlayerStateChanged = useCallback(event => {
+    onPlayerStateChanged?.(event.nativeEvent.playbackState);
+  }, [onPlayerStateChanged]);
+  const handleIsPlayingChanged = useCallback(event => {
+    onIsPlayingChanged?.(event.nativeEvent.isPlaying);
+  }, [onIsPlayingChanged]);
+  const handlePlaybackSpeedChanged = useCallback(event => {
+    onPlaybackSpeedChanged?.(event.nativeEvent.speed);
+  }, [onPlaybackSpeedChanged]);
+  const handleIsLoadingChanged = useCallback(event => {
+    onIsLoadingChanged?.(event.nativeEvent.isLoading);
+  }, [onIsLoadingChanged]);
+  const handleError = useCallback(event => {
+    const {
+      message,
+      code,
+      details
+    } = event.nativeEvent;
+
+    // Reject any pending promises with this error
+    Object.entries(promiseMap.current).forEach(([key, handler]) => {
+      handler.reject(new Error(`${message}: ${details || 'Unknown error'}`));
+      delete promiseMap.current[key];
+    });
+
+    // Forward the error to the client if they provided an onError handler
+    onError?.({
+      message,
+      code,
+      details
+    });
+  }, [onError]);
+
+  // Helper to create promise-based API methods
+  const createPromiseMethod = useCallback((command, eventKey) => {
+    return () => new Promise((resolve, reject) => {
+      if (nativeRef.current) {
+        const key = `${eventKey}-${instanceId.current}`;
+        promiseMap.current[key] = {
+          resolve,
+          reject
+        };
+        command(nativeRef.current);
+
+        // Set a timeout to reject the promise if it's not resolved in time
+        setTimeout(() => {
+          if (promiseMap.current[key]) {
+            reject(new Error(`Timeout getting ${eventKey}`));
+            delete promiseMap.current[key];
+          }
+        }, 5000);
+      } else {
+        reject(new Error('Player is not initialized'));
+      }
+    });
+  }, []);
+  useImperativeHandle(ref, () => ({
+    play: () => nativeRef.current && Commands.play(nativeRef.current),
+    pause: () => nativeRef.current && Commands.pause(nativeRef.current),
+    seekTo: positionMs => nativeRef.current && Commands.seekTo(nativeRef.current, positionMs),
+    setPlaybackSpeed: speed => nativeRef.current && Commands.setPlaybackSpeed(nativeRef.current, speed),
+    getCurrentPosition: createPromiseMethod(Commands.getCurrentPosition, 'position'),
+    getDuration: createPromiseMethod(Commands.getDuration, 'duration'),
+    isPlaying: createPromiseMethod(Commands.isPlaying, 'isPlaying'),
+    getPlaybackSpeed: createPromiseMethod(Commands.getPlaybackSpeed, 'speed')
+  }), [createPromiseMethod]);
+
+  // Create native props object with the correct types
+  const nativeProps = {
+    ...restProps,
+    videoId,
+    accessToken,
+    style,
+    onCurrentPosition,
+    onDuration,
+    onIsPlaying,
+    onPlaybackSpeed,
+    onPlayerStateChanged: handlePlayerStateChanged,
+    onIsPlayingChanged: handleIsPlayingChanged,
+    onPlaybackSpeedChanged: handlePlaybackSpeedChanged,
+    onIsLoadingChanged: handleIsLoadingChanged,
+    onError: handleError
+  };
+  return /*#__PURE__*/_jsx(TPStreamsPlayerNative, {
+    ...nativeProps,
+    ref: nativeRef
+  });
+});
+export default TPStreamsPlayerView;
+//# sourceMappingURL=TPStreamsPlayer.js.map

package/lib/module/TPStreamsPlayer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["forwardRef","useImperativeHandle","useRef","useCallback","TPStreamsPlayerNative","Commands","jsx","_jsx","nextInstanceId","TPStreamsPlayerView","props","ref","videoId","accessToken","style","onPlayerStateChanged","onIsPlayingChanged","onPlaybackSpeedChanged","onIsLoadingChanged","onError","restProps","nativeRef","instanceId","promiseMap","onCurrentPosition","event","key","current","handler","resolve","nativeEvent","position","onDuration","duration","onIsPlaying","isPlaying","onPlaybackSpeed","speed","handlePlayerStateChanged","playbackState","handleIsPlayingChanged","handlePlaybackSpeedChanged","handleIsLoadingChanged","isLoading","handleError","message","code","details","Object","entries","forEach","reject","Error","createPromiseMethod","command","eventKey","Promise","setTimeout","play","pause","seekTo","positionMs","setPlaybackSpeed","getCurrentPosition","getDuration","getPlaybackSpeed","nativeProps"],"sourceRoot":"../../src","sources":["TPStreamsPlayer.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/TPStreamsPlayerViewNativeComponent.ts

@@ -1,9 +1,70 @@
 import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
 import type { ViewProps } from 'react-native';
+import type {
+  Double,
+  Float,
+  Int32,
+} from 'react-native/Libraries/Types/CodegenTypes';
+import type { HostComponent } from 'react-native';
+import type { DirectEventHandler } from 'react-native/Libraries/Types/CodegenTypes';
+import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands';
 
-interface NativeProps extends ViewProps {
+export interface ErrorEvent {
+  message: string;
+  code: Int32;
+  details?: string;
+}
+
+export interface NativeProps extends ViewProps {
   videoId?: string;
   accessToken?: string;
+
+  // Event props for receiving data from native methods
+  onCurrentPosition?: DirectEventHandler<{ position: Double }>;
+  onDuration?: DirectEventHandler<{ duration: Double }>;
+  onIsPlaying?: DirectEventHandler<{ isPlaying: boolean }>;
+  onPlaybackSpeed?: DirectEventHandler<{ speed: Float }>;
+
+  // Player event props
+  onPlayerStateChanged?: DirectEventHandler<{ playbackState: Int32 }>;
+  onIsPlayingChanged?: DirectEventHandler<{ isPlaying: boolean }>;
+  onPlaybackSpeedChanged?: DirectEventHandler<{ speed: Double }>;
+  onIsLoadingChanged?: DirectEventHandler<{ isLoading: boolean }>;
+  onError?: DirectEventHandler<ErrorEvent>;
 }
 
+interface TPStreamsPlayerViewCommands {
+  play: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+  pause: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+  seekTo: (
+    viewRef: React.ElementRef<HostComponent<NativeProps>>,
+    positionMs: Double
+  ) => void;
+  setPlaybackSpeed: (
+    viewRef: React.ElementRef<HostComponent<NativeProps>>,
+    speed: Float
+  ) => void;
+  getCurrentPosition: (
+    viewRef: React.ElementRef<HostComponent<NativeProps>>
+  ) => void;
+  getDuration: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+  isPlaying: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+  getPlaybackSpeed: (
+    viewRef: React.ElementRef<HostComponent<NativeProps>>
+  ) => void;
+}
+
+export const Commands = codegenNativeCommands<TPStreamsPlayerViewCommands>({
+  supportedCommands: [
+    'play',
+    'pause',
+    'seekTo',
+    'setPlaybackSpeed',
+    'getCurrentPosition',
+    'getDuration',
+    'isPlaying',
+    'getPlaybackSpeed',
+  ],
+});
+
 export default codegenNativeComponent<NativeProps>('TPStreamsRNPlayerView');

package/lib/module/index.js

@@ -1,8 +1,12 @@
 "use strict";
 
 import { NativeModules } from 'react-native';
-export { default as TPStreamsPlayerView } from './TPStreamsPlayerViewNativeComponent';
+// Export the native component with a different name to avoid conflicts
+export { default as TPStreamsPlayerNative } from './TPStreamsPlayerViewNativeComponent';
 export * from './TPStreamsPlayerViewNativeComponent';
+
+// Export the wrapper component as TPStreamsPlayerView
+export { default as TPStreamsPlayerView } from "./TPStreamsPlayer.js";
 const TPStreamsModule = NativeModules.TPStreams;
 export const TPStreams = {
   initialize: organizationId => {

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["NativeModules","default","TPStreamsPlayerView","TPStreamsModule","TPStreams","initialize","organizationId"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,cAAc;AAC5C,SAASC,OAAO,IAAIC,mBAAmB,QAAQ,sCAAsC;AACrF,cAAc,sCAAsC;AAEpD,MAAMC,eAAe,GAAGH,aAAa,CAACI,SAAS;AAE/C,OAAO,MAAMA,SAAS,GAAG;EACvBC,UAAU,EAAGC,cAAsB,IAAW;IAC5CH,eAAe,CAACE,UAAU,CAACC,cAAc,CAAC;EAC5C;AACF,CAAC","ignoreList":[]}
+{"version":3,"names":["NativeModules","default","TPStreamsPlayerNative","TPStreamsPlayerView","TPStreamsModule","TPStreams","initialize","organizationId"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,cAAc;AAC5C;AACA,SAASC,OAAO,IAAIC,qBAAqB,QAAQ,sCAAsC;AACvF,cAAc,sCAAsC;;AAEpD;AACA,SAASD,OAAO,IAAIE,mBAAmB,QAAQ,sBAAmB;AAGlE,MAAMC,eAAe,GAAGJ,aAAa,CAACK,SAAS;AAE/C,OAAO,MAAMA,SAAS,GAAG;EACvBC,UAAU,EAAGC,cAAsB,IAAW;IAC5CH,eAAe,CAACE,UAAU,CAACC,cAAc,CAAC;EAC5C;AACF,CAAC","ignoreList":[]}

package/lib/typescript/src/TPStreamsPlayer.d.ts

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+import type { ViewProps } from 'react-native';
+export interface TPStreamsPlayerRef {
+    play: () => void;
+    pause: () => void;
+    seekTo: (positionMs: number) => void;
+    setPlaybackSpeed: (speed: number) => void;
+    getCurrentPosition: () => Promise<number>;
+    getDuration: () => Promise<number>;
+    isPlaying: () => Promise<boolean>;
+    getPlaybackSpeed: () => Promise<number>;
+}
+export interface TPStreamsPlayerProps extends ViewProps {
+    videoId?: string;
+    accessToken?: string;
+    onPlayerStateChanged?: (state: number) => void;
+    onIsPlayingChanged?: (isPlaying: boolean) => void;
+    onPlaybackSpeedChanged?: (speed: number) => void;
+    onIsLoadingChanged?: (isLoading: boolean) => void;
+    onError?: (error: {
+        message: string;
+        code: number;
+        details?: string;
+    }) => void;
+}
+/**
+ * TPStreamsPlayerView - React component wrapper for TPStreamsPlayerNative
+ * Provides a simple imperative API for controlling the player
+ */
+declare const TPStreamsPlayerView: import("react").ForwardRefExoticComponent<TPStreamsPlayerProps & import("react").RefAttributes<TPStreamsPlayerRef>>;
+export default TPStreamsPlayerView;
+//# sourceMappingURL=TPStreamsPlayer.d.ts.map

package/lib/typescript/src/TPStreamsPlayer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TPStreamsPlayer.d.ts","sourceRoot":"","sources":["../../../src/TPStreamsPlayer.tsx"],"names":[],"mappings":";AAQA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAc9C,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,MAAM,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,kBAAkB,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;IAC1C,WAAW,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;IACnC,SAAS,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC;IAClC,gBAAgB,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;CACzC;AAGD,MAAM,WAAW,oBAAqB,SAAQ,SAAS;IACrD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,kBAAkB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,sBAAsB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,kBAAkB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE;QAChB,OAAO,EAAE,MAAM,CAAC;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,KAAK,IAAI,CAAC;CACZ;AAED;;;GAGG;AACH,QAAA,MAAM,mBAAmB,qHAsKvB,CAAC;AAEH,eAAe,mBAAmB,CAAC"}

package/lib/typescript/src/TPStreamsPlayerViewNativeComponent.d.ts

@@ -1,9 +1,54 @@
+/// <reference types="react" />
 /// <reference types="react-native/types/modules/Codegen" />
 import type { ViewProps } from 'react-native';
-interface NativeProps extends ViewProps {
+import type { Double, Float, Int32 } from 'react-native/Libraries/Types/CodegenTypes';
+import type { HostComponent } from 'react-native';
+import type { DirectEventHandler } from 'react-native/Libraries/Types/CodegenTypes';
+export interface ErrorEvent {
+    message: string;
+    code: Int32;
+    details?: string;
+}
+export interface NativeProps extends ViewProps {
     videoId?: string;
     accessToken?: string;
+    onCurrentPosition?: DirectEventHandler<{
+        position: Double;
+    }>;
+    onDuration?: DirectEventHandler<{
+        duration: Double;
+    }>;
+    onIsPlaying?: DirectEventHandler<{
+        isPlaying: boolean;
+    }>;
+    onPlaybackSpeed?: DirectEventHandler<{
+        speed: Float;
+    }>;
+    onPlayerStateChanged?: DirectEventHandler<{
+        playbackState: Int32;
+    }>;
+    onIsPlayingChanged?: DirectEventHandler<{
+        isPlaying: boolean;
+    }>;
+    onPlaybackSpeedChanged?: DirectEventHandler<{
+        speed: Double;
+    }>;
+    onIsLoadingChanged?: DirectEventHandler<{
+        isLoading: boolean;
+    }>;
+    onError?: DirectEventHandler<ErrorEvent>;
+}
+interface TPStreamsPlayerViewCommands {
+    play: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+    pause: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+    seekTo: (viewRef: React.ElementRef<HostComponent<NativeProps>>, positionMs: Double) => void;
+    setPlaybackSpeed: (viewRef: React.ElementRef<HostComponent<NativeProps>>, speed: Float) => void;
+    getCurrentPosition: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+    getDuration: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+    isPlaying: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+    getPlaybackSpeed: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
 }
+export declare const Commands: TPStreamsPlayerViewCommands;
 declare const _default: import("react-native/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeProps>;
 export default _default;
 //# sourceMappingURL=TPStreamsPlayerViewNativeComponent.d.ts.map

package/lib/typescript/src/TPStreamsPlayerViewNativeComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TPStreamsPlayerViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/TPStreamsPlayerViewNativeComponent.ts"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,UAAU,WAAY,SAAQ,SAAS;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;;AAED,wBAA4E"}
+{"version":3,"file":"TPStreamsPlayerViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/TPStreamsPlayerViewNativeComponent.ts"],"names":[],"mappings":";;AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EACV,MAAM,EACN,KAAK,EACL,KAAK,EACN,MAAM,2CAA2C,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2CAA2C,CAAC;AAGpF,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,KAAK,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IAGrB,iBAAiB,CAAC,EAAE,kBAAkB,CAAC;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7D,UAAU,CAAC,EAAE,kBAAkB,CAAC;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACtD,WAAW,CAAC,EAAE,kBAAkB,CAAC;QAAE,SAAS,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzD,eAAe,CAAC,EAAE,kBAAkB,CAAC;QAAE,KAAK,EAAE,KAAK,CAAA;KAAE,CAAC,CAAC;IAGvD,oBAAoB,CAAC,EAAE,kBAAkB,CAAC;QAAE,aAAa,EAAE,KAAK,CAAA;KAAE,CAAC,CAAC;IACpE,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;QAAE,SAAS,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IAChE,sBAAsB,CAAC,EAAE,kBAAkB,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC/D,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;QAAE,SAAS,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IAChE,OAAO,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;CAC1C;AAED,UAAU,2BAA2B;IACnC,IAAI,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,KAAK,IAAI,CAAC;IACtE,KAAK,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,KAAK,IAAI,CAAC;IACvE,MAAM,EAAE,CACN,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,EACrD,UAAU,EAAE,MAAM,KACf,IAAI,CAAC;IACV,gBAAgB,EAAE,CAChB,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,EACrD,KAAK,EAAE,KAAK,KACT,IAAI,CAAC;IACV,kBAAkB,EAAE,CAClB,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,KAClD,IAAI,CAAC;IACV,WAAW,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,KAAK,IAAI,CAAC;IAC7E,SAAS,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,KAAK,IAAI,CAAC;IAC3E,gBAAgB,EAAE,CAChB,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,KAClD,IAAI,CAAC;CACX;AAED,eAAO,MAAM,QAAQ,6BAWnB,CAAC;;AAEH,wBAA4E"}

package/lib/typescript/src/index.d.ts

@@ -1,5 +1,7 @@
-export { default as TPStreamsPlayerView } from './TPStreamsPlayerViewNativeComponent';
+export { default as TPStreamsPlayerNative } from './TPStreamsPlayerViewNativeComponent';
 export * from './TPStreamsPlayerViewNativeComponent';
+export { default as TPStreamsPlayerView } from './TPStreamsPlayer';
+export type { TPStreamsPlayerRef } from './TPStreamsPlayer';
 export declare const TPStreams: {
     initialize: (organizationId: string) => void;
 };

package/lib/typescript/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AACtF,cAAc,sCAAsC,CAAC;AAIrD,eAAO,MAAM,SAAS;iCACS,MAAM,KAAG,IAAI;CAG3C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AACxF,cAAc,sCAAsC,CAAC;AAGrD,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACnE,YAAY,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAI5D,eAAO,MAAM,SAAS;iCACS,MAAM,KAAG,IAAI;CAG3C,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-tpstreams",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "Video component for TPStreams",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",

package/src/TPStreamsPlayer.tsx

@@ -0,0 +1,221 @@
+import { forwardRef, useImperativeHandle, useRef, useCallback } from 'react';
+import TPStreamsPlayerNative, {
+  Commands,
+} from './TPStreamsPlayerViewNativeComponent';
+import type {
+  NativeProps,
+  ErrorEvent,
+} from './TPStreamsPlayerViewNativeComponent';
+import type { ViewProps } from 'react-native';
+
+// Create a unique ID for each instance to track promises
+let nextInstanceId = 0;
+
+// Type for tracking promises waiting to be resolved
+type PromiseMap = {
+  [key: string]: {
+    resolve: (value: any) => void;
+    reject: (reason?: any) => void;
+  };
+};
+
+// Return type for player API methods
+export interface TPStreamsPlayerRef {
+  play: () => void;
+  pause: () => void;
+  seekTo: (positionMs: number) => void;
+  setPlaybackSpeed: (speed: number) => void;
+  getCurrentPosition: () => Promise<number>;
+  getDuration: () => Promise<number>;
+  isPlaying: () => Promise<boolean>;
+  getPlaybackSpeed: () => Promise<number>;
+}
+
+// Prop types for the player component
+export interface TPStreamsPlayerProps extends ViewProps {
+  videoId?: string;
+  accessToken?: string;
+  onPlayerStateChanged?: (state: number) => void;
+  onIsPlayingChanged?: (isPlaying: boolean) => void;
+  onPlaybackSpeedChanged?: (speed: number) => void;
+  onIsLoadingChanged?: (isLoading: boolean) => void;
+  onError?: (error: {
+    message: string;
+    code: number;
+    details?: string;
+  }) => void;
+}
+
+/**
+ * TPStreamsPlayerView - React component wrapper for TPStreamsPlayerNative
+ * Provides a simple imperative API for controlling the player
+ */
+const TPStreamsPlayerView = forwardRef<
+  TPStreamsPlayerRef,
+  TPStreamsPlayerProps
+>((props, ref) => {
+  const {
+    videoId,
+    accessToken,
+    style,
+    onPlayerStateChanged,
+    onIsPlayingChanged,
+    onPlaybackSpeedChanged,
+    onIsLoadingChanged,
+    onError,
+    ...restProps
+  } = props;
+
+  const nativeRef = useRef(null);
+  const instanceId = useRef<number>(nextInstanceId++);
+  const promiseMap = useRef<PromiseMap>({});
+
+  // Event handlers that resolve promises
+  const onCurrentPosition = useCallback((event: any) => {
+    const key = `position-${instanceId.current}`;
+    const handler = promiseMap.current[key];
+    if (handler) {
+      handler.resolve(event.nativeEvent.position);
+      delete promiseMap.current[key];
+    }
+  }, []);
+
+  const onDuration = useCallback((event: any) => {
+    const key = `duration-${instanceId.current}`;
+    const handler = promiseMap.current[key];
+    if (handler) {
+      handler.resolve(event.nativeEvent.duration);
+      delete promiseMap.current[key];
+    }
+  }, []);
+
+  const onIsPlaying = useCallback((event: any) => {
+    const key = `isPlaying-${instanceId.current}`;
+    const handler = promiseMap.current[key];
+    if (handler) {
+      handler.resolve(event.nativeEvent.isPlaying);
+      delete promiseMap.current[key];
+    }
+  }, []);
+
+  const onPlaybackSpeed = useCallback((event: any) => {
+    const key = `playbackSpeed-${instanceId.current}`;
+    const handler = promiseMap.current[key];
+    if (handler) {
+      handler.resolve(event.nativeEvent.speed);
+      delete promiseMap.current[key];
+    }
+  }, []);
+
+  // Player event handlers
+  const handlePlayerStateChanged = useCallback(
+    (event: any) => {
+      onPlayerStateChanged?.(event.nativeEvent.playbackState);
+    },
+    [onPlayerStateChanged]
+  );
+
+  const handleIsPlayingChanged = useCallback(
+    (event: any) => {
+      onIsPlayingChanged?.(event.nativeEvent.isPlaying);
+    },
+    [onIsPlayingChanged]
+  );
+
+  const handlePlaybackSpeedChanged = useCallback(
+    (event: any) => {
+      onPlaybackSpeedChanged?.(event.nativeEvent.speed);
+    },
+    [onPlaybackSpeedChanged]
+  );
+
+  const handleIsLoadingChanged = useCallback(
+    (event: any) => {
+      onIsLoadingChanged?.(event.nativeEvent.isLoading);
+    },
+    [onIsLoadingChanged]
+  );
+
+  const handleError = useCallback(
+    (event: { nativeEvent: ErrorEvent }) => {
+      const { message, code, details } = event.nativeEvent;
+
+      // Reject any pending promises with this error
+      Object.entries(promiseMap.current).forEach(([key, handler]) => {
+        handler.reject(new Error(`${message}: ${details || 'Unknown error'}`));
+        delete promiseMap.current[key];
+      });
+
+      // Forward the error to the client if they provided an onError handler
+      onError?.({ message, code, details });
+    },
+    [onError]
+  );
+
+  // Helper to create promise-based API methods
+  const createPromiseMethod = useCallback(
+    (command: (ref: any) => void, eventKey: string) => {
+      return () =>
+        new Promise<any>((resolve, reject) => {
+          if (nativeRef.current) {
+            const key = `${eventKey}-${instanceId.current}`;
+            promiseMap.current[key] = { resolve, reject };
+            command(nativeRef.current);
+
+            // Set a timeout to reject the promise if it's not resolved in time
+            setTimeout(() => {
+              if (promiseMap.current[key]) {
+                reject(new Error(`Timeout getting ${eventKey}`));
+                delete promiseMap.current[key];
+              }
+            }, 5000);
+          } else {
+            reject(new Error('Player is not initialized'));
+          }
+        });
+    },
+    []
+  );
+
+  useImperativeHandle(
+    ref,
+    () => ({
+      play: () => nativeRef.current && Commands.play(nativeRef.current),
+      pause: () => nativeRef.current && Commands.pause(nativeRef.current),
+      seekTo: (positionMs: number) =>
+        nativeRef.current && Commands.seekTo(nativeRef.current, positionMs),
+      setPlaybackSpeed: (speed: number) =>
+        nativeRef.current &&
+        Commands.setPlaybackSpeed(nativeRef.current, speed),
+      getCurrentPosition: createPromiseMethod(
+        Commands.getCurrentPosition,
+        'position'
+      ),
+      getDuration: createPromiseMethod(Commands.getDuration, 'duration'),
+      isPlaying: createPromiseMethod(Commands.isPlaying, 'isPlaying'),
+      getPlaybackSpeed: createPromiseMethod(Commands.getPlaybackSpeed, 'speed'),
+    }),
+    [createPromiseMethod]
+  );
+
+  // Create native props object with the correct types
+  const nativeProps: NativeProps = {
+    ...restProps,
+    videoId,
+    accessToken,
+    style,
+    onCurrentPosition,
+    onDuration,
+    onIsPlaying,
+    onPlaybackSpeed,
+    onPlayerStateChanged: handlePlayerStateChanged,
+    onIsPlayingChanged: handleIsPlayingChanged,
+    onPlaybackSpeedChanged: handlePlaybackSpeedChanged,
+    onIsLoadingChanged: handleIsLoadingChanged,
+    onError: handleError,
+  };
+
+  return <TPStreamsPlayerNative {...nativeProps} ref={nativeRef} />;
+});
+
+export default TPStreamsPlayerView;

package/src/TPStreamsPlayerViewNativeComponent.ts

@@ -1,9 +1,70 @@
 import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
 import type { ViewProps } from 'react-native';
+import type {
+  Double,
+  Float,
+  Int32,
+} from 'react-native/Libraries/Types/CodegenTypes';
+import type { HostComponent } from 'react-native';
+import type { DirectEventHandler } from 'react-native/Libraries/Types/CodegenTypes';
+import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands';
 
-interface NativeProps extends ViewProps {
+export interface ErrorEvent {
+  message: string;
+  code: Int32;
+  details?: string;
+}
+
+export interface NativeProps extends ViewProps {
   videoId?: string;
   accessToken?: string;
+
+  // Event props for receiving data from native methods
+  onCurrentPosition?: DirectEventHandler<{ position: Double }>;
+  onDuration?: DirectEventHandler<{ duration: Double }>;
+  onIsPlaying?: DirectEventHandler<{ isPlaying: boolean }>;
+  onPlaybackSpeed?: DirectEventHandler<{ speed: Float }>;
+
+  // Player event props
+  onPlayerStateChanged?: DirectEventHandler<{ playbackState: Int32 }>;
+  onIsPlayingChanged?: DirectEventHandler<{ isPlaying: boolean }>;
+  onPlaybackSpeedChanged?: DirectEventHandler<{ speed: Double }>;
+  onIsLoadingChanged?: DirectEventHandler<{ isLoading: boolean }>;
+  onError?: DirectEventHandler<ErrorEvent>;
 }
 
+interface TPStreamsPlayerViewCommands {
+  play: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+  pause: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+  seekTo: (
+    viewRef: React.ElementRef<HostComponent<NativeProps>>,
+    positionMs: Double
+  ) => void;
+  setPlaybackSpeed: (
+    viewRef: React.ElementRef<HostComponent<NativeProps>>,
+    speed: Float
+  ) => void;
+  getCurrentPosition: (
+    viewRef: React.ElementRef<HostComponent<NativeProps>>
+  ) => void;
+  getDuration: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+  isPlaying: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
+  getPlaybackSpeed: (
+    viewRef: React.ElementRef<HostComponent<NativeProps>>
+  ) => void;
+}
+
+export const Commands = codegenNativeCommands<TPStreamsPlayerViewCommands>({
+  supportedCommands: [
+    'play',
+    'pause',
+    'seekTo',
+    'setPlaybackSpeed',
+    'getCurrentPosition',
+    'getDuration',
+    'isPlaying',
+    'getPlaybackSpeed',
+  ],
+});
+
 export default codegenNativeComponent<NativeProps>('TPStreamsRNPlayerView');

package/src/index.tsx

@@ -1,7 +1,12 @@
 import { NativeModules } from 'react-native';
-export { default as TPStreamsPlayerView } from './TPStreamsPlayerViewNativeComponent';
+// Export the native component with a different name to avoid conflicts
+export { default as TPStreamsPlayerNative } from './TPStreamsPlayerViewNativeComponent';
 export * from './TPStreamsPlayerViewNativeComponent';
 
+// Export the wrapper component as TPStreamsPlayerView
+export { default as TPStreamsPlayerView } from './TPStreamsPlayer';
+export type { TPStreamsPlayerRef } from './TPStreamsPlayer';
+
 const TPStreamsModule = NativeModules.TPStreams;
 
 export const TPStreams = {