@100mslive/roomkit-react 0.3.7-alpha.0 → 0.3.7-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{HLSView-4GYBPDV3.js → HLSView-QKPBZFZP.js} +120 -109
- package/dist/{HLSView-4GYBPDV3.js.map → HLSView-QKPBZFZP.js.map} +2 -2
- package/dist/Prebuilt/common/constants.d.ts +1 -2
- package/dist/Prebuilt/components/VideoLayouts/WhiteboardLayout.d.ts +0 -1
- package/dist/{chunk-3KJZ5DTM.js → chunk-LVXGI4HW.js} +1769 -1445
- package/dist/chunk-LVXGI4HW.js.map +7 -0
- package/dist/index.cjs.js +1938 -1628
- package/dist/index.cjs.js.map +4 -4
- package/dist/index.js +1 -1
- package/dist/meta.cjs.json +748 -343
- package/dist/meta.esbuild.json +761 -419
- package/package.json +6 -7
- package/src/Prebuilt/common/constants.ts +0 -1
- package/src/Prebuilt/components/AppData/AppData.tsx +2 -5
- package/src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx +6 -2
- package/src/Prebuilt/components/Preview/PreviewJoin.tsx +1 -1
- package/src/Prebuilt/components/VideoLayouts/WhiteboardLayout.tsx +13 -7
- package/dist/HLSView-B3CVWA37.css +0 -2765
- package/dist/HLSView-B3CVWA37.css.map +0 -7
- package/dist/chunk-3KJZ5DTM.js.map +0 -7
- package/dist/index.cjs.css +0 -2765
- package/dist/index.cjs.css.map +0 -7
- package/dist/index.css +0 -2765
- package/dist/index.css.map +0 -7
package/package.json
CHANGED
@@ -10,7 +10,7 @@
|
|
10
10
|
"prebuilt",
|
11
11
|
"roomkit"
|
12
12
|
],
|
13
|
-
"version": "0.3.7-alpha.
|
13
|
+
"version": "0.3.7-alpha.1",
|
14
14
|
"author": "100ms",
|
15
15
|
"license": "MIT",
|
16
16
|
"repository": {
|
@@ -82,12 +82,11 @@
|
|
82
82
|
"react": ">=17.0.2 <19.0.0"
|
83
83
|
},
|
84
84
|
"dependencies": {
|
85
|
-
"@100mslive/hls-player": "0.3.7-alpha.
|
85
|
+
"@100mslive/hls-player": "0.3.7-alpha.1",
|
86
86
|
"@100mslive/hms-noise-cancellation": "0.0.1",
|
87
|
-
"@100mslive/hms-virtual-background": "1.13.7-alpha.
|
88
|
-
"@100mslive/
|
89
|
-
"@100mslive/react-
|
90
|
-
"@100mslive/react-sdk": "0.10.7-alpha.0",
|
87
|
+
"@100mslive/hms-virtual-background": "1.13.7-alpha.1",
|
88
|
+
"@100mslive/react-icons": "0.10.7-alpha.1",
|
89
|
+
"@100mslive/react-sdk": "0.10.7-alpha.1",
|
91
90
|
"@100mslive/types-prebuilt": "0.12.8",
|
92
91
|
"@emoji-mart/data": "^1.0.6",
|
93
92
|
"@emoji-mart/react": "^1.0.1",
|
@@ -123,5 +122,5 @@
|
|
123
122
|
"uuid": "^8.3.2",
|
124
123
|
"worker-timers": "^7.0.40"
|
125
124
|
},
|
126
|
-
"gitHead": "
|
125
|
+
"gitHead": "f8131959ff3d81261f1f5e10aeca4ffdb85de037"
|
127
126
|
}
|
@@ -117,7 +117,6 @@ export enum SESSION_STORE_KEY {
|
|
117
117
|
CHAT_PEER_BLACKLIST = 'chatPeerBlacklist',
|
118
118
|
CHAT_MESSAGE_BLACKLIST = 'chatMessageBlacklist',
|
119
119
|
CHAT_STATE = 'chatState',
|
120
|
-
SHARED_LEADERBOARDS = 'sharedLeaderboards',
|
121
120
|
}
|
122
121
|
|
123
122
|
export enum INTERACTION_TYPE {
|
@@ -1,5 +1,4 @@
|
|
1
1
|
import React, { useEffect, useMemo, useRef } from 'react';
|
2
|
-
import { useMedia } from 'react-use';
|
3
2
|
import {
|
4
3
|
HMSRoomState,
|
5
4
|
selectFullAppData,
|
@@ -11,7 +10,6 @@ import {
|
|
11
10
|
useHMSStore,
|
12
11
|
useRecordingStreaming,
|
13
12
|
} from '@100mslive/react-sdk';
|
14
|
-
import { config as cssConfig } from '../../../Theme';
|
15
13
|
import { LayoutMode } from '../Settings/LayoutSettings';
|
16
14
|
import { useRoomLayoutConferencingScreen } from '../../provider/roomLayoutProvider/hooks/useRoomLayoutScreen';
|
17
15
|
//@ts-ignore
|
@@ -77,7 +75,6 @@ export const AppData = React.memo(() => {
|
|
77
75
|
const appData = useHMSStore(selectFullAppData);
|
78
76
|
const { elements } = useRoomLayoutConferencingScreen();
|
79
77
|
const toggleVB = useSidepaneToggle(SIDE_PANE_OPTIONS.VB);
|
80
|
-
const isMobile = useMedia(cssConfig.media.md);
|
81
78
|
const { isLocalVideoEnabled } = useAVToggle();
|
82
79
|
const sidepaneOpenedRef = useRef(false);
|
83
80
|
|
@@ -123,12 +120,12 @@ export const AppData = React.memo(() => {
|
|
123
120
|
}, [preferences.subscribedNotifications, hmsActions]);
|
124
121
|
|
125
122
|
useEffect(() => {
|
126
|
-
if (defaultMediaURL && !sidepaneOpenedRef.current &&
|
123
|
+
if (defaultMediaURL && !sidepaneOpenedRef.current && isLocalVideoEnabled) {
|
127
124
|
hmsActions.setAppData(APP_DATA.background, defaultMediaURL);
|
128
125
|
sidepaneOpenedRef.current = true;
|
129
126
|
toggleVB();
|
130
127
|
}
|
131
|
-
}, [hmsActions, toggleVB, isLocalVideoEnabled,
|
128
|
+
}, [hmsActions, toggleVB, isLocalVideoEnabled, defaultMediaURL]);
|
132
129
|
|
133
130
|
return <ResetStreamingStart />;
|
134
131
|
});
|
@@ -4,6 +4,7 @@ import { ConferencingScreen, DefaultConferencingScreen_Elements } from '@100msli
|
|
4
4
|
import { match } from 'ts-pattern';
|
5
5
|
import {
|
6
6
|
selectIsConnectedToRoom,
|
7
|
+
selectIsLocalVideoEnabled,
|
7
8
|
selectPeerCount,
|
8
9
|
selectPermissions,
|
9
10
|
useHMSActions,
|
@@ -23,6 +24,7 @@ import {
|
|
23
24
|
QuizIcon,
|
24
25
|
RecordIcon,
|
25
26
|
SettingsIcon,
|
27
|
+
VirtualBackgroundIcon,
|
26
28
|
} from '@100mslive/react-icons';
|
27
29
|
import { Box, Loading, Tooltip } from '../../../..';
|
28
30
|
import { Sheet } from '../../../../Sheet';
|
@@ -98,6 +100,8 @@ export const MwebOptions = ({
|
|
98
100
|
const toggleDetailsSheet = useSheetToggle(SHEET_OPTIONS.ROOM_DETAILS);
|
99
101
|
const isMobileHLSStream = useMobileHLSStream();
|
100
102
|
const isLandscapeHLSStream = useLandscapeHLSStream();
|
103
|
+
const toggleVB = useSidepaneToggle(SIDE_PANE_OPTIONS.VB);
|
104
|
+
const isLocalVideoEnabled = useHMSStore(selectIsLocalVideoEnabled);
|
101
105
|
|
102
106
|
useDropdownList({ open: openModals.size > 0 || openOptionsSheet || openSettingsSheet, name: 'MoreSettings' });
|
103
107
|
|
@@ -184,7 +188,7 @@ export const MwebOptions = ({
|
|
184
188
|
</ActionTile.Root>
|
185
189
|
) : null}
|
186
190
|
|
187
|
-
{
|
191
|
+
{isLocalVideoEnabled && !!elements?.virtual_background ? (
|
188
192
|
<ActionTile.Root
|
189
193
|
onClick={() => {
|
190
194
|
toggleVB();
|
@@ -194,7 +198,7 @@ export const MwebOptions = ({
|
|
194
198
|
<VirtualBackgroundIcon />
|
195
199
|
<ActionTile.Title>Virtual Background</ActionTile.Title>
|
196
200
|
</ActionTile.Root>
|
197
|
-
) : null}
|
201
|
+
) : null}
|
198
202
|
|
199
203
|
{elements?.emoji_reactions && !(isLandscapeHLSStream || isMobileHLSStream) && (
|
200
204
|
<ActionTile.Root
|
@@ -267,7 +267,7 @@ export const PreviewControls = ({ hideSettings, vbEnabled }: { hideSettings: boo
|
|
267
267
|
>
|
268
268
|
<Flex css={{ gap: '$4' }}>
|
269
269
|
<AudioVideoToggle />
|
270
|
-
{vbEnabled
|
270
|
+
{vbEnabled ? <VBToggle /> : null}
|
271
271
|
</Flex>
|
272
272
|
{!hideSettings ? <PreviewSettings /> : null}
|
273
273
|
</Flex>
|
@@ -1,6 +1,5 @@
|
|
1
1
|
import React, { useEffect, useMemo } from 'react';
|
2
2
|
import { useMedia } from 'react-use';
|
3
|
-
import { Whiteboard } from '@100mslive/hms-whiteboard';
|
4
3
|
import { selectPeerByCondition, selectWhiteboard, useHMSStore, useWhiteboard } from '@100mslive/react-sdk';
|
5
4
|
import { Box } from '../../../Layout';
|
6
5
|
import { config as cssConfig } from '../../../Theme';
|
@@ -12,12 +11,10 @@ import { ProminenceLayout } from './ProminenceLayout';
|
|
12
11
|
// @ts-ignore: No implicit Any
|
13
12
|
import { useSetUiSettings } from '../AppData/useUISettings';
|
14
13
|
import { UI_SETTINGS } from '../../common/constants';
|
15
|
-
// eslint-disable-next-line import/no-unresolved
|
16
|
-
import '@100mslive/hms-whiteboard/index.css';
|
17
14
|
|
18
15
|
const WhiteboardEmbed = () => {
|
19
16
|
const isMobile = useMedia(cssConfig.media.md);
|
20
|
-
const {
|
17
|
+
const { iframeRef } = useWhiteboard(isMobile);
|
21
18
|
|
22
19
|
return (
|
23
20
|
<Box
|
@@ -31,9 +28,18 @@ const WhiteboardEmbed = () => {
|
|
31
28
|
},
|
32
29
|
}}
|
33
30
|
>
|
34
|
-
<
|
35
|
-
|
36
|
-
|
31
|
+
<iframe
|
32
|
+
title="Whiteboard View"
|
33
|
+
ref={iframeRef}
|
34
|
+
style={{
|
35
|
+
width: '100%',
|
36
|
+
height: '100%',
|
37
|
+
border: 0,
|
38
|
+
borderRadius: '0.75rem',
|
39
|
+
}}
|
40
|
+
allow="autoplay; clipboard-write;"
|
41
|
+
referrerPolicy="no-referrer"
|
42
|
+
/>
|
37
43
|
</Box>
|
38
44
|
);
|
39
45
|
};
|