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

Sign up to get free protection for your applications and to get access to all the features.
@@ -9,7 +9,7 @@ import {
9
9
  Slider,
10
10
  ToastManager,
11
11
  useTheme
12
- } from "./chunk-ANQRGVIX.js";
12
+ } from "./chunk-EDGWHFCM.js";
13
13
  import {
14
14
  Box,
15
15
  Flex,
@@ -23,7 +23,7 @@ import {
23
23
  __spreadValues,
24
24
  config,
25
25
  styled
26
- } from "./chunk-XQ2NRKIW.js";
26
+ } from "./chunk-SONHO3VM.js";
27
27
 
28
28
  // src/Prebuilt/layouts/HLSView.jsx
29
29
  import React10, { useCallback, useEffect as useEffect3, useRef as useRef2, useState as useState4 } from "react";
@@ -860,4 +860,4 @@ var HLSView_default = HLSView;
860
860
  export {
861
861
  HLSView_default as default
862
862
  };
863
- //# sourceMappingURL=HLSView-U53QN3AC.js.map
863
+ //# sourceMappingURL=HLSView-VGJ2XUDT.js.map
@@ -1,3 +1,3 @@
1
1
  export declare const useRedirectToLeave: () => {
2
- redirectToLeave: (timeout?: number) => Promise<void>;
2
+ redirectToLeave: (timeout?: number) => void;
3
3
  };
@@ -4,7 +4,7 @@ import {
4
4
  Loading,
5
5
  Tooltip,
6
6
  __async
7
- } from "./chunk-XQ2NRKIW.js";
7
+ } from "./chunk-SONHO3VM.js";
8
8
 
9
9
  // src/Prebuilt/plugins/VirtualBackground/VirtualBackground.jsx
10
10
  import React, { useEffect, useRef, useState } from "react";
@@ -172,4 +172,4 @@ export {
172
172
  VirtualBackground,
173
173
  VirtualBackground_default as default
174
174
  };
175
- //# sourceMappingURL=VirtualBackground-PMLQPJB6.js.map
175
+ //# sourceMappingURL=VirtualBackground-2VZVBRIC.js.map
@@ -38,7 +38,7 @@ import {
38
38
  theme,
39
39
  toastAnimation,
40
40
  translateAcross
41
- } from "./chunk-XQ2NRKIW.js";
41
+ } from "./chunk-SONHO3VM.js";
42
42
 
43
43
  // src/Button/Button.tsx
44
44
  import React2 from "react";
@@ -2485,19 +2485,20 @@ var useSidepaneToggle = (sidepaneType) => {
2485
2485
  return toggleSidepane;
2486
2486
  };
2487
2487
  var usePollViewToggle = () => {
2488
+ const hmsActions = useHMSActions2();
2488
2489
  const { view, setPollState } = usePollViewState();
2489
2490
  const isOpen = useSidepaneState() === SIDE_PANE_OPTIONS.POLLS;
2490
- const toggleSidepane = useSidepaneToggle(SIDE_PANE_OPTIONS.POLLS);
2491
2491
  const togglePollView = useCallback4(
2492
2492
  (id) => {
2493
2493
  id = typeof id === "string" ? id : void 0;
2494
+ const newView = id ? POLL_VIEWS.VOTE : isOpen && view ? null : POLL_VIEWS.CREATE_POLL_QUIZ;
2494
2495
  setPollState({
2495
2496
  [POLL_STATE.pollInView]: id,
2496
- [POLL_STATE.view]: id ? POLL_VIEWS.VOTE : isOpen && view ? null : POLL_VIEWS.CREATE_POLL_QUIZ
2497
+ [POLL_STATE.view]: newView
2497
2498
  });
2498
- toggleSidepane();
2499
+ hmsActions.setAppData(APP_DATA.sidePane, newView ? SIDE_PANE_OPTIONS.POLLS : "");
2499
2500
  },
2500
- [view, setPollState, isOpen, toggleSidepane]
2501
+ [hmsActions, view, setPollState, isOpen]
2501
2502
  );
2502
2503
  return togglePollView;
2503
2504
  };
