@100mslive/react-native-room-kit 0.0.3 → 0.1.0

package/lib/module/Icons/index.js

@@ -23,4 +23,16 @@ export * from './Bluetooth';
 export * from './Headphones';
 export * from './Wave';
 export * from './GenericLogo';
+export * from './Radio';
+export * from './Check';
+export * from './BRB';
+export * from './Maximize';
+export * from './Minimize';
+export * from './Star';
+export * from './Pin';
+export * from './Pencil';
+export * from './Recording';
+export * from './AlertTriangle';
+export * from './Hamburger';
+export * from './Stop';
 //# sourceMappingURL=index.js.map

package/lib/module/Icons/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sourceRoot":"../../../src","sources":["Icons/index.ts"],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,OAAO;AACrB,cAAc,gBAAgB;AAC9B,cAAc,gBAAgB;AAC9B,cAAc,YAAY;AAC1B,cAAc,kBAAkB;AAChC,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,eAAe;AAC7B,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,OAAO;AACrB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,aAAa;AAC3B,cAAc,cAAc;AAC5B,cAAc,QAAQ;AACtB,cAAc,eAAe"}
+{"version":3,"names":[],"sourceRoot":"../../../src","sources":["Icons/index.ts"],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,OAAO;AACrB,cAAc,gBAAgB;AAC9B,cAAc,gBAAgB;AAC9B,cAAc,YAAY;AAC1B,cAAc,kBAAkB;AAChC,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,eAAe;AAC7B,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,OAAO;AACrB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,aAAa;AAC3B,cAAc,cAAc;AAC5B,cAAc,QAAQ;AACtB,cAAc,eAAe;AAC7B,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,OAAO;AACrB,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,aAAa;AAC3B,cAAc,iBAAiB;AAC/B,cAAc,aAAa;AAC3B,cAAc,QAAQ"}

package/lib/module/components/AvatarView.js

@@ -30,8 +30,7 @@ const styles = StyleSheet.create({
   avatarText: {
     color: COLORS.SURFACE.ON_SURFACE.HIGH,
     fontSize: 34,
-    fontFamily: 'Inter',
-    fontWeight: '600',
+    fontFamily: 'Inter-SemiBold',
     lineHeight: 40,
     letterSpacing: 0.25
   }

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

@@ -1 +1 @@
-{"version":3,"names":["React","Text","StyleSheet","View","getInitials","COLORS","AvatarView","_ref","userName","style","initialsStyle","createElement","styles","avatar","length","emptyAvatar","avatarText","create","width","aspectRatio","backgroundColor","EXTENDED","PURPLE","borderRadius","justifyContent","alignItems","color","SURFACE","ON_SURFACE","HIGH","fontSize","fontFamily","fontWeight","lineHeight","letterSpacing"],"sourceRoot":"../../../src","sources":["components/AvatarView.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,IAAI,EAAEC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAGrD,SAASC,WAAW,QAAQ,oBAAoB;AAChD,SAASC,MAAM,QAAQ,gBAAgB;AAQvC,OAAO,MAAMC,UAAqC,GAAGC,IAAA,IAI/C;EAAA,IAJgD;IACpDC,QAAQ;IACRC,KAAK;IACLC;EACF,CAAC,GAAAH,IAAA;EACC,oBACEP,KAAA,CAAAW,aAAA,CAACR,IAAI;IACHM,KAAK,EAAE,CACLG,MAAM,CAACC,MAAM,EACbL,QAAQ,CAACM,MAAM,KAAK,CAAC,GAAGF,MAAM,CAACG,WAAW,GAAG,IAAI,EACjDN,KAAK;EACL,gBAEFT,KAAA,CAAAW,aAAA,CAACV,IAAI;IAACQ,KAAK,EAAE,CAACG,MAAM,CAACI,UAAU,EAAEN,aAAa;EAAE,GAC7CF,QAAQ,CAACM,MAAM,KAAK,CAAC,GAAG,IAAI,GAAGV,WAAW,CAACI,QAAQ,CAChD,CACF,CAAC;AAEX,CAAC;AAED,MAAMI,MAAM,GAAGV,UAAU,CAACe,MAAM,CAAC;EAC/BJ,MAAM,EAAE;IACNK,KAAK,EAAE,EAAE;IACTC,WAAW,EAAE,CAAC;IACdC,eAAe,EAAEf,MAAM,CAACgB,QAAQ,CAACC,MAAM;IACvCC,YAAY,EAAE,EAAE;IAChBC,cAAc,EAAE,QAAQ;IACxBC,UAAU,EAAE;EACd,CAAC;EACDV,WAAW,EAAE;IACXK,eAAe,EAAE,SAAS,CAAE;EAC9B,CAAC;;EACDJ,UAAU,EAAE;IACVU,KAAK,EAAErB,MAAM,CAACsB,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","Text","StyleSheet","View","getInitials","COLORS","AvatarView","_ref","userName","style","initialsStyle","createElement","styles","avatar","length","emptyAvatar","avatarText","create","width","aspectRatio","backgroundColor","EXTENDED","PURPLE","borderRadius","justifyContent","alignItems","color","SURFACE","ON_SURFACE","HIGH","fontSize","fontFamily","lineHeight","letterSpacing"],"sourceRoot":"../../../src","sources":["components/AvatarView.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,IAAI,EAAEC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAGrD,SAASC,WAAW,QAAQ,oBAAoB;AAChD,SAASC,MAAM,QAAQ,gBAAgB;AAQvC,OAAO,MAAMC,UAAqC,GAAGC,IAAA,IAI/C;EAAA,IAJgD;IACpDC,QAAQ;IACRC,KAAK;IACLC;EACF,CAAC,GAAAH,IAAA;EACC,oBACEP,KAAA,CAAAW,aAAA,CAACR,IAAI;IACHM,KAAK,EAAE,CACLG,MAAM,CAACC,MAAM,EACbL,QAAQ,CAACM,MAAM,KAAK,CAAC,GAAGF,MAAM,CAACG,WAAW,GAAG,IAAI,EACjDN,KAAK;EACL,gBAEFT,KAAA,CAAAW,aAAA,CAACV,IAAI;IAACQ,KAAK,EAAE,CAACG,MAAM,CAACI,UAAU,EAAEN,aAAa;EAAE,GAC7CF,QAAQ,CAACM,MAAM,KAAK,CAAC,GAAG,IAAI,GAAGV,WAAW,CAACI,QAAQ,CAChD,CACF,CAAC;AAEX,CAAC;AAED,MAAMI,MAAM,GAAGV,UAAU,CAACe,MAAM,CAAC;EAC/BJ,MAAM,EAAE;IACNK,KAAK,EAAE,EAAE;IACTC,WAAW,EAAE,CAAC;IACdC,eAAe,EAAEf,MAAM,CAACgB,QAAQ,CAACC,MAAM;IACvCC,YAAY,EAAE,EAAE;IAChBC,cAAc,EAAE,QAAQ;IACxBC,UAAU,EAAE;EACd,CAAC;EACDV,WAAW,EAAE;IACXK,eAAe,EAAE,SAAS,CAAE;EAC9B,CAAC;;EACDJ,UAAU,EAAE;IACVU,KAAK,EAAErB,MAAM,CAACsB,OAAO,CAACC,UAAU,CAACC,IAAI;IACrCC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,gBAAgB;IAC5BC,UAAU,EAAE,EAAE;IACdC,aAAa,EAAE;EACjB;AACF,CAAC,CAAC"}

package/lib/module/components/BackButton.js

@@ -1,12 +1,15 @@
 import * as React from 'react';
 import { StyleSheet } from 'react-native';
-import { useNavigation } from '@react-navigation/native';
-import { COLORS } from '../utils/theme';
+import { NavigationContext } from '@react-navigation/native';
 import { PressableIcon } from './PressableIcon';
 import { ChevronIcon } from '../Icons';
+import { useHMSRoomStyle } from '../hooks-util';
 export const BackButton = () => {
-  const navigation = useNavigation();
-  if (!navigation.canGoBack()) {
+  const navigation = React.useContext(NavigationContext);
+  const buttonStyles = useHMSRoomStyle(theme => ({
+    backgroundColor: theme.palette.surface_default
+  }));
+  if (!navigation || !navigation.canGoBack()) {
     return null;
   }
   const handleGoBack = () => {
@@ -15,7 +18,7 @@ export const BackButton = () => {
     }
   };
   return /*#__PURE__*/React.createElement(PressableIcon, {
-    style: styles.button,
+    style: [styles.button, buttonStyles],
     rounded: true,
     border: false,
     onPress: handleGoBack
@@ -26,8 +29,7 @@ export const BackButton = () => {
 const styles = StyleSheet.create({
   button: {
     marginTop: 16,
-    marginLeft: 16,
-    backgroundColor: COLORS.SURFACE.DEFAULT
+    marginLeft: 16
   }
 });
 //# sourceMappingURL=BackButton.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","useNavigation","COLORS","PressableIcon","ChevronIcon","BackButton","navigation","canGoBack","handleGoBack","goBack","createElement","style","styles","button","rounded","border","onPress","direction","create","marginTop","marginLeft","backgroundColor","SURFACE","DEFAULT"],"sourceRoot":"../../../src","sources":["components/BackButton.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,aAAa,QAAQ,0BAA0B;AAExD,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,WAAW,QAAQ,UAAU;AAItC,OAAO,MAAMC,UAAqC,GAAGA,CAAA,KAAM;EACzD,MAAMC,UAAU,GAAGL,aAAa,CAAC,CAAC;EAElC,IAAI,CAACK,UAAU,CAACC,SAAS,CAAC,CAAC,EAAE;IAC3B,OAAO,IAAI;EACb;EAEA,MAAMC,YAAY,GAAGA,CAAA,KAAM;IACzB,IAAIF,UAAU,CAACC,SAAS,CAAC,CAAC,EAAE;MAC1BD,UAAU,CAACG,MAAM,CAAC,CAAC;IACrB;EACF,CAAC;EAED,oBACEV,KAAA,CAAAW,aAAA,CAACP,aAAa;IACZQ,KAAK,EAAEC,MAAM,CAACC,MAAO;IACrBC,OAAO,EAAE,IAAK;IACdC,MAAM,EAAE,KAAM;IACdC,OAAO,EAAER;EAAa,gBAEtBT,KAAA,CAAAW,aAAA,CAACN,WAAW;IAACa,SAAS,EAAC;EAAM,CAAE,CAClB,CAAC;AAEpB,CAAC;AAED,MAAML,MAAM,GAAGZ,UAAU,CAACkB,MAAM,CAAC;EAC/BL,MAAM,EAAE;IACNM,SAAS,EAAE,EAAE;IACbC,UAAU,EAAE,EAAE;IACdC,eAAe,EAAEnB,MAAM,CAACoB,OAAO,CAACC;EAClC;AACF,CAAC,CAAC"}
+{"version":3,"names":["React","StyleSheet","NavigationContext","PressableIcon","ChevronIcon","useHMSRoomStyle","BackButton","navigation","useContext","buttonStyles","theme","backgroundColor","palette","surface_default","canGoBack","handleGoBack","goBack","createElement","style","styles","button","rounded","border","onPress","direction","create","marginTop","marginLeft"],"sourceRoot":"../../../src","sources":["components/BackButton.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,iBAAiB,QAAQ,0BAA0B;AAE5D,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,WAAW,QAAQ,UAAU;AACtC,SAASC,eAAe,QAAQ,eAAe;AAI/C,OAAO,MAAMC,UAAqC,GAAGA,CAAA,KAAM;EACzD,MAAMC,UAAU,GAAGP,KAAK,CAACQ,UAAU,CAACN,iBAAiB,CAAC;EAEtD,MAAMO,YAAY,GAAGJ,eAAe,CAAEK,KAAK,KAAM;IAC/CC,eAAe,EAAED,KAAK,CAACE,OAAO,CAACC;EACjC,CAAC,CAAC,CAAC;EAEH,IAAI,CAACN,UAAU,IAAI,CAACA,UAAU,CAACO,SAAS,CAAC,CAAC,EAAE;IAC1C,OAAO,IAAI;EACb;EAEA,MAAMC,YAAY,GAAGA,CAAA,KAAM;IACzB,IAAIR,UAAU,CAACO,SAAS,CAAC,CAAC,EAAE;MAC1BP,UAAU,CAACS,MAAM,CAAC,CAAC;IACrB;EACF,CAAC;EAED,oBACEhB,KAAA,CAAAiB,aAAA,CAACd,aAAa;IACZe,KAAK,EAAE,CAACC,MAAM,CAACC,MAAM,EAAEX,YAAY,CAAE;IACrCY,OAAO,EAAE,IAAK;IACdC,MAAM,EAAE,KAAM;IACdC,OAAO,EAAER;EAAa,gBAEtBf,KAAA,CAAAiB,aAAA,CAACb,WAAW;IAACoB,SAAS,EAAC;EAAM,CAAE,CAClB,CAAC;AAEpB,CAAC;AAED,MAAML,MAAM,GAAGlB,UAAU,CAACwB,MAAM,CAAC;EAC/BL,MAAM,EAAE;IACNM,SAAS,EAAE,EAAE;IACbC,UAAU,EAAE;EACd;AACF,CAAC,CAAC"}

package/lib/module/components/BottomSheet.js

@@ -0,0 +1,146 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import * as React from 'react';
+import Modal from 'react-native-modal';
+import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+import { CloseIcon } from '../Icons';
+import { useHMSRoomColorPalette, useHMSRoomStyle, useHMSRoomStyleSheet } from '../hooks-util';
+export const BottomSheet = _ref => {
+  let {
+    dismissModal,
+    style,
+    children,
+    containerStyle,
+    ...resetProps
+  } = _ref;
+  const {
+    background_dim: backgroundDimColor
+  } = useHMSRoomColorPalette();
+  const containerStyles = useHMSRoomStyle(theme => ({
+    backgroundColor: theme.palette.background_default
+  }));
+  const {
+    handleModalHideAction
+  } = useBottomSheetActionHandlers();
+  return /*#__PURE__*/React.createElement(Modal, _extends({}, resetProps, {
+    animationIn: resetProps.animationIn ?? 'slideInUp',
+    animationOut: resetProps.animationOut ?? 'slideOutDown',
+    backdropColor: resetProps.backdropColor ?? backgroundDimColor,
+    backdropOpacity: resetProps.backdropOpacity ?? 0.3,
+    onBackButtonPress: resetProps.onBackButtonPress ?? dismissModal,
+    onBackdropPress: resetProps.onBackdropPress ?? dismissModal,
+    useNativeDriver: resetProps.useNativeDriver ?? true,
+    useNativeDriverForBackdrop: resetProps.useNativeDriverForBackdrop ?? true,
+    hideModalContentWhileAnimating: resetProps.hideModalContentWhileAnimating ?? true,
+    style: [styles.modal, style],
+    onModalHide: resetProps.onModalHide ?? handleModalHideAction,
+    supportedOrientations: resetProps.supportedOrientations ?? ['portrait', 'landscape']
+    // coverScreen={true}
+  }), /*#__PURE__*/React.createElement(View, {
+    style: [styles.container, containerStyles, containerStyle]
+  }, children));
+};
+const BottomSheetHeader = _ref2 => {
+  let {
+    dismissModal,
+    heading,
+    subheading
+  } = _ref2;
+  const hmsRoomStyles = useHMSRoomStyleSheet((theme, typography) => ({
+    headerText: {
+      color: theme.palette.on_surface_high,
+      fontFamily: `${typography.font_family}-SemiBold`
+    },
+    subheadingText: {
+      color: theme.palette.on_surface_medium,
+      fontFamily: `${typography.font_family}-Regular`
+    }
+  }));
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.header
+  }, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Text, {
+    style: [styles.headerText, hmsRoomStyles.headerText]
+  }, heading), subheading ? /*#__PURE__*/React.createElement(Text, {
+    style: [styles.subheadingText, hmsRoomStyles.subheadingText]
+  }, subheading) : null), /*#__PURE__*/React.createElement(TouchableOpacity, {
+    onPress: dismissModal,
+    hitSlop: styles.closeIconHitSlop
+  }, /*#__PURE__*/React.createElement(CloseIcon, null)));
+};
+const BottomSheetDivider = () => {
+  const dividerStyles = useHMSRoomStyle(theme => ({
+    backgroundColor: theme.palette.border_default
+  }));
+  return /*#__PURE__*/React.createElement(View, {
+    style: [styles.divider, dividerStyles]
+  });
+};
+BottomSheet.Header = BottomSheetHeader;
+BottomSheet.Divider = BottomSheetDivider;
+const onModalHideActionHandlerRef = {
+  handler: null
+};
+const useBottomSheetActionHandlers = () => {
+  const onModalHideActionRef = React.useRef(onModalHideActionHandlerRef);
+  const handleModalHideAction = React.useCallback(() => {
+    if (typeof onModalHideActionRef.current.handler === 'function') {
+      onModalHideActionRef.current.handler();
+    }
+    onModalHideActionRef.current.handler = null;
+  }, []);
+  return {
+    handleModalHideAction
+  };
+};
+export const useBottomSheetActions = () => {
+  const registerOnModalHideAction = React.useCallback(action => {
+    onModalHideActionHandlerRef.handler = action;
+  }, []);
+  const clearOnModalHideAction = React.useCallback(() => {
+    onModalHideActionHandlerRef.handler = null;
+  }, []);
+  return {
+    registerOnModalHideAction,
+    clearOnModalHideAction
+  };
+};
+const styles = StyleSheet.create({
+  modal: {
+    margin: 0,
+    justifyContent: 'flex-end'
+  },
+  container: {
+    borderTopLeftRadius: 16,
+    borderTopRightRadius: 16,
+    paddingBottom: 32
+  },
+  header: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    marginTop: 16,
+    marginHorizontal: 24
+  },
+  headerText: {
+    fontSize: 16,
+    lineHeight: 24,
+    letterSpacing: 0.15
+  },
+  subheadingText: {
+    marginTop: 4,
+    fontSize: 12,
+    lineHeight: 16,
+    letterSpacing: 0.4
+  },
+  closeIconHitSlop: {
+    bottom: 16,
+    left: 16,
+    right: 16,
+    top: 16
+  },
+  divider: {
+    height: 1,
+    width: '100%',
+    marginVertical: 16
+  }
+});
+//# sourceMappingURL=BottomSheet.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Modal","StyleSheet","Text","TouchableOpacity","View","CloseIcon","useHMSRoomColorPalette","useHMSRoomStyle","useHMSRoomStyleSheet","BottomSheet","_ref","dismissModal","style","children","containerStyle","resetProps","background_dim","backgroundDimColor","containerStyles","theme","backgroundColor","palette","background_default","handleModalHideAction","useBottomSheetActionHandlers","createElement","_extends","animationIn","animationOut","backdropColor","backdropOpacity","onBackButtonPress","onBackdropPress","useNativeDriver","useNativeDriverForBackdrop","hideModalContentWhileAnimating","styles","modal","onModalHide","supportedOrientations","container","BottomSheetHeader","_ref2","heading","subheading","hmsRoomStyles","typography","headerText","color","on_surface_high","fontFamily","font_family","subheadingText","on_surface_medium","header","onPress","hitSlop","closeIconHitSlop","BottomSheetDivider","dividerStyles","border_default","divider","Header","Divider","onModalHideActionHandlerRef","handler","onModalHideActionRef","useRef","useCallback","current","useBottomSheetActions","registerOnModalHideAction","action","clearOnModalHideAction","create","margin","justifyContent","borderTopLeftRadius","borderTopRightRadius","paddingBottom","flexDirection","alignItems","marginTop","marginHorizontal","fontSize","lineHeight","letterSpacing","bottom","left","right","top","height","width","marginVertical"],"sourceRoot":"../../../src","sources":["components/BottomSheet.tsx"],"mappings":"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"}

package/lib/module/components/ChangeNameModalContent.js

@@ -0,0 +1,122 @@
+import * as React from 'react';
+import { View, Text, StyleSheet, TouchableOpacity, Keyboard } from 'react-native';
+import { useSelector } from 'react-redux';
+import { useHMSRoomStyleSheet, useModalType } from '../hooks-util';
+import { BottomSheet, useBottomSheetActions } from './BottomSheet';
+import { ChevronIcon, CloseIcon } from '../Icons';
+import { ModalTypes } from '../utils/types';
+import { HMSTextInput } from './HMSTextInput';
+import { HMSPrimaryButton } from './HMSPrimaryButton';
+import { useHMSActions } from '../hooks-sdk';
+export const ChangeNameModalContent = _ref => {
+  let {
+    dismissModal
+  } = _ref;
+  const hmsActions = useHMSActions();
+  const localPeerName = useSelector(state => {
+    var _state$hmsStates$loca;
+    return ((_state$hmsStates$loca = state.hmsStates.localPeer) === null || _state$hmsStates$loca === void 0 ? void 0 : _state$hmsStates$loca.name) || '';
+  });
+  const [name, setName] = React.useState(localPeerName);
+  const [nameChangeLoading, setNameChangeLoading] = React.useState(false);
+  const {
+    handleModalVisibleType
+  } = useModalType();
+  const {
+    registerOnModalHideAction
+  } = useBottomSheetActions();
+  const hmsRoomStyles = useHMSRoomStyleSheet((theme, typography) => ({
+    headerText: {
+      color: theme.palette.on_surface_high,
+      fontFamily: `${typography.font_family}-SemiBold`
+    }
+  }));
+  const invalidName = name.trim().length <= 0;
+  const disabledButton = nameChangeLoading || invalidName;
+  const handleBackPress = () => {
+    Keyboard.dismiss();
+
+    // Open SETTINGS bottom sheet when current sheet is closed
+    registerOnModalHideAction(() => {
+      handleModalVisibleType(ModalTypes.SETTINGS);
+    });
+
+    // Close current bottom sheet
+    dismissModal();
+  };
+  const handleClosePress = () => {
+    Keyboard.dismiss();
+    dismissModal();
+  };
+  const changeName = async () => {
+    if (invalidName) return;
+    setNameChangeLoading(true);
+    try {
+      await hmsActions.changeName(name);
+      Keyboard.dismiss();
+      dismissModal();
+    } catch (error) {
+      setNameChangeLoading(false);
+    }
+  };
+  return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
+    style: styles.header
+  }, /*#__PURE__*/React.createElement(View, {
+    style: styles.headerControls
+  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+    onPress: handleBackPress,
+    hitSlop: styles.closeIconHitSlop
+  }, /*#__PURE__*/React.createElement(ChevronIcon, {
+    direction: "left"
+  })), /*#__PURE__*/React.createElement(Text, {
+    style: [styles.headerText, hmsRoomStyles.headerText]
+  }, "Change Name")), /*#__PURE__*/React.createElement(TouchableOpacity, {
+    onPress: handleClosePress,
+    hitSlop: styles.closeIconHitSlop
+  }, /*#__PURE__*/React.createElement(CloseIcon, null))), /*#__PURE__*/React.createElement(BottomSheet.Divider, null), /*#__PURE__*/React.createElement(View, {
+    style: styles.contentContainer
+  }, /*#__PURE__*/React.createElement(HMSTextInput, {
+    style: styles.textInput,
+    value: name,
+    autoFocus: true,
+    onChangeText: setName
+  }), /*#__PURE__*/React.createElement(HMSPrimaryButton, {
+    loading: nameChangeLoading,
+    onPress: changeName,
+    title: "Change",
+    disabled: disabledButton
+  })));
+};
+const styles = StyleSheet.create({
+  header: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    marginTop: 16,
+    marginHorizontal: 24
+  },
+  headerControls: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  headerText: {
+    fontSize: 16,
+    lineHeight: 24,
+    letterSpacing: 0.15,
+    marginLeft: 8
+  },
+  closeIconHitSlop: {
+    bottom: 16,
+    left: 16,
+    right: 16,
+    top: 16
+  },
+  contentContainer: {
+    marginHorizontal: 24
+  },
+  textInput: {
+    flex: undefined,
+    marginBottom: 16
+  }
+});
+//# sourceMappingURL=ChangeNameModalContent.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","StyleSheet","TouchableOpacity","Keyboard","useSelector","useHMSRoomStyleSheet","useModalType","BottomSheet","useBottomSheetActions","ChevronIcon","CloseIcon","ModalTypes","HMSTextInput","HMSPrimaryButton","useHMSActions","ChangeNameModalContent","_ref","dismissModal","hmsActions","localPeerName","state","_state$hmsStates$loca","hmsStates","localPeer","name","setName","useState","nameChangeLoading","setNameChangeLoading","handleModalVisibleType","registerOnModalHideAction","hmsRoomStyles","theme","typography","headerText","color","palette","on_surface_high","fontFamily","font_family","invalidName","trim","length","disabledButton","handleBackPress","dismiss","SETTINGS","handleClosePress","changeName","error","createElement","style","styles","header","headerControls","onPress","hitSlop","closeIconHitSlop","direction","Divider","contentContainer","textInput","value","autoFocus","onChangeText","loading","title","disabled","create","flexDirection","alignItems","justifyContent","marginTop","marginHorizontal","fontSize","lineHeight","letterSpacing","marginLeft","bottom","left","right","top","flex","undefined","marginBottom"],"sourceRoot":"../../../src","sources":["components/ChangeNameModalContent.tsx"],"mappings":"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"}

