@100mslive/react-native-room-kit 0.0.1

package/lib/module/components/HMSPreviewTile.js

@@ -0,0 +1,129 @@
+import * as React from 'react';
+import { useSelector } from 'react-redux';
+import { HMSVideoViewMode } from '@100mslive/react-native-hms';
+import { StyleSheet, Text, View } from 'react-native';
+import { MicIcon, NetworkQualityIcon } from '../Icons';
+import { useHMSInstance } from '../hooks-util';
+import { getInitials } from '../utils/functions';
+import { COLORS } from '../utils/theme';
+export const HMSPreviewTile = () => {
+  const hmsInstance = useHMSInstance();
+  const HmsView = hmsInstance.HmsView;
+  const mirrorCamera = useSelector(state => state.app.joinConfig.mirrorCamera);
+  const autoSimulcast = useSelector(state => state.app.joinConfig.autoSimulcast);
+  const isLocalVideoMuted = useSelector(state => state.hmsStates.isLocalVideoMuted);
+  const isLocalAudioMuted = useSelector(state => state.hmsStates.isLocalAudioMuted);
+  const localVideoTrackId = useSelector(state => {
+    var _state$hmsStates$loca;
+    return (_state$hmsStates$loca = state.hmsStates.localPeer) === null || _state$hmsStates$loca === void 0 || (_state$hmsStates$loca = _state$hmsStates$loca.videoTrack) === null || _state$hmsStates$loca === void 0 ? void 0 : _state$hmsStates$loca.trackId;
+  });
+  const localPeerNetworkQuality = useSelector(state => {
+    var _state$hmsStates$loca2;
+    return (_state$hmsStates$loca2 = state.hmsStates.localPeer) === null || _state$hmsStates$loca2 === void 0 || (_state$hmsStates$loca2 = _state$hmsStates$loca2.networkQuality) === null || _state$hmsStates$loca2 === void 0 ? void 0 : _state$hmsStates$loca2.downlinkQuality;
+  });
+  const userName = useSelector(state => state.user.userName);
+  React.useEffect(() => {
+    hmsInstance.enableNetworkQualityUpdates();
+    return () => hmsInstance.disableNetworkQualityUpdates();
+  }, []);
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.modalContainer
+  }, isLocalVideoMuted || !localVideoTrackId ? /*#__PURE__*/React.createElement(View, {
+    style: styles.avatarContainer
+  }, /*#__PURE__*/React.createElement(View, {
+    style: [styles.avatar, userName.length === 0 ? styles.emptyAvatar : null]
+  }, /*#__PURE__*/React.createElement(Text, {
+    style: styles.avatarText
+  }, userName.length === 0 ? '👤' : getInitials(userName)))) : /*#__PURE__*/React.createElement(HmsView, {
+    trackId: localVideoTrackId,
+    key: localVideoTrackId,
+    mirror: mirrorCamera,
+    autoSimulcast: autoSimulcast,
+    scaleType: HMSVideoViewMode.ASPECT_FILL,
+    style: styles.hmsView
+  }), isLocalAudioMuted ? /*#__PURE__*/React.createElement(View, {
+    style: styles.micMuted
+  }, /*#__PURE__*/React.createElement(MicIcon, {
+    muted: true,
+    style: styles.micMutedIcon
+  })) : null, /*#__PURE__*/React.createElement(View, {
+    style: styles.nameInTileContainer
+  }, userName ? /*#__PURE__*/React.createElement(Text, {
+    style: styles.nameInTile
+  }, userName) : null, /*#__PURE__*/React.createElement(NetworkQualityIcon, {
+    quality: localPeerNetworkQuality
+  })));
+};
+const styles = StyleSheet.create({
+  modalContainer: {
+    flex: 1,
+    position: 'relative',
+    backgroundColor: COLORS.BACKGROUND.DEFAULT,
+    marginHorizontal: 8,
+    borderRadius: 16,
+    alignSelf: 'center',
+    overflow: 'hidden',
+    minWidth: '50%',
+    // minHeight: '50%',
+    aspectRatio: 377 / 482 // TODO: DO WE NEED THIS?
+  },
+
+  hmsView: {
+    flex: 1
+  },
+  micMuted: {
+    position: 'absolute',
+    top: 8,
+    right: 8,
+    backgroundColor: COLORS.ALERT.ERROR.DEFAULT,
+    padding: 8,
+    borderRadius: 12
+  },
+  micMutedIcon: {
+    tintColor: COLORS.ALERT.ERROR.BRIGHTER
+  },
+  avatarContainer: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  avatar: {
+    width: 88,
+    aspectRatio: 1,
+    backgroundColor: COLORS.EXTENDED.PURPLE,
+    borderRadius: 44,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  emptyAvatar: {
+    backgroundColor: '#C3D0E5' // TODO: use it from variable
+  },
+
+  avatarText: {
+    color: COLORS.SURFACE.ON_SURFACE.HIGH,
+    fontSize: 34,
+    fontFamily: 'Inter',
+    fontWeight: '600',
+    lineHeight: 40,
+    letterSpacing: 0.25
+  },
+  nameInTileContainer: {
+    position: 'absolute',
+    bottom: 8,
+    left: 8,
+    backgroundColor: COLORS.BACKGROUND.DIM_80,
+    padding: 8,
+    borderRadius: 12,
+    flexDirection: 'row'
+  },
+  nameInTile: {
+    color: COLORS.SURFACE.ON_SURFACE.HIGH,
+    fontSize: 14,
+    fontFamily: 'Inter',
+    fontWeight: '400',
+    lineHeight: 20,
+    letterSpacing: 0.25,
+    marginRight: 8
+  }
+});
+//# sourceMappingURL=HMSPreviewTile.js.map

package/lib/module/components/HMSPreviewTile.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useSelector","HMSVideoViewMode","StyleSheet","Text","View","MicIcon","NetworkQualityIcon","useHMSInstance","getInitials","COLORS","HMSPreviewTile","hmsInstance","HmsView","mirrorCamera","state","app","joinConfig","autoSimulcast","isLocalVideoMuted","hmsStates","isLocalAudioMuted","localVideoTrackId","_state$hmsStates$loca","localPeer","videoTrack","trackId","localPeerNetworkQuality","_state$hmsStates$loca2","networkQuality","downlinkQuality","userName","user","useEffect","enableNetworkQualityUpdates","disableNetworkQualityUpdates","createElement","style","styles","modalContainer","avatarContainer","avatar","length","emptyAvatar","avatarText","key","mirror","scaleType","ASPECT_FILL","hmsView","micMuted","muted","micMutedIcon","nameInTileContainer","nameInTile","quality","create","flex","position","backgroundColor","BACKGROUND","DEFAULT","marginHorizontal","borderRadius","alignSelf","overflow","minWidth","aspectRatio","top","right","ALERT","ERROR","padding","tintColor","BRIGHTER","alignItems","justifyContent","width","EXTENDED","PURPLE","color","SURFACE","ON_SURFACE","HIGH","fontSize","fontFamily","fontWeight","lineHeight","letterSpacing","bottom","left","DIM_80","flexDirection","marginRight"],"sourceRoot":"../../../src","sources":["components/HMSPreviewTile.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,WAAW,QAAQ,aAAa;AACzC,SAASC,gBAAgB,QAAQ,6BAA6B;AAC9D,SAASC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AAErD,SAASC,OAAO,EAAEC,kBAAkB,QAAQ,UAAU;AACtD,SAASC,cAAc,QAAQ,eAAe;AAE9C,SAASC,WAAW,QAAQ,oBAAoB;AAChD,SAASC,MAAM,QAAQ,gBAAgB;AAEvC,OAAO,MAAMC,cAAwB,GAAGA,CAAA,KAAM;EAC5C,MAAMC,WAAW,GAAGJ,cAAc,CAAC,CAAC;EACpC,MAAMK,OAAO,GAAGD,WAAW,CAACC,OAAO;EACnC,MAAMC,YAAY,GAAGb,WAAW,CAC7Bc,KAAgB,IAAKA,KAAK,CAACC,GAAG,CAACC,UAAU,CAACH,YAC7C,CAAC;EACD,MAAMI,aAAa,GAAGjB,WAAW,CAC9Bc,KAAgB,IAAKA,KAAK,CAACC,GAAG,CAACC,UAAU,CAACC,aAC7C,CAAC;EACD,MAAMC,iBAAiB,GAAGlB,WAAW,CAClCc,KAAgB,IAAKA,KAAK,CAACK,SAAS,CAACD,iBACxC,CAAC;EACD,MAAME,iBAAiB,GAAGpB,WAAW,CAClCc,KAAgB,IAAKA,KAAK,CAACK,SAAS,CAACC,iBACxC,CAAC;EACD,MAAMC,iBAAiB,GAAGrB,WAAW,CAClCc,KAAgB;IAAA,IAAAQ,qBAAA;IAAA,QAAAA,qBAAA,GAAKR,KAAK,CAACK,SAAS,CAACI,SAAS,cAAAD,qBAAA,gBAAAA,qBAAA,GAAzBA,qBAAA,CAA2BE,UAAU,cAAAF,qBAAA,uBAArCA,qBAAA,CAAuCG,OAAO;EAAA,CACtE,CAAC;EACD,MAAMC,uBAAuB,GAAG1B,WAAW,CACxCc,KAAgB;IAAA,IAAAa,sBAAA;IAAA,QAAAA,sBAAA,GACfb,KAAK,CAACK,SAAS,CAACI,SAAS,cAAAI,sBAAA,gBAAAA,sBAAA,GAAzBA,sBAAA,CAA2BC,cAAc,cAAAD,sBAAA,uBAAzCA,sBAAA,CAA2CE,eAAe;EAAA,CAC9D,CAAC;EACD,MAAMC,QAAQ,GAAG9B,WAAW,CAAEc,KAAgB,IAAKA,KAAK,CAACiB,IAAI,CAACD,QAAQ,CAAC;EAEvE/B,KAAK,CAACiC,SAAS,CAAC,MAAM;IACpBrB,WAAW,CAACsB,2BAA2B,CAAC,CAAC;IAEzC,OAAO,MAAMtB,WAAW,CAACuB,4BAA4B,CAAC,CAAC;EACzD,CAAC,EAAE,EAAE,CAAC;EAEN,oBACEnC,KAAA,CAAAoC,aAAA,CAAC/B,IAAI;IAACgC,KAAK,EAAEC,MAAM,CAACC;EAAe,GAChCpB,iBAAiB,IAAI,CAACG,iBAAiB,gBACtCtB,KAAA,CAAAoC,aAAA,CAAC/B,IAAI;IAACgC,KAAK,EAAEC,MAAM,CAACE;EAAgB,gBAClCxC,KAAA,CAAAoC,aAAA,CAAC/B,IAAI;IACHgC,KAAK,EAAE,CACLC,MAAM,CAACG,MAAM,EACbV,QAAQ,CAACW,MAAM,KAAK,CAAC,GAAGJ,MAAM,CAACK,WAAW,GAAG,IAAI;EACjD,gBAEF3C,KAAA,CAAAoC,aAAA,CAAChC,IAAI;IAACiC,KAAK,EAAEC,MAAM,CAACM;EAAW,GAC5Bb,QAAQ,CAACW,MAAM,KAAK,CAAC,GAAG,IAAI,GAAGjC,WAAW,CAACsB,QAAQ,CAChD,CACF,CACF,CAAC,gBAEP/B,KAAA,CAAAoC,aAAA,CAACvB,OAAO;IACNa,OAAO,EAAEJ,iBAAkB;IAC3BuB,GAAG,EAAEvB,iBAAkB;IACvBwB,MAAM,EAAEhC,YAAa;IACrBI,aAAa,EAAEA,aAAc;IAC7B6B,SAAS,EAAE7C,gBAAgB,CAAC8C,WAAY;IACxCX,KAAK,EAAEC,MAAM,CAACW;EAAQ,CACvB,CACF,EAEA5B,iBAAiB,gBAChBrB,KAAA,CAAAoC,aAAA,CAAC/B,IAAI;IAACgC,KAAK,EAAEC,MAAM,CAACY;EAAS,gBAC3BlD,KAAA,CAAAoC,aAAA,CAAC9B,OAAO;IAAC6C,KAAK,EAAE,IAAK;IAACd,KAAK,EAAEC,MAAM,CAACc;EAAa,CAAE,CAC/C,CAAC,GACL,IAAI,eAERpD,KAAA,CAAAoC,aAAA,CAAC/B,IAAI;IAACgC,KAAK,EAAEC,MAAM,CAACe;EAAoB,GACrCtB,QAAQ,gBAAG/B,KAAA,CAAAoC,aAAA,CAAChC,IAAI;IAACiC,KAAK,EAAEC,MAAM,CAACgB;EAAW,GAAEvB,QAAe,CAAC,GAAG,IAAI,eAEpE/B,KAAA,CAAAoC,aAAA,CAAC7B,kBAAkB;IAACgD,OAAO,EAAE5B;EAAwB,CAAE,CACnD,CACF,CAAC;AAEX,CAAC;AAED,MAAMW,MAAM,GAAGnC,UAAU,CAACqD,MAAM,CAAC;EAC/BjB,cAAc,EAAE;IACdkB,IAAI,EAAE,CAAC;IACPC,QAAQ,EAAE,UAAU;IACpBC,eAAe,EAAEjD,MAAM,CAACkD,UAAU,CAACC,OAAO;IAC1CC,gBAAgB,EAAE,CAAC;IACnBC,YAAY,EAAE,EAAE;IAChBC,SAAS,EAAE,QAAQ;IACnBC,QAAQ,EAAE,QAAQ;IAClBC,QAAQ,EAAE,KAAK;IACf;IACAC,WAAW,EAAE,GAAG,GAAG,GAAG,CAAE;EAC1B,CAAC;;EACDlB,OAAO,EAAE;IACPQ,IAAI,EAAE;EACR,CAAC;EACDP,QAAQ,EAAE;IACRQ,QAAQ,EAAE,UAAU;IACpBU,GAAG,EAAE,CAAC;IACNC,KAAK,EAAE,CAAC;IACRV,eAAe,EAAEjD,MAAM,CAAC4D,KAAK,CAACC,KAAK,CAACV,OAAO;IAC3CW,OAAO,EAAE,CAAC;IACVT,YAAY,EAAE;EAChB,CAAC;EACDX,YAAY,EAAE;IACZqB,SAAS,EAAE/D,MAAM,CAAC4D,KAAK,CAACC,KAAK,CAACG;EAChC,CAAC;EACDlC,eAAe,EAAE;IACfiB,IAAI,EAAE,CAAC;IACPkB,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDnC,MAAM,EAAE;IACNoC,KAAK,EAAE,EAAE;IACTV,WAAW,EAAE,CAAC;IACdR,eAAe,EAAEjD,MAAM,CAACoE,QAAQ,CAACC,MAAM;IACvChB,YAAY,EAAE,EAAE;IAChBa,cAAc,EAAE,QAAQ;IACxBD,UAAU,EAAE;EACd,CAAC;EACDhC,WAAW,EAAE;IACXgB,eAAe,EAAE,SAAS,CAAE;EAC9B,CAAC;;EACDf,UAAU,EAAE;IACVoC,KAAK,EAAEtE,MAAM,CAACuE,OAAO,CAACC,UAAU,CAACC,IAAI;IACrCC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,OAAO;IACnBC,UAAU,EAAE,KAAK;IACjBC,UAAU,EAAE,EAAE;IACdC,aAAa,EAAE;EACjB,CAAC;EACDnC,mBAAmB,EAAE;IACnBK,QAAQ,EAAE,UAAU;IACpB+B,MAAM,EAAE,CAAC;IACTC,IAAI,EAAE,CAAC;IACP/B,eAAe,EAAEjD,MAAM,CAACkD,UAAU,CAAC+B,MAAM;IACzCnB,OAAO,EAAE,CAAC;IACVT,YAAY,EAAE,EAAE;IAChB6B,aAAa,EAAE;EACjB,CAAC;EACDtC,UAAU,EAAE;IACV0B,KAAK,EAAEtE,MAAM,CAACuE,OAAO,CAACC,UAAU,CAACC,IAAI;IACrCC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,OAAO;IACnBC,UAAU,EAAE,KAAK;IACjBC,UAAU,EAAE,EAAE;IACdC,aAAa,EAAE,IAAI;IACnBK,WAAW,EAAE;EACf;AACF,CAAC,CAAC"}

package/lib/module/components/HMSPreviewTitle.js

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { StyleSheet, Text } from 'react-native';
+import { COLORS } from '../utils/theme';
+export const HMSPreviewTitle = _ref => {
+  let {
+    title = 'Get Started'
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Text, {
+    style: styles.title
+  }, title);
+};
+const styles = StyleSheet.create({
+  title: {
+    color: COLORS.SURFACE.ON_SURFACE.HIGH,
+    fontSize: 24,
+    fontFamily: 'Inter',
+    fontWeight: '600',
+    lineHeight: 32,
+    marginTop: 8,
+    textAlign: 'center'
+  }
+});
+//# sourceMappingURL=HMSPreviewTitle.js.map

package/lib/module/components/HMSPreviewTitle.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","Text","COLORS","HMSPreviewTitle","_ref","title","createElement","style","styles","create","color","SURFACE","ON_SURFACE","HIGH","fontSize","fontFamily","fontWeight","lineHeight","marginTop","textAlign"],"sourceRoot":"../../../src","sources":["components/HMSPreviewTitle.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAE/C,SAASC,MAAM,QAAQ,gBAAgB;AAMvC,OAAO,MAAMC,eAA+C,GAAGC,IAAA,IAEzD;EAAA,IAF0D;IAC9DC,KAAK,GAAG;EACV,CAAC,GAAAD,IAAA;EACC,oBAAOL,KAAA,CAAAO,aAAA,CAACL,IAAI;IAACM,KAAK,EAAEC,MAAM,CAACH;EAAM,GAAEA,KAAY,CAAC;AAClD,CAAC;AAED,MAAMG,MAAM,GAAGR,UAAU,CAACS,MAAM,CAAC;EAC/BJ,KAAK,EAAE;IACLK,KAAK,EAAER,MAAM,CAACS,OAAO,CAACC,UAAU,CAACC,IAAI;IACrCC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,OAAO;IACnBC,UAAU,EAAE,KAAK;IACjBC,UAAU,EAAE,EAAE;IACdC,SAAS,EAAE,CAAC;IACZC,SAAS,EAAE;EACb;AACF,CAAC,CAAC"}

package/lib/module/components/HMSRoomOptions.js

@@ -0,0 +1,96 @@
+import * as React from 'react';
+import { View } from 'react-native';
+import { HMSAudioMixingMode, HMSAudioMode } from '@100mslive/react-native-hms';
+import { PressableIcon } from './PressableIcon';
+import { ThreeDotsIcon } from '../Icons';
+import { DefaultModal } from './DefaultModal';
+import { RoomSettingsModalContent } from './RoomSettingsModalContent';
+import { ChangeAudioMixingModeModal, ChangeAudioModeModal, ChangeAudioOutputModal, ChangeBulkRoleModal, ChangeTrackStateForRoleModal, HlsStreamingModal, RecordingModal, RtcStatsModal } from './Modals';
+import { ModalTypes } from '../utils/types';
+import { useModalType } from '../hooks-util';
+export const HMSRoomOptions = () => {
+  const {
+    modalVisibleType: modalVisible,
+    handleModalVisibleType: setModalVisible
+  } = useModalType();
+  const [isAudioShared, setIsAudioShared] = React.useState(false);
+  const [audioMode, setAudioMode] = React.useState(HMSAudioMode.MODE_NORMAL);
+  const [muteAllTracksAudio, setMuteAllTracksAudio] = React.useState(false);
+  const [audioDeviceChangeListener, setAudioDeviceChangeListener] = React.useState(false);
+  const [newAudioMixingMode, setNewAudioMixingMode] = React.useState(HMSAudioMixingMode.TALK_AND_MUSIC);
+  const onSettingsPress = () => setModalVisible(ModalTypes.SETTINGS);
+  const dismissModal = () => setModalVisible(ModalTypes.DEFAULT);
+  return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(PressableIcon, {
+    onPress: onSettingsPress
+  }, /*#__PURE__*/React.createElement(ThreeDotsIcon, {
+    stack: "vertical"
+  })), /*#__PURE__*/React.createElement(DefaultModal, {
+    animationIn: 'slideInUp',
+    animationOut: 'slideOutDown',
+    modalVisible: modalVisible === ModalTypes.SETTINGS,
+    setModalVisible: dismissModal
+  }, /*#__PURE__*/React.createElement(RoomSettingsModalContent, {
+    newAudioMixingMode: newAudioMixingMode,
+    audioDeviceListenerAdded: audioDeviceChangeListener,
+    isAudioShared: isAudioShared,
+    muteAllTracksAudio: muteAllTracksAudio,
+    closeRoomSettingsModal: dismissModal,
+    setModalVisible: setModalVisible,
+    setAudioDeviceListenerAdded: setAudioDeviceChangeListener,
+    setIsAudioShared: setIsAudioShared,
+    setMuteAllTracksAudio: setMuteAllTracksAudio
+  })), /*#__PURE__*/React.createElement(DefaultModal, {
+    animationIn: 'slideInUp',
+    animationOut: 'slideOutDown',
+    modalVisible: modalVisible === ModalTypes.RTC_STATS,
+    setModalVisible: dismissModal
+  }, /*#__PURE__*/React.createElement(RtcStatsModal, null)), /*#__PURE__*/React.createElement(DefaultModal, {
+    modalPosiion: "center",
+    modalVisible: modalVisible === ModalTypes.RECORDING || modalVisible === ModalTypes.RESOLUTION,
+    setModalVisible: dismissModal
+  }, /*#__PURE__*/React.createElement(RecordingModal, {
+    setModalVisible: setModalVisible,
+    recordingModal: modalVisible === ModalTypes.RECORDING
+  })), /*#__PURE__*/React.createElement(DefaultModal, {
+    modalPosiion: "center",
+    modalVisible: modalVisible === ModalTypes.HLS_STREAMING,
+    setModalVisible: dismissModal
+  }, /*#__PURE__*/React.createElement(HlsStreamingModal, {
+    cancelModal: dismissModal
+  })), /*#__PURE__*/React.createElement(DefaultModal, {
+    modalPosiion: "center",
+    modalVisible: modalVisible === ModalTypes.CHANGE_TRACK_ROLE,
+    setModalVisible: dismissModal
+  }, /*#__PURE__*/React.createElement(ChangeTrackStateForRoleModal, {
+    cancelModal: dismissModal
+  })), /*#__PURE__*/React.createElement(DefaultModal, {
+    modalPosiion: "center",
+    modalVisible: modalVisible === ModalTypes.SWITCH_AUDIO_OUTPUT,
+    setModalVisible: dismissModal
+  }, /*#__PURE__*/React.createElement(ChangeAudioOutputModal, {
+    cancelModal: dismissModal
+  })), /*#__PURE__*/React.createElement(DefaultModal, {
+    modalPosiion: "center",
+    modalVisible: modalVisible === ModalTypes.CHANGE_AUDIO_MODE,
+    setModalVisible: dismissModal
+  }, /*#__PURE__*/React.createElement(ChangeAudioModeModal, {
+    audioMode: audioMode,
+    setAudioMode: setAudioMode,
+    cancelModal: dismissModal
+  })), /*#__PURE__*/React.createElement(DefaultModal, {
+    modalPosiion: "center",
+    modalVisible: modalVisible === ModalTypes.AUDIO_MIXING_MODE,
+    setModalVisible: dismissModal
+  }, /*#__PURE__*/React.createElement(ChangeAudioMixingModeModal, {
+    newAudioMixingMode: newAudioMixingMode,
+    setNewAudioMixingMode: setNewAudioMixingMode,
+    cancelModal: dismissModal
+  })), /*#__PURE__*/React.createElement(DefaultModal, {
+    modalPosiion: "center",
+    modalVisible: modalVisible === ModalTypes.BULK_ROLE_CHANGE,
+    setModalVisible: dismissModal
+  }, /*#__PURE__*/React.createElement(ChangeBulkRoleModal, {
+    cancelModal: dismissModal
+  })));
+};
+//# sourceMappingURL=HMSRoomOptions.js.map