@@ -3700,9 +3701,11 @@ var LeaveRoom = ({ screenType }) => {
3700
3701
  const hmsActions = useHMSActions6();
3701
3702
  const stopStream = () => __async(void 0, null, function* () {
3702
3703
  try {
3703
- console.log("Stopping HLS stream");
3704
- yield hmsActions.stopHLSStreaming();
3705
- ToastManager.addToast({ title: "Stopping the stream" });
3704
+ if (permissions == null ? void 0 : permissions.hlsStreaming) {
3705
+ console.log("Stopping HLS stream");
3706
+ yield hmsActions.stopHLSStreaming();
3707
+ ToastManager.addToast({ title: "Stopping the stream" });
3708
+ }
3706
3709
  } catch (e) {
3707
3710
  console.error("Error stopping stream", e);
3708
3711
  ToastManager.addToast({ title: "Error in stopping the stream", type: "error" });
@@ -8093,7 +8096,7 @@ var PollsToggle = () => {
8093
8096
  };
8094
8097
 
8095
8098
  // src/Prebuilt/components/Footer/Footer.tsx
8096
- var VirtualBackground = React71.lazy(() => import("./VirtualBackground-PMLQPJB6.js"));
8099
+ var VirtualBackground = React71.lazy(() => import("./VirtualBackground-2VZVBRIC.js"));
8097
8100
  var Footer2 = ({
8098
8101
  screenType,
8099
8102
  elements
@@ -8424,7 +8427,7 @@ var Form = styled("form", {
8424
8427
  var PreviewForm_default = PreviewForm;
8425
8428
 
8426
8429
  // src/Prebuilt/components/Preview/PreviewJoin.tsx
8427
- var VirtualBackground2 = React78.lazy(() => import("./VirtualBackground-PMLQPJB6.js"));
8430
+ var VirtualBackground2 = React78.lazy(() => import("./VirtualBackground-2VZVBRIC.js"));
8428
8431
  var getParticipantChipContent = (peerCount = 0) => {
8429
8432
  if (peerCount === 0) {
8430
8433
  return "You are the first to join";
@@ -10406,7 +10409,10 @@ var AddMenu = () => {
10406
10409
  };
10407
10410
  var PrevMenu = () => {
10408
10411
  var _a7;
10409
- const polls = (_a7 = useHMSStore48(selectPolls2)) == null ? void 0 : _a7.filter((poll) => poll.state === "started" || poll.state === "stopped");
10412
+ const polls = (_a7 = useHMSStore48(selectPolls2)) == null ? void 0 : _a7.filter((poll) => poll.state === "started" || poll.state === "stopped").sort((a, b) => {
10413
+ var _a8, _b7;
10414
+ return (((_a8 = b.createdAt) == null ? void 0 : _a8.getTime()) || 0) - (((_b7 = a.createdAt) == null ? void 0 : _b7.getTime()) || 0);
10415
+ }).sort((a, b) => (b.state === "started" ? 1 : 0) - (a.state === "started" ? 1 : 0));
10410
10416
  return (polls == null ? void 0 : polls.length) ? /* @__PURE__ */ React100.createElement(
10411
10417
  Flex,
10412
10418
  {
@@ -10871,7 +10877,7 @@ var QuestionForm = ({ question, index, length, onSave, removeQuestion, isQuiz })
10871
10877
  Tooltip,
10872
10878
  {
10873
10879
  disabled: isValid,
10874
- title: `Please fill all the fields ${isQuiz ? "and mark the correct answer(s)" : ""} to continue`,
10880
+ title: options.length === 0 ? "At least one option is required for a question" : `Please fill all the fields ${isQuiz ? "and mark the correct answer(s)" : ""} to continue`,
10875
10881
  boxCss: { maxWidth: "$40" }
10876
10882
  },
10877
10883
  /* @__PURE__ */ React107.createElement(
@@ -10901,7 +10907,7 @@ var isValidQuestion = ({ text, type, options, isQuiz = false }) => {
10901
10907
  if (![QUESTION_TYPE.SINGLE_CHOICE, QUESTION_TYPE.MULTIPLE_CHOICE].includes(type)) {
10902
10908
  return true;
10903
10909
  }
10904
- const everyOptionHasText = options.every((option) => option && isValidTextInput(option.text, 1));
10910
+ const everyOptionHasText = options.length > 0 && options.every((option) => option && isValidTextInput(option.text, 1));
10905
10911
  const hasCorrectAnswer = options.some((option) => option.isCorrectAnswer);
10906
10912
  if (!isQuiz) {
10907
10913
  return everyOptionHasText;
@@ -11357,7 +11363,7 @@ var Voting = ({ id, toggleVoting }) => {
11357
11363
  },
11358
11364
  /* @__PURE__ */ React113.createElement(CrossIcon14, { onClick: toggleVoting })
11359
11365
  )
11360
- ), /* @__PURE__ */ React113.createElement(Flex, { direction: "column", css: { p: "$8 $10" } }, /* @__PURE__ */ React113.createElement(Flex, { align: "center" }, /* @__PURE__ */ React113.createElement(Box, { css: { flex: "auto" } }, /* @__PURE__ */ React113.createElement(Text, { css: { color: "$on_surface_medium", fontWeight: "$semiBold" } }, pollCreatorName || "Participant", " started a ", poll.type)), poll.state === "started" && isLocalPeerCreator && /* @__PURE__ */ React113.createElement(Box, { css: { flex: "initial" } }, /* @__PURE__ */ React113.createElement(
11366
+ ), /* @__PURE__ */ React113.createElement(Flex, { direction: "column", css: { p: "$8 $10", overflowY: "auto" } }, /* @__PURE__ */ React113.createElement(Flex, { align: "center" }, /* @__PURE__ */ React113.createElement(Box, { css: { flex: "auto" } }, /* @__PURE__ */ React113.createElement(Text, { css: { color: "$on_surface_medium", fontWeight: "$semiBold" } }, pollCreatorName || "Participant", " started a ", poll.type)), poll.state === "started" && isLocalPeerCreator && /* @__PURE__ */ React113.createElement(Box, { css: { flex: "initial" } }, /* @__PURE__ */ React113.createElement(
11361
11367
  Button,
11362
11368
  {
11363
11369
  variant: "danger",
@@ -12543,7 +12549,7 @@ var WaitingView = React121.memo(() => {
12543
12549
  });
12544
12550
 
12545
12551
  // src/Prebuilt/layouts/VideoStreamingSection.tsx
12546
- var HLSView = React122.lazy(() => import("./HLSView-U53QN3AC.js"));
12552
+ var HLSView = React122.lazy(() => import("./HLSView-VGJ2XUDT.js"));
12547
12553
  var VideoStreamingSection = ({
12548
12554
  screenType,
12549
12555
  elements,
@@ -13102,14 +13108,11 @@ var useRedirectToLeave = () => {
13102
13108
  const { onLeave } = useHMSPrebuiltContext();
13103
13109
  const redirect = useCallback29(
13104
13110
  (timeout = 0) => {
13105
- return new Promise((resolve) => {
13106
- setTimeout(() => {
13107
- PictureInPicture.stop().catch(() => console.error("stopping pip"));
13108
- ToastManager.clearAllToast();
13109
- onLeave == null ? void 0 : onLeave();
13110
- resolve();
13111
- }, timeout);
13112
- });
13111
+ setTimeout(() => {
13112
+ PictureInPicture.stop().catch(() => console.error("stopping pip"));
13113
+ ToastManager.clearAllToast();
13114
+ onLeave == null ? void 0 : onLeave();
13115
+ }, timeout);
13113
13116
  },
13114
13117
  [onLeave]
13115
13118
  );
@@ -13148,10 +13151,9 @@ var useAppStateManager = () => {
13148
13151
  if (roomState === HMSRoomState7.Connected) {
13149
13152
  setActiveState("meeting" /* MEETING */);
13150
13153
  } else if (prevRoomState && [HMSRoomState7.Reconnecting, HMSRoomState7.Connected].includes(prevRoomState) && [HMSRoomState7.Disconnecting, HMSRoomState7.Disconnected].includes(roomState)) {
13151
- redirectToLeave().then(() => {
13152
- const goTo = isPreviewScreenEnabled ? "preview" /* PREVIEW */ : "meeting" /* MEETING */;
13153
- setActiveState(isLeaveScreenEnabled ? "leave" /* LEAVE */ : goTo);
13154
- });
13154
+ const goTo = isPreviewScreenEnabled ? "preview" /* PREVIEW */ : "meeting" /* MEETING */;
13155
+ setActiveState(isLeaveScreenEnabled ? "leave" /* LEAVE */ : goTo);
13156
+ redirectToLeave(1e3);
13155
13157
  } else if (!prevRoomState && roomState === HMSRoomState7.Disconnected) {
13156
13158
  setActiveState(isPreviewScreenEnabled ? "preview" /* PREVIEW */ : "meeting" /* MEETING */);
13157
13159
  }
@@ -13205,21 +13207,28 @@ var LeaveScreen = () => {
13205
13207
 
13206
13208
  // src/Prebuilt/components/MwebLandscapePrompt.tsx
13207
13209
  import React130, { useEffect as useEffect44, useState as useState53 } from "react";
13210
+ import { useMedia as useMedia26 } from "react-use";
13208
13211
  import { RefreshIcon } from "@100mslive/react-icons";
13209
13212
  var MwebLandscapePrompt = () => {
13210
13213
  const [showMwebLandscapePrompt, setShowMwebLandscapePrompt] = useState53(false);
13214
+ const isLandscape = useMedia26(config.media.ls);
13211
13215
  useEffect44(() => {
13216
+ var _a7;
13217
+ if (!((_a7 = window.screen) == null ? void 0 : _a7.orientation)) {
13218
+ setShowMwebLandscapePrompt(isLandscape);
13219
+ return;
13220
+ }
13212
13221
  const handleRotation = () => {
13213
13222
  const angle = window.screen.orientation.angle;
13214
- const type = window.screen.orientation.type;
13215
- setShowMwebLandscapePrompt(angle >= 90 && type.includes("landscape"));
13223
+ const type = window.screen.orientation.type || "";
13224
+ setShowMwebLandscapePrompt(angle ? angle >= 90 && type.includes("landscape") : isLandscape);
13216
13225
  };
13217
13226
  handleRotation();
13218
13227
  window.screen.orientation.addEventListener("change", handleRotation);
13219
13228
  return () => {
13220
13229
  window.screen.orientation.removeEventListener("change", handleRotation);
13221
13230
  };
13222
- }, []);
13231
+ }, [isLandscape]);
13223
13232
  return /* @__PURE__ */ React130.createElement(Dialog.Root, { open: showMwebLandscapePrompt, onOpenChange: setShowMwebLandscapePrompt }, /* @__PURE__ */ React130.createElement(Dialog.Portal, null, /* @__PURE__ */ React130.createElement(Dialog.Overlay, null), /* @__PURE__ */ React130.createElement(Dialog.Content, { css: { w: "min(420px, 90%)", p: "$8", bg: "$surface_dim" } }, /* @__PURE__ */ React130.createElement(Box, null, /* @__PURE__ */ React130.createElement(
13224
13233
  Flex,
13225
13234
  {
@@ -13563,7 +13572,7 @@ var PeerNotifications = () => {
13563
13572
 
13564
13573
  // src/Prebuilt/components/Notifications/PermissionErrorModal.tsx
13565
13574
  import React134, { useEffect as useEffect47, useState as useState55 } from "react";
13566
- import { useMedia as useMedia26 } from "react-use";
13575
+ import { useMedia as useMedia27 } from "react-use";
13567
13576
  import { HMSNotificationTypes as HMSNotificationTypes4, useHMSNotifications as useHMSNotifications4 } from "@100mslive/react-sdk";
13568
13577
 
13569
13578
  // src/Prebuilt/images/android-perm-1.png
@@ -13577,7 +13586,7 @@ function PermissionErrorModal() {
13577
13586
  const notification = useHMSNotifications4(HMSNotificationTypes4.ERROR);
13578
13587
  const [deviceType, setDeviceType] = useState55("");
13579
13588
  const [isSystemError, setIsSystemError] = useState55(false);
13580
- const isMobile = useMedia26(config.media.md);
13589
+ const isMobile = useMedia27(config.media.md);
13581
13590
  useEffect47(() => {
13582
13591
  var _a7, _b7, _c, _d, _e;
13583
13592
  if (!notification || ((_a7 = notification.data) == null ? void 0 : _a7.code) !== 3001 && ((_b7 = notification.data) == null ? void 0 : _b7.code) !== 3011 || ((_c = notification.data) == null ? void 0 : _c.code) === 3001 && ((_d = notification.data) == null ? void 0 : _d.message.includes("screen"))) {
@@ -13895,7 +13904,7 @@ function Notifications() {
13895
13904
  break;
13896
13905
  case HMSNotificationTypes9.POLL_STARTED:
13897
13906
  if (notification.data.startedBy !== localPeerID) {
13898
- const pollStartedBy = vanillaStore.getState(selectPeerNameByID6(notification.data.startedBy));
13907
+ const pollStartedBy = vanillaStore.getState(selectPeerNameByID6(notification.data.startedBy)) || "Participant";
13899
13908
  ToastManager.addToast({
13900
13909
  title: `${pollStartedBy} started a ${notification.data.type}: ${notification.data.title}`,
13901
13910
  action: /* @__PURE__ */ React138.createElement(
@@ -13995,7 +14004,7 @@ var ToastContainer = () => {
13995
14004
 
13996
14005
  // src/Prebuilt/plugins/FlyingEmoji.jsx
13997
14006
  import React142, { useCallback as useCallback32, useEffect as useEffect54, useMemo as useMemo17, useState as useState60 } from "react";
13998
- import { useMedia as useMedia27 } from "react-use";
14007
+ import { useMedia as useMedia28 } from "react-use";
13999
14008
  import {
14000
14009
  selectLocalPeerID as selectLocalPeerID15,
14001
14010
  selectPeerNameByID as selectPeerNameByID7,
@@ -14030,7 +14039,7 @@ function FlyingEmoji() {
14030
14039
  const localPeerId = useHMSStore68(selectLocalPeerID15);
14031
14040
  const vanillaStore = useHMSVanillaStore13();
14032
14041
  const [emojis, setEmojis] = useState60([]);
14033
- const isMobile = useMedia27(config.media.md);
14042
+ const isMobile = useMedia28(config.media.md);
14034
14043
  const startingPoints = useMemo17(() => getStartingPoints(isMobile), [isMobile]);
14035
14044
  const showFlyingEmoji = useCallback32(
14036
14045
  ({ emojiId, senderId }) => {
@@ -14438,4 +14447,4 @@ export {
14438
14447
  HMSPrebuilt,
14439
14448
  Progress
14440
14449
  };
14441
- //# sourceMappingURL=chunk-ANQRGVIX.js.map
14450
+ //# sourceMappingURL=chunk-EDGWHFCM.js.map