feat: add technical stream info overlay for MPV player

modules/mpv-player/src/MpvPlayer.types.ts

@@ -89,6 +89,8 @@ export interface MpvPlayerViewRef {
   // Video scaling
   setZoomedToFill: (zoomed: boolean) => Promise<void>;
   isZoomedToFill: () => Promise<boolean>;
+  // Technical info
+  getTechnicalInfo: () => Promise<TechnicalInfo>;
 }
 
 export type SubtitleTrack = {
@@ -106,3 +108,15 @@ export type AudioTrack = {
   channels?: number;
   selected?: boolean;
 };
+
+export type TechnicalInfo = {
+  videoWidth?: number;
+  videoHeight?: number;
+  videoCodec?: string;
+  audioCodec?: string;
+  fps?: number;
+  videoBitrate?: number;
+  audioBitrate?: number;
+  cacheSeconds?: number;
+  droppedFrames?: number;
+};

modules/mpv-player/src/MpvPlayerView.tsx

@@ -101,6 +101,10 @@ export default React.forwardRef<MpvPlayerViewRef, MpvPlayerViewProps>(
       isZoomedToFill: async () => {
         return await nativeRef.current?.isZoomedToFill();
       },
+      // Technical info
+      getTechnicalInfo: async () => {
+        return await nativeRef.current?.getTechnicalInfo();
+      },
     }));
 
     return <NativeView ref={nativeRef} {...props} />;