package/lib/module/components/HMSRoomOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","HMSAudioMixingMode","HMSAudioMode","PressableIcon","ThreeDotsIcon","DefaultModal","RoomSettingsModalContent","ChangeAudioMixingModeModal","ChangeAudioModeModal","ChangeAudioOutputModal","ChangeBulkRoleModal","ChangeTrackStateForRoleModal","HlsStreamingModal","RecordingModal","RtcStatsModal","ModalTypes","useModalType","HMSRoomOptions","modalVisibleType","modalVisible","handleModalVisibleType","setModalVisible","isAudioShared","setIsAudioShared","useState","audioMode","setAudioMode","MODE_NORMAL","muteAllTracksAudio","setMuteAllTracksAudio","audioDeviceChangeListener","setAudioDeviceChangeListener","newAudioMixingMode","setNewAudioMixingMode","TALK_AND_MUSIC","onSettingsPress","SETTINGS","dismissModal","DEFAULT","createElement","onPress","stack","animationIn","animationOut","audioDeviceListenerAdded","closeRoomSettingsModal","setAudioDeviceListenerAdded","RTC_STATS","modalPosiion","RECORDING","RESOLUTION","recordingModal","HLS_STREAMING","cancelModal","CHANGE_TRACK_ROLE","SWITCH_AUDIO_OUTPUT","CHANGE_AUDIO_MODE","AUDIO_MIXING_MODE","BULK_ROLE_CHANGE"],"sourceRoot":"../../../src","sources":["components/HMSRoomOptions.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,kBAAkB,EAAEC,YAAY,QAAQ,6BAA6B;AAE9E,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,aAAa,QAAQ,UAAU;AACxC,SAASC,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,wBAAwB,QAAQ,4BAA4B;AACrE,SACEC,0BAA0B,EAC1BC,oBAAoB,EACpBC,sBAAsB,EACtBC,mBAAmB,EACnBC,4BAA4B,EAC5BC,iBAAiB,EACjBC,cAAc,EACdC,aAAa,QACR,UAAU;AACjB,SAASC,UAAU,QAAQ,gBAAgB;AAC3C,SAASC,YAAY,QAAQ,eAAe;AAI5C,OAAO,MAAMC,cAA6C,GAAGA,CAAA,KAAM;EACjE,MAAM;IACJC,gBAAgB,EAAEC,YAAY;IAC9BC,sBAAsB,EAAEC;EAC1B,CAAC,GAAGL,YAAY,CAAC,CAAC;EAClB,MAAM,CAACM,aAAa,EAAEC,gBAAgB,CAAC,GAAGxB,KAAK,CAACyB,QAAQ,CAAC,KAAK,CAAC;EAC/D,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAG3B,KAAK,CAACyB,QAAQ,CAC9CtB,YAAY,CAACyB,WACf,CAAC;EACD,MAAM,CAACC,kBAAkB,EAAEC,qBAAqB,CAAC,GAAG9B,KAAK,CAACyB,QAAQ,CAAC,KAAK,CAAC;EACzE,MAAM,CAACM,yBAAyB,EAAEC,4BAA4B,CAAC,GAC7DhC,KAAK,CAACyB,QAAQ,CAAU,KAAK,CAAC;EAChC,MAAM,CAACQ,kBAAkB,EAAEC,qBAAqB,CAAC,GAAGlC,KAAK,CAACyB,QAAQ,CAChEvB,kBAAkB,CAACiC,cACrB,CAAC;EAED,MAAMC,eAAe,GAAGA,CAAA,KAAMd,eAAe,CAACN,UAAU,CAACqB,QAAQ,CAAC;EAElE,MAAMC,YAAY,GAAGA,CAAA,KAAMhB,eAAe,CAACN,UAAU,CAACuB,OAAO,CAAC;EAE9D,oBACEvC,KAAA,CAAAwC,aAAA,CAACvC,IAAI,qBACHD,KAAA,CAAAwC,aAAA,CAACpC,aAAa;IAACqC,OAAO,EAAEL;EAAgB,gBACtCpC,KAAA,CAAAwC,aAAA,CAACnC,aAAa;IAACqC,KAAK,EAAC;EAAU,CAAE,CACpB,CAAC,eAEhB1C,KAAA,CAAAwC,aAAA,CAAClC,YAAY;IACXqC,WAAW,EAAE,WAAY;IACzBC,YAAY,EAAE,cAAe;IAC7BxB,YAAY,EAAEA,YAAY,KAAKJ,UAAU,CAACqB,QAAS;IACnDf,eAAe,EAAEgB;EAAa,gBAE9BtC,KAAA,CAAAwC,aAAA,CAACjC,wBAAwB;IACvB0B,kBAAkB,EAAEA,kBAAmB;IACvCY,wBAAwB,EAAEd,yBAA0B;IACpDR,aAAa,EAAEA,aAAc;IAC7BM,kBAAkB,EAAEA,kBAAmB;IACvCiB,sBAAsB,EAAER,YAAa;IACrChB,eAAe,EAAEA,eAAgB;IACjCyB,2BAA2B,EAAEf,4BAA6B;IAC1DR,gBAAgB,EAAEA,gBAAiB;IACnCM,qBAAqB,EAAEA;EAAsB,CAC9C,CACW,CAAC,eACf9B,KAAA,CAAAwC,aAAA,CAAClC,YAAY;IACXqC,WAAW,EAAE,WAAY;IACzBC,YAAY,EAAE,cAAe;IAC7BxB,YAAY,EAAEA,YAAY,KAAKJ,UAAU,CAACgC,SAAU;IACpD1B,eAAe,EAAEgB;EAAa,gBAE9BtC,KAAA,CAAAwC,aAAA,CAACzB,aAAa,MAAE,CACJ,CAAC,eACff,KAAA,CAAAwC,aAAA,CAAClC,YAAY;IACX2C,YAAY,EAAC,QAAQ;IACrB7B,YAAY,EACVA,YAAY,KAAKJ,UAAU,CAACkC,SAAS,IACrC9B,YAAY,KAAKJ,UAAU,CAACmC,UAC7B;IACD7B,eAAe,EAAEgB;EAAa,gBAE9BtC,KAAA,CAAAwC,aAAA,CAAC1B,cAAc;IACbQ,eAAe,EAAEA,eAAgB;IACjC8B,cAAc,EAAEhC,YAAY,KAAKJ,UAAU,CAACkC;EAAU,CACvD,CACW,CAAC,eACflD,KAAA,CAAAwC,aAAA,CAAClC,YAAY;IACX2C,YAAY,EAAC,QAAQ;IACrB7B,YAAY,EAAEA,YAAY,KAAKJ,UAAU,CAACqC,aAAc;IACxD/B,eAAe,EAAEgB;EAAa,gBAE9BtC,KAAA,CAAAwC,aAAA,CAAC3B,iBAAiB;IAACyC,WAAW,EAAEhB;EAAa,CAAE,CACnC,CAAC,eACftC,KAAA,CAAAwC,aAAA,CAAClC,YAAY;IACX2C,YAAY,EAAC,QAAQ;IACrB7B,YAAY,EAAEA,YAAY,KAAKJ,UAAU,CAACuC,iBAAkB;IAC5DjC,eAAe,EAAEgB;EAAa,gBAE9BtC,KAAA,CAAAwC,aAAA,CAAC5B,4BAA4B;IAAC0C,WAAW,EAAEhB;EAAa,CAAE,CAC9C,CAAC,eACftC,KAAA,CAAAwC,aAAA,CAAClC,YAAY;IACX2C,YAAY,EAAC,QAAQ;IACrB7B,YAAY,EAAEA,YAAY,KAAKJ,UAAU,CAACwC,mBAAoB;IAC9DlC,eAAe,EAAEgB;EAAa,gBAE9BtC,KAAA,CAAAwC,aAAA,CAAC9B,sBAAsB;IAAC4C,WAAW,EAAEhB;EAAa,CAAE,CACxC,CAAC,eACftC,KAAA,CAAAwC,aAAA,CAAClC,YAAY;IACX2C,YAAY,EAAC,QAAQ;IACrB7B,YAAY,EAAEA,YAAY,KAAKJ,UAAU,CAACyC,iBAAkB;IAC5DnC,eAAe,EAAEgB;EAAa,gBAE9BtC,KAAA,CAAAwC,aAAA,CAAC/B,oBAAoB;IACnBiB,SAAS,EAAEA,SAAU;IACrBC,YAAY,EAAEA,YAAa;IAC3B2B,WAAW,EAAEhB;EAAa,CAC3B,CACW,CAAC,eACftC,KAAA,CAAAwC,aAAA,CAAClC,YAAY;IACX2C,YAAY,EAAC,QAAQ;IACrB7B,YAAY,EAAEA,YAAY,KAAKJ,UAAU,CAAC0C,iBAAkB;IAC5DpC,eAAe,EAAEgB;EAAa,gBAE9BtC,KAAA,CAAAwC,aAAA,CAAChC,0BAA0B;IACzByB,kBAAkB,EAAEA,kBAAmB;IACvCC,qBAAqB,EAAEA,qBAAsB;IAC7CoB,WAAW,EAAEhB;EAAa,CAC3B,CACW,CAAC,eACftC,KAAA,CAAAwC,aAAA,CAAClC,YAAY;IACX2C,YAAY,EAAC,QAAQ;IACrB7B,YAAY,EAAEA,YAAY,KAAKJ,UAAU,CAAC2C,gBAAiB;IAC3DrC,eAAe,EAAEgB;EAAa,gBAE9BtC,KAAA,CAAAwC,aAAA,CAAC7B,mBAAmB;IAAC2C,WAAW,EAAEhB;EAAa,CAAE,CACrC,CACV,CAAC;AAEX,CAAC"}

