@100mslive/roomkit-react 0.1.9-alpha.1 → 0.1.9

package/dist/index.js

@@ -42,7 +42,7 @@ import {
   getLeft,
   useBorderAudioLevel,
   useTheme
-} from "./chunk-322YFA55.js";
+} from "./chunk-EDGWHFCM.js";
 import {
   Box,
   Flex,
@@ -63,7 +63,7 @@ import {
   styled,
   textEllipsis,
   theme
-} from "./chunk-6UGU3UJL.js";
+} from "./chunk-SONHO3VM.js";
 export {
   Accordion,
   AudioLevel,

package/dist/meta.cjs.json

@@ -1982,7 +1982,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/AppData/useSidepane.js": {
-      "bytes": 2450,
+      "bytes": 2510,
       "imports": [
         {
           "path": "react",
@@ -2842,7 +2842,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Leave/LeaveRoom.tsx": {
-      "bytes": 2251,
+      "bytes": 2304,
       "imports": [
         {
           "path": "react",
@@ -7148,7 +7148,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Polls/CreatePollQuiz/PollsQuizMenu.jsx": {
-      "bytes": 7348,
+      "bytes": 7629,
       "imports": [
         {
           "path": "react",
@@ -7405,7 +7405,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Polls/CreateQuestions/QuestionForm.jsx": {
-      "bytes": 7945,
+      "bytes": 8093,
       "imports": [
         {
           "path": "react",
@@ -7676,7 +7676,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Polls/Voting/Voting.jsx": {
-      "bytes": 3246,
+      "bytes": 3265,
       "imports": [
         {
           "path": "react",
@@ -9244,7 +9244,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/hooks/useRedirectToLeave.tsx": {
-      "bytes": 746,
+      "bytes": 661,
       "imports": [
         {
           "path": "react",
@@ -9275,7 +9275,7 @@
       "format": "esm"
     },
     "src/Prebuilt/AppStateContext.tsx": {
-      "bytes": 2523,
+      "bytes": 2535,
       "imports": [
         {
           "path": "react",
@@ -9382,13 +9382,18 @@
       "format": "esm"
     },
     "src/Prebuilt/components/MwebLandscapePrompt.tsx": {
-      "bytes": 2181,
+      "bytes": 2466,
       "imports": [
         {
           "path": "react",
           "kind": "import-statement",
           "external": true
         },
+        {
+          "path": "react-use",
+          "kind": "import-statement",
+          "external": true
+        },
         {
           "path": "@100mslive/react-icons",
           "kind": "import-statement",
@@ -9414,6 +9419,11 @@
           "kind": "import-statement",
           "original": "../../Text"
         },
+        {
+          "path": "src/Theme/index.tsx",
+          "kind": "import-statement",
+          "original": "../../Theme"
+        },
         {
           "path": "<define:process.env>",
           "kind": "import-statement",
@@ -9766,7 +9776,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Notifications/Notifications.tsx": {
-      "bytes": 7271,
+      "bytes": 7288,
       "imports": [
         {
           "path": "react",
@@ -10538,7 +10548,7 @@
       "imports": [],
       "exports": [],
       "inputs": {},
-      "bytes": 1094618
+      "bytes": 1095884
     },
     "dist/index.cjs.js": {
       "imports": [
@@ -12592,6 +12602,11 @@
           "kind": "require-call",
           "external": true
         },
+        {
+          "path": "react-use",
+          "kind": "require-call",
+          "external": true
+        },
         {
           "path": "@100mslive/react-icons",
           "kind": "require-call",
@@ -12797,7 +12812,7 @@
       "entryPoint": "src/index.ts",
       "inputs": {
         "<define:process.env>": {
-          "bytesInOutput": 18494
+          "bytesInOutput": 18428
         },
         "src/Theme/base.config.ts": {
           "bytesInOutput": 6104
@@ -13067,7 +13082,7 @@
           "bytesInOutput": 7161
         },
         "src/Prebuilt/components/AppData/useSidepane.js": {
-          "bytesInOutput": 2428
+          "bytesInOutput": 2515
         },
         "src/Prebuilt/components/AppData/AppData.jsx": {
           "bytesInOutput": 6787
@@ -13127,7 +13142,7 @@
           "bytesInOutput": 5237
         },
         "src/Prebuilt/components/Leave/LeaveRoom.tsx": {
-          "bytesInOutput": 2510
+          "bytesInOutput": 2601
         },
         "src/Prebuilt/components/PIP/pipUtils.js": {
           "bytesInOutput": 4391
@@ -13412,7 +13427,7 @@
           "bytesInOutput": 1555
         },
         "src/Prebuilt/components/Polls/CreatePollQuiz/PollsQuizMenu.jsx": {
-          "bytesInOutput": 9161
+          "bytesInOutput": 9433
         },
         "src/Prebuilt/components/Polls/CreateQuestions/DeleteQuestionModal.jsx": {
           "bytesInOutput": 2780
@@ -13433,7 +13448,7 @@
           "bytesInOutput": 4752
         },
         "src/Prebuilt/components/Polls/CreateQuestions/QuestionForm.jsx": {
-          "bytesInOutput": 9229
+          "bytesInOutput": 9325
         },
         "src/Prebuilt/components/Polls/CreateQuestions/SavedQuestion.jsx": {
           "bytesInOutput": 2749
@@ -13451,7 +13466,7 @@
           "bytesInOutput": 1381
         },
         "src/Prebuilt/components/Polls/Voting/Voting.jsx": {
-          "bytesInOutput": 3872
+          "bytesInOutput": 3891
         },
         "src/Prebuilt/components/Polls/Polls.tsx": {
           "bytesInOutput": 996
@@ -13556,16 +13571,16 @@
           "bytesInOutput": 4998
         },
         "src/Prebuilt/components/hooks/useRedirectToLeave.tsx": {
-          "bytesInOutput": 882
+          "bytesInOutput": 789
         },
         "src/Prebuilt/AppStateContext.tsx": {
-          "bytesInOutput": 2724
+          "bytesInOutput": 2697
         },
         "src/Prebuilt/components/LeaveScreen.tsx": {
           "bytesInOutput": 2925
         },
         "src/Prebuilt/components/MwebLandscapePrompt.tsx": {
-          "bytesInOutput": 2697
+          "bytesInOutput": 3069
         },
         "src/Prebuilt/components/Toast/ToastConfig.jsx": {
           "bytesInOutput": 7487
@@ -13604,7 +13619,7 @@
           "bytesInOutput": 2271
         },
         "src/Prebuilt/components/Notifications/Notifications.tsx": {
-          "bytesInOutput": 7786
+          "bytesInOutput": 7803
         },
         "src/Prebuilt/components/Notifications/index.tsx": {
           "bytesInOutput": 173
@@ -13640,7 +13655,7 @@
           "bytesInOutput": 2930
         }
       },
-      "bytes": 892772
+      "bytes": 893540
     }
   }
 }

package/dist/meta.esbuild.json

@@ -1982,7 +1982,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/AppData/useSidepane.js": {
-      "bytes": 2450,
+      "bytes": 2510,
       "imports": [
         {
           "path": "react",
@@ -2842,7 +2842,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Leave/LeaveRoom.tsx": {
-      "bytes": 2251,
+      "bytes": 2304,
       "imports": [
         {
           "path": "react",
@@ -7148,7 +7148,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Polls/CreatePollQuiz/PollsQuizMenu.jsx": {
-      "bytes": 7348,
+      "bytes": 7629,
       "imports": [
         {
           "path": "react",
@@ -7405,7 +7405,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Polls/CreateQuestions/QuestionForm.jsx": {
-      "bytes": 7945,
+      "bytes": 8093,
       "imports": [
         {
           "path": "react",
@@ -7676,7 +7676,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Polls/Voting/Voting.jsx": {
-      "bytes": 3246,
+      "bytes": 3265,
       "imports": [
         {
           "path": "react",
@@ -9244,7 +9244,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/hooks/useRedirectToLeave.tsx": {
-      "bytes": 746,
+      "bytes": 661,
       "imports": [
         {
           "path": "react",
@@ -9275,7 +9275,7 @@
       "format": "esm"
     },
     "src/Prebuilt/AppStateContext.tsx": {
-      "bytes": 2523,
+      "bytes": 2535,
       "imports": [
         {
           "path": "react",
@@ -9382,13 +9382,18 @@
       "format": "esm"
     },
     "src/Prebuilt/components/MwebLandscapePrompt.tsx": {
-      "bytes": 2181,
+      "bytes": 2466,
       "imports": [
         {
           "path": "react",
           "kind": "import-statement",
           "external": true
         },
+        {
+          "path": "react-use",
+          "kind": "import-statement",
+          "external": true
+        },
         {
           "path": "@100mslive/react-icons",
           "kind": "import-statement",
@@ -9414,6 +9419,11 @@
           "kind": "import-statement",
           "original": "../../Text"
         },
+        {
+          "path": "src/Theme/index.tsx",
+          "kind": "import-statement",
+          "original": "../../Theme"
+        },
         {
           "path": "<define:process.env>",
           "kind": "import-statement",
@@ -9766,7 +9776,7 @@
       "format": "esm"
     },
     "src/Prebuilt/components/Notifications/Notifications.tsx": {
-      "bytes": 7271,
+      "bytes": 7288,
       "imports": [
         {
           "path": "react",
@@ -10543,11 +10553,11 @@
     "dist/index.js": {
       "imports": [
         {
-          "path": "dist/chunk-322YFA55.js",
+          "path": "dist/chunk-EDGWHFCM.js",
           "kind": "import-statement"
         },
         {
-          "path": "dist/chunk-6UGU3UJL.js",
+          "path": "dist/chunk-SONHO3VM.js",
           "kind": "import-statement"
         }
       ],
@@ -10619,16 +10629,16 @@
       "inputs": {},
       "bytes": 1836
     },
-    "dist/VirtualBackground-MIRXD2HZ.js.map": {
+    "dist/VirtualBackground-2VZVBRIC.js.map": {
       "imports": [],
       "exports": [],
       "inputs": {},
       "bytes": 9168
     },
-    "dist/VirtualBackground-MIRXD2HZ.js": {
+    "dist/VirtualBackground-2VZVBRIC.js": {
       "imports": [
         {
-          "path": "dist/chunk-6UGU3UJL.js",
+          "path": "dist/chunk-SONHO3VM.js",
           "kind": "import-statement"
         },
         {
@@ -10677,20 +10687,20 @@
       },
       "bytes": 6075
     },
-    "dist/HLSView-4JC65BAY.js.map": {
+    "dist/HLSView-VGJ2XUDT.js.map": {
       "imports": [],
       "exports": [],
       "inputs": {},
       "bytes": 52770
     },
-    "dist/HLSView-4JC65BAY.js": {
+    "dist/HLSView-VGJ2XUDT.js": {
       "imports": [
         {
-          "path": "dist/chunk-322YFA55.js",
+          "path": "dist/chunk-EDGWHFCM.js",
           "kind": "import-statement"
         },
         {
-          "path": "dist/chunk-6UGU3UJL.js",
+          "path": "dist/chunk-SONHO3VM.js",
           "kind": "import-statement"
         },
         {
@@ -10841,16 +10851,16 @@
       },
       "bytes": 32794
     },
-    "dist/chunk-322YFA55.js.map": {
+    "dist/chunk-EDGWHFCM.js.map": {
       "imports": [],
       "exports": [],
       "inputs": {},
-      "bytes": 980731
+      "bytes": 981994
     },
-    "dist/chunk-322YFA55.js": {
+    "dist/chunk-EDGWHFCM.js": {
       "imports": [
         {
-          "path": "dist/chunk-6UGU3UJL.js",
+          "path": "dist/chunk-SONHO3VM.js",
           "kind": "import-statement"
         },
         {
@@ -11929,7 +11939,7 @@
           "external": true
         },
         {
-          "path": "dist/VirtualBackground-MIRXD2HZ.js",
+          "path": "dist/VirtualBackground-2VZVBRIC.js",
           "kind": "dynamic-import"
         },
         {
@@ -12033,7 +12043,7 @@
           "external": true
         },
         {
-          "path": "dist/VirtualBackground-MIRXD2HZ.js",
+          "path": "dist/VirtualBackground-2VZVBRIC.js",
           "kind": "dynamic-import"
         },
         {
@@ -12667,7 +12677,7 @@
           "external": true
         },
         {
-          "path": "dist/HLSView-4JC65BAY.js",
+          "path": "dist/HLSView-VGJ2XUDT.js",
           "kind": "dynamic-import"
         },
         {
@@ -12760,6 +12770,11 @@
           "kind": "import-statement",
           "external": true
         },
+        {
+          "path": "react-use",
+          "kind": "import-statement",
+          "external": true
+        },
         {
           "path": "@100mslive/react-icons",
           "kind": "import-statement",
@@ -13192,7 +13207,7 @@
           "bytesInOutput": 700
         },
         "src/Prebuilt/components/AppData/useSidepane.js": {
-          "bytesInOutput": 1846
+          "bytesInOutput": 1907
         },
         "src/Prebuilt/components/AppData/useUISettings.js": {
           "bytesInOutput": 5419
@@ -13234,7 +13249,7 @@
           "bytesInOutput": 577
         },
         "src/Prebuilt/components/Leave/LeaveRoom.tsx": {
-          "bytesInOutput": 2001
+          "bytesInOutput": 2084
         },
         "src/Prebuilt/components/Leave/DesktopLeaveRoom.tsx": {
           "bytesInOutput": 5525
@@ -13534,7 +13549,7 @@
           "bytesInOutput": 581
         },
         "src/Prebuilt/components/Polls/CreatePollQuiz/PollsQuizMenu.jsx": {
-          "bytesInOutput": 7616
+          "bytesInOutput": 7876
         },
         "src/Prebuilt/components/Streaming/Common.jsx": {
           "bytesInOutput": 2220
@@ -13546,7 +13561,7 @@
           "bytesInOutput": 4359
         },
         "src/Prebuilt/components/Polls/CreateQuestions/QuestionForm.jsx": {
-          "bytesInOutput": 7439
+          "bytesInOutput": 7535
         },
         "src/Prebuilt/components/Polls/CreateQuestions/DeleteQuestionModal.jsx": {
           "bytesInOutput": 2065
@@ -13570,7 +13585,7 @@
           "bytesInOutput": 2119
         },
         "src/Prebuilt/components/Polls/Voting/Voting.jsx": {
-          "bytesInOutput": 3040
+          "bytesInOutput": 3059
         },
         "src/Prebuilt/components/Polls/Voting/StandardVoting.jsx": {
           "bytesInOutput": 1064
@@ -13636,16 +13651,16 @@
           "bytesInOutput": 2158
         },
         "src/Prebuilt/AppStateContext.tsx": {
-          "bytesInOutput": 2102
+          "bytesInOutput": 2079
         },
         "src/Prebuilt/components/hooks/useRedirectToLeave.tsx": {
-          "bytesInOutput": 545
+          "bytesInOutput": 464
         },
         "src/Prebuilt/components/MwebLandscapePrompt.tsx": {
-          "bytesInOutput": 2105
+          "bytesInOutput": 2398
         },
         "src/Prebuilt/components/Notifications/Notifications.tsx": {
-          "bytesInOutput": 6971
+          "bytesInOutput": 6988
         },
         "src/Prebuilt/components/Toast/ToastConfig.jsx": {
           "bytesInOutput": 6198
@@ -13708,15 +13723,15 @@
           "bytesInOutput": 391
         }
       },
-      "bytes": 647188
+      "bytes": 647913
     },
-    "dist/chunk-6UGU3UJL.js.map": {
+    "dist/chunk-SONHO3VM.js.map": {
       "imports": [],
       "exports": [],
       "inputs": {},
-      "bytes": 42176
+      "bytes": 42174
     },
-    "dist/chunk-6UGU3UJL.js": {
+    "dist/chunk-SONHO3VM.js": {
       "imports": [
         {
           "path": "@stitches/react",
@@ -13800,7 +13815,7 @@
       ],
       "inputs": {
         "<define:process.env>": {
-          "bytesInOutput": 18387
+          "bytesInOutput": 18321
         },
         "src/Theme/stitches.config.ts": {
           "bytesInOutput": 1652
@@ -13854,7 +13869,7 @@
           "bytesInOutput": 1356
         }
       },
-      "bytes": 41703
+      "bytes": 41637
     }
   }
 }

package/package.json

@@ -10,7 +10,7 @@
     "prebuilt",
     "roomkit"
   ],
-  "version": "0.1.9-alpha.1",
+  "version": "0.1.9",
   "author": "100ms",
   "license": "MIT",
   "files": [
@@ -76,10 +76,10 @@
     "react": ">=17.0.2 <19.0.0"
   },
   "dependencies": {
-    "@100mslive/hls-player": "0.1.18-alpha.1",
-    "@100mslive/hms-virtual-background": "1.11.18-alpha.1",
-    "@100mslive/react-icons": "0.8.18-alpha.1",
-    "@100mslive/react-sdk": "0.8.18-alpha.1",
+    "@100mslive/hls-player": "0.1.18",
+    "@100mslive/hms-virtual-background": "1.11.18",
+    "@100mslive/react-icons": "0.8.18",
+    "@100mslive/react-sdk": "0.8.18",
     "@100mslive/types-prebuilt": "0.12.0",
     "@emoji-mart/data": "^1.0.6",
     "@emoji-mart/react": "^1.0.1",
@@ -114,5 +114,5 @@
     "uuid": "^8.3.2",
     "worker-timers": "^7.0.40"
   },
-  "gitHead": "ac35df485fe756c88bd2ebd40e421475ec748bb1"
+  "gitHead": "b78d4abbfb1bb119dcdd29613484f22fbae5b149"
 }

package/src/Prebuilt/AppStateContext.tsx

@@ -58,10 +58,9 @@ export const useAppStateManager = () => {
       [HMSRoomState.Reconnecting, HMSRoomState.Connected].includes(prevRoomState) &&
       [HMSRoomState.Disconnecting, HMSRoomState.Disconnected].includes(roomState)
     ) {
-      redirectToLeave().then(() => {
-        const goTo = isPreviewScreenEnabled ? PrebuiltStates.PREVIEW : PrebuiltStates.MEETING;
-        setActiveState(isLeaveScreenEnabled ? PrebuiltStates.LEAVE : goTo);
-      });
+      const goTo = isPreviewScreenEnabled ? PrebuiltStates.PREVIEW : PrebuiltStates.MEETING;
+      setActiveState(isLeaveScreenEnabled ? PrebuiltStates.LEAVE : goTo);
+      redirectToLeave(1000); // to clear toasts after 1 second
     } else if (!prevRoomState && roomState === HMSRoomState.Disconnected) {
       setActiveState(isPreviewScreenEnabled ? PrebuiltStates.PREVIEW : PrebuiltStates.MEETING);
     }

package/src/Prebuilt/components/AppData/useSidepane.js

@@ -39,20 +39,21 @@ export const useSidepaneToggle = sidepaneType => {
 };
 
 export const usePollViewToggle = () => {
+  const hmsActions = useHMSActions();
   const { view, setPollState } = usePollViewState();
   const isOpen = useSidepaneState() === SIDE_PANE_OPTIONS.POLLS;
-  const toggleSidepane = useSidepaneToggle(SIDE_PANE_OPTIONS.POLLS);
 
   const togglePollView = useCallback(
     id => {
       id = typeof id === 'string' ? id : undefined;
+      const newView = id ? POLL_VIEWS.VOTE : isOpen && view ? null : POLL_VIEWS.CREATE_POLL_QUIZ;
       setPollState({
         [POLL_STATE.pollInView]: id,
-        [POLL_STATE.view]: id ? POLL_VIEWS.VOTE : isOpen && view ? null : POLL_VIEWS.CREATE_POLL_QUIZ,
+        [POLL_STATE.view]: newView,
       });
-      toggleSidepane();
+      hmsActions.setAppData(APP_DATA.sidePane, newView ? SIDE_PANE_OPTIONS.POLLS : '');
     },
-    [view, setPollState, isOpen, toggleSidepane],
+    [hmsActions, view, setPollState, isOpen],
   );
 
   return togglePollView;

package/src/Prebuilt/components/Leave/LeaveRoom.tsx

@@ -36,9 +36,11 @@ export const LeaveRoom = ({ screenType }: { screenType: keyof ConferencingScreen
 
   const stopStream = async () => {
     try {
-      console.log('Stopping HLS stream');
-      await hmsActions.stopHLSStreaming();
-      ToastManager.addToast({ title: 'Stopping the stream' });
+      if (permissions?.hlsStreaming) {
+        console.log('Stopping HLS stream');
+        await hmsActions.stopHLSStreaming();
+        ToastManager.addToast({ title: 'Stopping the stream' });
+      }
     } catch (e) {
       console.error('Error stopping stream', e);
       ToastManager.addToast({ title: 'Error in stopping the stream', type: 'error' });

package/src/Prebuilt/components/MwebLandscapePrompt.tsx

@@ -1,27 +1,33 @@
 import React, { useEffect, useState } from 'react';
+import { useMedia } from 'react-use';
 import { RefreshIcon } from '@100mslive/react-icons';
 import { Button } from '../../Button';
 import { Box, Flex } from '../../Layout';
 import { Dialog } from '../../Modal';
 import { Text } from '../../Text';
+import { config as cssConfig } from '../../Theme';
 
 export const MwebLandscapePrompt = () => {
   const [showMwebLandscapePrompt, setShowMwebLandscapePrompt] = useState(false);
+  const isLandscape = useMedia(cssConfig.media.ls);
 
   useEffect(() => {
+    if (!window.screen?.orientation) {
+      setShowMwebLandscapePrompt(isLandscape);
+      return;
+    }
     const handleRotation = () => {
       const angle = window.screen.orientation.angle;
-      const type = window.screen.orientation.type;
+      const type = window.screen.orientation.type || '';
       // Angle check needed to diff bw mobile and desktop
-      setShowMwebLandscapePrompt(angle >= 90 && type.includes('landscape'));
+      setShowMwebLandscapePrompt(angle ? angle >= 90 && type.includes('landscape') : isLandscape);
     };
     handleRotation();
     window.screen.orientation.addEventListener('change', handleRotation);
-
     return () => {
       window.screen.orientation.removeEventListener('change', handleRotation);
     };
-  }, []);
+  }, [isLandscape]);
 
   return (
     <Dialog.Root open={showMwebLandscapePrompt} onOpenChange={setShowMwebLandscapePrompt}>