@100mslive/react-native-hms 0.9.4 → 0.9.5

package/lib/module/classes/HmsView.js

@@ -1,22 +1,24 @@
-import React, { useState, useEffect } from 'react';
-import { requireNativeComponent, StyleSheet } from 'react-native';
-import { HMSVideoViewMode } from '../classes/HMSVideoViewMode';
-const HmsViewComponent = requireNativeComponent('HmsView');
-export const HmsView = _ref => {
-  let {
-    sink,
+import React, { useState, useEffect, useImperativeHandle, useRef } from 'react';
+import { findNodeHandle, requireNativeComponent, StyleSheet, UIManager } from 'react-native';
+import { HMSVideoViewMode } from './HMSVideoViewMode';
+const HmsView = requireNativeComponent('HmsView');
+let _nextRequestId = 1;
+
+let _requestMap = new Map();
+
+export const HmsViewComponent = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const {
     trackId,
-    style,
-    id = null,
+    style = temporaryStyles.customStyle,
+    id = '12345',
     mirror = false,
     setZOrderMediaOverlay = false,
-    scaleType = HMSVideoViewMode.ASPECT_FILL,
-    screenshot = false
-  } = _ref;
+    scaleType = HMSVideoViewMode.ASPECT_FILL
+  } = props;
+  const hmsViewRef = useRef();
   const [tempVal, setTempVal] = useState(0);
   const data = {
     trackId,
-    sink,
     id,
     mirror
   };
@@ -28,18 +30,62 @@ export const HmsView = _ref => {
     }, 2000);
   };
 
+  const _onDataReturned = event => {
+    // We grab the relevant data out of our event.
+    let {
+      requestId,
+      result,
+      error
+    } = event.nativeEvent; // Then we get the promise we saved earlier for the given request ID.
+
+    let promise = _requestMap.get(requestId);
+
+    if (result) {
+      // If it was successful, we resolve the promise.
+      promise.resolve(result);
+    } else {
+      // Otherwise, we reject it.
+      promise.reject(error);
+    } // Finally, we clean up our request map.
+
+
+    _requestMap.delete(requestId);
+  };
+
+  const capture = async () => {
+    let requestId = _nextRequestId++;
+    let requestMap = _requestMap; // We create a promise here that will be resolved once `_onRequestDone` is
+    // called.
+
+    let promise = new Promise(function (resolve, reject) {
+      requestMap.set(requestId, {
+        resolve,
+        reject
+      });
+    });
+    const viewManagerConfig = UIManager.getViewManagerConfig('HmsView');
+    UIManager.dispatchViewManagerCommand(findNodeHandle(hmsViewRef.current), viewManagerConfig.Commands.capture, [requestId]);
+    return promise;
+  };
+
+  useImperativeHandle(ref, () => {
+    return {
+      capture
+    };
+  });
   useEffect(() => {
     setTempVal(0);
   }, [tempVal]);