package/lib/module/components/HMSShareScreen.js

@@ -0,0 +1,50 @@
+import * as React from 'react';
+import { StyleSheet } from 'react-native';
+import { useSelector } from 'react-redux';
+import { COLORS } from '../utils/theme';
+import { useCanPublishScreen, useHMSActions } from '../hooks-sdk';
+import { PressableIcon } from './PressableIcon';
+import { ScreenShareIcon } from '../Icons';
+export const HMSShareScreen = _ref => {
+  let {
+    screenShareDelegate
+  } = _ref;
+  const canPublishScreen = useCanPublishScreen();
+  if (!canPublishScreen) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(ScreenShareButton, {
+    screenShareDelegate: screenShareDelegate
+  });
+};
+const ScreenShareButton = _ref2 => {
+  let {
+    screenShareDelegate = /*#__PURE__*/React.createElement(DefaultScreenShareButtonDelegate, null)
+  } = _ref2;
+  const hmsActions = useHMSActions();
+  const isLocalScreenShared = useSelector(state => state.hmsStates.isLocalScreenShared);
+  const handleScreenShareTogglePress = async () => {
+    await hmsActions.setScreenShareEnabled(!isLocalScreenShared);
+  };
+  return /*#__PURE__*/React.cloneElement(screenShareDelegate, {
+    onPress: handleScreenShareTogglePress,
+    isLocalScreenShared
+  });
+};
+const DefaultScreenShareButtonDelegate = _ref3 => {
+  let {
+    onPress,
+    isLocalScreenShared
+  } = _ref3;
+  return /*#__PURE__*/React.createElement(PressableIcon, {
+    onPress: onPress,
+    style: isLocalScreenShared ? styles.mutedButton : undefined
+  }, /*#__PURE__*/React.createElement(ScreenShareIcon, null));
+};
+const styles = StyleSheet.create({
+  mutedButton: {
+    backgroundColor: COLORS.SECONDARY.DIM,
+    borderColor: COLORS.SECONDARY.DIM
+  }
+});
+//# sourceMappingURL=HMSShareScreen.js.map