package/lib/module/components/CompanyLogo.js

@@ -0,0 +1,30 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import React from 'react';
+import { Image, StyleSheet } from 'react-native';
+import { useHMSLayoutConfig } from '../hooks-util';
+export const CompanyLogo = _ref => {
+  var _layoutConfig$logo;
+  let {
+    style,
+    ...restProps
+  } = _ref;
+  const layoutConfig = useHMSLayoutConfig();
+  const logoSource = layoutConfig === null || layoutConfig === void 0 || (_layoutConfig$logo = layoutConfig.logo) === null || _layoutConfig$logo === void 0 ? void 0 : _layoutConfig$logo.url;
+  if (!logoSource) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(Image, _extends({
+    source: {
+      uri: logoSource
+    },
+    style: [styles.icon, style]
+  }, restProps));
+};
+const styles = StyleSheet.create({
+  icon: {
+    width: '100%',
+    height: 32,
+    resizeMode: 'contain'
+  }
+});
+//# sourceMappingURL=CompanyLogo.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Image","StyleSheet","useHMSLayoutConfig","CompanyLogo","_ref","_layoutConfig$logo","style","restProps","layoutConfig","logoSource","logo","url","createElement","_extends","source","uri","styles","icon","create","width","height","resizeMode"],"sourceRoot":"../../../src","sources":["components/CompanyLogo.tsx"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,KAAK,EAAEC,UAAU,QAAQ,cAAc;AAGhD,SAASC,kBAAkB,QAAQ,eAAe;AAIlD,OAAO,MAAMC,WAAuC,GAAGC,IAAA,IAGjD;EAAA,IAAAC,kBAAA;EAAA,IAHkD;IACtDC,KAAK;IACL,GAAGC;EACL,CAAC,GAAAH,IAAA;EACC,MAAMI,YAAY,GAAGN,kBAAkB,CAAC,CAAC;EAEzC,MAAMO,UAAU,GAAGD,YAAY,aAAZA,YAAY,gBAAAH,kBAAA,GAAZG,YAAY,CAAEE,IAAI,cAAAL,kBAAA,uBAAlBA,kBAAA,CAAoBM,GAAG;EAC1C,IAAI,CAACF,UAAU,EAAE;IACf,OAAO,IAAI;EACb;EAEA,oBACEV,KAAA,CAAAa,aAAA,CAACZ,KAAK,EAAAa,QAAA;IACJC,MAAM,EAAE;MAAEC,GAAG,EAAEN;IAAW,CAAE;IAC5BH,KAAK,EAAE,CAACU,MAAM,CAACC,IAAI,EAAEX,KAAK;EAAE,GACxBC,SAAS,CACd,CAAC;AAEN,CAAC;AAED,MAAMS,MAAM,GAAGf,UAAU,CAACiB,MAAM,CAAC;EAC/BD,IAAI,EAAE;IACJE,KAAK,EAAE,MAAM;IACbC,MAAM,EAAE,EAAE;IACVC,UAAU,EAAE;EACd;AACF,CAAC,CAAC"}

