@100mslive/roomkit-react 0.2.8-alpha.0 → 0.2.8-alpha.2

package/dist/index.js

@@ -62,7 +62,7 @@ import {
   theme,
   useBorderAudioLevel,
   useTheme
-} from "./chunk-72B32WVR.js";
+} from "./chunk-2Y4FJB25.js";
 export {
   Accordion,
   AudioLevel,

package/dist/meta.cjs.json

@@ -2814,7 +2814,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/AudioVideoToggle.tsx": {
-      "bytes": 9962,
+      "bytes": 9985,
       "imports": [
         {
           "path": "react",
@@ -4636,7 +4636,7 @@
       "format": "cjs"
     },
     "../hms-video-store/dist/index.js": {
-      "bytes": 324491,
+      "bytes": 326043,
       "imports": [
         {
           "path": "../../node_modules/reselect/es/index.js",
@@ -5870,7 +5870,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Footer/RoleOptions.tsx": {
-      "bytes": 6603,
+      "bytes": 6635,
       "imports": [
         {
           "path": "react",
@@ -10001,7 +10001,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/hooks/useRoleProminencePeers.tsx": {
-      "bytes": 1092,
+      "bytes": 1143,
       "imports": [
         {
           "path": "react",
@@ -10027,7 +10027,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/VideoLayouts/RoleProminence.tsx": {
-      "bytes": 2562,
+      "bytes": 2591,
       "imports": [
         {
           "path": "react",
@@ -13224,7 +13224,7 @@
       "imports": [],
       "exports": [],
       "inputs": {},
-      "bytes": 3203504
+      "bytes": 3206564
     },
     "dist/index.cjs.js": {
       "imports": [
@@ -16028,7 +16028,7 @@
       "entryPoint": "src/index.ts",
       "inputs": {
         "<define:process.env>": {
-          "bytesInOutput": 18254
+          "bytesInOutput": 18234
         },
         "src/Theme/base.config.ts": {
           "bytesInOutput": 6104
@@ -16370,7 +16370,7 @@
           "bytesInOutput": 1359
         },
         "src/Prebuilt/components/AudioVideoToggle.tsx": {
-          "bytesInOutput": 12588
+          "bytesInOutput": 12611
         },
         "src/Prebuilt/components/Footer/EmojiCard.jsx": {
           "bytesInOutput": 1315
@@ -16478,7 +16478,7 @@
           "bytesInOutput": 1396
         },
         "../../node_modules/webrtc-adapter/src/js/chrome/chrome_shim.js": {
-          "bytesInOutput": 22897
+          "bytesInOutput": 22882
         },
         "../../node_modules/webrtc-adapter/src/js/firefox/getusermedia.js": {
           "bytesInOutput": 2280
@@ -16490,13 +16490,13 @@
           "bytesInOutput": 9352
         },
         "../../node_modules/webrtc-adapter/src/js/safari/safari_shim.js": {
-          "bytesInOutput": 12026
+          "bytesInOutput": 12019
         },
         "../../node_modules/sdp/sdp.js": {
-          "bytesInOutput": 22278
+          "bytesInOutput": 22291
         },
         "../../node_modules/webrtc-adapter/src/js/common_shim.js": {
-          "bytesInOutput": 12616
+          "bytesInOutput": 12606
         },
         "../../node_modules/webrtc-adapter/src/js/adapter_factory.js": {
           "bytesInOutput": 4575
@@ -16517,7 +16517,7 @@
           "bytesInOutput": 615
         },
         "../hms-video-store/dist/index.js": {
-          "bytesInOutput": 53028
+          "bytesInOutput": 53062
         },
         "src/Prebuilt/components/hooks/usePlaylistMusic.js": {
           "bytesInOutput": 1384
@@ -16601,7 +16601,7 @@
           "bytesInOutput": 1694
         },
         "src/Prebuilt/components/Footer/RoleOptions.tsx": {
-          "bytesInOutput": 8344
+          "bytesInOutput": 8376
         },
         "src/Prebuilt/components/Footer/RoleAccordion.tsx": {
           "bytesInOutput": 5338
@@ -16847,10 +16847,10 @@
           "bytesInOutput": 3143
         },
         "src/Prebuilt/components/hooks/useRoleProminencePeers.tsx": {
-          "bytesInOutput": 1302
+          "bytesInOutput": 1387
         },
         "src/Prebuilt/components/VideoLayouts/RoleProminence.tsx": {
-          "bytesInOutput": 2716
+          "bytesInOutput": 2745
         },
         "src/Prebuilt/components/LayoutModeSelector.tsx": {
           "bytesInOutput": 3951
@@ -17015,7 +17015,7 @@
           "bytesInOutput": 2245
         },
         "src/Prebuilt/components/Notifications/Notifications.tsx": {
-          "bytesInOutput": 8883
+          "bytesInOutput": 8880
         },
         "src/Prebuilt/components/Notifications/index.tsx": {
           "bytesInOutput": 173
@@ -17063,7 +17063,7 @@
           "bytesInOutput": 2980
         }
       },
-      "bytes": 1512065
+      "bytes": 1512226
     }
   }
 }

package/dist/meta.esbuild.json

@@ -2814,7 +2814,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/AudioVideoToggle.tsx": {
-      "bytes": 9962,
+      "bytes": 9985,
       "imports": [
         {
           "path": "react",
@@ -4636,7 +4636,7 @@
       "format": "cjs"
     },
     "../hms-video-store/dist/index.js": {
-      "bytes": 324491,
+      "bytes": 326043,
       "imports": [
         {
           "path": "../../node_modules/reselect/es/index.js",
@@ -5870,7 +5870,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Footer/RoleOptions.tsx": {
-      "bytes": 6603,
+      "bytes": 6635,
       "imports": [
         {
           "path": "react",
@@ -10001,7 +10001,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/hooks/useRoleProminencePeers.tsx": {
-      "bytes": 1092,
+      "bytes": 1143,
       "imports": [
         {
           "path": "react",
@@ -10027,7 +10027,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/VideoLayouts/RoleProminence.tsx": {
-      "bytes": 2562,
+      "bytes": 2591,
       "imports": [
         {
           "path": "react",
@@ -13229,7 +13229,7 @@
     "dist/index.js": {
       "imports": [
         {
-          "path": "dist/chunk-72B32WVR.js",
+          "path": "dist/chunk-2Y4FJB25.js",
           "kind": "import-statement"
         }
       ],
@@ -13302,16 +13302,16 @@
       "inputs": {},
       "bytes": 1822
     },
-    "dist/HLSView-37B2YVTC.js.map": {
+    "dist/HLSView-CEPQ23TO.js.map": {
       "imports": [],
       "exports": [],
       "inputs": {},
       "bytes": 58854
     },
-    "dist/HLSView-37B2YVTC.js": {
+    "dist/HLSView-CEPQ23TO.js": {
       "imports": [
         {
-          "path": "dist/chunk-72B32WVR.js",
+          "path": "dist/chunk-2Y4FJB25.js",
           "kind": "import-statement"
         },
         {
@@ -13475,13 +13475,13 @@
       },
       "bytes": 36972
     },
-    "dist/chunk-72B32WVR.js.map": {
+    "dist/chunk-2Y4FJB25.js.map": {
       "imports": [],
       "exports": [],
       "inputs": {},
-      "bytes": 3140675
+      "bytes": 3143729
     },
-    "dist/chunk-72B32WVR.js": {
+    "dist/chunk-2Y4FJB25.js": {
       "imports": [
         {
           "path": "react",
@@ -15794,7 +15794,7 @@
           "external": true
         },
         {
-          "path": "dist/HLSView-37B2YVTC.js",
+          "path": "dist/HLSView-CEPQ23TO.js",
           "kind": "dynamic-import"
         },
         {
@@ -16251,7 +16251,7 @@
       ],
       "inputs": {
         "<define:process.env>": {
-          "bytesInOutput": 18254
+          "bytesInOutput": 18234
         },
         "../../node_modules/lodash/lodash.js": {
           "bytesInOutput": 224269
@@ -16263,7 +16263,7 @@
           "bytesInOutput": 26591
         },
         "../../node_modules/sdp/sdp.js": {
-          "bytesInOutput": 22275
+          "bytesInOutput": 22288
         },
         "../../node_modules/sdp-transform/lib/grammar.js": {
           "bytesInOutput": 16120
@@ -16557,7 +16557,7 @@
           "bytesInOutput": 3350
         },
         "src/Prebuilt/components/AudioVideoToggle.tsx": {
-          "bytesInOutput": 10265
+          "bytesInOutput": 10284
         },
         "src/Prebuilt/components/IconButtonWithOptions/IconButtonWithOptions.tsx": {
           "bytesInOutput": 3065
@@ -16689,7 +16689,7 @@
           "bytesInOutput": 10019
         },
         "../hms-video-store/dist/index.js": {
-          "bytesInOutput": 48465
+          "bytesInOutput": 48495
         },
         "../../node_modules/reselect/es/index.js": {
           "bytesInOutput": 2539
@@ -16704,7 +16704,7 @@
           "bytesInOutput": 6305
         },
         "../../node_modules/webrtc-adapter/src/js/chrome/chrome_shim.js": {
-          "bytesInOutput": 22693
+          "bytesInOutput": 22678
         },
         "../../node_modules/webrtc-adapter/src/js/chrome/getusermedia.js": {
           "bytesInOutput": 6078
@@ -16722,10 +16722,10 @@
           "bytesInOutput": 842
         },
         "../../node_modules/webrtc-adapter/src/js/safari/safari_shim.js": {
-          "bytesInOutput": 11875
+          "bytesInOutput": 11868
         },
         "../../node_modules/webrtc-adapter/src/js/common_shim.js": {
-          "bytesInOutput": 12456
+          "bytesInOutput": 12446
         },
         "src/Prebuilt/components/Header/AdditionalRoomState.jsx": {
           "bytesInOutput": 6823
@@ -16806,7 +16806,7 @@
           "bytesInOutput": 4229
         },
         "src/Prebuilt/components/Footer/RoleOptions.tsx": {
-          "bytesInOutput": 7153
+          "bytesInOutput": 7185
         },
         "src/Prebuilt/components/Footer/PollsToggle.tsx": {
           "bytesInOutput": 1073
@@ -17043,7 +17043,7 @@
           "bytesInOutput": 3838
         },
         "src/Prebuilt/components/VideoLayouts/RoleProminence.tsx": {
-          "bytesInOutput": 2154
+          "bytesInOutput": 2183
         },
         "src/Prebuilt/components/SecondaryTiles.tsx": {
           "bytesInOutput": 2494
@@ -17052,7 +17052,7 @@
           "bytesInOutput": 2301
         },
         "src/Prebuilt/components/hooks/useRoleProminencePeers.tsx": {
-          "bytesInOutput": 961
+          "bytesInOutput": 1046
         },
         "src/Prebuilt/components/VideoLayouts/ScreenshareLayout.tsx": {
           "bytesInOutput": 2664
@@ -17127,7 +17127,7 @@
           "bytesInOutput": 27
         },
         "src/Prebuilt/components/Notifications/Notifications.tsx": {
-          "bytesInOutput": 7968
+          "bytesInOutput": 7965
         },
         "src/Prebuilt/components/Notifications/AutoplayBlockedModal.tsx": {
           "bytesInOutput": 1053
@@ -17205,7 +17205,7 @@
           "bytesInOutput": 651
         }
       },
-      "bytes": 1284998
+      "bytes": 1285151
     }
   }
 }

package/package.json

@@ -10,7 +10,7 @@
     "prebuilt",
     "roomkit"
   ],
-  "version": "0.2.8-alpha.0",
+  "version": "0.2.8-alpha.2",
   "author": "100ms",
   "license": "MIT",
   "repository": {
@@ -82,11 +82,11 @@
     "react": ">=17.0.2 <19.0.0"
   },
   "dependencies": {
-    "@100mslive/hls-player": "0.2.8-alpha.0",
+    "@100mslive/hls-player": "0.2.8-alpha.2",
     "@100mslive/hms-noise-cancellation": "0.0.0-alpha.1",
-    "@100mslive/hms-virtual-background": "1.12.8-alpha.0",
-    "@100mslive/react-icons": "0.9.8-alpha.0",
-    "@100mslive/react-sdk": "0.9.8-alpha.0",
+    "@100mslive/hms-virtual-background": "1.12.8-alpha.2",
+    "@100mslive/react-icons": "0.9.8-alpha.2",
+    "@100mslive/react-sdk": "0.9.8-alpha.2",
     "@100mslive/types-prebuilt": "0.12.7",
     "@emoji-mart/data": "^1.0.6",
     "@emoji-mart/react": "^1.0.1",
@@ -121,5 +121,5 @@
     "uuid": "^8.3.2",
     "worker-timers": "^7.0.40"
   },
-  "gitHead": "9eade912c3121837ed2b09ef0047bfbdb6f7cdf2"
+  "gitHead": "ae7569036b49c02d22414e5de343119c48b4aa91"
 }

package/src/Prebuilt/components/AudioVideoToggle.tsx

@@ -57,11 +57,12 @@ export const Options = ({
         <Dropdown.Item
           key={option.label}
           css={{
-            backgroundColor: selectedDeviceId === option.deviceId ? '$surface_bright' : '$surface_dim',
+            backgroundColor: '$surface_dim',
             p: '$4 $8',
             h: '$15',
             fontSize: '$xs',
             justifyContent: 'space-between',
+            color: selectedDeviceId === option.deviceId ? '$primary_bright' : '',
           }}
           onClick={() => {
             onClick(option.deviceId);

package/src/Prebuilt/components/Footer/RoleOptions.tsx

@@ -63,7 +63,7 @@ const MuteUnmuteOption = ({ roleName, peerList }: { peerList: HMSPeer[]; roleNam
             <Dropdown.Item css={dropdownItemCSS} onClick={() => setTrackEnabled('audio', false)}>
               <MicOffIcon />
               <Text variant="sm" css={optionTextCSS}>
-                Mute Audio
+                Mute Audio for All
               </Text>
             </Dropdown.Item>
           ) : null}
@@ -72,7 +72,7 @@ const MuteUnmuteOption = ({ roleName, peerList }: { peerList: HMSPeer[]; roleNam
             <Dropdown.Item css={dropdownItemCSS} onClick={() => setTrackEnabled('audio', true)}>
               <MicOnIcon />
               <Text variant="sm" css={optionTextCSS}>
-                Unmute Audio
+                Unmute Audio for All
               </Text>
             </Dropdown.Item>
           ) : null}
@@ -85,7 +85,7 @@ const MuteUnmuteOption = ({ roleName, peerList }: { peerList: HMSPeer[]; roleNam
             <Dropdown.Item css={dropdownItemCSS} onClick={() => setTrackEnabled('video', false)}>
               <VideoOffIcon />
               <Text variant="sm" css={optionTextCSS}>
-                Mute Video
+                Mute Video for All
               </Text>
             </Dropdown.Item>
           ) : null}
@@ -94,7 +94,7 @@ const MuteUnmuteOption = ({ roleName, peerList }: { peerList: HMSPeer[]; roleNam
             <Dropdown.Item css={dropdownItemCSS} onClick={() => setTrackEnabled('video', true)}>
               <VideoOnIcon />
               <Text variant="sm" css={optionTextCSS}>
-                Unmute Video
+                Unmute Video for All
               </Text>
             </Dropdown.Item>
           ) : null}

package/src/Prebuilt/components/VideoLayouts/RoleProminence.tsx

@@ -67,7 +67,7 @@ export function RoleProminence({
         edgeToEdge={edgeToEdge}
         hasSidebar={layoutMode === LayoutMode.SIDEBAR}
       />
-      {isInsetEnabled && localPeer && !prominentPeers.includes(localPeer) && <InsetTile />}
+      {isInsetEnabled && localPeer && prominentPeers.length > 0 && !prominentPeers.includes(localPeer) && <InsetTile />}
     </ProminenceLayout.Root>
   );
 }

package/src/Prebuilt/components/hooks/useRoleProminencePeers.tsx

@@ -17,7 +17,7 @@ export const useRoleProminencePeers = (prominentRoles: string[], peers: HMSPeer[
           }
           return acc;
         }
-        if (peer.isLocal && isInsetEnabled) {
+        if (peer.isLocal && isInsetEnabled && !prominentRoles?.includes(peer.roleName || '')) {
           return acc;
         }
         if (prominentRoles?.includes(peer.roleName || '')) {
@@ -25,6 +25,7 @@ export const useRoleProminencePeers = (prominentRoles: string[], peers: HMSPeer[
         } else {
           acc[1].push(peer);
         }
+
         return acc;
       },
       [[], []],