package/lib/module/components/HMSShareScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","useSelector","COLORS","useCanPublishScreen","useHMSActions","PressableIcon","ScreenShareIcon","HMSShareScreen","_ref","screenShareDelegate","canPublishScreen","createElement","ScreenShareButton","_ref2","DefaultScreenShareButtonDelegate","hmsActions","isLocalScreenShared","state","hmsStates","handleScreenShareTogglePress","setScreenShareEnabled","cloneElement","onPress","_ref3","style","styles","mutedButton","undefined","create","backgroundColor","SECONDARY","DIM","borderColor"],"sourceRoot":"../../../src","sources":["components/HMSShareScreen.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,WAAW,QAAQ,aAAa;AAGzC,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,mBAAmB,EAAEC,aAAa,QAAQ,cAAc;AACjE,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,eAAe,QAAQ,UAAU;AAI1C,OAAO,MAAMC,cAA6C,GAAGC,IAAA,IAEvD;EAAA,IAFwD;IAC5DC;EACF,CAAC,GAAAD,IAAA;EACC,MAAME,gBAAgB,GAAGP,mBAAmB,CAAC,CAAC;EAE9C,IAAI,CAACO,gBAAgB,EAAE;IACrB,OAAO,IAAI;EACb;EAEA,oBAAOX,KAAA,CAAAY,aAAA,CAACC,iBAAiB;IAACH,mBAAmB,EAAEA;EAAoB,CAAE,CAAC;AACxE,CAAC;AAMD,MAAMG,iBAAmD,GAAGC,KAAA,IAEtD;EAAA,IAFuD;IAC3DJ,mBAAmB,gBAAGV,KAAA,CAAAY,aAAA,CAACG,gCAAgC,MAAE;EAC3D,CAAC,GAAAD,KAAA;EACC,MAAME,UAAU,GAAGX,aAAa,CAAC,CAAC;EAElC,MAAMY,mBAAmB,GAAGf,WAAW,CACpCgB,KAAgB,IAAKA,KAAK,CAACC,SAAS,CAACF,mBACxC,CAAC;EAED,MAAMG,4BAA4B,GAAG,MAAAA,CAAA,KAAY;IAC/C,MAAMJ,UAAU,CAACK,qBAAqB,CAAC,CAACJ,mBAAmB,CAAC;EAC9D,CAAC;EAED,oBAAOjB,KAAK,CAACsB,YAAY,CAACZ,mBAAmB,EAAE;IAC7Ca,OAAO,EAAEH,4BAA4B;IACrCH;EACF,CAAC,CAAC;AACJ,CAAC;AAOD,MAAMF,gCAEL,GAAGS,KAAA,IAAsC;EAAA,IAArC;IAAED,OAAO;IAAEN;EAAoB,CAAC,GAAAO,KAAA;EACnC,oBACExB,KAAA,CAAAY,aAAA,CAACN,aAAa;IACZiB,OAAO,EAAEA,OAAQ;IACjBE,KAAK,EAAER,mBAAmB,GAAGS,MAAM,CAACC,WAAW,GAAGC;EAAU,gBAE5D5B,KAAA,CAAAY,aAAA,CAACL,eAAe,MAAE,CACL,CAAC;AAEpB,CAAC;AAED,MAAMmB,MAAM,GAAGzB,UAAU,CAAC4B,MAAM,CAAC;EAC/BF,WAAW,EAAE;IACXG,eAAe,EAAE3B,MAAM,CAAC4B,SAAS,CAACC,GAAG;IACrCC,WAAW,EAAE9B,MAAM,CAAC4B,SAAS,CAACC;EAChC;AACF,CAAC,CAAC"}