package/lib/module/components/CustomInput.js

@@ -2,8 +2,7 @@ import React from 'react';
 import { StyleSheet, Text, TextInput, TouchableOpacity, View } from 'react-native';
 import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
 import { COLORS } from '../utils/theme';
-const CustomInput = (_ref // autoCompleteType = 'off',
-) => {
+const CustomInput = _ref => {
   let {
     value,
     title,
@@ -20,7 +19,7 @@ const CustomInput = (_ref // autoCompleteType = 'off',
     blurOnSubmit,
     disableFullscreenUI = true,
     clear = true,
-    autoCapitalize = 'none' // autoCorrect = false,
+    autoCapitalize = 'none' // autoCorrect = false, // autoCompleteType = 'off',
   } = _ref;
   const showClear = clear && value !== undefined && (value === null || value === void 0 ? void 0 : value.length) > 0;
   const onChange = newValue => {

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

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","Text","TextInput","TouchableOpacity","View","MaterialIcons","COLORS","CustomInput","_ref","value","title","onChangeText","placeholderTextColor","placeholder","textStyle","viewStyle","clearButtonStyle","inputStyle","defaultValue","returnKeyType","multiline","blurOnSubmit","disableFullscreenUI","clear","autoCapitalize","showClear","undefined","length","onChange","newValue","createElement","style","styles","inputContainer","input","keyboardAppearance","autoCorrect","textContentType","autoCompleteType","onPress","clearContainer","name","clearIcon","size","create","width","height","position","right","top","bottom","justifyContent","paddingHorizontal","paddingRight","color","TEXT","HIGH_EMPHASIS"],"sourceRoot":"../../../src","sources":["components/CustomInput.tsx"],"mappings":"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"}
+{"version":3,"names":["React","StyleSheet","Text","TextInput","TouchableOpacity","View","MaterialIcons","COLORS","CustomInput","_ref","value","title","onChangeText","placeholderTextColor","placeholder","textStyle","viewStyle","clearButtonStyle","inputStyle","defaultValue","returnKeyType","multiline","blurOnSubmit","disableFullscreenUI","clear","autoCapitalize","showClear","undefined","length","onChange","newValue","createElement","style","styles","inputContainer","input","keyboardAppearance","autoCorrect","textContentType","autoCompleteType","onPress","clearContainer","name","clearIcon","size","create","width","height","position","right","top","bottom","justifyContent","paddingHorizontal","paddingRight","color","TEXT","HIGH_EMPHASIS"],"sourceRoot":"../../../src","sources":["components/CustomInput.tsx"],"mappings":"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"}

package/lib/module/components/DisplayView.js

@@ -1,21 +1,20 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
+import React, { useRef, useState } from 'react';
 import { useSelector } from 'react-redux';
-import { View, Text, InteractionManager } from 'react-native';
+import { InteractionManager } from 'react-native';
 import { HMSCameraControl } from '@100mslive/react-native-hms';
 import Animated, { interpolate, useAnimatedStyle } from 'react-native-reanimated';
 import { styles } from './styles';
 import { DefaultModal } from './DefaultModal';
 import { ModalTypes, PipModes } from '../utils/types';
-import { pairData, requestExternalStoragePermission } from '../utils/functions';
-import { ChangeAspectRatio, ChangeNameModal, ChangeRoleAccepteModal, ChangeRoleModal, ChangeTrackStateModal, ChangeVolumeModal, SaveScreenshot } from './Modals';
-import { GridView } from './GridView';
+import { requestExternalStoragePermission } from '../utils/functions';
+import { ChangeAspectRatio, ChangeRoleAccepteModal, ChangeRoleModal, ChangeTrackStateModal, SaveScreenshot } from './Modals';
 import { HLSView } from './HLSView';
-import PIPView from './PIPView';
 import { PeerSettingsModalContent } from '../components/PeerSettingsModalContent';
 import { StreamingQualityModalContent } from '../components/StreamingQualityModalContent';
 import { useHMSChangeTrackStateRequest, useHMSInstance, useHMSRoleChangeRequest, useHMSSessionStoreListeners, useIsHLSViewer, useModalType } from '../hooks-util';
-import { useIsPortraitOrientation } from '../utils/dimension';
 import { ParticipantsModal } from './ParticipantsModal';
+import { WebrtcView } from './WebrtcView';
+import { BottomSheet } from './BottomSheet';
 export const DisplayView = _ref => {
   let {
     offset,
@@ -23,7 +22,6 @@ export const DisplayView = _ref => {
   } = _ref;
   // --- 100ms SDK Instance ---
   const hmsInstance = useHMSInstance();
-  const isPortrait = useIsPortraitOrientation();
   const isHLSViewer = useIsHLSViewer();
   const {
     modalVisibleType: modalVisible,
@@ -36,17 +34,13 @@ export const DisplayView = _ref => {
 
   //  --- Redux stores ---
   const isPipModeActive = useSelector(state => state.app.pipModeStatus === PipModes.ACTIVE);
-  const spotlightTrackId = useSelector(state => state.user.spotlightTrackId); // State to track active spotlight trackId
 
   // --- Component Local States ---
   const [selectedPeerTrackNode, setSelectedPeerTrackNode] = useState(null);
   const [capturedImagePath, setCapturedImagePath] = useState(null);
 
-  // --- Constants ---
-  const pairedPeers = useMemo(() => pairData(peerTrackNodes, isPortrait ? 4 : 2, spotlightTrackId), [peerTrackNodes, spotlightTrackId, isPortrait]);
-
   // --- Listeners ---
-  useHMSSessionStoreListeners();
+  useHMSSessionStoreListeners(gridViewRef);
   const trackStateChangeRequest = useHMSChangeTrackStateRequest(() => {
     setModalVisible(ModalTypes.CHANGE_TRACK, true);
   });
@@ -54,18 +48,6 @@ export const DisplayView = _ref => {
     setModalVisible(ModalTypes.CHANGE_ROLE_ACCEPT, true);
   });
 
-  // --- Effects ---
-  useEffect(() => {
-    // Scroll to start of the list
-    if (spotlightTrackId) {
-      var _gridViewRef$current;
-      (_gridViewRef$current = gridViewRef.current) === null || _gridViewRef$current === void 0 || (_gridViewRef$current = _gridViewRef$current.getFlatlistRef().current) === null || _gridViewRef$current === void 0 ? void 0 : _gridViewRef$current.scrollToOffset({
-        animated: true,
-        offset: 0
-      });
-    }
-  }, [spotlightTrackId]);
-
   // functions
 
   const handlePeerTileMorePress = React.useCallback(peerTrackNode => {
@@ -75,8 +57,8 @@ export const DisplayView = _ref => {
   const handleCaptureScreenShotPress = node => {
     setModalVisible(ModalTypes.DEFAULT);
     InteractionManager.runAfterInteractions(() => {
-      var _gridViewRef$current2;
-      (_gridViewRef$current2 = gridViewRef.current) === null || _gridViewRef$current2 === void 0 ? void 0 : _gridViewRef$current2.captureViewScreenshot(node);
+      var _gridViewRef$current;
+      (_gridViewRef$current = gridViewRef.current) === null || _gridViewRef$current === void 0 ? void 0 : _gridViewRef$current.captureViewScreenshot(node);
     });
   };
   const handleCaptureImageAtMaxSupportedResolutionPress = _node => {
@@ -109,31 +91,16 @@ export const DisplayView = _ref => {
   }, []);
   return /*#__PURE__*/React.createElement(Animated.View, {
     style: [styles.container, animatedStyles]
-  }, isHLSViewer ? /*#__PURE__*/React.createElement(HLSView, null) : pairedPeers.length > 0 ? /*#__PURE__*/React.createElement(React.Fragment, null, isPipModeActive ? /*#__PURE__*/React.createElement(PIPView, {
-    pairedPeers: pairedPeers
-  }) : /*#__PURE__*/React.createElement(GridView, {
+  }, isHLSViewer ? /*#__PURE__*/React.createElement(HLSView, null) : /*#__PURE__*/React.createElement(WebrtcView, {
     ref: gridViewRef,
-    onPeerTileMorePress: handlePeerTileMorePress,
-    pairedPeers: pairedPeers
-  })) : /*#__PURE__*/React.createElement(View, {
-    style: styles.welcomeContainer
-  }, /*#__PURE__*/React.createElement(Text, {
-    style: styles.welcomeHeading
-  }, "Welcome!"), /*#__PURE__*/React.createElement(Text, {
-    style: styles.welcomeDescription
-  }, "You're the first one here."), /*#__PURE__*/React.createElement(Text, {
-    style: styles.welcomeDescription
-  }, "Sit back and relax till the others join.")), isPipModeActive ? null : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DefaultModal, {
-    backdrop: true,
-    modalPosiion: "center",
-    viewStyle: {
-      minWidth: '70%',
-      width: undefined
-    },
-    modalVisible: modalVisible === ModalTypes.PEER_SETTINGS,
-    setModalVisible: () => setModalVisible(ModalTypes.DEFAULT)
+    peerTrackNodes: peerTrackNodes,
+    handlePeerTileMorePress: handlePeerTileMorePress
+  }), isPipModeActive ? null : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(BottomSheet, {
+    isVisible: modalVisible === ModalTypes.PEER_SETTINGS,
+    dismissModal: () => setModalVisible(ModalTypes.DEFAULT)
   }, selectedPeerTrackNode ? /*#__PURE__*/React.createElement(PeerSettingsModalContent, {
     peerTrackNode: selectedPeerTrackNode,
+    peerTrackNodesListEmpty: peerTrackNodes.length === 0,
     cancelModal: () => setModalVisible(ModalTypes.DEFAULT),
     onCaptureScreenShotPress: handleCaptureScreenShotPress,
     onCaptureImageAtMaxSupportedResolutionPress: handleCaptureImageAtMaxSupportedResolutionPress,
@@ -186,18 +153,6 @@ export const DisplayView = _ref => {
     setModalVisible: () => setModalVisible(ModalTypes.DEFAULT)
   }, /*#__PURE__*/React.createElement(ChangeRoleModal, {
     cancelModal: () => setModalVisible(ModalTypes.DEFAULT)
-  })), /*#__PURE__*/React.createElement(DefaultModal, {
-    modalPosiion: "center",
-    modalVisible: modalVisible === ModalTypes.VOLUME,
-    setModalVisible: () => setModalVisible(ModalTypes.DEFAULT)
-  }, /*#__PURE__*/React.createElement(ChangeVolumeModal, {
-    cancelModal: () => setModalVisible(ModalTypes.DEFAULT)
-  })), /*#__PURE__*/React.createElement(DefaultModal, {
-    modalPosiion: "center",
-    modalVisible: modalVisible === ModalTypes.CHANGE_NAME,
-    setModalVisible: () => setModalVisible(ModalTypes.DEFAULT)
-  }, /*#__PURE__*/React.createElement(ChangeNameModal, {
-    cancelModal: () => setModalVisible(ModalTypes.DEFAULT)
   }))));
 };
 //# sourceMappingURL=DisplayView.js.map