@100mslive/roomkit-react 0.3.3-alpha.1 → 0.3.3-alpha.10
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{HLSView-GDOF4655.js → HLSView-SYFDABFO.js} +331 -166
- package/dist/HLSView-SYFDABFO.js.map +7 -0
- package/dist/IconButton/IconButton.d.ts +1 -1
- package/dist/Modal/Dialog.d.ts +1 -1
- package/dist/Prebuilt/IconButton.d.ts +2 -3
- package/dist/Prebuilt/components/Footer/ChatToggle.d.ts +3 -1
- package/dist/Prebuilt/components/HMSVideo/PlayPauseButton.d.ts +2 -2
- package/dist/Prebuilt/components/HMSVideo/PlayPauseSeekControls.d.ts +14 -0
- package/dist/Prebuilt/components/HMSVideo/{SeekControls.d.ts → SeekControl.d.ts} +2 -2
- package/dist/Prebuilt/components/HMSVideo/index.d.ts +15 -11
- package/dist/Prebuilt/components/Leave/LeaveAtoms.d.ts +2 -2
- package/dist/Prebuilt/components/RaiseHand.d.ts +1 -1
- package/dist/Prebuilt/components/VideoLayouts/WhiteboardLayout.d.ts +3 -0
- package/dist/Sheet/Sheet.d.ts +1 -1
- package/dist/{chunk-ZDW56PPL.js → chunk-HIJ2DH6Q.js} +440 -417
- package/dist/chunk-HIJ2DH6Q.js.map +7 -0
- package/dist/index.cjs.js +1533 -1333
- package/dist/index.cjs.js.map +4 -4
- package/dist/index.js +1 -1
- package/dist/meta.cjs.json +236 -147
- package/dist/meta.esbuild.json +249 -159
- package/package.json +8 -8
- package/src/IconButton/IconButton.tsx +2 -7
- package/src/Prebuilt/IconButton.tsx +6 -10
- package/src/Prebuilt/components/Chat/ChatFooter.tsx +4 -2
- package/src/Prebuilt/components/ConferenceScreen.tsx +4 -1
- package/src/Prebuilt/components/Footer/ChatToggle.tsx +2 -2
- package/src/Prebuilt/components/Footer/Footer.tsx +4 -1
- package/src/Prebuilt/components/Footer/ParticipantList.tsx +4 -1
- package/src/Prebuilt/components/Footer/RoleAccordion.tsx +5 -6
- package/src/Prebuilt/components/Footer/WhiteboardToggle.tsx +17 -3
- package/src/Prebuilt/components/HMSVideo/HMSVideo.jsx +1 -0
- package/src/Prebuilt/components/HMSVideo/PlayPauseButton.tsx +2 -2
- package/src/Prebuilt/components/HMSVideo/PlayPauseSeekControls.tsx +158 -0
- package/src/Prebuilt/components/HMSVideo/{SeekControls.tsx → SeekControl.tsx} +2 -2
- package/src/Prebuilt/components/HMSVideo/VideoProgress.tsx +7 -3
- package/src/Prebuilt/components/HMSVideo/index.ts +5 -4
- package/src/Prebuilt/components/IconButtonWithOptions/IconButtonWithOptions.tsx +9 -9
- package/src/Prebuilt/components/MoreSettings/SplitComponents/DesktopOptions.tsx +1 -0
- package/src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx +5 -1
- package/src/Prebuilt/components/PreviousRoleInMetadata.tsx +1 -0
- package/src/Prebuilt/components/RaiseHand.tsx +1 -7
- package/src/Prebuilt/components/RoleChangeRequest/RoleChangeRequestModal.tsx +1 -0
- package/src/Prebuilt/components/VideoLayouts/GridLayout.tsx +27 -4
- package/src/Prebuilt/components/VideoLayouts/WhiteboardLayout.tsx +95 -0
- package/src/Prebuilt/components/hooks/useCloseScreenshareWhiteboard.tsx +13 -5
- package/src/Prebuilt/components/hooks/{useMetadata.tsx → useMetadata.jsx} +8 -2
- package/src/Prebuilt/layouts/HLSView.jsx +115 -78
- package/src/Prebuilt/layouts/VideoStreamingSection.tsx +1 -17
- package/dist/HLSView-GDOF4655.js.map +0 -7
- package/dist/Prebuilt/components/hooks/useMetadata.d.ts +0 -8
- package/dist/Prebuilt/layouts/WhiteboardView.d.ts +0 -2
- package/dist/chunk-ZDW56PPL.js.map +0 -7
- package/src/Prebuilt/layouts/WhiteboardView.tsx +0 -69
@@ -1,69 +0,0 @@
|
|
1
|
-
import React, { useEffect, useMemo } from 'react';
|
2
|
-
import { useMedia } from 'react-use';
|
3
|
-
import { selectPeers, selectWhiteboard, useHMSStore, useWhiteboard } from '@100mslive/react-sdk';
|
4
|
-
import { SecondaryTiles } from '../components/SecondaryTiles';
|
5
|
-
import { ProminenceLayout } from '../components/VideoLayouts/ProminenceLayout';
|
6
|
-
import { config as cssConfig } from '../../';
|
7
|
-
import { Box } from '../../Layout';
|
8
|
-
// @ts-ignore: No implicit Any
|
9
|
-
import { useSetAppDataByKey } from '../components/AppData/useUISettings';
|
10
|
-
import { APP_DATA } from '../common/constants';
|
11
|
-
|
12
|
-
const EmbedComponent = () => {
|
13
|
-
const isMobile = useMedia(cssConfig.media.md);
|
14
|
-
const { iframeRef } = useWhiteboard(isMobile);
|
15
|
-
|
16
|
-
return (
|
17
|
-
<Box
|
18
|
-
css={{
|
19
|
-
mx: '$8',
|
20
|
-
flex: '3 1 0',
|
21
|
-
'@lg': {
|
22
|
-
flex: '2 1 0',
|
23
|
-
display: 'flex',
|
24
|
-
alignItems: 'center',
|
25
|
-
},
|
26
|
-
}}
|
27
|
-
>
|
28
|
-
<iframe
|
29
|
-
title="Whiteboard View"
|
30
|
-
ref={iframeRef}
|
31
|
-
style={{
|
32
|
-
width: '100%',
|
33
|
-
height: '100%',
|
34
|
-
border: 0,
|
35
|
-
borderRadius: '0.75rem',
|
36
|
-
}}
|
37
|
-
allow="autoplay; clipboard-write;"
|
38
|
-
referrerPolicy="no-referrer"
|
39
|
-
/>
|
40
|
-
</Box>
|
41
|
-
);
|
42
|
-
};
|
43
|
-
|
44
|
-
export const WhiteboardView = () => {
|
45
|
-
const peers = useHMSStore(selectPeers);
|
46
|
-
const whiteboard = useHMSStore(selectWhiteboard);
|
47
|
-
const [, setActiveScreenSharePeer] = useSetAppDataByKey(APP_DATA.activeScreensharePeerId);
|
48
|
-
|
49
|
-
const smallTilePeers = useMemo(() => {
|
50
|
-
const smallTilePeers = peers.filter(peer => peer.id !== whiteboard?.owner);
|
51
|
-
return smallTilePeers;
|
52
|
-
}, [peers, whiteboard?.owner]);
|
53
|
-
|
54
|
-
useEffect(() => {
|
55
|
-
setActiveScreenSharePeer(whiteboard?.owner || '');
|
56
|
-
return () => {
|
57
|
-
setActiveScreenSharePeer('');
|
58
|
-
};
|
59
|
-
}, [whiteboard?.owner, setActiveScreenSharePeer]);
|
60
|
-
|
61
|
-
return (
|
62
|
-
<ProminenceLayout.Root>
|
63
|
-
<ProminenceLayout.ProminentSection>
|
64
|
-
<EmbedComponent />
|
65
|
-
</ProminenceLayout.ProminentSection>
|
66
|
-
<SecondaryTiles peers={smallTilePeers} />
|
67
|
-
</ProminenceLayout.Root>
|
68
|
-
);
|
69
|
-
};
|