-  return /*#__PURE__*/React.createElement(HmsViewComponent, {
+  return /*#__PURE__*/React.createElement(HmsView, {
+    ref: hmsViewRef,
     onChange: onChange,
     data: data,
     style: tempVal === 0 ? style : temporaryStyles.customStyle,
     scaleType: scaleType,
     setZOrderMediaOverlay: setZOrderMediaOverlay,
-    screenshot: screenshot
+    onDataReturned: _onDataReturned
   });
-};
+});
 const temporaryStyles = StyleSheet.create({
   customStyle: {
     width: '100%',

package/lib/module/classes/HmsView.js.map

@@ -1 +1 @@
-{"version":3,"sources":["HmsView.tsx"],"names":["React","useState","useEffect","requireNativeComponent","StyleSheet","HMSVideoViewMode","HmsViewComponent","HmsView","sink","trackId","style","id","mirror","setZOrderMediaOverlay","scaleType","ASPECT_FILL","screenshot","tempVal","setTempVal","data","onChange","values","console","log","setTimeout","temporaryStyles","customStyle","create","width","height"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,QAAhB,EAA0BC,SAA1B,QAA2C,OAA3C;AACA,SAASC,sBAAT,EAAiCC,UAAjC,QAA8D,cAA9D;AACA,SAASC,gBAAT,QAAiC,6BAAjC;AAgBA,MAAMC,gBAAgB,GAAGH,sBAAsB,CAAe,SAAf,CAA/C;AAaA,OAAO,MAAMI,OAAO,GAAG,QASE;AAAA,MATD;AACtBC,IAAAA,IADsB;AAEtBC,IAAAA,OAFsB;AAGtBC,IAAAA,KAHsB;AAItBC,IAAAA,EAAE,GAAG,IAJiB;AAKtBC,IAAAA,MAAM,GAAG,KALa;AAMtBC,IAAAA,qBAAqB,GAAG,KANF;AAOtBC,IAAAA,SAAS,GAAGT,gBAAgB,CAACU,WAPP;AAQtBC,IAAAA,UAAU,GAAG;AARS,GASC;AACvB,QAAM,CAACC,OAAD,EAAUC,UAAV,IAAwBjB,QAAQ,CAAC,CAAD,CAAtC;AACA,QAAMkB,IAAI,GAAG;AACXV,IAAAA,OADW;AAEXD,IAAAA,IAFW;AAGXG,IAAAA,EAHW;AAIXC,IAAAA;AAJW,GAAb;;AAOA,QAAMQ,QAAQ,GAAIC,MAAD,IAAiB;AAChCC,IAAAA,OAAO,CAACC,GAAR,CAAYF,MAAZ,EAAoB,QAApB;AACAG,IAAAA,UAAU,CAAC,MAAM;AACfN,MAAAA,UAAU,CAAC,CAAD,CAAV;AACD,KAFS,EAEP,IAFO,CAAV;AAGD,GALD;;AAOAhB,EAAAA,SAAS,CAAC,MAAM;AACdgB,IAAAA,UAAU,CAAC,CAAD,CAAV;AACD,GAFQ,EAEN,CAACD,OAAD,CAFM,CAAT;AAIA,sBACE,oBAAC,gBAAD;AACE,IAAA,QAAQ,EAAEG,QADZ;AAEE,IAAA,IAAI,EAAED,IAFR;AAGE,IAAA,KAAK,EAAEF,OAAO,KAAK,CAAZ,GAAgBP,KAAhB,GAAwBe,eAAe,CAACC,WAHjD;AAIE,IAAA,SAAS,EAAEZ,SAJb;AAKE,IAAA,qBAAqB,EAAED,qBALzB;AAME,IAAA,UAAU,EAAEG;AANd,IADF;AAUD,CAvCM;AAyCP,MAAMS,eAAe,GAAGrB,UAAU,CAACuB,MAAX,CAAkB;AACxCD,EAAAA,WAAW,EAAE;AACXE,IAAAA,KAAK,EAAE,MADI;AAEXC,IAAAA,MAAM,EAAE;AAFG;AAD2B,CAAlB,CAAxB","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { requireNativeComponent, StyleSheet, ViewStyle } from 'react-native';\nimport { HMSVideoViewMode } from '../classes/HMSVideoViewMode';\n\ninterface HmsViewProps {\n  data: {\n    trackId: string;\n    sink: boolean;\n    id?: string | null;\n    mirror: boolean;\n  };\n  setZOrderMediaOverlay: boolean;\n  scaleType: HMSVideoViewMode;\n  screenshot: boolean;\n  style: ViewStyle;\n  onChange: Function;\n}\n\nconst HmsViewComponent = requireNativeComponent<HmsViewProps>('HmsView');\n\ninterface HmsComponentProps {\n  trackId: string;\n  sink: boolean;\n  style: ViewStyle;\n  mirror?: boolean;\n  scaleType?: HMSVideoViewMode;\n  setZOrderMediaOverlay?: boolean;\n  screenshot?: boolean;\n  id?: string | null;\n}\n\nexport const HmsView = ({\n  sink,\n  trackId,\n  style,\n  id = null,\n  mirror = false,\n  setZOrderMediaOverlay = false,\n  scaleType = HMSVideoViewMode.ASPECT_FILL,\n  screenshot = false,\n}: HmsComponentProps) => {\n  const [tempVal, setTempVal] = useState(0);\n  const data = {\n    trackId,\n    sink,\n    id,\n    mirror,\n  };\n\n  const onChange = (values: any) => {\n    console.log(values, 'values');\n    setTimeout(() => {\n      setTempVal(1);\n    }, 2000);\n  };\n\n  useEffect(() => {\n    setTempVal(0);\n  }, [tempVal]);\n\n  return (\n    <HmsViewComponent\n      onChange={onChange}\n      data={data}\n      style={tempVal === 0 ? style : temporaryStyles.customStyle}\n      scaleType={scaleType}\n      setZOrderMediaOverlay={setZOrderMediaOverlay}\n      screenshot={screenshot}\n    />\n  );\n};\n\nconst temporaryStyles = StyleSheet.create({\n  customStyle: {\n    width: '100%',\n    height: '50%',\n  },\n});\n"]}
+{"version":3,"names":["React","useState","useEffect","useImperativeHandle","useRef","findNodeHandle","requireNativeComponent","StyleSheet","UIManager","HMSVideoViewMode","HmsView","_nextRequestId","_requestMap","Map","HmsViewComponent","forwardRef","props","ref","trackId","style","temporaryStyles","customStyle","id","mirror","setZOrderMediaOverlay","scaleType","ASPECT_FILL","hmsViewRef","tempVal","setTempVal","data","onChange","values","console","log","setTimeout","_onDataReturned","event","requestId","result","error","nativeEvent","promise","get","resolve","reject","delete","capture","requestMap","Promise","set","viewManagerConfig","getViewManagerConfig","dispatchViewManagerCommand","current","Commands","create","width","height"],"sources":["HmsView.tsx"],"sourcesContent":["import React, { useState, useEffect, useImperativeHandle, useRef } from 'react';\nimport {\n  findNodeHandle,\n  requireNativeComponent,\n  StyleSheet,\n  UIManager,\n  ViewStyle,\n} from 'react-native';\nimport { HMSVideoViewMode } from './HMSVideoViewMode';\n\ninterface HmsViewProps {\n  data: {\n    trackId: string;\n    id: string;\n    mirror: boolean;\n  };\n  setZOrderMediaOverlay: boolean;\n  scaleType: HMSVideoViewMode;\n  style: ViewStyle;\n  onChange: Function;\n  onDataReturned: Function;\n}\n\nconst HmsView = requireNativeComponent<HmsViewProps>('HmsView');\nlet _nextRequestId = 1;\nlet _requestMap = new Map();\n\ninterface HmsComponentProps {\n  trackId: string;\n  style?: ViewStyle;\n  mirror?: boolean;\n  scaleType?: HMSVideoViewMode;\n  setZOrderMediaOverlay?: boolean;\n  id: string;\n}\n\nexport const HmsViewComponent = React.forwardRef<any, HmsComponentProps>(\n  (props, ref) => {\n    const {\n      trackId,\n      style = temporaryStyles.customStyle,\n      id = '12345',\n      mirror = false,\n      setZOrderMediaOverlay = false,\n      scaleType = HMSVideoViewMode.ASPECT_FILL,\n    } = props;\n\n    const hmsViewRef: any = useRef();\n    const [tempVal, setTempVal] = useState(0);\n    const data = {\n      trackId,\n      id,\n      mirror,\n    };\n\n    const onChange = (values: any) => {\n      console.log(values, 'values');\n      setTimeout(() => {\n        setTempVal(1);\n      }, 2000);\n    };\n\n    const _onDataReturned = (event: {\n      nativeEvent: { requestId: any; result: any; error: any };\n    }) => {\n      // We grab the relevant data out of our event.\n      let { requestId, result, error } = event.nativeEvent;\n      // Then we get the promise we saved earlier for the given request ID.\n      let promise = _requestMap.get(requestId);\n      if (result) {\n        // If it was successful, we resolve the promise.\n        promise.resolve(result);\n      } else {\n        // Otherwise, we reject it.\n        promise.reject(error);\n      }\n      // Finally, we clean up our request map.\n      _requestMap.delete(requestId);\n    };\n\n    const capture = async () => {\n      let requestId = _nextRequestId++;\n      let requestMap = _requestMap;\n\n      // We create a promise here that will be resolved once `_onRequestDone` is\n      // called.\n      let promise = new Promise(function (resolve, reject) {\n        requestMap.set(requestId, { resolve, reject });\n      });\n      const viewManagerConfig = UIManager.getViewManagerConfig('HmsView');\n      UIManager.dispatchViewManagerCommand(\n        findNodeHandle(hmsViewRef.current),\n        viewManagerConfig.Commands.capture,\n        [requestId]\n      );\n      return promise;\n    };\n\n    useImperativeHandle(ref, () => {\n      return {\n        capture,\n      };\n    });\n\n    useEffect(() => {\n      setTempVal(0);\n    }, [tempVal]);\n\n    return (\n      <HmsView\n        ref={hmsViewRef}\n        onChange={onChange}\n        data={data}\n        style={tempVal === 0 ? style : temporaryStyles.customStyle}\n        scaleType={scaleType}\n        setZOrderMediaOverlay={setZOrderMediaOverlay}\n        onDataReturned={_onDataReturned}\n      />\n    );\n  }\n);\n\nconst temporaryStyles = StyleSheet.create({\n  customStyle: {\n    width: '100%',\n    height: '50%',\n  },\n});\n"],"mappings":"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"}

package/lib/module/index.js

@@ -1,7 +1,6 @@
 export * from './classes/HMSConfig';
 export * from './classes/HMSUpdateListenerActions';
 export * from './classes/HMSMessage';
-export * from './classes/HmsView';
 export * from './classes/HMSVideoTrackSettings';
 export * from './classes/HMSVideoTrack';
 export * from './classes/HMSVideoSettings';

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":["HMSSDK","HmsManager"],"mappings":"AAAA,cAAc,qBAAd;AACA,cAAc,oCAAd;AACA,cAAc,sBAAd;AACA,cAAc,mBAAd;AACA,cAAc,iCAAd;AACA,cAAc,yBAAd;AACA,cAAc,4BAAd;AACA,cAAc,yBAAd;AACA,cAAc,4BAAd;AACA,cAAc,oBAAd;AACA,cAAc,wBAAd;AACA,cAAc,gCAAd;AACA,cAAc,gCAAd;AACA,cAAc,qCAAd;AACA,cAAc,kBAAd;AACA,cAAc,mBAAd;AACA,cAAc,gCAAd;AACA,cAAc,mBAAd;AACA,cAAc,+BAAd;AACA,cAAc,yBAAd;AACA,cAAc,+BAAd;AACA,cAAc,8BAAd;AACA,cAAc,0BAAd;AACA,cAAc,mBAAd;AACA,cAAc,8BAAd;AACA,cAAc,wBAAd;AACA,cAAc,8BAAd;AACA,cAAc,qBAAd;AACA,cAAc,sBAAd;AACA,cAAc,iCAAd;AACA,cAAc,yBAAd;AACA,cAAc,4BAAd;AACA,cAAc,yBAAd;AACA,cAAc,yBAAd;AACA,cAAc,yBAAd;AACA,cAAc,0BAAd;AACA,cAAc,qBAAd;AACA,cAAc,uBAAd;AACA,cAAc,4BAAd;AACA,cAAc,sCAAd;AACA,cAAc,sBAAd;AACA,cAAc,4BAAd;AACA,cAAc,2BAAd;AACA,cAAc,wBAAd;AACA,cAAc,iCAAd;AACA,cAAc,mCAAd;AACA,cAAc,oCAAd;AACA,cAAc,yBAAd;AACA,cAAc,wBAAd;AACA,cAAc,mCAAd;AACA,cAAc,yBAAd;AACA,cAAc,gCAAd;AACA,cAAc,8BAAd;AACA,cAAc,8BAAd;AACA,cAAc,8BAAd;AACA,cAAc,uBAAd;AACA,cAAc,6BAAd;AACA,cAAc,+BAAd;AACA,cAAc,+BAAd;AACA,cAAc,iCAAd;AACA,cAAc,gCAAd;AACA,cAAc,+BAAd;AACA,cAAc,mCAAd;AACA,cAAc,6BAAd;AAEA,SAASA,MAAM,IAAIC,UAAnB,QAAqC,kBAArC;AACA,eAAeA,UAAf","sourcesContent":["export * from './classes/HMSConfig';\nexport * from './classes/HMSUpdateListenerActions';\nexport * from './classes/HMSMessage';\nexport * from './classes/HmsView';\nexport * from './classes/HMSVideoTrackSettings';\nexport * from './classes/HMSVideoTrack';\nexport * from './classes/HMSVideoSettings';\nexport * from './classes/HMSVideoCodec';\nexport * from './classes/HMSTrackSettings';\nexport * from './classes/HMSTrack';\nexport * from './classes/HMSTrackType';\nexport * from './classes/HMSSubscribeSettings';\nexport * from './classes/HMSSimulcastSettings';\nexport * from './classes/HMSSimulcastLayerSettings';\nexport * from './classes/HMSSDK';\nexport * from './classes/HMSRoom';\nexport * from './classes/HMSRoleChangeRequest';\nexport * from './classes/HMSRole';\nexport * from './classes/HMSRemoteVideoTrack';\nexport * from './classes/HMSRemotePeer';\nexport * from './classes/HMSRemoteAudioTrack';\nexport * from './classes/HMSPublishSettings';\nexport * from './classes/HMSPermissions';\nexport * from './classes/HMSPeer';\nexport * from './classes/HMSLocalVideoTrack';\nexport * from './classes/HMSLocalPeer';\nexport * from './classes/HMSLocalAudioTrack';\nexport * from './classes/HMSHelper';\nexport * from './classes/HMSEncoder';\nexport * from './classes/HMSAudioTrackSettings';\nexport * from './classes/HMSAudioTrack';\nexport * from './classes/HMSAudioSettings';\nexport * from './classes/HMSAudioCodec';\nexport * from './classes/HMSPeerUpdate';\nexport * from './classes/HMSRoomUpdate';\nexport * from './classes/HMSTrackUpdate';\nexport * from './classes/HMSLogger';\nexport * from './classes/HMSLogLevel';\nexport * from './classes/HMSVideoViewMode';\nexport * from './classes/HMSChangeTrackStateRequest';\nexport * from './classes/HMSSpeaker';\nexport * from './classes/HMSSpeakerUpdate';\nexport * from './classes/HMSCameraFacing';\nexport * from './classes/HMSException';\nexport * from './classes/HMSRtmpStreamingState';\nexport * from './classes/HMSServerRecordingState';\nexport * from './classes/HMSBrowserRecordingState';\nexport * from './classes/HMSRTMPConfig';\nexport * from './classes/HMSHLSConfig';\nexport * from './classes/HMSHLSMeetingURLVariant';\nexport * from './classes/HMSHLSVariant';\nexport * from './classes/HMSHLSStreamingState';\nexport * from './classes/HMSVideoResolution';\nexport * from './classes/HMSLocalAudioStats';\nexport * from './classes/HMSLocalVideoStats';\nexport * from './classes/HMSRTCStats';\nexport * from './classes/HMSRTCStatsReport';\nexport * from './classes/HMSRemoteAudioStats';\nexport * from './classes/HMSRemoteVideoStats';\nexport * from './classes/HMSHLSRecordingConfig';\nexport * from './classes/HMSHLSRecordingState';\nexport * from './classes/HMSMessageRecipient';\nexport * from './classes/HMSMessageRecipientType';\nexport * from './classes/HMSNetworkQuality';\n\nimport { HMSSDK as HmsManager } from './classes/HMSSDK';\nexport default HmsManager;\n"]}
+{"version":3,"names":["HMSSDK","HmsManager"],"sources":["index.ts"],"sourcesContent":["export * from './classes/HMSConfig';\nexport * from './classes/HMSUpdateListenerActions';\nexport * from './classes/HMSMessage';\nexport * from './classes/HMSVideoTrackSettings';\nexport * from './classes/HMSVideoTrack';\nexport * from './classes/HMSVideoSettings';\nexport * from './classes/HMSVideoCodec';\nexport * from './classes/HMSTrackSettings';\nexport * from './classes/HMSTrack';\nexport * from './classes/HMSTrackType';\nexport * from './classes/HMSSubscribeSettings';\nexport * from './classes/HMSSimulcastSettings';\nexport * from './classes/HMSSimulcastLayerSettings';\nexport * from './classes/HMSSDK';\nexport * from './classes/HMSRoom';\nexport * from './classes/HMSRoleChangeRequest';\nexport * from './classes/HMSRole';\nexport * from './classes/HMSRemoteVideoTrack';\nexport * from './classes/HMSRemotePeer';\nexport * from './classes/HMSRemoteAudioTrack';\nexport * from './classes/HMSPublishSettings';\nexport * from './classes/HMSPermissions';\nexport * from './classes/HMSPeer';\nexport * from './classes/HMSLocalVideoTrack';\nexport * from './classes/HMSLocalPeer';\nexport * from './classes/HMSLocalAudioTrack';\nexport * from './classes/HMSHelper';\nexport * from './classes/HMSEncoder';\nexport * from './classes/HMSAudioTrackSettings';\nexport * from './classes/HMSAudioTrack';\nexport * from './classes/HMSAudioSettings';\nexport * from './classes/HMSAudioCodec';\nexport * from './classes/HMSPeerUpdate';\nexport * from './classes/HMSRoomUpdate';\nexport * from './classes/HMSTrackUpdate';\nexport * from './classes/HMSLogger';\nexport * from './classes/HMSLogLevel';\nexport * from './classes/HMSVideoViewMode';\nexport * from './classes/HMSChangeTrackStateRequest';\nexport * from './classes/HMSSpeaker';\nexport * from './classes/HMSSpeakerUpdate';\nexport * from './classes/HMSCameraFacing';\nexport * from './classes/HMSException';\nexport * from './classes/HMSRtmpStreamingState';\nexport * from './classes/HMSServerRecordingState';\nexport * from './classes/HMSBrowserRecordingState';\nexport * from './classes/HMSRTMPConfig';\nexport * from './classes/HMSHLSConfig';\nexport * from './classes/HMSHLSMeetingURLVariant';\nexport * from './classes/HMSHLSVariant';\nexport * from './classes/HMSHLSStreamingState';\nexport * from './classes/HMSVideoResolution';\nexport * from './classes/HMSLocalAudioStats';\nexport * from './classes/HMSLocalVideoStats';\nexport * from './classes/HMSRTCStats';\nexport * from './classes/HMSRTCStatsReport';\nexport * from './classes/HMSRemoteAudioStats';\nexport * from './classes/HMSRemoteVideoStats';\nexport * from './classes/HMSHLSRecordingConfig';\nexport * from './classes/HMSHLSRecordingState';\nexport * from './classes/HMSMessageRecipient';\nexport * from './classes/HMSMessageRecipientType';\nexport * from './classes/HMSNetworkQuality';\n\nimport { HMSSDK as HmsManager } from './classes/HMSSDK';\nexport default HmsManager;\n"],"mappings":"AAAA,cAAc,qBAAd;AACA,cAAc,oCAAd;AACA,cAAc,sBAAd;AACA,cAAc,iCAAd;AACA,cAAc,yBAAd;AACA,cAAc,4BAAd;AACA,cAAc,yBAAd;AACA,cAAc,4BAAd;AACA,cAAc,oBAAd;AACA,cAAc,wBAAd;AACA,cAAc,gCAAd;AACA,cAAc,gCAAd;AACA,cAAc,qCAAd;AACA,cAAc,kBAAd;AACA,cAAc,mBAAd;AACA,cAAc,gCAAd;AACA,cAAc,mBAAd;AACA,cAAc,+BAAd;AACA,cAAc,yBAAd;AACA,cAAc,+BAAd;AACA,cAAc,8BAAd;AACA,cAAc,0BAAd;AACA,cAAc,mBAAd;AACA,cAAc,8BAAd;AACA,cAAc,wBAAd;AACA,cAAc,8BAAd;AACA,cAAc,qBAAd;AACA,cAAc,sBAAd;AACA,cAAc,iCAAd;AACA,cAAc,yBAAd;AACA,cAAc,4BAAd;AACA,cAAc,yBAAd;AACA,cAAc,yBAAd;AACA,cAAc,yBAAd;AACA,cAAc,0BAAd;AACA,cAAc,qBAAd;AACA,cAAc,uBAAd;AACA,cAAc,4BAAd;AACA,cAAc,sCAAd;AACA,cAAc,sBAAd;AACA,cAAc,4BAAd;AACA,cAAc,2BAAd;AACA,cAAc,wBAAd;AACA,cAAc,iCAAd;AACA,cAAc,mCAAd;AACA,cAAc,oCAAd;AACA,cAAc,yBAAd;AACA,cAAc,wBAAd;AACA,cAAc,mCAAd;AACA,cAAc,yBAAd;AACA,cAAc,gCAAd;AACA,cAAc,8BAAd;AACA,cAAc,8BAAd;AACA,cAAc,8BAAd;AACA,cAAc,uBAAd;AACA,cAAc,6BAAd;AACA,cAAc,+BAAd;AACA,cAAc,+BAAd;AACA,cAAc,iCAAd;AACA,cAAc,gCAAd;AACA,cAAc,+BAAd;AACA,cAAc,mCAAd;AACA,cAAc,6BAAd;AAEA,SAASA,MAAM,IAAIC,UAAnB,QAAqC,kBAArC;AACA,eAAeA,UAAf"}

package/lib/typescript/classes/HMSEncoder.d.ts

@@ -19,9 +19,13 @@ import { HMSRemoteAudioTrack } from './HMSRemoteAudioTrack';
 import { HMSRemoteVideoTrack } from './HMSRemoteVideoTrack';
 import { HMSSpeaker } from './HMSSpeaker';
 import { HMSSpeakerUpdate } from './HMSSpeakerUpdate';
-import { HMSBrowserRecordingState, HMSHLSStreamingState, HMSHLSVariant, HMSRtmpStreamingState, HMSServerRecordingState } from '..';
 import { HMSHLSRecordingState } from './HMSHLSRecordingState';
 import { HMSNetworkQuality } from './HMSNetworkQuality';
+import { HMSBrowserRecordingState } from './HMSBrowserRecordingState';
+import { HMSHLSStreamingState } from './HMSHLSStreamingState';
+import { HMSHLSVariant } from './HMSHLSVariant';
+import { HMSRtmpStreamingState } from './HMSRtmpStreamingState';
+import { HMSServerRecordingState } from './HMSServerRecordingState';
 export declare class HMSEncoder {
     static encodeHmsRoom(room: HMSRoom, id: string): HMSRoom;
     static encodeHmsPeers(peers: any, id: string): HMSPeer[];

package/lib/typescript/classes/HMSLogger.d.ts

@@ -1,4 +1,7 @@
 import { HMSLogLevel } from './HMSLogLevel';
+export declare let logger: HMSLogger | undefined;
+export declare const getLogger: () => HMSLogger | undefined;
+export declare const setLogger: (hmsLogger: HMSLogger, id: string) => void;
 export declare class HMSLogger {
     private _verbose;
     private _warning;

package/lib/typescript/classes/HMSSDK.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { ViewStyle } from 'react-native';
 import { HMSUpdateListenerActions } from './HMSUpdateListenerActions';
 import type { HMSConfig } from './HMSConfig';
@@ -14,14 +14,11 @@ import type { HMSVideoViewMode } from './HMSVideoViewMode';
 import type { HMSTrackSettings } from './HMSTrackSettings';
 import type { HMSRTMPConfig } from './HMSRTMPConfig';
 import type { HMSHLSConfig } from './HMSHLSConfig';
-interface HmsComponentProps {
+interface HmsViewProps {
     trackId: string;
-    sink: boolean;
-    style: ViewStyle;
+    style?: ViewStyle;
     mirror?: boolean;
     scaleType?: HMSVideoViewMode;
-    screenshot?: boolean;
-    id?: string | null;
     setZOrderMediaOverlay?: boolean;
 }
 export declare class HMSSDK {
@@ -134,7 +131,6 @@ export declare class HMSSDK {
     /**
      * - HmsView is react component that takes one track and starts showing that track on a tile.
      * - The appearance of tile is completely customizable with style prop.
-     * - setting sink true or false for a video tile will add or remove sink for a video.
      * - scale type can determine how the incoming video will fit in the canvas check {@link HMSVideoViewMode} for more information.
      *
      * checkout {@link https://www.100ms.live/docs/react-native/v2/features/render-video} for more info
@@ -142,7 +138,7 @@ export declare class HMSSDK {
      * @param {HmsComponentProps}
      * @memberof HMSSDK
      */
-    HmsView: ({ sink, trackId, style, mirror, scaleType, screenshot, setZOrderMediaOverlay, }: HmsComponentProps) => JSX.Element;
+    HmsView: React.ForwardRefExoticComponent<HmsViewProps & React.RefAttributes<any>>;
     /**
      * Calls leave function of native sdk and session of current user is invalidated.
      *

package/lib/typescript/classes/HmsView.d.ts

@@ -1,15 +1,13 @@
-/// <reference types="react" />
+import React from 'react';
 import { ViewStyle } from 'react-native';
-import { HMSVideoViewMode } from '../classes/HMSVideoViewMode';
+import { HMSVideoViewMode } from './HMSVideoViewMode';
 interface HmsComponentProps {
     trackId: string;
-    sink: boolean;
-    style: ViewStyle;
+    style?: ViewStyle;
     mirror?: boolean;
     scaleType?: HMSVideoViewMode;
     setZOrderMediaOverlay?: boolean;
-    screenshot?: boolean;
-    id?: string | null;
+    id: string;
 }
-export declare const HmsView: ({ sink, trackId, style, id, mirror, setZOrderMediaOverlay, scaleType, screenshot, }: HmsComponentProps) => JSX.Element;
+export declare const HmsViewComponent: React.ForwardRefExoticComponent<HmsComponentProps & React.RefAttributes<any>>;
 export {};

package/lib/typescript/index.d.ts

@@ -1,7 +1,6 @@
 export * from './classes/HMSConfig';
 export * from './classes/HMSUpdateListenerActions';
 export * from './classes/HMSMessage';
-export * from './classes/HmsView';
 export * from './classes/HMSVideoTrackSettings';
 export * from './classes/HMSVideoTrack';
 export * from './classes/HMSVideoSettings';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@100mslive/react-native-hms",
-  "version": "0.9.4",
+  "version": "0.9.5",
   "description": "The React Native package for 100ms SDK",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -95,7 +95,7 @@
     "prettier": "^2.0.5",
     "react-native-builder-bob": "^0.18.0",
     "release-it": "^14.2.2",
-    "typescript": "^4.1.3"
+    "typescript": "^4.6.3"
   },
   "peerDependencies": {
     "react": "*",

package/react-native-hms.podspec

@@ -16,5 +16,5 @@ Pod::Spec.new do |s|
   s.source_files = "ios/**/*.{h,m,mm,swift}"
 
   s.dependency "React-Core"
-  s.dependency "HMSSDK", "0.2.9"
+  s.dependency "HMSSDK", "0.2.11"
 end

package/src/classes/HMSEncoder.ts

@@ -3,10 +3,8 @@ import { HMSAudioTrack } from './HMSAudioTrack';
 import { HMSVideoTrack } from './HMSVideoTrack';
 import { HMSRoom } from './HMSRoom';
 import { HMSPeer } from './HMSPeer';
-
 import { HMSLocalPeer } from './HMSLocalPeer';
 import { HMSRemotePeer } from './HMSRemotePeer';
-
 import { HMSAudioTrackSettings } from './HMSAudioTrackSettings';
 import { HMSVideoTrackSettings } from './HMSVideoTrackSettings';
 import { HMSLocalVideoTrack } from './HMSLocalVideoTrack';
@@ -21,15 +19,13 @@ import { HMSRemoteAudioTrack } from './HMSRemoteAudioTrack';
 import { HMSRemoteVideoTrack } from './HMSRemoteVideoTrack';
 import { HMSSpeaker } from './HMSSpeaker';
 import { HMSSpeakerUpdate } from './HMSSpeakerUpdate';
-import {
-  HMSBrowserRecordingState,
-  HMSHLSStreamingState,
-  HMSHLSVariant,
-  HMSRtmpStreamingState,
-  HMSServerRecordingState,
-} from '..';
 import { HMSHLSRecordingState } from './HMSHLSRecordingState';
 import { HMSNetworkQuality } from './HMSNetworkQuality';
+import { HMSBrowserRecordingState } from './HMSBrowserRecordingState';
+import { HMSHLSStreamingState } from './HMSHLSStreamingState';
+import { HMSHLSVariant } from './HMSHLSVariant';
+import { HMSRtmpStreamingState } from './HMSRtmpStreamingState';
+import { HMSServerRecordingState } from './HMSServerRecordingState';
 
 export class HMSEncoder {
   static encodeHmsRoom(room: HMSRoom, id: string) {

package/src/classes/HMSLocalAudioTrack.ts

@@ -1,6 +1,6 @@
 import { NativeModules, Platform } from 'react-native';
 import { HMSAudioTrack } from './HMSAudioTrack';
-import { HMSSDK } from './HMSSDK';
+import { getLogger } from './HMSLogger';
 import type { HMSAudioTrackSettings } from './HMSAudioTrackSettings';
 import type { HMSTrackType } from './HMSTrackType';
 
@@ -22,7 +22,7 @@ export class HMSLocalAudioTrack extends HMSAudioTrack {
    * @memberof HMSLocalAudioTrack
    */
   setMute(isMute: boolean) {
-    const logger = HMSSDK.getLogger();
+    const logger = getLogger();
     logger?.verbose('#Function setMute', {
       trackId: this.trackId,
       id: this.id,
@@ -34,7 +34,7 @@ export class HMSLocalAudioTrack extends HMSAudioTrack {
   }
 
   getVolume = async () => {
-    const logger = HMSSDK.getLogger();
+    const logger = getLogger();
     logger?.verbose('#Function getVolume', {
       trackId: this.trackId,
       id: this.id,

package/src/classes/HMSLocalVideoTrack.ts

@@ -1,6 +1,6 @@
 import { NativeModules } from 'react-native';
 import { HMSVideoTrack } from './HMSVideoTrack';
-import { HMSSDK } from './HMSSDK';
+import { getLogger } from './HMSLogger';
 import type { HMSVideoTrackSettings } from './HMSVideoTrackSettings';
 import type { HMSTrackType } from './HMSTrackType';
 
@@ -23,7 +23,7 @@ export class HMSLocalVideoTrack extends HMSVideoTrack {
    * @memberof HMSSDK
    */
   switchCamera = () => {
-    const logger = HMSSDK.getLogger();
+    const logger = getLogger();
     logger?.verbose('#Function switchCamera', {
       trackId: this.trackId,
       source: this.source,
@@ -40,7 +40,7 @@ export class HMSLocalVideoTrack extends HMSVideoTrack {
    * @memberof HMSLocalVideoTrack
    */
   setMute(isMute: boolean) {
-    const logger = HMSSDK.getLogger();
+    const logger = getLogger();
     logger?.verbose('#Function setMute', {
       trackId: this.trackId,
       source: this.source,

package/src/classes/HMSLogger.ts

@@ -1,5 +1,16 @@
 import { HMSLogLevel } from './HMSLogLevel';
 
+export let logger: HMSLogger | undefined;
+
+export const getLogger = () => {
+  return logger;
+};
+
+export const setLogger = (hmsLogger: HMSLogger, id: string) => {
+  logger = hmsLogger;
+  hmsLogger.verbose('#Function setLogger', { id });
+};
+
 export class HMSLogger {
   private _verbose: boolean = false;
   private _warning: boolean = false;

package/src/classes/HMSMessage.ts

@@ -18,7 +18,7 @@ export class HMSMessage {
   }) {
     this.message = params.message;
     this.type = params.type;
-    this.time = new Date(params.time);
+    this.time = new Date(parseInt(params.time));
     this.sender = params.sender;
     this.recipient = params.recipient;
   }

package/src/classes/HMSRemoteAudioTrack.ts

@@ -1,5 +1,5 @@
 import { NativeModules } from 'react-native';
-import { HMSSDK } from './HMSSDK';
+import { getLogger } from './HMSLogger';
 import type { HMSTrackType } from './HMSTrackType';
 import { HMSAudioTrack } from './HMSAudioTrack';
 
@@ -18,7 +18,7 @@ export class HMSRemoteAudioTrack extends HMSAudioTrack {
    * @memberof HMSRemoteAudioTrack
    */
   setPlaybackAllowed(playbackAllowed: boolean) {
-    const logger = HMSSDK.getLogger();
+    const logger = getLogger();
     logger?.verbose('#Function setPlaybackAllowed', {
       trackId: this.trackId,
       id: this.id,
@@ -35,7 +35,7 @@ export class HMSRemoteAudioTrack extends HMSAudioTrack {
 
   isPlaybackAllowed = async () => {
     try {
-      const logger = HMSSDK.getLogger();
+      const logger = getLogger();
       logger?.verbose('#Function isPlaybackAllowed', {
         trackId: this.trackId,
         id: this.id,

package/src/classes/HMSRemoteVideoTrack.ts

@@ -1,5 +1,5 @@
 import { NativeModules } from 'react-native';
-import { HMSSDK } from './HMSSDK';
+import { getLogger } from './HMSLogger';
 import { HMSVideoTrack } from './HMSVideoTrack';
 import type { HMSTrackType } from './HMSTrackType';
 
@@ -20,7 +20,7 @@ export class HMSRemoteVideoTrack extends HMSVideoTrack {
    * @memberof HMSRemoteVideoTrack
    */
   setPlaybackAllowed(playbackAllowed: boolean) {
-    const logger = HMSSDK.getLogger();
+    const logger = getLogger();
     logger?.verbose('#Function setPlaybackAllowed', {
       trackId: this.trackId,
       id: this.id,
@@ -37,7 +37,7 @@ export class HMSRemoteVideoTrack extends HMSVideoTrack {
 
   isPlaybackAllowed = async () => {
     try {
-      const logger = HMSSDK.getLogger();
+      const logger = getLogger();
       logger?.verbose('#Function isPlaybackAllowed', {
         trackId: this.trackId,
         id: this.id,

package/src/classes/HMSSDK.tsx

@@ -7,36 +7,34 @@ import {
   AppState,
 } from 'react-native';
 import { HMSUpdateListenerActions } from './HMSUpdateListenerActions';
+import { HMSEncoder } from './HMSEncoder';
+import { HMSMessage } from './HMSMessage';
+import { HMSHelper } from './HMSHelper';
+import { HmsViewComponent } from './HmsView';
+import { HMSLocalAudioStats } from './HMSLocalAudioStats';
+import { HMSLocalVideoStats } from './HMSLocalVideoStats';
+import { HMSRemoteVideoStats } from './HMSRemoteVideoStats';
+import { HMSRemoteAudioStats } from './HMSRemoteAudioStats';
+import { logger, getLogger, setLogger } from './HMSLogger';
 import type { HMSConfig } from './HMSConfig';
 import type { HMSLocalPeer } from './HMSLocalPeer';
 import type { HMSRemotePeer } from './HMSRemotePeer';
 import type { HMSRoom } from './HMSRoom';
 import type { HMSRole } from './HMSRole';
-import { HMSEncoder } from './HMSEncoder';
-import { HMSMessage } from './HMSMessage';
-import { HMSHelper } from './HMSHelper';
 import type { HMSTrack } from './HMSTrack';
 import type { HMSTrackType } from './HMSTrackType';
 import type { HMSLogger } from './HMSLogger';
 import type { HMSPeer } from './HMSPeer';
-import { HmsView as HMSViewComponent } from './HmsView';
 import type { HMSVideoViewMode } from './HMSVideoViewMode';
 import type { HMSTrackSettings } from './HMSTrackSettings';
 import type { HMSRTMPConfig } from './HMSRTMPConfig';
 import type { HMSHLSConfig } from './HMSHLSConfig';
-import { HMSLocalAudioStats } from './HMSLocalAudioStats';
-import { HMSLocalVideoStats } from './HMSLocalVideoStats';
-import { HMSRemoteVideoStats } from './HMSRemoteVideoStats';
-import { HMSRemoteAudioStats } from './HMSRemoteAudioStats';
 
-interface HmsComponentProps {
+interface HmsViewProps {
   trackId: string;
-  sink: boolean;
-  style: ViewStyle;
+  style?: ViewStyle;
   mirror?: boolean;
   scaleType?: HMSVideoViewMode;
-  screenshot?: boolean;
-  id?: string | null;
   setZOrderMediaOverlay?: boolean;
 }
 
@@ -51,8 +49,6 @@ const HmsEventEmitter = new NativeEventEmitter(HmsManager);
 
 let HmsSdk: HMSSDK | undefined;
 
-let logger: HMSLogger | undefined;
-
 export class HMSSDK {
   room?: HMSRoom;
   localPeer?: HMSLocalPeer;
@@ -107,7 +103,7 @@ export class HMSSDK {
    * @memberof HMSSDK
    */
   static getLogger() {
-    return logger;
+    return getLogger();
   }
 
   /**
@@ -116,8 +112,7 @@ export class HMSSDK {
    * @memberof HMSSDK
    */
   setLogger = (hmsLogger: HMSLogger) => {
-    logger = hmsLogger;
-    hmsLogger.verbose('#Function setLogger', { id: this.id });
+    setLogger(hmsLogger, this.id);
   };
 
   /**
@@ -382,7 +377,6 @@ export class HMSSDK {
   /**
    * - HmsView is react component that takes one track and starts showing that track on a tile.
    * - The appearance of tile is completely customizable with style prop.
-   * - setting sink true or false for a video tile will add or remove sink for a video.
    * - scale type can determine how the incoming video will fit in the canvas check {@link HMSVideoViewMode} for more information.
    *
    * checkout {@link https://www.100ms.live/docs/react-native/v2/features/render-video} for more info
@@ -390,28 +384,20 @@ export class HMSSDK {
    * @param {HmsComponentProps}
    * @memberof HMSSDK
    */
-  HmsView = ({
-    sink,
-    trackId,
-    style,
-    mirror,
-    scaleType,
-    screenshot,
-    setZOrderMediaOverlay,
-  }: HmsComponentProps) => {
+  HmsView = React.forwardRef<any, HmsViewProps>((props, ref) => {
+    const { trackId, style, mirror, scaleType, setZOrderMediaOverlay } = props;
     return (
-      <HMSViewComponent
-        sink={sink}
+      <HmsViewComponent
+        ref={ref}
         trackId={trackId}
         style={style}
         setZOrderMediaOverlay={setZOrderMediaOverlay}
         mirror={mirror}
         scaleType={scaleType}
         id={this.id}
-        screenshot={screenshot}
       />
     );
-  };
+  });
 
   /**
    * Calls leave function of native sdk and session of current user is invalidated.