@100mslive/react-native-room-kit 0.0.4 → 0.2.0

package/lib/module/components/HMSPreviewTile.js

@@ -5,6 +5,7 @@ import { PersonIcon } from '../Icons';
 import { getInitials } from '../utils/functions';
 import { COLORS } from '../utils/theme';
 import { HMSLocalVideoView } from './HMSLocalVideoView';
+import { useHMSRoomStyleSheet } from '../hooks-util';
 export const HMSPreviewTile = () => {
   const isLocalVideoMuted = useSelector(state => state.hmsStates.isLocalVideoMuted);
   const localVideoTrackId = useSelector(state => {
@@ -12,23 +13,34 @@ export const HMSPreviewTile = () => {
     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 userName = useSelector(state => state.user.userName);
+  const roomStyles = useHMSRoomStyleSheet((theme, typography) => ({
+    container: {
+      backgroundColor: theme.palette.background_dim
+    },
+    avatar: {
+      backgroundColor: COLORS.EXTENDED.PURPLE
+    },
+    avatarText: {
+      color: theme.palette.on_surface_high,
+      fontFamily: `${typography.font_family}-SemiBold`
+    }
+  }));
   return /*#__PURE__*/React.createElement(View, {
-    style: styles.modalContainer
+    style: [styles.modalContainer, roomStyles.container]
   }, isLocalVideoMuted || !localVideoTrackId ? /*#__PURE__*/React.createElement(View, {
     style: styles.avatarContainer
   }, /*#__PURE__*/React.createElement(View, {
-    style: styles.avatar
+    style: [styles.avatar, roomStyles.avatar]
   }, userName.length === 0 ? /*#__PURE__*/React.createElement(PersonIcon, {
     style: styles.avatarIcon
   }) : /*#__PURE__*/React.createElement(Text, {
-    style: styles.avatarText
+    style: [styles.avatarText, roomStyles.avatarText]
   }, getInitials(userName)))) : /*#__PURE__*/React.createElement(HMSLocalVideoView, null));
 };
 const styles = StyleSheet.create({
   modalContainer: {
     flex: 1,
     position: 'relative',
-    backgroundColor: COLORS.BACKGROUND.DIM,
     overflow: 'hidden'
   },
   hmsView: {
@@ -42,7 +54,6 @@ const styles = StyleSheet.create({
   avatar: {
     width: 88,
     aspectRatio: 1,
-    backgroundColor: COLORS.EXTENDED.PURPLE,
     borderRadius: 44,
     justifyContent: 'center',
     alignItems: 'center'
@@ -52,10 +63,7 @@ const styles = StyleSheet.create({
     height: 40
   },
   avatarText: {
-    color: COLORS.SURFACE.ON_SURFACE.HIGH,
     fontSize: 34,
-    fontFamily: 'Inter',
-    fontWeight: '600',
     lineHeight: 40,
     letterSpacing: 0.25
   }

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

@@ -1 +1 @@
-{"version":3,"names":["React","useSelector","StyleSheet","Text","View","PersonIcon","getInitials","COLORS","HMSLocalVideoView","HMSPreviewTile","isLocalVideoMuted","state","hmsStates","localVideoTrackId","_state$hmsStates$loca","localPeer","videoTrack","trackId","userName","user","createElement","style","styles","modalContainer","avatarContainer","avatar","length","avatarIcon","avatarText","create","flex","position","backgroundColor","BACKGROUND","DIM","overflow","hmsView","alignItems","justifyContent","width","aspectRatio","EXTENDED","PURPLE","borderRadius","height","color","SURFACE","ON_SURFACE","HIGH","fontSize","fontFamily","fontWeight","lineHeight","letterSpacing"],"sourceRoot":"../../../src","sources":["components/HMSPreviewTile.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,WAAW,QAAQ,aAAa;AACzC,SAASC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AAErD,SAASC,UAAU,QAAQ,UAAU;AAErC,SAASC,WAAW,QAAQ,oBAAoB;AAChD,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,iBAAiB,QAAQ,qBAAqB;AAEvD,OAAO,MAAMC,cAAwB,GAAGA,CAAA,KAAM;EAC5C,MAAMC,iBAAiB,GAAGT,WAAW,CAClCU,KAAgB,IAAKA,KAAK,CAACC,SAAS,CAACF,iBACxC,CAAC;EACD,MAAMG,iBAAiB,GAAGZ,WAAW,CAClCU,KAAgB;IAAA,IAAAG,qBAAA;IAAA,QAAAA,qBAAA,GAAKH,KAAK,CAACC,SAAS,CAACG,SAAS,cAAAD,qBAAA,gBAAAA,qBAAA,GAAzBA,qBAAA,CAA2BE,UAAU,cAAAF,qBAAA,uBAArCA,qBAAA,CAAuCG,OAAO;EAAA,CACtE,CAAC;EACD,MAAMC,QAAQ,GAAGjB,WAAW,CAAEU,KAAgB,IAAKA,KAAK,CAACQ,IAAI,CAACD,QAAQ,CAAC;EAEvE,oBACElB,KAAA,CAAAoB,aAAA,CAAChB,IAAI;IAACiB,KAAK,EAAEC,MAAM,CAACC;EAAe,GAChCb,iBAAiB,IAAI,CAACG,iBAAiB,gBACtCb,KAAA,CAAAoB,aAAA,CAAChB,IAAI;IAACiB,KAAK,EAAEC,MAAM,CAACE;EAAgB,gBAClCxB,KAAA,CAAAoB,aAAA,CAAChB,IAAI;IAACiB,KAAK,EAAEC,MAAM,CAACG;EAAO,GACxBP,QAAQ,CAACQ,MAAM,KAAK,CAAC,gBACpB1B,KAAA,CAAAoB,aAAA,CAACf,UAAU;IAACgB,KAAK,EAAEC,MAAM,CAACK;EAAW,CAAE,CAAC,gBAExC3B,KAAA,CAAAoB,aAAA,CAACjB,IAAI;IAACkB,KAAK,EAAEC,MAAM,CAACM;EAAW,GAAEtB,WAAW,CAACY,QAAQ,CAAQ,CAE3D,CACF,CAAC,gBAEPlB,KAAA,CAAAoB,aAAA,CAACZ,iBAAiB,MAAE,CAElB,CAAC;AAEX,CAAC;AAED,MAAMc,MAAM,GAAGpB,UAAU,CAAC2B,MAAM,CAAC;EAC/BN,cAAc,EAAE;IACdO,IAAI,EAAE,CAAC;IACPC,QAAQ,EAAE,UAAU;IACpBC,eAAe,EAAEzB,MAAM,CAAC0B,UAAU,CAACC,GAAG;IACtCC,QAAQ,EAAE;EACZ,CAAC;EACDC,OAAO,EAAE;IACPN,IAAI,EAAE;EACR,CAAC;EACDN,eAAe,EAAE;IACfM,IAAI,EAAE,CAAC;IACPO,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDb,MAAM,EAAE;IACNc,KAAK,EAAE,EAAE;IACTC,WAAW,EAAE,CAAC;IACdR,eAAe,EAAEzB,MAAM,CAACkC,QAAQ,CAACC,MAAM;IACvCC,YAAY,EAAE,EAAE;IAChBL,cAAc,EAAE,QAAQ;IACxBD,UAAU,EAAE;EACd,CAAC;EACDV,UAAU,EAAE;IACVY,KAAK,EAAE,EAAE;IACTK,MAAM,EAAE;EACV,CAAC;EACDhB,UAAU,EAAE;IACViB,KAAK,EAAEtC,MAAM,CAACuC,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;AACF,CAAC,CAAC"}
+{"version":3,"names":["React","useSelector","StyleSheet","Text","View","PersonIcon","getInitials","COLORS","HMSLocalVideoView","useHMSRoomStyleSheet","HMSPreviewTile","isLocalVideoMuted","state","hmsStates","localVideoTrackId","_state$hmsStates$loca","localPeer","videoTrack","trackId","userName","user","roomStyles","theme","typography","container","backgroundColor","palette","background_dim","avatar","EXTENDED","PURPLE","avatarText","color","on_surface_high","fontFamily","font_family","createElement","style","styles","modalContainer","avatarContainer","length","avatarIcon","create","flex","position","overflow","hmsView","alignItems","justifyContent","width","aspectRatio","borderRadius","height","fontSize","lineHeight","letterSpacing"],"sourceRoot":"../../../src","sources":["components/HMSPreviewTile.tsx"],"mappings":"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"}

package/lib/module/components/HMSPreviewTitle.js

@@ -1,20 +1,28 @@
 import * as React from 'react';
 import { StyleSheet, Text } from 'react-native';
-import { COLORS } from '../utils/theme';
+import { useSelector } from 'react-redux';
+import { useHMSRoomStyle } from '../hooks-util';
 export const HMSPreviewTitle = _ref => {
   let {
     title = 'Get Started'
   } = _ref;
+  const hmsRoomPreviewTitle = useSelector(state => {
+    var _layoutConfig$screens;
+    const layoutConfig = state.hmsStates.layoutConfig;
+    const previewTitle = layoutConfig === null || layoutConfig === void 0 || (_layoutConfig$screens = layoutConfig.screens) === null || _layoutConfig$screens === void 0 || (_layoutConfig$screens = _layoutConfig$screens.preview) === null || _layoutConfig$screens === void 0 || (_layoutConfig$screens = _layoutConfig$screens.default) === null || _layoutConfig$screens === void 0 || (_layoutConfig$screens = _layoutConfig$screens.elements) === null || _layoutConfig$screens === void 0 || (_layoutConfig$screens = _layoutConfig$screens.preview_header) === null || _layoutConfig$screens === void 0 ? void 0 : _layoutConfig$screens.title;
+    return previewTitle || title;
+  });
+  const titleStyles = useHMSRoomStyle((theme, typography) => ({
+    color: theme.palette.on_surface_high,
+    fontFamily: `${typography.font_family}-SemiBold`
+  }));
   return /*#__PURE__*/React.createElement(Text, {
-    style: styles.title
-  }, title);
+    style: [styles.title, titleStyles]
+  }, hmsRoomPreviewTitle);
 };
 const styles = StyleSheet.create({
   title: {
-    color: COLORS.SURFACE.ON_SURFACE.HIGH,
     fontSize: 24,
-    fontFamily: 'Inter',
-    fontWeight: '600',
     lineHeight: 32,
     textAlign: 'center'
   }

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

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","Text","COLORS","HMSPreviewTitle","_ref","title","createElement","style","styles","create","color","SURFACE","ON_SURFACE","HIGH","fontSize","fontFamily","fontWeight","lineHeight","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;EACb;AACF,CAAC,CAAC"}
+{"version":3,"names":["React","StyleSheet","Text","useSelector","useHMSRoomStyle","HMSPreviewTitle","_ref","title","hmsRoomPreviewTitle","state","_layoutConfig$screens","layoutConfig","hmsStates","previewTitle","screens","preview","default","elements","preview_header","titleStyles","theme","typography","color","palette","on_surface_high","fontFamily","font_family","createElement","style","styles","create","fontSize","lineHeight","textAlign"],"sourceRoot":"../../../src","sources":["components/HMSPreviewTitle.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,SAASC,WAAW,QAAQ,aAAa;AAEzC,SAASC,eAAe,QAAQ,eAAe;AAO/C,OAAO,MAAMC,eAA+C,GAAGC,IAAA,IAEzD;EAAA,IAF0D;IAC9DC,KAAK,GAAG;EACV,CAAC,GAAAD,IAAA;EACC,MAAME,mBAAmB,GAAGL,WAAW,CAAEM,KAAgB,IAAK;IAAA,IAAAC,qBAAA;IAC5D,MAAMC,YAAY,GAAGF,KAAK,CAACG,SAAS,CAACD,YAAY;IAEjD,MAAME,YAAY,GAChBF,YAAY,aAAZA,YAAY,gBAAAD,qBAAA,GAAZC,YAAY,CAAEG,OAAO,cAAAJ,qBAAA,gBAAAA,qBAAA,GAArBA,qBAAA,CAAuBK,OAAO,cAAAL,qBAAA,gBAAAA,qBAAA,GAA9BA,qBAAA,CAAgCM,OAAO,cAAAN,qBAAA,gBAAAA,qBAAA,GAAvCA,qBAAA,CAAyCO,QAAQ,cAAAP,qBAAA,gBAAAA,qBAAA,GAAjDA,qBAAA,CAAmDQ,cAAc,cAAAR,qBAAA,uBAAjEA,qBAAA,CAAmEH,KAAK;IAE1E,OAAOM,YAAY,IAAIN,KAAK;EAC9B,CAAC,CAAC;EAEF,MAAMY,WAAW,GAAGf,eAAe,CAAC,CAACgB,KAAK,EAAEC,UAAU,MAAM;IAC1DC,KAAK,EAAEF,KAAK,CAACG,OAAO,CAACC,eAAe;IACpCC,UAAU,EAAG,GAAEJ,UAAU,CAACK,WAAY;EACxC,CAAC,CAAC,CAAC;EAEH,oBAAO1B,KAAA,CAAA2B,aAAA,CAACzB,IAAI;IAAC0B,KAAK,EAAE,CAACC,MAAM,CAACtB,KAAK,EAAEY,WAAW;EAAE,GAAEX,mBAA0B,CAAC;AAC/E,CAAC;AAED,MAAMqB,MAAM,GAAG5B,UAAU,CAAC6B,MAAM,CAAC;EAC/BvB,KAAK,EAAE;IACLwB,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,EAAE;IACdC,SAAS,EAAE;EACb;AACF,CAAC,CAAC"}

package/lib/module/components/HMSPrimaryButton.js

@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { useHMSRoomColorPalette, useHMSRoomStyleSheet } from '../hooks-util';
+import { HMSBaseButton } from './HMSBaseButton';
+export const HMSPrimaryButton = _ref => {
+  let {
+    title,
+    loading,
+    onPress,
+    style,
+    disabled,
+    leftComponent
+  } = _ref;
+  const {
+    primary_dim: primaryDarkColor,
+    on_primary_high: onPrimaryHighColor
+  } = useHMSRoomColorPalette();
+  const hmsRoomStyles = useHMSRoomStyleSheet((theme, typography) => ({
+    button: {
+      backgroundColor: theme.palette.primary_default
+    },
+    disabledButton: {
+      backgroundColor: theme.palette.primary_disabled
+    },
+    buttonText: {
+      color: theme.palette.on_primary_high,
+      fontFamily: `${typography.font_family}-SemiBold`
+    },
+    disabledText: {
+      color: theme.palette.on_primary_low
+    }
+  }));
+  return /*#__PURE__*/React.createElement(HMSBaseButton, {
+    loaderColor: onPrimaryHighColor,
+    loading: loading,
+    onPress: onPress,
+    title: title,
+    underlayColor: primaryDarkColor,
+    disabled: disabled,
+    leftComponent: leftComponent,
+    style: [hmsRoomStyles.button, disabled ? hmsRoomStyles.disabledButton : null, style],
+    textStyle: [hmsRoomStyles.buttonText, disabled ? hmsRoomStyles.disabledText : null]
+  });
+};
+//# sourceMappingURL=HMSPrimaryButton.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","useHMSRoomColorPalette","useHMSRoomStyleSheet","HMSBaseButton","HMSPrimaryButton","_ref","title","loading","onPress","style","disabled","leftComponent","primary_dim","primaryDarkColor","on_primary_high","onPrimaryHighColor","hmsRoomStyles","theme","typography","button","backgroundColor","palette","primary_default","disabledButton","primary_disabled","buttonText","color","fontFamily","font_family","disabledText","on_primary_low","createElement","loaderColor","underlayColor","textStyle"],"sourceRoot":"../../../src","sources":["components/HMSPrimaryButton.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,SAASC,sBAAsB,EAAEC,oBAAoB,QAAQ,eAAe;AAC5E,SAASC,aAAa,QAAQ,iBAAiB;AAW/C,OAAO,MAAMC,gBAAiD,GAAGC,IAAA,IAO3D;EAAA,IAP4D;IAChEC,KAAK;IACLC,OAAO;IACPC,OAAO;IACPC,KAAK;IACLC,QAAQ;IACRC;EACF,CAAC,GAAAN,IAAA;EACC,MAAM;IAAEO,WAAW,EAAEC,gBAAgB;IAAEC,eAAe,EAAEC;EAAmB,CAAC,GAC1Ed,sBAAsB,CAAC,CAAC;EAE1B,MAAMe,aAAa,GAAGd,oBAAoB,CAAC,CAACe,KAAK,EAAEC,UAAU,MAAM;IACjEC,MAAM,EAAE;MACNC,eAAe,EAAEH,KAAK,CAACI,OAAO,CAACC;IACjC,CAAC;IACDC,cAAc,EAAE;MACdH,eAAe,EAAEH,KAAK,CAACI,OAAO,CAACG;IACjC,CAAC;IACDC,UAAU,EAAE;MACVC,KAAK,EAAET,KAAK,CAACI,OAAO,CAACP,eAAe;MACpCa,UAAU,EAAG,GAAET,UAAU,CAACU,WAAY;IACxC,CAAC;IACDC,YAAY,EAAE;MACZH,KAAK,EAAET,KAAK,CAACI,OAAO,CAACS;IACvB;EACF,CAAC,CAAC,CAAC;EAEH,oBACE9B,KAAA,CAAA+B,aAAA,CAAC5B,aAAa;IACZ6B,WAAW,EAAEjB,kBAAmB;IAChCR,OAAO,EAAEA,OAAQ;IACjBC,OAAO,EAAEA,OAAQ;IACjBF,KAAK,EAAEA,KAAM;IACb2B,aAAa,EAAEpB,gBAAiB;IAChCH,QAAQ,EAAEA,QAAS;IACnBC,aAAa,EAAEA,aAAc;IAC7BF,KAAK,EAAE,CACLO,aAAa,CAACG,MAAM,EACpBT,QAAQ,GAAGM,aAAa,CAACO,cAAc,GAAG,IAAI,EAC9Cd,KAAK,CACL;IACFyB,SAAS,EAAE,CACTlB,aAAa,CAACS,UAAU,EACxBf,QAAQ,GAAGM,aAAa,CAACa,YAAY,GAAG,IAAI;EAC5C,CACH,CAAC;AAEN,CAAC"}

package/lib/module/components/HMSRecordingIndicator.js

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { useSelector } from 'react-redux';
+import { ActivityIndicator, StyleSheet } from 'react-native';
+import { RecordingIcon } from '../Icons';
+import { useHMSRoomColorPalette, useHMSRoomStyle } from '../hooks-util';
+export const HMSRecordingIndicator = () => {
+  const isRecordingOn = useSelector(state => {
+    var _state$hmsStates$room;
+    return !!((_state$hmsStates$room = state.hmsStates.room) !== null && _state$hmsStates$room !== void 0 && (_state$hmsStates$room = _state$hmsStates$room.browserRecordingState) !== null && _state$hmsStates$room !== void 0 && _state$hmsStates$room.running);
+  });
+  const startingOrStoppingRecording = useSelector(state => state.app.startingOrStoppingRecording);
+  const {
+    on_surface_high: onSurfaceHighColor
+  } = useHMSRoomColorPalette();
+  const iconStyles = useHMSRoomStyle(theme => ({
+    tintColor: theme.palette.alert_error_default
+  }));
+  if (startingOrStoppingRecording) {
+    return /*#__PURE__*/React.createElement(ActivityIndicator, {
+      size: 'small',
+      color: onSurfaceHighColor
+    });
+  }
+  if (isRecordingOn) {
+    return /*#__PURE__*/React.createElement(RecordingIcon, {
+      style: [styles.icon, iconStyles]
+    });
+  }
+  return null;
+};
+const styles = StyleSheet.create({
+  icon: {
+    width: 24,
+    height: 24
+  }
+});
+//# sourceMappingURL=HMSRecordingIndicator.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","useSelector","ActivityIndicator","StyleSheet","RecordingIcon","useHMSRoomColorPalette","useHMSRoomStyle","HMSRecordingIndicator","isRecordingOn","state","_state$hmsStates$room","hmsStates","room","browserRecordingState","running","startingOrStoppingRecording","app","on_surface_high","onSurfaceHighColor","iconStyles","theme","tintColor","palette","alert_error_default","createElement","size","color","style","styles","icon","create","width","height"],"sourceRoot":"../../../src","sources":["components/HMSRecordingIndicator.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,WAAW,QAAQ,aAAa;AACzC,SAASC,iBAAiB,EAAEC,UAAU,QAAQ,cAAc;AAG5D,SAASC,aAAa,QAAQ,UAAU;AACxC,SAASC,sBAAsB,EAAEC,eAAe,QAAQ,eAAe;AAEvE,OAAO,MAAMC,qBAAqB,GAAGA,CAAA,KAAM;EACzC,MAAMC,aAAa,GAAGP,WAAW,CAC9BQ,KAAgB;IAAA,IAAAC,qBAAA;IAAA,OAAK,CAAC,GAAAA,qBAAA,GAACD,KAAK,CAACE,SAAS,CAACC,IAAI,cAAAF,qBAAA,gBAAAA,qBAAA,GAApBA,qBAAA,CAAsBG,qBAAqB,cAAAH,qBAAA,eAA3CA,qBAAA,CAA6CI,OAAO;EAAA,CAC9E,CAAC;EACD,MAAMC,2BAA2B,GAAGd,WAAW,CAC5CQ,KAAgB,IAAKA,KAAK,CAACO,GAAG,CAACD,2BAClC,CAAC;EAED,MAAM;IAAEE,eAAe,EAAEC;EAAmB,CAAC,GAAGb,sBAAsB,CAAC,CAAC;EAExE,MAAMc,UAAU,GAAGb,eAAe,CAAEc,KAAK,KAAM;IAC7CC,SAAS,EAAED,KAAK,CAACE,OAAO,CAACC;EAC3B,CAAC,CAAC,CAAC;EAEH,IAAIR,2BAA2B,EAAE;IAC/B,oBAAOf,KAAA,CAAAwB,aAAA,CAACtB,iBAAiB;MAACuB,IAAI,EAAE,OAAQ;MAACC,KAAK,EAAER;IAAmB,CAAE,CAAC;EACxE;EAEA,IAAIV,aAAa,EAAE;IACjB,oBAAOR,KAAA,CAAAwB,aAAA,CAACpB,aAAa;MAACuB,KAAK,EAAE,CAACC,MAAM,CAACC,IAAI,EAAEV,UAAU;IAAE,CAAE,CAAC;EAC5D;EAEA,OAAO,IAAI;AACb,CAAC;AAED,MAAMS,MAAM,GAAGzB,UAAU,CAAC2B,MAAM,CAAC;EAC/BD,IAAI,EAAE;IACJE,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE;EACV;AACF,CAAC,CAAC"}

package/lib/module/components/HMSRoomOptions.js

@@ -2,12 +2,15 @@ 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 { HamburgerIcon } 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';
+import { BottomSheet } from './BottomSheet';
+import { ChangeNameModalContent } from './ChangeNameModalContent';
+import { StopRecordingModalContent } from './StopRecordingModalContent';
 export const HMSRoomOptions = () => {
   const {
     modalVisibleType: modalVisible,
@@ -22,13 +25,10 @@ export const HMSRoomOptions = () => {
   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(HamburgerIcon, null)), /*#__PURE__*/React.createElement(BottomSheet, {
+    isVisible: modalVisible === ModalTypes.SETTINGS,
+    dismissModal: dismissModal,
+    animationOutTiming: 700
   }, /*#__PURE__*/React.createElement(RoomSettingsModalContent, {
     newAudioMixingMode: newAudioMixingMode,
     audioDeviceListenerAdded: audioDeviceChangeListener,
@@ -39,6 +39,19 @@ export const HMSRoomOptions = () => {
     setAudioDeviceListenerAdded: setAudioDeviceChangeListener,
     setIsAudioShared: setIsAudioShared,
     setMuteAllTracksAudio: setMuteAllTracksAudio
+  })), /*#__PURE__*/React.createElement(BottomSheet, {
+    isVisible: modalVisible === ModalTypes.CHANGE_NAME,
+    dismissModal: dismissModal,
+    avoidKeyboard: true,
+    animationOutTiming: 700
+  }, /*#__PURE__*/React.createElement(ChangeNameModalContent, {
+    dismissModal: dismissModal
+  })), /*#__PURE__*/React.createElement(BottomSheet, {
+    isVisible: modalVisible === ModalTypes.STOP_RECORDING,
+    dismissModal: dismissModal,
+    animationOutTiming: 800
+  }, /*#__PURE__*/React.createElement(StopRecordingModalContent, {
+    dismissModal: dismissModal
   })), /*#__PURE__*/React.createElement(DefaultModal, {
     animationIn: 'slideInUp',
     animationOut: 'slideOutDown',

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

@@ -1 +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","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":"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"}
+{"version":3,"names":["React","View","HMSAudioMixingMode","HMSAudioMode","PressableIcon","HamburgerIcon","DefaultModal","RoomSettingsModalContent","ChangeAudioMixingModeModal","ChangeAudioModeModal","ChangeAudioOutputModal","ChangeBulkRoleModal","ChangeTrackStateForRoleModal","HlsStreamingModal","RecordingModal","RtcStatsModal","ModalTypes","useModalType","BottomSheet","ChangeNameModalContent","StopRecordingModalContent","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","isVisible","animationOutTiming","audioDeviceListenerAdded","closeRoomSettingsModal","setAudioDeviceListenerAdded","CHANGE_NAME","avoidKeyboard","STOP_RECORDING","animationIn","animationOut","RTC_STATS","modalPosiion","RECORDING","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":"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"}

package/lib/module/components/HMSShowNetworkQuality.js

@@ -1,9 +1,8 @@
 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';
+import { useHMSInstance, useHMSRoomStyle } from '../hooks-util';
 export const HMSShowNetworkQuality = () => {
   const hmsInstance = useHMSInstance();
   const localPeerDownlinkNetworkQuality = useSelector(state => {
@@ -14,10 +13,14 @@ export const HMSShowNetworkQuality = () => {
     hmsInstance.enableNetworkQualityUpdates();
     return () => hmsInstance.disableNetworkQualityUpdates();
   }, [hmsInstance]);
+  const iconContainer = useHMSRoomStyle(theme => ({
+    backgroundColor: theme.palette.border_bright,
+    borderColor: theme.palette.border_bright
+  }));
   return /*#__PURE__*/React.createElement(CustomButton, {
     onPress: () => {},
     disabled: true,
-    viewStyle: styles.singleIconContainer,
+    viewStyle: [styles.singleIconContainer, iconContainer],
     LeftIcon: /*#__PURE__*/React.createElement(Image, {
       resizeMode: "contain",
       style: styles.image,
@@ -32,8 +35,6 @@ const styles = StyleSheet.create({
   },
   singleIconContainer: {
     padding: 8,
-    backgroundColor: COLORS.BORDER.LIGHT,
-    borderColor: COLORS.BORDER.LIGHT,
     borderWidth: 1,
     width: 'auto',
     height: 48,

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

@@ -1 +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;EAEDf,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"}
+{"version":3,"names":["React","useEffect","useSelector","StyleSheet","Image","CustomButton","useHMSInstance","useHMSRoomStyle","HMSShowNetworkQuality","hmsInstance","localPeerDownlinkNetworkQuality","state","_state$hmsStates$loca","hmsStates","localPeer","networkQuality","downlinkQuality","enableNetworkQualityUpdates","disableNetworkQualityUpdates","iconContainer","theme","backgroundColor","palette","border_bright","borderColor","createElement","onPress","disabled","viewStyle","styles","singleIconContainer","LeftIcon","resizeMode","style","image","source","require","create","height","width","padding","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,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,cAAc,EAAEC,eAAe,QAAQ,eAAe;AAE/D,OAAO,MAAMC,qBAAqB,GAAGA,CAAA,KAAM;EACzC,MAAMC,WAAW,GAAGH,cAAc,CAAC,CAAC;EACpC,MAAMI,+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;EAEDf,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,MAAMU,aAAa,GAAGZ,eAAe,CAAEa,KAAK,KAAM;IAChDC,eAAe,EAAED,KAAK,CAACE,OAAO,CAACC,aAAa;IAC5CC,WAAW,EAAEJ,KAAK,CAACE,OAAO,CAACC;EAC7B,CAAC,CAAC,CAAC;EAEH,oBACEvB,KAAA,CAAAyB,aAAA,CAACpB,YAAY;IACXqB,OAAO,EAAEA,CAAA,KAAM,CAAC,CAAE;IAClBC,QAAQ,EAAE,IAAK;IACfC,SAAS,EAAE,CAACC,MAAM,CAACC,mBAAmB,EAAEX,aAAa,CAAE;IACvDY,QAAQ,eACN/B,KAAA,CAAAyB,aAAA,CAACrB,KAAK;MACJ4B,UAAU,EAAC,SAAS;MACpBC,KAAK,EAAEJ,MAAM,CAACK,KAAM;MACpBC,MAAM,EACJzB,+BAA+B,KAAK,CAAC,GACjC0B,OAAO,CAAC,yBAAyB,CAAC,GAClC1B,+BAA+B,KAAK,CAAC,GACrC0B,OAAO,CAAC,yBAAyB,CAAC,GAClC1B,+BAA+B,KAAK,CAAC,GACrC0B,OAAO,CAAC,yBAAyB,CAAC,GAClC1B,+BAA+B,KAAK,CAAC,GACrC0B,OAAO,CAAC,yBAAyB,CAAC,GAClCA,OAAO,CAAC,yBAAyB;IACtC,CACF;EACF,CACF,CAAC;AAEN,CAAC;AAED,MAAMP,MAAM,GAAG1B,UAAU,CAACkC,MAAM,CAAC;EAC/BH,KAAK,EAAE;IACLI,MAAM,EAAE,EAAE;IACVC,KAAK,EAAE;EACT,CAAC;EACDT,mBAAmB,EAAE;IACnBU,OAAO,EAAE,CAAC;IACVC,WAAW,EAAE,CAAC;IACdF,KAAK,EAAE,MAAM;IACbD,MAAM,EAAE,EAAE;IACVI,cAAc,EAAE,QAAQ;IACxBC,UAAU,EAAE,QAAQ;IACpBC,YAAY,EAAE,EAAE;IAChBC,gBAAgB,EAAE;EACpB;AACF,CAAC,CAAC"}

package/lib/module/components/HMSTextInput.js

@@ -0,0 +1,57 @@
+import * as React from 'react';
+import { Platform, StyleSheet, TextInput } from 'react-native';
+import { useHMSRoomColorPalette, useHMSRoomStyleSheet } from '../hooks-util';
+export const HMSTextInput = _ref => {
+  let {
+    value,
+    onChangeText,
+    style,
+    autoFocus
+  } = _ref;
+  const [inputFocused, setInputFocused] = React.useState(false);
+  const handleInputFocus = () => setInputFocused(true);
+  const handleInputBlur = () => setInputFocused(false);
+  const {
+    on_surface_low: onSurfaceLowColor,
+    on_surface_high: onSurfaceHighColor
+  } = useHMSRoomColorPalette();
+  const hmsRoomStyles = useHMSRoomStyleSheet((theme, typography) => ({
+    input: {
+      backgroundColor: theme.palette.surface_default,
+      color: theme.palette.on_surface_high,
+      borderColor: theme.palette.surface_default,
+      fontFamily: `${typography.font_family}-Regular`
+    },
+    focusedInput: {
+      borderColor: theme.palette.primary_default,
+      borderWidth: 2
+    }
+  }));
+  return /*#__PURE__*/React.createElement(TextInput, {
+    style: [styles.input, hmsRoomStyles.input, inputFocused ? hmsRoomStyles.focusedInput : null, style],
+    value: value,
+    onChangeText: onChangeText,
+    placeholder: "Enter Name...",
+    autoCapitalize: "words",
+    autoCompleteType: "name",
+    placeholderTextColor: onSurfaceLowColor,
+    selectionColor: onSurfaceHighColor,
+    onFocus: handleInputFocus,
+    onBlur: handleInputBlur,
+    autoFocus: autoFocus
+  });
+};
+const styles = StyleSheet.create({
+  input: {
+    flex: 1,
+    height: 50,
+    textAlignVertical: 'center',
+    paddingHorizontal: 16,
+    borderRadius: 8,
+    fontSize: 16,
+    lineHeight: Platform.OS === 'android' ? 24 : undefined,
+    letterSpacing: 0.5,
+    borderWidth: 2
+  }
+});
+//# sourceMappingURL=HMSTextInput.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Platform","StyleSheet","TextInput","useHMSRoomColorPalette","useHMSRoomStyleSheet","HMSTextInput","_ref","value","onChangeText","style","autoFocus","inputFocused","setInputFocused","useState","handleInputFocus","handleInputBlur","on_surface_low","onSurfaceLowColor","on_surface_high","onSurfaceHighColor","hmsRoomStyles","theme","typography","input","backgroundColor","palette","surface_default","color","borderColor","fontFamily","font_family","focusedInput","primary_default","borderWidth","createElement","styles","placeholder","autoCapitalize","autoCompleteType","placeholderTextColor","selectionColor","onFocus","onBlur","create","flex","height","textAlignVertical","paddingHorizontal","borderRadius","fontSize","lineHeight","OS","undefined","letterSpacing"],"sourceRoot":"../../../src","sources":["components/HMSTextInput.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,EAAEC,UAAU,EAAEC,SAAS,QAAQ,cAAc;AAG9D,SAASC,sBAAsB,EAAEC,oBAAoB,QAAQ,eAAe;AAS5E,OAAO,MAAMC,YAAyC,GAAGC,IAAA,IAKnD;EAAA,IALoD;IACxDC,KAAK;IACLC,YAAY;IACZC,KAAK;IACLC;EACF,CAAC,GAAAJ,IAAA;EACC,MAAM,CAACK,YAAY,EAAEC,eAAe,CAAC,GAAGb,KAAK,CAACc,QAAQ,CAAC,KAAK,CAAC;EAE7D,MAAMC,gBAAgB,GAAGA,CAAA,KAAMF,eAAe,CAAC,IAAI,CAAC;EAEpD,MAAMG,eAAe,GAAGA,CAAA,KAAMH,eAAe,CAAC,KAAK,CAAC;EAEpD,MAAM;IACJI,cAAc,EAAEC,iBAAiB;IACjCC,eAAe,EAAEC;EACnB,CAAC,GAAGhB,sBAAsB,CAAC,CAAC;EAE5B,MAAMiB,aAAa,GAAGhB,oBAAoB,CAAC,CAACiB,KAAK,EAAEC,UAAU,MAAM;IACjEC,KAAK,EAAE;MACLC,eAAe,EAAEH,KAAK,CAACI,OAAO,CAACC,eAAe;MAC9CC,KAAK,EAAEN,KAAK,CAACI,OAAO,CAACP,eAAe;MACpCU,WAAW,EAAEP,KAAK,CAACI,OAAO,CAACC,eAAe;MAC1CG,UAAU,EAAG,GAAEP,UAAU,CAACQ,WAAY;IACxC,CAAC;IACDC,YAAY,EAAE;MACZH,WAAW,EAAEP,KAAK,CAACI,OAAO,CAACO,eAAe;MAC1CC,WAAW,EAAE;IACf;EACF,CAAC,CAAC,CAAC;EAEH,oBACElC,KAAA,CAAAmC,aAAA,CAAChC,SAAS;IACRO,KAAK,EAAE,CACL0B,MAAM,CAACZ,KAAK,EACZH,aAAa,CAACG,KAAK,EACnBZ,YAAY,GAAGS,aAAa,CAACW,YAAY,GAAG,IAAI,EAChDtB,KAAK,CACL;IACFF,KAAK,EAAEA,KAAM;IACbC,YAAY,EAAEA,YAAa;IAC3B4B,WAAW,EAAC,eAAe;IAC3BC,cAAc,EAAC,OAAO;IACtBC,gBAAgB,EAAC,MAAM;IACvBC,oBAAoB,EAAEtB,iBAAkB;IACxCuB,cAAc,EAAErB,kBAAmB;IACnCsB,OAAO,EAAE3B,gBAAiB;IAC1B4B,MAAM,EAAE3B,eAAgB;IACxBL,SAAS,EAAEA;EAAU,CACtB,CAAC;AAEN,CAAC;AAED,MAAMyB,MAAM,GAAGlC,UAAU,CAAC0C,MAAM,CAAC;EAC/BpB,KAAK,EAAE;IACLqB,IAAI,EAAE,CAAC;IACPC,MAAM,EAAE,EAAE;IACVC,iBAAiB,EAAE,QAAQ;IAC3BC,iBAAiB,EAAE,EAAE;IACrBC,YAAY,EAAE,CAAC;IACfC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAElD,QAAQ,CAACmD,EAAE,KAAK,SAAS,GAAG,EAAE,GAAGC,SAAS;IACtDC,aAAa,EAAE,GAAG;IAClBpB,WAAW,EAAE;EACf;AACF,CAAC,CAAC"}

package/lib/module/components/Header.js

@@ -1,22 +1,16 @@
 import React, { memo } from 'react';
-import { View, StyleSheet, Text } from 'react-native';
+import { View, StyleSheet } 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';
+import { useHMSRoomStyle, useIsHLSViewer } from '../hooks-util';
+import { HMSManageAudioOutput } from './HMSManageAudioOutput';
+import { HMSRecordingIndicator } from './HMSRecordingIndicator';
+import { CompanyLogo } from './CompanyLogo';
 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 debugMode = useSelector(state => state.user.debugMode);
   const animatedStyles = useAnimatedStyle(() => {
     return {
       opacity: offset.value
@@ -28,41 +22,47 @@ export const _Header = _ref => {
       pointerEvents: offset.value === 0 ? 'none' : 'auto'
     };
   }, []);
+  const containerStyles = useHMSRoomStyle(theme => ({
+    backgroundColor: theme.palette.background_dim
+  }));
   return /*#__PURE__*/React.createElement(Animated.View, {
     style: animatedStyles,
     animatedProps: animatedProps
-  }, isHLSViewer ? /*#__PURE__*/React.createElement(View, {
-    style: styles.hlsContainer
-  }, /*#__PURE__*/React.createElement(HmsLogoIcon, null), debugMode && 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)));
+  }, /*#__PURE__*/React.createElement(View, {
+    style: [styles.container, containerStyles]
+  }, /*#__PURE__*/React.createElement(View, {
+    style: styles.logoContainer
+  }, /*#__PURE__*/React.createElement(CompanyLogo, {
+    style: styles.logo
+  }), /*#__PURE__*/React.createElement(HMSRecordingIndicator, null)), /*#__PURE__*/React.createElement(View, {
+    style: styles.controls
+  }, isHLSViewer ? null : /*#__PURE__*/React.createElement(View, {
+    style: styles.cameraRotationWrapper
+  }, /*#__PURE__*/React.createElement(HMSManageCameraRotation, null)), /*#__PURE__*/React.createElement(HMSManageAudioOutput, null))));
 };
 const styles = StyleSheet.create({
   container: {
-    paddingVertical: 8,
+    paddingTop: 8,
+    paddingBottom: 16,
     paddingHorizontal: 16,
-    backgroundColor: COLORS.BACKGROUND.DIM,
     flexDirection: 'row',
     alignItems: 'center',
     justifyContent: 'space-between'
   },
-  hlsContainer: {
-    padding: 16,
-    paddingTop: 8,
+  logoContainer: {
     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
+  logo: {
+    marginRight: 12
+  },
+  controls: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginLeft: 16
+  },
+  cameraRotationWrapper: {
+    marginRight: 16
   }
 });
 export const Header = /*#__PURE__*/memo(_Header);

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

@@ -1 +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","debugMode","user","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":"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"}
+{"version":3,"names":["React","memo","View","StyleSheet","Animated","useAnimatedProps","useAnimatedStyle","HMSManageCameraRotation","useHMSRoomStyle","useIsHLSViewer","HMSManageAudioOutput","HMSRecordingIndicator","CompanyLogo","_Header","_ref","offset","isHLSViewer","animatedStyles","opacity","value","animatedProps","pointerEvents","containerStyles","theme","backgroundColor","palette","background_dim","createElement","style","styles","container","logoContainer","logo","controls","cameraRotationWrapper","create","paddingTop","paddingBottom","paddingHorizontal","flexDirection","alignItems","justifyContent","marginRight","marginLeft","Header"],"sourceRoot":"../../../src","sources":["components/Header.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,IAAI,QAAQ,OAAO;AACnC,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC/C,OAAOC,QAAQ,IACbC,gBAAgB,EAChBC,gBAAgB,QACX,yBAAyB;AAGhC,SAASC,uBAAuB,QAAQ,2BAA2B;AACnE,SAASC,eAAe,EAAEC,cAAc,QAAQ,eAAe;AAC/D,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,WAAW,QAAQ,eAAe;AAM3C,OAAO,MAAMC,OAA8B,GAAGC,IAAA,IAAgB;EAAA,IAAf;IAAEC;EAAO,CAAC,GAAAD,IAAA;EACvD,MAAME,WAAW,GAAGP,cAAc,CAAC,CAAC;EAEpC,MAAMQ,cAAc,GAAGX,gBAAgB,CAAC,MAAM;IAC5C,OAAO;MACLY,OAAO,EAAEH,MAAM,CAACI;MAChB;IACF,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,aAAa,GAAGf,gBAAgB,CAAC,MAElC;IACH,OAAO;MACLgB,aAAa,EAAEN,MAAM,CAACI,KAAK,KAAK,CAAC,GAAG,MAAM,GAAG;IAC/C,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,eAAe,GAAGd,eAAe,CAAEe,KAAK,KAAM;IAClDC,eAAe,EAAED,KAAK,CAACE,OAAO,CAACC;EACjC,CAAC,CAAC,CAAC;EAEH,oBACE1B,KAAA,CAAA2B,aAAA,CAACvB,QAAQ,CAACF,IAAI;IAAC0B,KAAK,EAAEX,cAAe;IAACG,aAAa,EAAEA;EAAc,gBACjEpB,KAAA,CAAA2B,aAAA,CAACzB,IAAI;IAAC0B,KAAK,EAAE,CAACC,MAAM,CAACC,SAAS,EAAER,eAAe;EAAE,gBAC/CtB,KAAA,CAAA2B,aAAA,CAACzB,IAAI;IAAC0B,KAAK,EAAEC,MAAM,CAACE;EAAc,gBAChC/B,KAAA,CAAA2B,aAAA,CAACf,WAAW;IAACgB,KAAK,EAAEC,MAAM,CAACG;EAAK,CAAE,CAAC,eAEnChC,KAAA,CAAA2B,aAAA,CAAChB,qBAAqB,MAAE,CACpB,CAAC,eAEPX,KAAA,CAAA2B,aAAA,CAACzB,IAAI;IAAC0B,KAAK,EAAEC,MAAM,CAACI;EAAS,GAC1BjB,WAAW,GAAG,IAAI,gBACjBhB,KAAA,CAAA2B,aAAA,CAACzB,IAAI;IAAC0B,KAAK,EAAEC,MAAM,CAACK;EAAsB,gBACxClC,KAAA,CAAA2B,aAAA,CAACpB,uBAAuB,MAAE,CACtB,CACP,eAEDP,KAAA,CAAA2B,aAAA,CAACjB,oBAAoB,MAAE,CACnB,CACF,CACO,CAAC;AAEpB,CAAC;AAED,MAAMmB,MAAM,GAAG1B,UAAU,CAACgC,MAAM,CAAC;EAC/BL,SAAS,EAAE;IACTM,UAAU,EAAE,CAAC;IACbC,aAAa,EAAE,EAAE;IACjBC,iBAAiB,EAAE,EAAE;IACrBC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDV,aAAa,EAAE;IACbQ,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACDR,IAAI,EAAE;IACJU,WAAW,EAAE;EACf,CAAC;EACDT,QAAQ,EAAE;IACRM,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBG,UAAU,EAAE;EACd,CAAC;EACDT,qBAAqB,EAAE;IACrBQ,WAAW,EAAE;EACf;AACF,CAAC,CAAC;AAEF,OAAO,MAAME,MAAM,gBAAG3C,IAAI,CAACY,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/LocalPeerRegularVideoView.js

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { useSelector } from 'react-redux';
+import { PeerVideoTileView } from './PeerVideoTile/PeerVideoTileView';
+export const LocalPeerRegularVideoView = _ref => {
+  let {
+    onMoreOptionsPress
+  } = _ref;
+  const localPeerTrackNode = useSelector(state => state.app.localPeerTrackNode);
+  if (!localPeerTrackNode) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(PeerVideoTileView, {
+    peerTrackNode: localPeerTrackNode,
+    onMoreOptionsPress: onMoreOptionsPress
+  });
+};
+//# sourceMappingURL=LocalPeerRegularVideoView.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","useSelector","PeerVideoTileView","LocalPeerRegularVideoView","_ref","onMoreOptionsPress","localPeerTrackNode","state","app","createElement","peerTrackNode"],"sourceRoot":"../../../src","sources":["components/LocalPeerRegularVideoView.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,WAAW,QAAQ,aAAa;AAEzC,SAASC,iBAAiB,QAAQ,mCAAmC;AAOrE,OAAO,MAAMC,yBAEZ,GAAGC,IAAA,IAA4B;EAAA,IAA3B;IAAEC;EAAmB,CAAC,GAAAD,IAAA;EACzB,MAAME,kBAAkB,GAAGL,WAAW,CACnCM,KAAgB,IAAKA,KAAK,CAACC,GAAG,CAACF,kBAClC,CAAC;EAED,IAAI,CAACA,kBAAkB,EAAE;IACvB,OAAO,IAAI;EACb;EAEA,oBACEN,KAAA,CAAAS,aAAA,CAACP,iBAAiB;IAChBQ,aAAa,EAAEJ,kBAAmB;IAClCD,kBAAkB,EAAEA;EAAmB,CACxC,CAAC;AAEN,CAAC"}