package/lib/module/components/HMSShowNetworkQuality.js

@@ -0,0 +1,48 @@
+import React, { useEffect } from 'react';
+import { useSelector } from 'react-redux';
+import { StyleSheet, Image } from 'react-native';
+import { COLORS } from '../utils/theme';
+import { CustomButton } from './CustomButton';
+import { useHMSInstance } from '../hooks-util';
+export const HMSShowNetworkQuality = () => {
+  const hmsInstance = useHMSInstance();
+  const localPeerDownlinkNetworkQuality = useSelector(state => {
+    var _state$hmsStates$loca;
+    return (_state$hmsStates$loca = state.hmsStates.localPeer) === null || _state$hmsStates$loca === void 0 || (_state$hmsStates$loca = _state$hmsStates$loca.networkQuality) === null || _state$hmsStates$loca === void 0 ? void 0 : _state$hmsStates$loca.downlinkQuality;
+  });
+
+  // TODO: test network quality usage
+  useEffect(() => {
+    hmsInstance.enableNetworkQualityUpdates();
+    return () => hmsInstance.disableNetworkQualityUpdates();
+  }, [hmsInstance]);
+  return /*#__PURE__*/React.createElement(CustomButton, {
+    onPress: () => {},
+    disabled: true,
+    viewStyle: styles.singleIconContainer,
+    LeftIcon: /*#__PURE__*/React.createElement(Image, {
+      resizeMode: "contain",
+      style: styles.image,
+      source: localPeerDownlinkNetworkQuality === 0 ? require('../assets/network_0.png') : localPeerDownlinkNetworkQuality === 1 ? require('../assets/network_1.png') : localPeerDownlinkNetworkQuality === 2 ? require('../assets/network_2.png') : localPeerDownlinkNetworkQuality === 3 ? require('../assets/network_3.png') : require('../assets/network_4.png')
+    })
+  });
+};
+const styles = StyleSheet.create({
+  image: {
+    height: 32,
+    width: 32
+  },
+  singleIconContainer: {
+    padding: 8,
+    backgroundColor: COLORS.BORDER.LIGHT,
+    borderColor: COLORS.BORDER.LIGHT,
+    borderWidth: 1,
+    width: 'auto',
+    height: 48,
+    justifyContent: 'center',
+    alignItems: 'center',
+    borderRadius: 12,
+    marginHorizontal: 4
+  }
+});
+//# sourceMappingURL=HMSShowNetworkQuality.js.map

