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

package/lib/module/components/PeerVideoTile/PeerAudioIndicator.js

@@ -0,0 +1,65 @@
+import * as React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { useSelector } from 'react-redux';
+import LottieView from 'lottie-react-native';
+import { MicIcon } from '../../Icons';
+import { useHMSRoomStyleSheet } from '../../hooks-util';
+export const PeerAudioIndicator = _ref => {
+  let {
+    peer,
+    isMuted
+  } = _ref;
+  const activeSpeaker = useSelector(state => state.hmsStates.activeSpeakers.findIndex(activeSpeaker => activeSpeaker.peer.peerID === peer.peerID) >= 0);
+  const hmsRoomStyles = useHMSRoomStyleSheet(theme => ({
+    iconWrapper: {
+      backgroundColor: theme.palette.secondary_dim
+    },
+    icon: {
+      tintColor: theme.palette.on_secondary_high
+    }
+  }));
+  if (isMuted) {
+    return /*#__PURE__*/React.createElement(View, {
+      style: [styles.iconWrapper, hmsRoomStyles.iconWrapper]
+    }, /*#__PURE__*/React.createElement(MicIcon, {
+      muted: true,
+      style: [styles.icon, hmsRoomStyles.icon]
+    }));
+  }
+  if (activeSpeaker) {
+    return /*#__PURE__*/React.createElement(View, {
+      style: [styles.speakerIconWrapper, hmsRoomStyles.iconWrapper]
+    }, /*#__PURE__*/React.createElement(LottieView, {
+      style: styles.speakerIcon,
+      source: require('../../assets/audio-level-white.json'),
+      autoPlay: true,
+      loop: true
+    }));
+  }
+  return null;
+};
+const styles = StyleSheet.create({
+  iconWrapper: {
+    position: 'absolute',
+    top: 8,
+    right: 8,
+    padding: 8,
+    borderRadius: 16
+  },
+  icon: {
+    width: 16,
+    height: 16
+  },
+  speakerIconWrapper: {
+    position: 'absolute',
+    top: 8,
+    right: 8,
+    padding: 0,
+    borderRadius: 16
+  },
+  speakerIcon: {
+    width: 32,
+    height: 32
+  }
+});
+//# sourceMappingURL=PeerAudioIndicator.js.map

package/lib/module/components/PeerVideoTile/PeerAudioIndicator.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","View","useSelector","LottieView","MicIcon","useHMSRoomStyleSheet","PeerAudioIndicator","_ref","peer","isMuted","activeSpeaker","state","hmsStates","activeSpeakers","findIndex","peerID","hmsRoomStyles","theme","iconWrapper","backgroundColor","palette","secondary_dim","icon","tintColor","on_secondary_high","createElement","style","styles","muted","speakerIconWrapper","speakerIcon","source","require","autoPlay","loop","create","position","top","right","padding","borderRadius","width","height"],"sourceRoot":"../../../../src","sources":["components/PeerVideoTile/PeerAudioIndicator.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAE/C,SAASC,WAAW,QAAQ,aAAa;AACzC,OAAOC,UAAU,MAAM,qBAAqB;AAE5C,SAASC,OAAO,QAAQ,aAAa;AACrC,SAASC,oBAAoB,QAAQ,kBAAkB;AAQvD,OAAO,MAAMC,kBAAqD,GAAGC,IAAA,IAG/D;EAAA,IAHgE;IACpEC,IAAI;IACJC;EACF,CAAC,GAAAF,IAAA;EACC,MAAMG,aAAa,GAAGR,WAAW,CAC9BS,KAAgB,IACfA,KAAK,CAACC,SAAS,CAACC,cAAc,CAACC,SAAS,CACrCJ,aAAa,IAAKA,aAAa,CAACF,IAAI,CAACO,MAAM,KAAKP,IAAI,CAACO,MACxD,CAAC,IAAI,CACT,CAAC;EAED,MAAMC,aAAa,GAAGX,oBAAoB,CAAEY,KAAK,KAAM;IACrDC,WAAW,EAAE;MACXC,eAAe,EAAEF,KAAK,CAACG,OAAO,CAACC;IACjC,CAAC;IACDC,IAAI,EAAE;MACJC,SAAS,EAAEN,KAAK,CAACG,OAAO,CAACI;IAC3B;EACF,CAAC,CAAC,CAAC;EAEH,IAAIf,OAAO,EAAE;IACX,oBACEV,KAAA,CAAA0B,aAAA,CAACxB,IAAI;MAACyB,KAAK,EAAE,CAACC,MAAM,CAACT,WAAW,EAAEF,aAAa,CAACE,WAAW;IAAE,gBAC3DnB,KAAA,CAAA0B,aAAA,CAACrB,OAAO;MAACwB,KAAK,EAAE,IAAK;MAACF,KAAK,EAAE,CAACC,MAAM,CAACL,IAAI,EAAEN,aAAa,CAACM,IAAI;IAAE,CAAE,CAC7D,CAAC;EAEX;EAEA,IAAIZ,aAAa,EAAE;IACjB,oBACEX,KAAA,CAAA0B,aAAA,CAACxB,IAAI;MAACyB,KAAK,EAAE,CAACC,MAAM,CAACE,kBAAkB,EAAEb,aAAa,CAACE,WAAW;IAAE,gBAClEnB,KAAA,CAAA0B,aAAA,CAACtB,UAAU;MACTuB,KAAK,EAAEC,MAAM,CAACG,WAAY;MAC1BC,MAAM,EAAEC,OAAO,CAAC,qCAAqC,CAAE;MACvDC,QAAQ;MACRC,IAAI;IAAA,CACL,CACG,CAAC;EAEX;EAEA,OAAO,IAAI;AACb,CAAC;AAED,MAAMP,MAAM,GAAG3B,UAAU,CAACmC,MAAM,CAAC;EAC/BjB,WAAW,EAAE;IACXkB,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNC,KAAK,EAAE,CAAC;IACRC,OAAO,EAAE,CAAC;IACVC,YAAY,EAAE;EAChB,CAAC;EACDlB,IAAI,EAAE;IACJmB,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE;EACV,CAAC;EACDb,kBAAkB,EAAE;IAClBO,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNC,KAAK,EAAE,CAAC;IACRC,OAAO,EAAE,CAAC;IACVC,YAAY,EAAE;EAChB,CAAC;EACDV,WAAW,EAAE;IACXW,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE;EACV;AACF,CAAC,CAAC"}

