@100mslive/roomkit-react 0.1.6-alpha.1 → 0.1.6-alpha.3
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{HLSView-HNVYG5VE.js → HLSView-HL455FYH.js} +3 -3
- package/dist/Prebuilt/components/Footer/ChatToggle.d.ts +1 -3
- package/dist/Prebuilt/components/Leave/DesktopLeaveRoom.d.ts +2 -1
- package/dist/Prebuilt/components/Leave/MwebLeaveRoom.d.ts +2 -1
- package/dist/Prebuilt/components/SidePaneTabs.d.ts +7 -0
- package/dist/{VirtualBackground-UM2FOUHQ.js → VirtualBackground-6EP3X7MO.js} +6 -6
- package/dist/VirtualBackground-6EP3X7MO.js.map +7 -0
- package/dist/{chunk-LYSAET4G.js → chunk-6JF3GAOH.js} +109 -127
- package/dist/chunk-6JF3GAOH.js.map +7 -0
- package/dist/{chunk-POE7H4IE.js → chunk-KAJJ56J4.js} +2 -2
- package/dist/{chunk-POE7H4IE.js.map → chunk-KAJJ56J4.js.map} +1 -1
- package/dist/{chunk-364HP22I.js → chunk-UXBTLGWY.js} +2 -2
- package/dist/{conference-UWLJHMB2.js → conference-MPZNWHV5.js} +472 -415
- package/dist/conference-MPZNWHV5.js.map +7 -0
- package/dist/index.cjs.js +714 -678
- package/dist/index.cjs.js.map +4 -4
- package/dist/index.js +2 -2
- package/dist/meta.cjs.json +153 -153
- package/dist/meta.esbuild.json +185 -184
- package/package.json +6 -6
- package/src/Button/Button.tsx +6 -6
- package/src/Prebuilt/components/Chat/Chat.jsx +3 -9
- package/src/Prebuilt/components/Chat/useEmojiPickerStyles.js +1 -0
- package/src/Prebuilt/components/Footer/ChatToggle.tsx +2 -9
- package/src/Prebuilt/components/Footer/Footer.tsx +23 -7
- package/src/Prebuilt/components/Footer/ParticipantList.jsx +4 -5
- package/src/Prebuilt/components/Footer/RoleAccordion.tsx +1 -1
- package/src/Prebuilt/components/Header/HeaderComponents.jsx +10 -9
- package/src/Prebuilt/components/InsetTile.tsx +1 -0
- package/src/Prebuilt/components/Leave/DesktopLeaveRoom.tsx +7 -9
- package/src/Prebuilt/components/Leave/LeaveRoom.tsx +6 -2
- package/src/Prebuilt/components/Leave/MwebLeaveRoom.tsx +7 -4
- package/src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx +1 -1
- package/src/Prebuilt/components/Notifications/Notifications.jsx +4 -3
- package/src/Prebuilt/components/Preview/PreviewJoin.tsx +2 -3
- package/src/Prebuilt/components/RoleChangeRequestModal.tsx +4 -3
- package/src/Prebuilt/components/ScreenshareTile.jsx +15 -7
- package/src/Prebuilt/components/SidePaneTabs.tsx +141 -0
- package/src/Prebuilt/components/conference.jsx +9 -1
- package/src/Prebuilt/components/hooks/useMetadata.jsx +7 -25
- package/src/Prebuilt/layouts/SidePane.tsx +12 -10
- package/src/Prebuilt/plugins/VirtualBackground/VirtualBackground.jsx +3 -3
- package/src/Prebuilt/provider/roomLayoutProvider/hooks/useFetchRoomLayout.ts +2 -2
- package/dist/VirtualBackground-UM2FOUHQ.js.map +0 -7
- package/dist/chunk-LYSAET4G.js.map +0 -7
- package/dist/conference-UWLJHMB2.js.map +0 -7
- package/src/Prebuilt/components/Chat/ChatParticipantHeader.jsx +0 -84
- /package/dist/{HLSView-HNVYG5VE.js.map → HLSView-HL455FYH.js.map} +0 -0
- /package/dist/{chunk-364HP22I.js.map → chunk-UXBTLGWY.js.map} +0 -0
@@ -9,7 +9,7 @@ import {
|
|
9
9
|
Slider,
|
10
10
|
ToastManager,
|
11
11
|
useTheme
|
12
|
-
} from "./chunk-
|
12
|
+
} from "./chunk-6JF3GAOH.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-
|
26
|
+
} from "./chunk-KAJJ56J4.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";
|
@@ -840,4 +840,4 @@ var HLSView_default = HLSView;
|
|
840
840
|
export {
|
841
841
|
HLSView_default as default
|
842
842
|
};
|
843
|
-
//# sourceMappingURL=HLSView-
|
843
|
+
//# sourceMappingURL=HLSView-HL455FYH.js.map
|
@@ -1,8 +1,9 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { ConferencingScreen } from '@100mslive/types-prebuilt';
|
3
|
-
export declare const DesktopLeaveRoom: ({ leaveRoom, screenType, }: {
|
3
|
+
export declare const DesktopLeaveRoom: ({ leaveRoom, screenType, endRoom, }: {
|
4
4
|
leaveRoom: (args: {
|
5
5
|
endstream: boolean;
|
6
6
|
}) => void;
|
7
7
|
screenType: keyof ConferencingScreen;
|
8
|
+
endRoom: () => void;
|
8
9
|
}) => React.JSX.Element | null;
|
@@ -1,8 +1,9 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { ConferencingScreen } from '@100mslive/types-prebuilt';
|
3
|
-
export declare const MwebLeaveRoom: ({ leaveRoom, screenType, }: {
|
3
|
+
export declare const MwebLeaveRoom: ({ leaveRoom, screenType, endRoom, }: {
|
4
4
|
leaveRoom: (args: {
|
5
5
|
endstream: boolean;
|
6
6
|
}) => void;
|
7
7
|
screenType: keyof ConferencingScreen;
|
8
|
+
endRoom: () => void;
|
8
9
|
}) => React.JSX.Element | null;
|
@@ -0,0 +1,7 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { ConferencingScreen } from '@100mslive/types-prebuilt';
|
3
|
+
export declare const SidePaneTabs: React.NamedExoticComponent<{
|
4
|
+
active: 'Participants | Chat';
|
5
|
+
screenType: keyof ConferencingScreen;
|
6
|
+
hideControls?: boolean | undefined;
|
7
|
+
}>;
|
@@ -1,18 +1,18 @@
|
|
1
1
|
import {
|
2
2
|
ActionTile
|
3
|
-
} from "./chunk-
|
3
|
+
} from "./chunk-UXBTLGWY.js";
|
4
4
|
import {
|
5
5
|
IconButton_default,
|
6
6
|
Loading,
|
7
7
|
Tooltip,
|
8
8
|
__async
|
9
|
-
} from "./chunk-
|
9
|
+
} from "./chunk-KAJJ56J4.js";
|
10
10
|
|
11
11
|
// src/Prebuilt/plugins/VirtualBackground/VirtualBackground.jsx
|
12
12
|
import React, { useEffect, useRef, useState } from "react";
|
13
13
|
import { HMSVirtualBackgroundTypes as HMSVirtualBackgroundTypes2 } from "@100mslive/hms-virtual-background";
|
14
14
|
import {
|
15
|
-
|
15
|
+
selectIsLocalVideoEnabled,
|
16
16
|
selectIsLocalVideoPluginPresent,
|
17
17
|
selectLocalPeerRole,
|
18
18
|
selectLocalVideoTrackID,
|
@@ -82,8 +82,8 @@ var VirtualBackground = ({
|
|
82
82
|
}) => {
|
83
83
|
const pluginRef = useRef(null);
|
84
84
|
const hmsActions = useHMSActions();
|
85
|
-
const isAllowedToPublish = useHMSStore(selectIsAllowedToPublish);
|
86
85
|
const role = useHMSStore(selectLocalPeerRole);
|
86
|
+
const isVideoOn = useHMSStore(selectIsLocalVideoEnabled);
|
87
87
|
const [isVBLoading, setIsVBLoading] = useState(false);
|
88
88
|
const [isVBSupported, setIsVBSupported] = useState(false);
|
89
89
|
const [isVBOn, setIsVBOn] = useState(false);
|
@@ -129,7 +129,7 @@ var VirtualBackground = ({
|
|
129
129
|
}
|
130
130
|
});
|
131
131
|
}
|
132
|
-
if (!
|
132
|
+
if (!isVBSupported || !isVideoOn) {
|
133
133
|
return null;
|
134
134
|
}
|
135
135
|
if (asActionTile) {
|
@@ -174,4 +174,4 @@ export {
|
|
174
174
|
VirtualBackground,
|
175
175
|
VirtualBackground_default as default
|
176
176
|
};
|
177
|
-
//# sourceMappingURL=VirtualBackground-
|
177
|
+
//# sourceMappingURL=VirtualBackground-6EP3X7MO.js.map
|
@@ -0,0 +1,7 @@
|
|
1
|
+
{
|
2
|
+
"version": 3,
|
3
|
+
"sources": ["../src/Prebuilt/plugins/VirtualBackground/VirtualBackground.jsx", "../src/Prebuilt/plugins/VirtualBackground/vbutils.js"],
|
4
|
+
"sourcesContent": ["import React, { useEffect, useRef, useState } from 'react';\nimport { HMSVirtualBackgroundTypes } from '@100mslive/hms-virtual-background';\nimport {\n selectIsLocalVideoEnabled,\n selectIsLocalVideoPluginPresent,\n selectLocalPeerRole,\n selectLocalVideoTrackID,\n useHMSActions,\n useHMSStore,\n} from '@100mslive/react-sdk';\nimport { VirtualBackgroundIcon } from '@100mslive/react-icons';\nimport { ActionTile } from '../../components/MoreSettings/ActionTile';\nimport { Loading } from '../../../Loading';\nimport { Tooltip } from '../../../Tooltip';\nimport IconButton from '../../IconButton';\nimport { getRandomVirtualBackground } from './vbutils';\n\nexport const VirtualBackground = ({\n asActionTile = false,\n onVBClick = () => {\n return;\n },\n}) => {\n const pluginRef = useRef(null);\n const hmsActions = useHMSActions();\n const role = useHMSStore(selectLocalPeerRole);\n const isVideoOn = useHMSStore(selectIsLocalVideoEnabled);\n const [isVBLoading, setIsVBLoading] = useState(false);\n const [isVBSupported, setIsVBSupported] = useState(false);\n const [isVBOn, setIsVBOn] = useState(false);\n const localPeerVideoTrackID = useHMSStore(selectLocalVideoTrackID);\n const isVBPresent = useHMSStore(selectIsLocalVideoPluginPresent('HMSVB'));\n\n async function createPlugin() {\n if (!pluginRef.current) {\n const { HMSVBPlugin } = await import('@100mslive/hms-virtual-background');\n pluginRef.current = new HMSVBPlugin(HMSVirtualBackgroundTypes.NONE, HMSVirtualBackgroundTypes.NONE);\n }\n }\n useEffect(() => {\n if (!localPeerVideoTrackID) {\n return;\n }\n createPlugin().then(() => {\n //check support of plugin\n const pluginSupport = hmsActions.validateVideoPluginSupport(pluginRef.current);\n setIsVBSupported(pluginSupport.isSupported);\n });\n }, [hmsActions, localPeerVideoTrackID]);\n\n async function addPlugin() {\n setIsVBLoading(true);\n try {\n await createPlugin();\n window.HMS.virtualBackground = pluginRef.current;\n const { background, backgroundType } = getRandomVirtualBackground();\n await pluginRef.current.setBackground(background, backgroundType);\n await hmsActions.addPluginToVideoTrack(pluginRef.current, Math.floor(role.publishParams.video.frameRate / 2));\n } catch (err) {\n console.error('add virtual background plugin failed', err);\n }\n setIsVBLoading(false);\n }\n\n async function removePlugin() {\n if (pluginRef.current) {\n await hmsActions.removePluginFromVideoTrack(pluginRef.current);\n pluginRef.current = null;\n }\n }\n\n if (!isVBSupported || !isVideoOn) {\n return null;\n }\n if (asActionTile) {\n return (\n <ActionTile.Root\n data-testid=\"virtual_bg_btn\"\n active={isVBPresent}\n disabled={isVBLoading}\n onClick={() => {\n setIsVBOn(!isVBOn);\n !isVBPresent ? addPlugin() : removePlugin();\n onVBClick();\n }}\n >\n <VirtualBackgroundIcon />\n <ActionTile.Title>Virtual Background</ActionTile.Title>\n </ActionTile.Root>\n );\n }\n\n return (\n <Tooltip\n boxCss={{ zIndex: '100' }}\n title={isVBLoading ? 'Adding virtual background' : `Turn ${!isVBPresent ? 'on' : 'off'} virtual background`}\n >\n <IconButton\n active={!isVBPresent}\n disabled={isVBLoading}\n onClick={() => {\n !isVBPresent ? addPlugin() : removePlugin();\n }}\n data-testid=\"virtual_bg_btn\"\n >\n {isVBLoading ? <Loading /> : <VirtualBackgroundIcon />}\n </IconButton>\n </Tooltip>\n );\n};\n\nexport default VirtualBackground;\n", "/* eslint-disable no-case-declarations */\nimport { HMSVirtualBackgroundTypes } from '@100mslive/hms-virtual-background';\nexport function getRandomVirtualBackground() {\n const backgroundList = [\n {\n background: HMSVirtualBackgroundTypes.BLUR,\n backgroundType: HMSVirtualBackgroundTypes.BLUR,\n },\n ];\n\n const images = [\n 'https://www.100ms.live/images/vb-1.jpeg',\n 'https://www.100ms.live/images/vb-2.jpg',\n 'https://www.100ms.live/images/vb-3.png',\n 'https://d2qi07yyjujoxr.cloudfront.net/webapp/vb/hms1.png',\n 'https://d2qi07yyjujoxr.cloudfront.net/webapp/vb/hms2.png',\n 'https://d2qi07yyjujoxr.cloudfront.net/webapp/vb/hms3.png',\n 'https://d2qi07yyjujoxr.cloudfront.net/webapp/vb/hms4.png',\n ].map(url => ({\n background: url,\n backgroundType: HMSVirtualBackgroundTypes.IMAGE,\n }));\n\n backgroundList.push(...images);\n\n /* \n //TODO: update with a better quality gif.\n const gifList = [\n {\n background: \"https://www.100ms.live/images/vb-1.gif\",\n backgroundType: HMSVirtualBackgroundTypes.GIF,\n },\n ];\n backgroundList.push(...gifList); \n */\n\n const videoList = [\n 'https://www.100ms.live/images/video-1.mp4',\n 'https://www.100ms.live/images/video-2.mp4',\n 'https://www.100ms.live/images/video-5.mp4',\n 'https://www.100ms.live/images/video-7.mp4',\n 'https://www.100ms.live/images/video-8.mp4',\n ].map(url => ({\n background: url,\n backgroundType: HMSVirtualBackgroundTypes.VIDEO,\n }));\n backgroundList.push(...videoList);\n\n const randomIdx = Math.floor(Math.random() * backgroundList.length);\n const virtualBackground = backgroundList[randomIdx];\n switch (virtualBackground.backgroundType) {\n case HMSVirtualBackgroundTypes.IMAGE:\n const img = document.createElement('img');\n img.alt = 'VB';\n img.src = backgroundList[randomIdx].background;\n virtualBackground.background = img;\n return virtualBackground;\n case HMSVirtualBackgroundTypes.VIDEO:\n const videoEl = document.createElement('video');\n videoEl.src = backgroundList[randomIdx].background;\n virtualBackground.background = videoEl;\n return virtualBackground;\n default:\n return virtualBackground;\n }\n}\n"],
|
5
|
+
"mappings": "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",
|
6
|
+
"names": ["HMSVirtualBackgroundTypes", "HMSVirtualBackgroundTypes"]
|
7
|
+
}
|