package/lib/module/components/HMSShowNetworkQuality.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useSelector","StyleSheet","Image","COLORS","CustomButton","useHMSInstance","HMSShowNetworkQuality","hmsInstance","localPeerDownlinkNetworkQuality","state","_state$hmsStates$loca","hmsStates","localPeer","networkQuality","downlinkQuality","enableNetworkQualityUpdates","disableNetworkQualityUpdates","createElement","onPress","disabled","viewStyle","styles","singleIconContainer","LeftIcon","resizeMode","style","image","source","require","create","height","width","padding","backgroundColor","BORDER","LIGHT","borderColor","borderWidth","justifyContent","alignItems","borderRadius","marginHorizontal"],"sourceRoot":"../../../src","sources":["components/HMSShowNetworkQuality.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,QAAQ,OAAO;AACxC,SAASC,WAAW,QAAQ,aAAa;AACzC,SAASC,UAAU,EAAEC,KAAK,QAAQ,cAAc;AAGhD,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,cAAc,QAAQ,eAAe;AAE9C,OAAO,MAAMC,qBAAqB,GAAGA,CAAA,KAAM;EACzC,MAAMC,WAAW,GAAGF,cAAc,CAAC,CAAC;EACpC,MAAMG,+BAA+B,GAAGR,WAAW,CAChDS,KAAgB;IAAA,IAAAC,qBAAA;IAAA,QAAAA,qBAAA,GACfD,KAAK,CAACE,SAAS,CAACC,SAAS,cAAAF,qBAAA,gBAAAA,qBAAA,GAAzBA,qBAAA,CAA2BG,cAAc,cAAAH,qBAAA,uBAAzCA,qBAAA,CAA2CI,eAAe;EAAA,CAC9D,CAAC;;EAED;EACAf,SAAS,CAAC,MAAM;IACdQ,WAAW,CAACQ,2BAA2B,CAAC,CAAC;IAEzC,OAAO,MAAMR,WAAW,CAACS,4BAA4B,CAAC,CAAC;EACzD,CAAC,EAAE,CAACT,WAAW,CAAC,CAAC;EAEjB,oBACET,KAAA,CAAAmB,aAAA,CAACb,YAAY;IACXc,OAAO,EAAEA,CAAA,KAAM,CAAC,CAAE;IAClBC,QAAQ,EAAE,IAAK;IACfC,SAAS,EAAEC,MAAM,CAACC,mBAAoB;IACtCC,QAAQ,eACNzB,KAAA,CAAAmB,aAAA,CAACf,KAAK;MACJsB,UAAU,EAAC,SAAS;MACpBC,KAAK,EAAEJ,MAAM,CAACK,KAAM;MACpBC,MAAM,EACJnB,+BAA+B,KAAK,CAAC,GACjCoB,OAAO,CAAC,yBAAyB,CAAC,GAClCpB,+BAA+B,KAAK,CAAC,GACrCoB,OAAO,CAAC,yBAAyB,CAAC,GAClCpB,+BAA+B,KAAK,CAAC,GACrCoB,OAAO,CAAC,yBAAyB,CAAC,GAClCpB,+BAA+B,KAAK,CAAC,GACrCoB,OAAO,CAAC,yBAAyB,CAAC,GAClCA,OAAO,CAAC,yBAAyB;IACtC,CACF;EACF,CACF,CAAC;AAEN,CAAC;AAED,MAAMP,MAAM,GAAGpB,UAAU,CAAC4B,MAAM,CAAC;EAC/BH,KAAK,EAAE;IACLI,MAAM,EAAE,EAAE;IACVC,KAAK,EAAE;EACT,CAAC;EACDT,mBAAmB,EAAE;IACnBU,OAAO,EAAE,CAAC;IACVC,eAAe,EAAE9B,MAAM,CAAC+B,MAAM,CAACC,KAAK;IACpCC,WAAW,EAAEjC,MAAM,CAAC+B,MAAM,CAACC,KAAK;IAChCE,WAAW,EAAE,CAAC;IACdN,KAAK,EAAE,MAAM;IACbD,MAAM,EAAE,EAAE;IACVQ,cAAc,EAAE,QAAQ;IACxBC,UAAU,EAAE,QAAQ;IACpBC,YAAY,EAAE,EAAE;IAChBC,gBAAgB,EAAE;EACpB;AACF,CAAC,CAAC"}

package/lib/module/components/Header.js