package/lib/module/components/PeerVideoTile/PeerMetadata.js

@@ -2,24 +2,34 @@ import * as React from 'react';
 import { StyleSheet, View } from 'react-native';
 import { parseMetadata } from '../../utils/functions';
 import { BRBIcon, HandIcon } from '../../Icons';
-import { useHMSRoomStyle } from '../../hooks-util';
+import { useHMSRoomStyleSheet } from '../../hooks-util';
 export const PeerMetadata = _ref => {
   let {
-    metadata
+    metadata,
+    isHandRaised
   } = _ref;
-  const parsedMetadata = parseMetadata(metadata);
-  const iconWrapperStyles = useHMSRoomStyle(theme => ({
-    backgroundColor: theme.palette.secondary_dim
+  const isBRBOn = !!parseMetadata(metadata).isBRBOn;
+  const hmsRoomStyles = useHMSRoomStyleSheet(theme => ({
+    iconWrapper: {
+      backgroundColor: theme.palette.secondary_dim
+    },
+    icon: {
+      tintColor: theme.palette.on_secondary_high
+    }
   }));
-  if (parsedMetadata.isBRBOn) {
+  if (isBRBOn) {
     return /*#__PURE__*/React.createElement(View, {
-      style: [styles.iconWrapper, iconWrapperStyles]
-    }, /*#__PURE__*/React.createElement(BRBIcon, null));
+      style: [styles.iconWrapper, hmsRoomStyles.iconWrapper]
+    }, /*#__PURE__*/React.createElement(BRBIcon, {
+      style: hmsRoomStyles.icon
+    }));
   }
-  if (parsedMetadata.isHandRaised) {
+  if (isHandRaised) {
     return /*#__PURE__*/React.createElement(View, {
-      style: [styles.iconWrapper, iconWrapperStyles]
-    }, /*#__PURE__*/React.createElement(HandIcon, null));
+      style: [styles.iconWrapper, hmsRoomStyles.iconWrapper]
+    }, /*#__PURE__*/React.createElement(HandIcon, {
+      style: hmsRoomStyles.icon
+    }));
   }
   return null;
 };

package/lib/module/components/PeerVideoTile/PeerMetadata.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","View","parseMetadata","BRBIcon","HandIcon","useHMSRoomStyle","PeerMetadata","_ref","metadata","parsedMetadata","iconWrapperStyles","theme","backgroundColor","palette","secondary_dim","isBRBOn","createElement","style","styles","iconWrapper","isHandRaised","create","position","top","left","padding","borderRadius"],"sourceRoot":"../../../../src","sources":["components/PeerVideoTile/PeerMetadata.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAE/C,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,OAAO,EAAEC,QAAQ,QAAQ,aAAa;AAC/C,SAASC,eAAe,QAAQ,kBAAkB;AAMlD,OAAO,MAAMC,YAAyC,GAAGC,IAAA,IAAkB;EAAA,IAAjB;IAAEC;EAAS,CAAC,GAAAD,IAAA;EACpE,MAAME,cAAc,GAAGP,aAAa,CAACM,QAAQ,CAAC;EAE9C,MAAME,iBAAiB,GAAGL,eAAe,CAAEM,KAAK,KAAM;IACpDC,eAAe,EAAED,KAAK,CAACE,OAAO,CAACC;EACjC,CAAC,CAAC,CAAC;EAEH,IAAIL,cAAc,CAACM,OAAO,EAAE;IAC1B,oBACEhB,KAAA,CAAAiB,aAAA,CAACf,IAAI;MAACgB,KAAK,EAAE,CAACC,MAAM,CAACC,WAAW,EAAET,iBAAiB;IAAE,gBACnDX,KAAA,CAAAiB,aAAA,CAACb,OAAO,MAAE,CACN,CAAC;EAEX;EAEA,IAAIM,cAAc,CAACW,YAAY,EAAE;IAC/B,oBACErB,KAAA,CAAAiB,aAAA,CAACf,IAAI;MAACgB,KAAK,EAAE,CAACC,MAAM,CAACC,WAAW,EAAET,iBAAiB;IAAE,gBACnDX,KAAA,CAAAiB,aAAA,CAACZ,QAAQ,MAAE,CACP,CAAC;EAEX;EAEA,OAAO,IAAI;AACb,CAAC;AAED,MAAMc,MAAM,GAAGlB,UAAU,CAACqB,MAAM,CAAC;EAC/BF,WAAW,EAAE;IACXG,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNC,IAAI,EAAE,CAAC;IACPC,OAAO,EAAE,CAAC;IACVC,YAAY,EAAE;EAChB;AACF,CAAC,CAAC"}
+{"version":3,"names":["React","StyleSheet","View","parseMetadata","BRBIcon","HandIcon","useHMSRoomStyleSheet","PeerMetadata","_ref","metadata","isHandRaised","isBRBOn","hmsRoomStyles","theme","iconWrapper","backgroundColor","palette","secondary_dim","icon","tintColor","on_secondary_high","createElement","style","styles","create","position","top","left","padding","borderRadius"],"sourceRoot":"../../../../src","sources":["components/PeerVideoTile/PeerMetadata.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAE/C,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,OAAO,EAAEC,QAAQ,QAAQ,aAAa;AAC/C,SAASC,oBAAoB,QAAQ,kBAAkB;AAOvD,OAAO,MAAMC,YAAyC,GAAGC,IAAA,IAGnD;EAAA,IAHoD;IACxDC,QAAQ;IACRC;EACF,CAAC,GAAAF,IAAA;EACC,MAAMG,OAAO,GAAG,CAAC,CAACR,aAAa,CAACM,QAAQ,CAAC,CAACE,OAAO;EAEjD,MAAMC,aAAa,GAAGN,oBAAoB,CAAEO,KAAK,KAAM;IACrDC,WAAW,EAAE;MACXC,eAAe,EAAEF,KAAK,CAACG,OAAO,CAACC;IACjC,CAAC;IACDC,IAAI,EAAE;MACJC,SAAS,EAAEN,KAAK,CAACG,OAAO,CAACI;IAC3B;EACF,CAAC,CAAC,CAAC;EAEH,IAAIT,OAAO,EAAE;IACX,oBACEX,KAAA,CAAAqB,aAAA,CAACnB,IAAI;MAACoB,KAAK,EAAE,CAACC,MAAM,CAACT,WAAW,EAAEF,aAAa,CAACE,WAAW;IAAE,gBAC3Dd,KAAA,CAAAqB,aAAA,CAACjB,OAAO;MAACkB,KAAK,EAAEV,aAAa,CAACM;IAAK,CAAE,CACjC,CAAC;EAEX;EAEA,IAAIR,YAAY,EAAE;IAChB,oBACEV,KAAA,CAAAqB,aAAA,CAACnB,IAAI;MAACoB,KAAK,EAAE,CAACC,MAAM,CAACT,WAAW,EAAEF,aAAa,CAACE,WAAW;IAAE,gBAC3Dd,KAAA,CAAAqB,aAAA,CAAChB,QAAQ;MAACiB,KAAK,EAAEV,aAAa,CAACM;IAAK,CAAE,CAClC,CAAC;EAEX;EAEA,OAAO,IAAI;AACb,CAAC;AAED,MAAMK,MAAM,GAAGtB,UAAU,CAACuB,MAAM,CAAC;EAC/BV,WAAW,EAAE;IACXW,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNC,IAAI,EAAE,CAAC;IACPC,OAAO,EAAE,CAAC;IACVC,YAAY,EAAE;EAChB;AACF,CAAC,CAAC"}

package/lib/module/components/PeerVideoTile/PeerNameAndNetwork.js

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 import { HMSTrackSource } from '@100mslive/react-native-hms';
 import { hexToRgbA } from '../../utils/theme';
-import { NetworkQualityIcon } from '../../Icons';
+import { NetworkQualityIcon, ScreenShareIcon } from '../../Icons';
 import { useHMSRoomStyleSheet } from '../../hooks-util';
 export const PeerNameAndNetwork = _ref => {
   let {
@@ -11,10 +11,11 @@ export const PeerNameAndNetwork = _ref => {
     trackSource,
     networkQuality
   } = _ref;
+  const isScreenTrackSource = trackSource && trackSource === HMSTrackSource.SCREEN;
   const showTrackSource = trackSource && trackSource !== HMSTrackSource.REGULAR;
   const hmsRoomStyles = useHMSRoomStyleSheet((theme, typography) => ({
     contentContainer: {
-      backgroundColor: hexToRgbA(theme.palette.background_dim, 0.64)
+      backgroundColor: theme.palette.background_dim && hexToRgbA(theme.palette.background_dim, 0.64)
     },
     name: {
       color: theme.palette.on_surface_high,
@@ -25,7 +26,9 @@ export const PeerNameAndNetwork = _ref => {
     style: styles.container
   }, /*#__PURE__*/React.createElement(View, {
     style: [styles.contentContainer, hmsRoomStyles.contentContainer]
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, isScreenTrackSource ? /*#__PURE__*/React.createElement(ScreenShareIcon, {
+    style: styles.screenShareIcon
+  }) : null, /*#__PURE__*/React.createElement(Text, {
     style: [styles.name, hmsRoomStyles.name],
     numberOfLines: 1,
     ellipsizeMode: showTrackSource ? 'middle' : 'tail'
@@ -58,6 +61,11 @@ const styles = StyleSheet.create({
     lineHeight: 20,
     letterSpacing: 0.25
   },
+  screenShareIcon: {
+    width: 20,
+    height: 20,
+    marginRight: 6
+  },
   networkIcon: {
     marginLeft: 4
   }

package/lib/module/components/PeerVideoTile/PeerNameAndNetwork.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","Text","View","HMSTrackSource","hexToRgbA","NetworkQualityIcon","useHMSRoomStyleSheet","PeerNameAndNetwork","_ref","name","isLocal","trackSource","networkQuality","showTrackSource","REGULAR","hmsRoomStyles","theme","typography","contentContainer","backgroundColor","palette","background_dim","color","on_surface_high","fontFamily","font_family","createElement","style","styles","container","numberOfLines","ellipsizeMode","quality","networkIcon","create","position","bottom","width","flexDirection","paddingVertical","paddingHorizontal","borderRadius","marginLeft","marginRight","flexGrow","flexShrink","fontSize","lineHeight","letterSpacing"],"sourceRoot":"../../../../src","sources":["components/PeerVideoTile/PeerNameAndNetwork.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACrD,SAASC,cAAc,QAAQ,6BAA6B;AAE5D,SAASC,SAAS,QAAQ,mBAAmB;AAC7C,SAASC,kBAAkB,QAAQ,aAAa;AAChD,SAASC,oBAAoB,QAAQ,kBAAkB;AASvD,OAAO,MAAMC,kBAAqD,GAAGC,IAAA,IAK/D;EAAA,IALgE;IACpEC,IAAI;IACJC,OAAO;IACPC,WAAW;IACXC;EACF,CAAC,GAAAJ,IAAA;EACC,MAAMK,eAAe,GAAGF,WAAW,IAAIA,WAAW,KAAKR,cAAc,CAACW,OAAO;EAE7E,MAAMC,aAAa,GAAGT,oBAAoB,CAAC,CAACU,KAAK,EAAEC,UAAU,MAAM;IACjEC,gBAAgB,EAAE;MAChBC,eAAe,EAAEf,SAAS,CAACY,KAAK,CAACI,OAAO,CAACC,cAAc,EAAE,IAAI;IAC/D,CAAC;IACDZ,IAAI,EAAE;MACJa,KAAK,EAAEN,KAAK,CAACI,OAAO,CAACG,eAAe;MACpCC,UAAU,EAAG,GAAEP,UAAU,CAACQ,WAAY;IACxC;EACF,CAAC,CAAC,CAAC;EAEH,oBACE1B,KAAA,CAAA2B,aAAA,CAACxB,IAAI;IAACyB,KAAK,EAAEC,MAAM,CAACC;EAAU,gBAC5B9B,KAAA,CAAA2B,aAAA,CAACxB,IAAI;IAACyB,KAAK,EAAE,CAACC,MAAM,CAACV,gBAAgB,EAAEH,aAAa,CAACG,gBAAgB;EAAE,gBACrEnB,KAAA,CAAA2B,aAAA,CAACzB,IAAI;IACH0B,KAAK,EAAE,CAACC,MAAM,CAACnB,IAAI,EAAEM,aAAa,CAACN,IAAI,CAAE;IACzCqB,aAAa,EAAE,CAAE;IACjBC,aAAa,EAAElB,eAAe,GAAG,QAAQ,GAAG;EAAO,GAElDJ,IAAI,EACJC,OAAO,GAAG,QAAQ,GAAG,EAAE,EACvBG,eAAe,GAAI,MAAKF,WAAY,EAAC,GAAG,EACrC,CAAC,eAEPZ,KAAA,CAAA2B,aAAA,CAACrB,kBAAkB;IACjB2B,OAAO,EAAEpB,cAAe;IACxBe,KAAK,EAAEC,MAAM,CAACK;EAAY,CAC3B,CACG,CACF,CAAC;AAEX,CAAC;AAED,MAAML,MAAM,GAAG5B,UAAU,CAACkC,MAAM,CAAC;EAC/BL,SAAS,EAAE;IACTM,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE,CAAC;IACTC,KAAK,EAAE,MAAM;IACbC,aAAa,EAAE;EACjB,CAAC;EACDpB,gBAAgB,EAAE;IAChBoB,aAAa,EAAE,KAAK;IACpBC,eAAe,EAAE,CAAC;IAClBC,iBAAiB,EAAE,CAAC;IACpBC,YAAY,EAAE,CAAC;IACfC,UAAU,EAAE,CAAC;IAAE;IACfC,WAAW,EAAE,EAAE,GAAG,CAAC,GAAG,EAAE,CAAE;EAC5B,CAAC;;EACDlC,IAAI,EAAE;IACJmC,QAAQ,EAAE,CAAC;IACXC,UAAU,EAAE,CAAC;IACbC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,EAAE;IACdC,aAAa,EAAE;EACjB,CAAC;EACDf,WAAW,EAAE;IACXS,UAAU,EAAE;EACd;AACF,CAAC,CAAC"}
+{"version":3,"names":["React","StyleSheet","Text","View","HMSTrackSource","hexToRgbA","NetworkQualityIcon","ScreenShareIcon","useHMSRoomStyleSheet","PeerNameAndNetwork","_ref","name","isLocal","trackSource","networkQuality","isScreenTrackSource","SCREEN","showTrackSource","REGULAR","hmsRoomStyles","theme","typography","contentContainer","backgroundColor","palette","background_dim","color","on_surface_high","fontFamily","font_family","createElement","style","styles","container","screenShareIcon","numberOfLines","ellipsizeMode","quality","networkIcon","create","position","bottom","width","flexDirection","paddingVertical","paddingHorizontal","borderRadius","marginLeft","marginRight","flexGrow","flexShrink","fontSize","lineHeight","letterSpacing","height"],"sourceRoot":"../../../../src","sources":["components/PeerVideoTile/PeerNameAndNetwork.tsx"],"mappings":"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"}

package/lib/module/components/PeerVideoTile/PeerVideoTileView.js

@@ -1,29 +1,32 @@
 import * as React from 'react';
 import { Pressable, StyleSheet, View } from 'react-native';
-import { HMSTrackSource, HMSVideoViewMode } from '@100mslive/react-native-hms';
-import Animated, { FadeIn, FadeOut } from 'react-native-reanimated';
+import { HMSTrackSource, HMSTrackType, HMSVideoViewMode } from '@100mslive/react-native-hms';
 import { useSelector } from 'react-redux';
 import { VideoView } from './VideoView';
 import { AvatarView } from './AvatarView';
 import { PeerMetadata } from './PeerMetadata';
-import { PeerAudioMutedIndicator } from './PeerAudioMutedIndicator';
+import { PeerAudioIndicator } from './PeerAudioIndicator';
 import { PressableIcon } from '../PressableIcon';
 import { ThreeDotsIcon } from '../../Icons';
 import { hexToRgbA } from '../../utils/theme';
 import { PeerNameAndNetwork } from './PeerNameAndNetwork';
 import { UnmountAfterDelay } from '../UnmountAfterDelay';
+import { PipModes } from '../../utils/types';
 import { isTileOnSpotlight } from '../../utils/functions';
-import { selectCanPublishTrackForRole } from '../../hooks-sdk-selectors';
-import { useHMSRoomStyle } from '../../hooks-util';
+import { selectAllowedTracksToPublish, selectCanPublishTrackForRole } from '../../hooks-sdk-selectors';
+import { useHMSRoomStyleSheet } from '../../hooks-util';
+import { HMSFullScreenButton } from './HMSFullScreenButton';
 export const _PeerVideoTileView = /*#__PURE__*/React.forwardRef((_ref, hmsViewRef) => {
   var _peer$audioTrack, _peer$networkQuality;
   let {
     peerTrackNode,
     onMoreOptionsPress,
+    zoomIn,
     insetMode = false
   } = _ref;
   const unmountAfterDelayRef = React.useRef(null);
   const [mounted, setMounted] = React.useState(true);
+  const isPipModeActive = useSelector(state => state.app.pipModeStatus === PipModes.ACTIVE);
   const onSpotlight = useSelector(state => {
     const {
       onSpotlight
@@ -37,7 +40,7 @@ export const _PeerVideoTileView = /*#__PURE__*/React.forwardRef((_ref, hmsViewRe
   const show = () => {
     var _unmountAfterDelayRef;
     setMounted(true);
-    (_unmountAfterDelayRef = unmountAfterDelayRef.current) === null || _unmountAfterDelayRef === void 0 ? void 0 : _unmountAfterDelayRef.resetTimer();
+    (_unmountAfterDelayRef = unmountAfterDelayRef.current) === null || _unmountAfterDelayRef === void 0 || _unmountAfterDelayRef.resetTimer();
   };
   const hide = () => {
     setMounted(false);
@@ -49,7 +52,7 @@ export const _PeerVideoTileView = /*#__PURE__*/React.forwardRef((_ref, hmsViewRe
     if (insetMode) {
       show();
     }
-    onMoreOptionsPress(peerTrackNode);
+    onMoreOptionsPress === null || onMoreOptionsPress === void 0 || onMoreOptionsPress(peerTrackNode);
   }, [peerTrackNode, onMoreOptionsPress, insetMode]);
   const {
     peer,
@@ -58,51 +61,85 @@ export const _PeerVideoTileView = /*#__PURE__*/React.forwardRef((_ref, hmsViewRe
   } = peerTrackNode;
   const peerCanPublishAudio = selectCanPublishTrackForRole(peer.role, 'audio');
   const peerCanPublishVideo = selectCanPublishTrackForRole(peer.role, 'video');
-  const iconWrapperStyles = useHMSRoomStyle(theme => ({
-    backgroundColor: hexToRgbA(theme.palette.background_dim, 0.64)
+  const allowedToPublish = useSelector(state => {
+    const allowed = selectAllowedTracksToPublish(state);
+    return (allowed && allowed.length > 0) ?? false;
+  });
+  const canTakeActionOnPeer = useSelector(state => {
+    var _state$hmsStates$loca;
+    if (peer.isLocal) {
+      return true;
+    }
+    const permissions = (_state$hmsStates$loca = state.hmsStates.localPeer) === null || _state$hmsStates$loca === void 0 || (_state$hmsStates$loca = _state$hmsStates$loca.role) === null || _state$hmsStates$loca === void 0 ? void 0 : _state$hmsStates$loca.permissions;
+    return permissions && (permissions.changeRole || permissions.mute || permissions.unmute || permissions.removeOthers);
+  });
+  const hmsRoomStyles = useHMSRoomStyleSheet(theme => ({
+    iconWrapperStyles: {
+      backgroundColor: theme.palette.background_dim && hexToRgbA(theme.palette.background_dim, 0.64)
+    },
+    avatarContainer: {
+      backgroundColor: theme.palette.surface_default
+    }
   }));
+  const trackSource = track === null || track === void 0 ? void 0 : track.source;
+  const screenShareTile = !!trackSource && trackSource === HMSTrackSource.SCREEN;
+  const showingVideoTrack = peerCanPublishVideo && track && track.trackId && track.type === HMSTrackType.VIDEO && track.isMute() === false;
+  const hide3DotsButton = !onMoreOptionsPress ||
+  // If button press handler is not available, Or
+  isPipModeActive ||
+  // If Pip Window is active, Or
+  track && (track === null || track === void 0 ? void 0 : track.source) !== HMSTrackSource.REGULAR ||
+  // If track is non-regular, like screen share, Or
+  !canTakeActionOnPeer ||
+  // If local peer can't take action on peer, Or
+  !allowedToPublish; // If local peer can't publish tracks
+
   return /*#__PURE__*/React.createElement(View, {
     style: styles.container
   }, /*#__PURE__*/React.createElement(AvatarView, {
     name: peer.name,
-    videoView: peerCanPublishVideo && track && track.trackId && track.isMute() === false ? /*#__PURE__*/React.createElement(VideoView, {
+    avatarContainerStyles: insetMode ? hmsRoomStyles.avatarContainer : null,
+    isInset: insetMode || isPipModeActive,
+    videoView: showingVideoTrack ? /*#__PURE__*/React.createElement(VideoView, {
       ref: hmsViewRef,
       peer: peer,
+      zoomIn: zoomIn,
       trackId: track.trackId,
       isDegraded: isDegraded,
       overlay: insetMode,
       scaleType: onSpotlight || track.source !== HMSTrackSource.REGULAR ? HMSVideoViewMode.ASPECT_FIT : HMSVideoViewMode.ASPECT_FILL
     }) : null
   }), /*#__PURE__*/React.createElement(PeerMetadata, {
-    metadata: peer.metadata
-  }), peerCanPublishAudio ? /*#__PURE__*/React.createElement(PeerAudioMutedIndicator, {
-    isMuted: (_peer$audioTrack = peer.audioTrack) === null || _peer$audioTrack === void 0 ? void 0 : _peer$audioTrack.isMute()
-  }) : null, insetMode ? null : /*#__PURE__*/React.createElement(PeerNameAndNetwork, {
+    metadata: peer.metadata,
+    isHandRaised: peer.isHandRaised
+  }), screenShareTile && showingVideoTrack ? /*#__PURE__*/React.createElement(HMSFullScreenButton, {
+    peerTrackNode: peerTrackNode
+  }) : peerCanPublishAudio ? /*#__PURE__*/React.createElement(PeerAudioIndicator, {
+    isMuted: (_peer$audioTrack = peer.audioTrack) === null || _peer$audioTrack === void 0 ? void 0 : _peer$audioTrack.isMute(),
+    peer: peer
+  }) : null, insetMode || isPipModeActive ? null : /*#__PURE__*/React.createElement(PeerNameAndNetwork, {
     name: peer.name,
     isLocal: peer.isLocal,
-    trackSource: track === null || track === void 0 ? void 0 : track.source,
+    trackSource: trackSource,
     networkQuality: (_peer$networkQuality = peer.networkQuality) === null || _peer$networkQuality === void 0 ? void 0 : _peer$networkQuality.downlinkQuality
   }), insetMode ? /*#__PURE__*/React.createElement(Pressable, {
     style: styles.pressable,
     onPress: handleTilePress
-  }) : null, insetMode ? /*#__PURE__*/React.createElement(UnmountAfterDelay, {
+  }) : null, hide3DotsButton ? null : insetMode ? /*#__PURE__*/React.createElement(UnmountAfterDelay, {
     ref: unmountAfterDelayRef,
     visible: mounted,
     onUnmount: hide
-  }, /*#__PURE__*/React.createElement(Animated.View, {
-    entering: FadeIn,
-    exiting: FadeOut
   }, /*#__PURE__*/React.createElement(PressableIcon, {
     activeOpacity: 0.7,
-    style: [styles.iconWrapper, iconWrapperStyles],
+    style: [styles.iconWrapper, hmsRoomStyles.iconWrapperStyles],
     border: false,
     onPress: handleOptionsPress
   }, /*#__PURE__*/React.createElement(ThreeDotsIcon, {
     stack: "vertical",
     style: styles.icon
-  })))) : /*#__PURE__*/React.createElement(PressableIcon, {
+  }))) : /*#__PURE__*/React.createElement(PressableIcon, {
     activeOpacity: 0.7,
-    style: [styles.iconWrapper, iconWrapperStyles],
+    style: [styles.iconWrapper, hmsRoomStyles.iconWrapperStyles],
     border: false,
     onPress: handleOptionsPress
   }, /*#__PURE__*/React.createElement(ThreeDotsIcon, {

package/lib/module/components/PeerVideoTile/PeerVideoTileView.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Pressable","StyleSheet","View","HMSTrackSource","HMSVideoViewMode","Animated","FadeIn","FadeOut","useSelector","VideoView","AvatarView","PeerMetadata","PeerAudioMutedIndicator","PressableIcon","ThreeDotsIcon","hexToRgbA","PeerNameAndNetwork","UnmountAfterDelay","isTileOnSpotlight","selectCanPublishTrackForRole","useHMSRoomStyle","_PeerVideoTileView","forwardRef","_ref","hmsViewRef","_peer$audioTrack","_peer$networkQuality","peerTrackNode","onMoreOptionsPress","insetMode","unmountAfterDelayRef","useRef","mounted","setMounted","useState","onSpotlight","state","user","spotlightTrackId","tileVideoTrack","track","peerRegularAudioTrack","peer","audioTrack","peerAuxTracks","auxiliaryTracks","show","_unmountAfterDelayRef","current","resetTimer","hide","handleTilePress","handleOptionsPress","useCallback","isDegraded","peerCanPublishAudio","role","peerCanPublishVideo","iconWrapperStyles","theme","backgroundColor","palette","background_dim","createElement","style","styles","container","name","videoView","trackId","isMute","ref","overlay","scaleType","source","REGULAR","ASPECT_FIT","ASPECT_FILL","metadata","isMuted","isLocal","trackSource","networkQuality","downlinkQuality","pressable","onPress","visible","onUnmount","entering","exiting","activeOpacity","iconWrapper","border","stack","icon","create","flex","position","bottom","right","padding","borderRadius","width","height","PeerVideoTileView","memo"],"sourceRoot":"../../../../src","sources":["components/PeerVideoTile/PeerVideoTileView.tsx"],"mappings":"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"}
+{"version":3,"names":["React","Pressable","StyleSheet","View","HMSTrackSource","HMSTrackType","HMSVideoViewMode","useSelector","VideoView","AvatarView","PeerMetadata","PeerAudioIndicator","PressableIcon","ThreeDotsIcon","hexToRgbA","PeerNameAndNetwork","UnmountAfterDelay","PipModes","isTileOnSpotlight","selectAllowedTracksToPublish","selectCanPublishTrackForRole","useHMSRoomStyleSheet","HMSFullScreenButton","_PeerVideoTileView","forwardRef","_ref","hmsViewRef","_peer$audioTrack","_peer$networkQuality","peerTrackNode","onMoreOptionsPress","zoomIn","insetMode","unmountAfterDelayRef","useRef","mounted","setMounted","useState","isPipModeActive","state","app","pipModeStatus","ACTIVE","onSpotlight","user","spotlightTrackId","tileVideoTrack","track","peerRegularAudioTrack","peer","audioTrack","peerAuxTracks","auxiliaryTracks","show","_unmountAfterDelayRef","current","resetTimer","hide","handleTilePress","handleOptionsPress","useCallback","isDegraded","peerCanPublishAudio","role","peerCanPublishVideo","allowedToPublish","allowed","length","canTakeActionOnPeer","_state$hmsStates$loca","isLocal","permissions","hmsStates","localPeer","changeRole","mute","unmute","removeOthers","hmsRoomStyles","theme","iconWrapperStyles","backgroundColor","palette","background_dim","avatarContainer","surface_default","trackSource","source","screenShareTile","SCREEN","showingVideoTrack","trackId","type","VIDEO","isMute","hide3DotsButton","REGULAR","createElement","style","styles","container","name","avatarContainerStyles","isInset","videoView","ref","overlay","scaleType","ASPECT_FIT","ASPECT_FILL","metadata","isHandRaised","isMuted","networkQuality","downlinkQuality","pressable","onPress","visible","onUnmount","activeOpacity","iconWrapper","border","stack","icon","create","flex","position","bottom","right","padding","borderRadius","width","height","PeerVideoTileView","memo"],"sourceRoot":"../../../../src","sources":["components/PeerVideoTile/PeerVideoTileView.tsx"],"mappings":"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"}

package/lib/module/components/PeerVideoTile/VideoView.js

@@ -1,7 +1,10 @@
 import * as React from 'react';
 import { View, Text, StyleSheet } from 'react-native';
 import { useSelector } from 'react-redux';
+import { BlurView } from '@react-native-community/blur';
 import { useHMSRoomStyleSheet } from '../../hooks-util';
+import { HMSPinchGesture } from './HMSPinchGesture';
+import { AlertTriangleIcon } from '../../Icons';
 const _VideoView = /*#__PURE__*/React.forwardRef((_ref, hmsViewRef) => {
   let {
     trackId,
@@ -9,7 +12,8 @@ const _VideoView = /*#__PURE__*/React.forwardRef((_ref, hmsViewRef) => {
     overlay,
     isDegraded,
     scaleType,
-    containerStyle
+    containerStyle,
+    zoomIn = false
   } = _ref;
   const HmsView = useSelector(state => {
     var _state$user$hmsInstan;
@@ -23,13 +27,16 @@ const _VideoView = /*#__PURE__*/React.forwardRef((_ref, hmsViewRef) => {
     },
     degradedText: {
       color: theme.palette.on_surface_high,
-      fontFamily: `${typography.font_family}-SemiBold`
+      fontFamily: `${typography.font_family}-Regular`
+    },
+    icon: {
+      tintColor: theme.palette.on_surface_high
     }
   }));
   if (!HmsView) {
     return null;
   }
-  return /*#__PURE__*/React.createElement(View, {
+  const videoView = /*#__PURE__*/React.createElement(View, {
     style: [styles.container, containerStyle]
   }, /*#__PURE__*/React.createElement(HmsView, {
     ref: hmsViewRef,
@@ -40,11 +47,24 @@ const _VideoView = /*#__PURE__*/React.forwardRef((_ref, hmsViewRef) => {
     mirror: peer.isLocal ? mirrorCamera : false,
     scaleType: scaleType,
     style: styles.hmsView
-  }), isDegraded ? /*#__PURE__*/React.createElement(View, {
-    style: [styles.degradedView, hmsRoomStyles.degradedView]
-  }, /*#__PURE__*/React.createElement(Text, {
+  }));
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.container
+  }, zoomIn ? /*#__PURE__*/React.createElement(HMSPinchGesture, {
+    style: styles.container
+  }, videoView) : videoView, isDegraded ? /*#__PURE__*/React.createElement(View, {
+    style: styles.degradedView
+  }, /*#__PURE__*/React.createElement(BlurView, {
+    style: styles.blurView,
+    blurType: "dark",
+    blurAmount: 24
+  }), /*#__PURE__*/React.createElement(AlertTriangleIcon, {
+    type: "fill",
+    style: [styles.icon, hmsRoomStyles.icon]
+  }), /*#__PURE__*/React.createElement(Text, {
+    numberOfLines: 2,
     style: [styles.degradedText, hmsRoomStyles.degradedText]
-  }, "Degraded")) : null);
+  }, peer.isLocal ? 'Your' : `${peer.name}'s`, " network is unstable")) : null);
 });
 const styles = StyleSheet.create({
   container: {
@@ -65,10 +85,23 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center'
   },
+  blurView: {
+    flex: 1,
+    position: 'absolute',
+    height: '100%',
+    width: '100%'
+  },
   degradedText: {
-    fontSize: 15,
-    lineHeight: 20,
-    letterSpacing: 0.25
+    fontSize: 12,
+    lineHeight: 16,
+    letterSpacing: 0.4,
+    marginTop: 8,
+    textAlign: 'center',
+    paddingHorizontal: 8
+  },
+  icon: {
+    width: 32,
+    height: 32
   }
 });
 export const VideoView = /*#__PURE__*/React.memo(_VideoView);

package/lib/module/components/PeerVideoTile/VideoView.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","Text","StyleSheet","useSelector","useHMSRoomStyleSheet","_VideoView","forwardRef","_ref","hmsViewRef","trackId","peer","overlay","isDegraded","scaleType","containerStyle","HmsView","state","_state$user$hmsInstan","user","hmsInstance","mirrorCamera","app","joinConfig","autoSimulcast","hmsRoomStyles","theme","typography","degradedView","backgroundColor","palette","surface_default","degradedText","color","on_surface_high","fontFamily","font_family","createElement","style","styles","container","ref","setZOrderMediaOverlay","key","mirror","isLocal","hmsView","create","flex","position","height","width","zIndex","alignItems","justifyContent","fontSize","lineHeight","letterSpacing","VideoView","memo"],"sourceRoot":"../../../../src","sources":["components/PeerVideoTile/VideoView.tsx"],"mappings":"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"}
+{"version":3,"names":["React","View","Text","StyleSheet","useSelector","BlurView","useHMSRoomStyleSheet","HMSPinchGesture","AlertTriangleIcon","_VideoView","forwardRef","_ref","hmsViewRef","trackId","peer","overlay","isDegraded","scaleType","containerStyle","zoomIn","HmsView","state","_state$user$hmsInstan","user","hmsInstance","mirrorCamera","app","joinConfig","autoSimulcast","hmsRoomStyles","theme","typography","degradedView","backgroundColor","palette","surface_default","degradedText","color","on_surface_high","fontFamily","font_family","icon","tintColor","videoView","createElement","style","styles","container","ref","setZOrderMediaOverlay","key","mirror","isLocal","hmsView","blurView","blurType","blurAmount","type","numberOfLines","name","create","flex","position","height","width","zIndex","alignItems","justifyContent","fontSize","lineHeight","letterSpacing","marginTop","textAlign","paddingHorizontal","VideoView","memo"],"sourceRoot":"../../../../src","sources":["components/PeerVideoTile/VideoView.tsx"],"mappings":"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"}

package/lib/module/components/PressableIcon.js

@@ -1,7 +1,8 @@
 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 { StyleSheet, TouchableOpacity } from 'react-native';
-import { useHMSRoomStyleSheet } from '../hooks-util';
+import { useHMSRoomStyleSheet, useIsHLSViewer } from '../hooks-util';
+import { hexToRgbA } from '../utils/theme';
 export const PressableIcon = _ref => {
   let {
     children,
@@ -11,7 +12,11 @@ export const PressableIcon = _ref => {
     border = true,
     ...restProps
   } = _ref;
+  const isHLSViewer = useIsHLSViewer();
   const hmsRoomStyles = useHMSRoomStyleSheet(theme => ({
+    pressable: {
+      backgroundColor: isHLSViewer ? theme.palette.background_dim && hexToRgbA(theme.palette.background_dim, 0.64) : undefined
+    },
     border: {
       borderColor: theme.palette.border_bright
     },
@@ -19,11 +24,11 @@ export const PressableIcon = _ref => {
       backgroundColor: theme.palette.surface_brighter,
       borderColor: theme.palette.surface_brighter
     }
-  }));
+  }), [isHLSViewer]);
   return /*#__PURE__*/React.createElement(TouchableOpacity, _extends({
-    style: [styles.pressable, {
-      borderRadius: rounded ? 20 : undefined,
-      ...(border ? {
+    style: [styles.pressable, hmsRoomStyles.pressable, {
+      borderRadius: rounded ? 20 : 8,
+      ...(border && !isHLSViewer ? {
         ...styles.withBorder,
         ...hmsRoomStyles.border
       } : undefined),
@@ -33,11 +38,11 @@ export const PressableIcon = _ref => {
 };
 const styles = StyleSheet.create({
   pressable: {
+    borderRadius: 8,
     padding: 8,
     alignSelf: 'flex-start'
   },
   withBorder: {
-    borderRadius: 8,
     borderWidth: 1
   }
 });

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

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","TouchableOpacity","useHMSRoomStyleSheet","PressableIcon","_ref","children","style","active","rounded","border","restProps","hmsRoomStyles","theme","borderColor","palette","border_bright","backgroundColor","surface_brighter","createElement","_extends","styles","pressable","borderRadius","undefined","withBorder","create","padding","alignSelf","borderWidth"],"sourceRoot":"../../../src","sources":["components/PressableIcon.tsx"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,gBAAgB,QAAQ,cAAc;AAG3D,SAASC,oBAAoB,QAAQ,eAAe;AASpD,OAAO,MAAMC,aAA2C,GAAGC,IAAA,IAOrD;EAAA,IAPsD;IAC1DC,QAAQ;IACRC,KAAK;IACLC,MAAM,GAAG,KAAK;IACdC,OAAO,GAAG,KAAK;IACfC,MAAM,GAAG,IAAI;IACb,GAAGC;EACL,CAAC,GAAAN,IAAA;EACC,MAAMO,aAAa,GAAGT,oBAAoB,CAAEU,KAAK,KAAM;IACrDH,MAAM,EAAE;MACNI,WAAW,EAAED,KAAK,CAACE,OAAO,CAACC;IAC7B,CAAC;IACDR,MAAM,EAAE;MACNS,eAAe,EAAEJ,KAAK,CAACE,OAAO,CAACG,gBAAgB;MAC/CJ,WAAW,EAAED,KAAK,CAACE,OAAO,CAACG;IAC7B;EACF,CAAC,CAAC,CAAC;EAEH,oBACElB,KAAA,CAAAmB,aAAA,CAACjB,gBAAgB,EAAAkB,QAAA;IACfb,KAAK,EAAE,CACLc,MAAM,CAACC,SAAS,EAChB;MACEC,YAAY,EAAEd,OAAO,GAAG,EAAE,GAAGe,SAAS;MACtC,IAAId,MAAM,GACN;QAAE,GAAGW,MAAM,CAACI,UAAU;QAAE,GAAGb,aAAa,CAACF;MAAO,CAAC,GACjDc,SAAS,CAAC;MACd,IAAIhB,MAAM,GAAGI,aAAa,CAACJ,MAAM,GAAGgB,SAAS;IAC/C,CAAC,EACDjB,KAAK;EACL,GACEI,SAAS,GAEZL,QACe,CAAC;AAEvB,CAAC;AAED,MAAMe,MAAM,GAAGpB,UAAU,CAACyB,MAAM,CAAC;EAC/BJ,SAAS,EAAE;IACTK,OAAO,EAAE,CAAC;IACVC,SAAS,EAAE;EACb,CAAC;EACDH,UAAU,EAAE;IACVF,YAAY,EAAE,CAAC;IACfM,WAAW,EAAE;EACf;AACF,CAAC,CAAC"}
+{"version":3,"names":["React","StyleSheet","TouchableOpacity","useHMSRoomStyleSheet","useIsHLSViewer","hexToRgbA","PressableIcon","_ref","children","style","active","rounded","border","restProps","isHLSViewer","hmsRoomStyles","theme","pressable","backgroundColor","palette","background_dim","undefined","borderColor","border_bright","surface_brighter","createElement","_extends","styles","borderRadius","withBorder","create","padding","alignSelf","borderWidth"],"sourceRoot":"../../../src","sources":["components/PressableIcon.tsx"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,gBAAgB,QAAQ,cAAc;AAG3D,SAASC,oBAAoB,EAAEC,cAAc,QAAQ,eAAe;AACpE,SAASC,SAAS,QAAQ,gBAAgB;AAS1C,OAAO,MAAMC,aAA2C,GAAGC,IAAA,IAOrD;EAAA,IAPsD;IAC1DC,QAAQ;IACRC,KAAK;IACLC,MAAM,GAAG,KAAK;IACdC,OAAO,GAAG,KAAK;IACfC,MAAM,GAAG,IAAI;IACb,GAAGC;EACL,CAAC,GAAAN,IAAA;EACC,MAAMO,WAAW,GAAGV,cAAc,CAAC,CAAC;EAEpC,MAAMW,aAAa,GAAGZ,oBAAoB,CACvCa,KAAK,KAAM;IACVC,SAAS,EAAE;MACTC,eAAe,EAAEJ,WAAW,GACxBE,KAAK,CAACG,OAAO,CAACC,cAAc,IAC5Bf,SAAS,CAACW,KAAK,CAACG,OAAO,CAACC,cAAc,EAAE,IAAI,CAAC,GAC7CC;IACN,CAAC;IACDT,MAAM,EAAE;MACNU,WAAW,EAAEN,KAAK,CAACG,OAAO,CAACI;IAC7B,CAAC;IACDb,MAAM,EAAE;MACNQ,eAAe,EAAEF,KAAK,CAACG,OAAO,CAACK,gBAAgB;MAC/CF,WAAW,EAAEN,KAAK,CAACG,OAAO,CAACK;IAC7B;EACF,CAAC,CAAC,EACF,CAACV,WAAW,CACd,CAAC;EAED,oBACEd,KAAA,CAAAyB,aAAA,CAACvB,gBAAgB,EAAAwB,QAAA;IACfjB,KAAK,EAAE,CACLkB,MAAM,CAACV,SAAS,EAChBF,aAAa,CAACE,SAAS,EACvB;MACEW,YAAY,EAAEjB,OAAO,GAAG,EAAE,GAAG,CAAC;MAC9B,IAAIC,MAAM,IAAI,CAACE,WAAW,GACtB;QAAE,GAAGa,MAAM,CAACE,UAAU;QAAE,GAAGd,aAAa,CAACH;MAAO,CAAC,GACjDS,SAAS,CAAC;MACd,IAAIX,MAAM,GAAGK,aAAa,CAACL,MAAM,GAAGW,SAAS;IAC/C,CAAC,EACDZ,KAAK;EACL,GACEI,SAAS,GAEZL,QACe,CAAC;AAEvB,CAAC;AAED,MAAMmB,MAAM,GAAG1B,UAAU,CAAC6B,MAAM,CAAC;EAC/Bb,SAAS,EAAE;IACTW,YAAY,EAAE,CAAC;IACfG,OAAO,EAAE,CAAC;IACVC,SAAS,EAAE;EACb,CAAC;EACDH,UAAU,EAAE;IACVI,WAAW,EAAE;EACf;AACF,CAAC,CAAC"}