@@ -0,0 +1,167 @@
+import React, { memo } from 'react';
+import { View, StyleSheet, Text } from 'react-native';
+import Animated, { useAnimatedProps, useAnimatedStyle } from 'react-native-reanimated';
+import { COLORS } from '../utils/theme';
+import { HMSManageLeave } from './HMSManageLeave';
+import { HMSManageCameraRotation } from './HMSManageCameraRotation';
+import { useIsHLSViewer } from '../hooks-util';
+import { HmsLogoIcon } from '../Icons';
+import { useSelector } from 'react-redux';
+export const _Header = _ref => {
+  let {
+    offset
+  } = _ref;
+  const isHLSViewer = useIsHLSViewer();
+  const roomName = useSelector(state => {
+    var _state$hmsStates$room;
+    return (_state$hmsStates$room = state.hmsStates.room) === null || _state$hmsStates$room === void 0 ? void 0 : _state$hmsStates$room.name;
+  });
+  const animatedStyles = useAnimatedStyle(() => {
+    return {
+      opacity: offset.value
+      // transform: [{ translateY: interpolate(offset.value, [0, 1], [-10, 0]) }]
+    };
+  }, []);
+  const animatedProps = useAnimatedProps(() => {
+    return {
+      pointerEvents: offset.value === 0 ? 'none' : 'auto'
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement(Animated.View, {
+    style: animatedStyles,
+    animatedProps: animatedProps
+  }, isHLSViewer ? /*#__PURE__*/React.createElement(View, {
+    style: styles.hlsContainer
+  }, /*#__PURE__*/React.createElement(HmsLogoIcon, null), roomName ? /*#__PURE__*/React.createElement(Text, {
+    style: styles.roomName
+  }, roomName) : null) : /*#__PURE__*/React.createElement(View, {
+    style: styles.container
+  }, /*#__PURE__*/React.createElement(HMSManageLeave, null), /*#__PURE__*/React.createElement(HMSManageCameraRotation, null)));
+};
+const styles = StyleSheet.create({
+  container: {
+    paddingVertical: 8,
+    paddingHorizontal: 16,
+    backgroundColor: COLORS.BACKGROUND.DIM,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between'
+  },
+  hlsContainer: {
+    padding: 16,
+    paddingTop: 8,
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  roomName: {
+    flex: 1,
+    fontFamily: 'Inter',
+    fontSize: 15,
+    fontWeight: '500',
+    color: COLORS.SURFACE.ON_SURFACE.HIGH,
+    lineHeight: 20,
+    letterSpacing: 0.1,
+    marginLeft: 24
+  }
+});
+export const Header = /*#__PURE__*/memo(_Header);
+
+// export const _Header2 = ({
+//   isLeaveMenuOpen,
+//   setModalVisible,
+// }: {
+//   isLeaveMenuOpen: boolean;
+//   setModalVisible(modalType: ModalTypes, delay?: any): void;
+// }) => {
+//   // hooks
+//   const hmsInstance = useSelector((state: RootState) => state.user.hmsInstance);
+//   const room = useSelector((state: RootState) => state.hmsStates.room);
+//   const localPeer = useSelector(
+//     (state: RootState) => state.hmsStates.localPeer,
+//   );
+//   const roomCode = useSelector((state: RootState) => state.user.roomCode);
+//   const isScreenShared = useSelector(
+//     (state: RootState) => state.hmsStates.isLocalScreenShared,
+//   );
+//   const showLandscapeLayout = useShowLandscapeLayout();
+
+//   // constants
+//   const iconSize = 20;
+
+//   // functions
+
+//   return (
+//     <View
+//       style={[
+//         styles.iconTopWrapper,
+//         showLandscapeLayout ? styles.iconTopWrapperLandscape : null,
+//       ]}
+//     >
+//       <View
+//         style={[
+//           styles.iconTopSubWrapper,
+//           showLandscapeLayout ? styles.iconTopSubWrapperLandscape : null,
+//         ]}
+//       >
+//         {room?.hlsStreamingState?.running ? (
+//           <View>
+//             <View style={styles.liveTextContainer}>
+//               <View style={styles.liveStatus} />
+//               <Text style={styles.liveTimeText}>Live</Text>
+//             </View>
+//             {Array.isArray(room?.hlsStreamingState?.variants) ? (
+//               <RealTime
+//                 startedAt={room?.hlsStreamingState?.variants[0]?.startedAt}
+//               />
+//             ) : null}
+//           </View>
+//         ) : (
+//           <Text style={styles.headerName}>{roomCode}</Text>
+//         )}
+//       </View>
+//       <View
+//         style={[
+//           styles.iconTopSubWrapper,
+//           showLandscapeLayout ? styles.iconTopSubWrapperLandscape : null,
+//         ]}
+//       >
+//         {(room?.browserRecordingState?.running ||
+//           room?.hlsRecordingState?.running) && (
+//           <MaterialCommunityIcons
+//             name="record-circle-outline"
+//             style={
+//               showLandscapeLayout
+//                 ? styles.roomStatusLandscape
+//                 : styles.roomStatus
+//             }
+//             size={iconSize}
+//           />
+//         )}
+//         {(room?.hlsStreamingState?.running ||
+//           room?.rtmpHMSRtmpStreamingState?.running) && (
+//           <Ionicons
+//             name="globe-outline"
+//             style={
+//               showLandscapeLayout
+//                 ? styles.roomStatusLandscape
+//                 : styles.roomStatus
+//             }
+//             size={iconSize}
+//           />
+//         )}
+//         {isScreenShared && (
+//           <Feather
+//             name="copy"
+//             style={
+//               showLandscapeLayout
+//                 ? styles.roomStatusLandscape
+//                 : styles.roomStatus
+//             }
+//             size={iconSize}
+//           />
+//         )}
+//       </View>
+//     </View>
+//   );
+// };
+//# sourceMappingURL=Header.js.map

package/lib/module/components/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","View","StyleSheet","Text","Animated","useAnimatedProps","useAnimatedStyle","COLORS","HMSManageLeave","HMSManageCameraRotation","useIsHLSViewer","HmsLogoIcon","useSelector","_Header","_ref","offset","isHLSViewer","roomName","state","_state$hmsStates$room","hmsStates","room","name","animatedStyles","opacity","value","animatedProps","pointerEvents","createElement","style","styles","hlsContainer","container","create","paddingVertical","paddingHorizontal","backgroundColor","BACKGROUND","DIM","flexDirection","alignItems","justifyContent","padding","paddingTop","flex","fontFamily","fontSize","fontWeight","color","SURFACE","ON_SURFACE","HIGH","lineHeight","letterSpacing","marginLeft","Header"],"sourceRoot":"../../../src","sources":["components/Header.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,IAAI,QAAQ,OAAO;AACnC,SAASC,IAAI,EAAEC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AACrD,OAAOC,QAAQ,IACbC,gBAAgB,EAChBC,gBAAgB,QACX,yBAAyB;AAGhC,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,uBAAuB,QAAQ,2BAA2B;AACnE,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,WAAW,QAAQ,UAAU;AACtC,SAASC,WAAW,QAAQ,aAAa;AAOzC,OAAO,MAAMC,OAA8B,GAAGC,IAAA,IAAgB;EAAA,IAAf;IAAEC;EAAO,CAAC,GAAAD,IAAA;EACvD,MAAME,WAAW,GAAGN,cAAc,CAAC,CAAC;EACpC,MAAMO,QAAQ,GAAGL,WAAW,CACzBM,KAAgB;IAAA,IAAAC,qBAAA;IAAA,QAAAA,qBAAA,GAAKD,KAAK,CAACE,SAAS,CAACC,IAAI,cAAAF,qBAAA,uBAApBA,qBAAA,CAAsBG,IAAI;EAAA,CAClD,CAAC;EACD,MAAMC,cAAc,GAAGjB,gBAAgB,CAAC,MAAM;IAC5C,OAAO;MACLkB,OAAO,EAAET,MAAM,CAACU;MAChB;IACF,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,aAAa,GAAGrB,gBAAgB,CAAC,MAElC;IACH,OAAO;MACLsB,aAAa,EAAEZ,MAAM,CAACU,KAAK,KAAK,CAAC,GAAG,MAAM,GAAG;IAC/C,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,oBACE1B,KAAA,CAAA6B,aAAA,CAACxB,QAAQ,CAACH,IAAI;IAAC4B,KAAK,EAAEN,cAAe;IAACG,aAAa,EAAEA;EAAc,GAChEV,WAAW,gBACVjB,KAAA,CAAA6B,aAAA,CAAC3B,IAAI;IAAC4B,KAAK,EAAEC,MAAM,CAACC;EAAa,gBAC/BhC,KAAA,CAAA6B,aAAA,CAACjB,WAAW,MAAE,CAAC,EAEdM,QAAQ,gBAAGlB,KAAA,CAAA6B,aAAA,CAACzB,IAAI;IAAC0B,KAAK,EAAEC,MAAM,CAACb;EAAS,GAAEA,QAAe,CAAC,GAAG,IAC1D,CAAC,gBAEPlB,KAAA,CAAA6B,aAAA,CAAC3B,IAAI;IAAC4B,KAAK,EAAEC,MAAM,CAACE;EAAU,gBAC5BjC,KAAA,CAAA6B,aAAA,CAACpB,cAAc,MAAE,CAAC,eAClBT,KAAA,CAAA6B,aAAA,CAACnB,uBAAuB,MAAE,CACtB,CAEK,CAAC;AAEpB,CAAC;AAED,MAAMqB,MAAM,GAAG5B,UAAU,CAAC+B,MAAM,CAAC;EAC/BD,SAAS,EAAE;IACTE,eAAe,EAAE,CAAC;IAClBC,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE7B,MAAM,CAAC8B,UAAU,CAACC,GAAG;IACtCC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDV,YAAY,EAAE;IACZW,OAAO,EAAE,EAAE;IACXC,UAAU,EAAE,CAAC;IACbJ,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACDvB,QAAQ,EAAE;IACR2B,IAAI,EAAE,CAAC;IACPC,UAAU,EAAE,OAAO;IACnBC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,KAAK;IACjBC,KAAK,EAAEzC,MAAM,CAAC0C,OAAO,CAACC,UAAU,CAACC,IAAI;IACrCC,UAAU,EAAE,EAAE;IACdC,aAAa,EAAE,GAAG;IAClBC,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAEF,OAAO,MAAMC,MAAM,gBAAGvD,IAAI,CAACa,OAAO,CAAC;;AAEnC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}

package/lib/module/components/LiveButton.js

@@ -0,0 +1,61 @@
+import React from 'react';
+import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
+import { COLORS } from '../utils/theme';
+export let LiveStates = /*#__PURE__*/function (LiveStates) {
+  LiveStates[LiveStates["LIVE"] = 10] = "LIVE";
+  LiveStates[LiveStates["BEHIND_LIVE"] = 20] = "BEHIND_LIVE";
+  LiveStates[LiveStates["LOADING_LIVE"] = 30] = "LOADING_LIVE";
+  return LiveStates;
+}({});
+const LiveButton = _ref => {
+  let {
+    containerStyle,
+    isLive,
+    onPress,
+    disabled,
+    size = 'normal'
+  } = _ref;
+  const textStyle = size !== 'normal' ? {
+    fontSize: 10
+  } : null;
+  const indicatorStyle = size !== 'normal' ? {
+    width: 4,
+    height: 4,
+    borderRadius: 2
+  } : null;
+  const pressableStyle = size !== 'normal' ? {
+    padding: 4
+  } : null;
+  return /*#__PURE__*/React.createElement(View, {
+    style: containerStyle
+  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+    onPress: onPress,
+    style: [styles.touchable, pressableStyle],
+    disabled: disabled
+  }, /*#__PURE__*/React.createElement(View, {
+    style: [styles.liveIndicator, indicatorStyle, {
+      backgroundColor: isLive ? COLORS.TWIN.RED : COLORS.SECONDARY.DEFAULT
+    }]
+  }), /*#__PURE__*/React.createElement(Text, {
+    style: [styles.liveText, textStyle]
+  }, "LIVE")));
+};
+export default LiveButton;
+const styles = StyleSheet.create({
+  touchable: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    padding: 16
+  },
+  liveText: {
+    color: COLORS.TEXT.HIGH_EMPHASIS
+  },
+  liveIndicator: {
+    width: 8,
+    height: 8,
+    backgroundColor: COLORS.TWIN.RED,
+    borderRadius: 4,
+    marginRight: 4
+  }
+});
+//# sourceMappingURL=LiveButton.js.map

package/lib/module/components/LiveButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","StyleSheet","TouchableOpacity","COLORS","LiveStates","LiveButton","_ref","containerStyle","isLive","onPress","disabled","size","textStyle","fontSize","indicatorStyle","width","height","borderRadius","pressableStyle","padding","createElement","style","styles","touchable","liveIndicator","backgroundColor","TWIN","RED","SECONDARY","DEFAULT","liveText","create","flexDirection","alignItems","color","TEXT","HIGH_EMPHASIS","marginRight"],"sourceRoot":"../../../src","sources":["components/LiveButton.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,IAAI,EAAEC,UAAU,EAAEC,gBAAgB,QAAQ,cAAc;AAGvE,SAASC,MAAM,QAAQ,gBAAgB;AAEvC,WAAYC,UAAU,0BAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAA,OAAVA,UAAU;AAAA;AActB,MAAMC,UAAqC,GAAGC,IAAA,IAMxC;EAAA,IANyC;IAC7CC,cAAc;IACdC,MAAM;IACNC,OAAO;IACPC,QAAQ;IACRC,IAAI,GAAG;EACT,CAAC,GAAAL,IAAA;EACC,MAAMM,SAA+B,GACnCD,IAAI,KAAK,QAAQ,GAAG;IAAEE,QAAQ,EAAE;EAAG,CAAC,GAAG,IAAI;EAC7C,MAAMC,cAAoC,GACxCH,IAAI,KAAK,QAAQ,GAAG;IAAEI,KAAK,EAAE,CAAC;IAAEC,MAAM,EAAE,CAAC;IAAEC,YAAY,EAAE;EAAE,CAAC,GAAG,IAAI;EACrE,MAAMC,cAAoC,GACxCP,IAAI,KAAK,QAAQ,GAAG;IAAEQ,OAAO,EAAE;EAAE,CAAC,GAAG,IAAI;EAE3C,oBACErB,KAAA,CAAAsB,aAAA,CAACrB,IAAI;IAACsB,KAAK,EAAEd;EAAe,gBAC1BT,KAAA,CAAAsB,aAAA,CAAClB,gBAAgB;IACfO,OAAO,EAAEA,OAAQ;IACjBY,KAAK,EAAE,CAACC,MAAM,CAACC,SAAS,EAAEL,cAAc,CAAE;IAC1CR,QAAQ,EAAEA;EAAS,gBAEnBZ,KAAA,CAAAsB,aAAA,CAACrB,IAAI;IACHsB,KAAK,EAAE,CACLC,MAAM,CAACE,aAAa,EACpBV,cAAc,EACd;MACEW,eAAe,EAAEjB,MAAM,GACnBL,MAAM,CAACuB,IAAI,CAACC,GAAG,GACfxB,MAAM,CAACyB,SAAS,CAACC;IACvB,CAAC;EACD,CACH,CAAC,eACF/B,KAAA,CAAAsB,aAAA,CAACpB,IAAI;IAACqB,KAAK,EAAE,CAACC,MAAM,CAACQ,QAAQ,EAAElB,SAAS;EAAE,GAAC,MAAU,CACrC,CACd,CAAC;AAEX,CAAC;AAED,eAAeP,UAAU;AAEzB,MAAMiB,MAAM,GAAGrB,UAAU,CAAC8B,MAAM,CAAC;EAC/BR,SAAS,EAAE;IACTS,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBd,OAAO,EAAE;EACX,CAAC;EACDW,QAAQ,EAAE;IACRI,KAAK,EAAE/B,MAAM,CAACgC,IAAI,CAACC;EACrB,CAAC;EACDZ,aAAa,EAAE;IACbT,KAAK,EAAE,CAAC;IACRC,MAAM,EAAE,CAAC;IACTS,eAAe,EAAEtB,MAAM,CAACuB,IAAI,CAACC,GAAG;IAChCV,YAAY,EAAE,CAAC;IACfoB,WAAW,EAAE;EACf;AACF,CAAC,CAAC"}