@stream-io/video-react-sdk 1.40.0 → 1.40.2

package/dist/index.cjs.js

@@ -7,7 +7,7 @@ var react = require('react');
 var react$1 = require('@floating-ui/react');
 var clsx = require('clsx');
 
-const Audio = react.memo(function Audio({ participant, trackType = 'audioTrack', ...rest }) {
+const Audio = react.memo(function AudioRender({ participant, trackType = 'audioTrack', ...rest }) {
     const call = videoReactBindings.useCall();
     const [audioElement, setAudioElement] = react.useState(null);
     const { userId, sessionId } = participant;
@@ -677,7 +677,7 @@ const normalizeString = (value) => value
  * @description Extends video element with `stream` property
  * (`srcObject`) to reactively handle stream changes
  */
-const BaseVideo = react.forwardRef(function BaseVideo({ stream, ...rest }, ref) {
+const BaseVideo = react.forwardRef(function BaseVideoRender({ stream, ...rest }, ref) {
     const [videoElement, setVideoElement] = react.useState(null);
     react.useEffect(() => {
         if (!videoElement || !stream)
@@ -723,12 +723,12 @@ const InitialsFallback = (props) => {
     return (jsxRuntime.jsx("div", { className: "str-video__video-placeholder__initials-fallback", children: initials }));
 };
 
-const DefaultVideoPlaceholder = react.forwardRef(function DefaultVideoPlaceholder(props, ref) {
+const DefaultVideoPlaceholder = react.forwardRef(function DefaultVideoPlaceholderRender(props, ref) {
     const { t } = videoReactBindings.useI18n();
     return (jsxRuntime.jsx(BaseVideoPlaceholder, { ref: ref, ...props, children: t('Video is disabled') }));
 });
 
-const DefaultPictureInPicturePlaceholder = react.forwardRef(function DefaultPictureInPicturePlaceholder(props, ref) {
+const DefaultPictureInPicturePlaceholder = react.forwardRef(function DefaultPictureInPicturePlaceholderRender(props, ref) {
     const { t } = videoReactBindings.useI18n();
     return (jsxRuntime.jsx(BaseVideoPlaceholder, { ref: ref, ...props, children: t('Video is playing in a popup') }));
 });
@@ -855,7 +855,7 @@ const BackgroundFiltersProvider = (props) => {
     return (jsxRuntime.jsx(react.Suspense, { fallback: SuspenseFallback, children: jsxRuntime.jsx(BackgroundFiltersProviderImpl, { ...filterProps, ContextProvider: BackgroundFiltersContext }) }));
 };
 
-const IconButton = react.forwardRef(function IconButton(props, ref) {
+const IconButton = react.forwardRef(function IconButtonRender(props, ref) {
     const { icon, enabled, variant, onClick, className, ...rest } = props;
     return (jsxRuntime.jsx("button", { className: clsx('str-video__call-controls__button', className, {
             [`str-video__call-controls__button--variant-${variant}`]: variant,
@@ -866,7 +866,7 @@ const IconButton = react.forwardRef(function IconButton(props, ref) {
         }, ref: ref, ...rest, children: jsxRuntime.jsx(Icon, { icon: icon }) }));
 });
 
-const CompositeButton = react.forwardRef(function CompositeButton({ disabled, caption, children, className, active, Menu, menuPlacement, menuOffset, title, ToggleMenuButton = DefaultToggleMenuButton, variant, onClick, onMenuToggle, ...restButtonProps }, ref) {
+const CompositeButton = react.forwardRef(function CompositeButtonRender({ disabled, caption, children, className, active, Menu, menuPlacement, menuOffset, title, ToggleMenuButton = DefaultToggleMenuButton, variant, onClick, onMenuToggle, ...restButtonProps }, ref) {
     return (jsxRuntime.jsxs("div", { className: clsx('str-video__composite-button', className, {
             'str-video__composite-button--caption': caption,
             'str-video__composite-button--menu': Menu,
@@ -880,7 +880,7 @@ const CompositeButton = react.forwardRef(function CompositeButton({ disabled, ca
                             onClick?.(e);
                         }, disabled: disabled, ...restButtonProps, children: children }), Menu && (jsxRuntime.jsx(MenuToggle, { offset: menuOffset, placement: menuPlacement, ToggleButton: ToggleMenuButton, onToggle: onMenuToggle, children: isComponentType(Menu) ? jsxRuntime.jsx(Menu, {}) : Menu }))] }), caption && (jsxRuntime.jsx("div", { className: "str-video__composite-button__caption", children: caption }))] }));
 });
-const DefaultToggleMenuButton = react.forwardRef(function DefaultToggleMenuButton({ menuShown }, ref) {
+const DefaultToggleMenuButton = react.forwardRef(function DefaultToggleMenuButtonRender({ menuShown }, ref) {
     return (jsxRuntime.jsx(IconButton, { className: clsx('str-video__menu-toggle-button', {
             'str-video__menu-toggle-button--active': menuShown,
         }), icon: menuShown ? 'caret-down' : 'caret-up', ref: ref }));
@@ -1075,7 +1075,7 @@ const RecordEndConfirmation = (props) => {
     const handleClick = createCallControlHandler(props, toggleCallRecording);
     return (jsxRuntime.jsxs("div", { className: "str-video__end-recording__confirmation", children: [jsxRuntime.jsxs("div", { className: "str-video__end-recording__header", children: [jsxRuntime.jsx(Icon, { icon: "recording-on" }), jsxRuntime.jsx("h2", { className: "str-video__end-recording__heading", children: t('End recording') })] }), jsxRuntime.jsx("p", { className: "str-video__end-recording__description", children: t('Are you sure you want end the recording?') }), jsxRuntime.jsxs("div", { className: "str-video__end-recording__actions", children: [jsxRuntime.jsx(CompositeButton, { variant: "secondary", onClick: close, children: t('Cancel') }), jsxRuntime.jsx(CompositeButton, { variant: "primary", onClick: isAwaitingResponse ? undefined : handleClick, children: isAwaitingResponse ? jsxRuntime.jsx(LoadingIndicator, {}) : t('End recording') })] })] }));
 };
-const ToggleEndRecordingMenuButton = react.forwardRef(function ToggleEndRecordingMenuButton(props, ref) {
+const ToggleEndRecordingMenuButton = react.forwardRef(function ToggleEndRecordingMenuButtonRender(props, ref) {
     return (jsxRuntime.jsx(CompositeButton, { ref: ref, active: true, variant: "secondary", "data-testid": "recording-stop-button", children: jsxRuntime.jsx(Icon, { icon: "recording-off" }) }));
 });
 const RecordCallConfirmationButton = (props) => {
@@ -1172,7 +1172,7 @@ const defaultReactions = [
 const ReactionsButton = ({ reactions = defaultReactions, }) => {
     return (jsxRuntime.jsx(videoReactBindings.Restricted, { requiredGrants: [videoClient.OwnCapability.CREATE_REACTION], children: jsxRuntime.jsx(MenuToggle, { placement: "top", ToggleButton: ToggleReactionsMenuButton, visualType: exports.MenuVisualType.MENU, children: jsxRuntime.jsx(DefaultReactionsMenu, { reactions: reactions }) }) }));
 };
-const ToggleReactionsMenuButton = react.forwardRef(function ToggleReactionsMenuButton({ menuShown }, ref) {
+const ToggleReactionsMenuButton = react.forwardRef(function ToggleReactionsMenuButtonRender({ menuShown }, ref) {
     const { t } = videoReactBindings.useI18n();
     return (jsxRuntime.jsx(WithTooltip, { title: t('Reactions'), tooltipDisabled: menuShown, children: jsxRuntime.jsx(CompositeButton, { ref: ref, active: menuShown, variant: "primary", children: jsxRuntime.jsx(Icon, { icon: "reactions" }) }) }));
 });
@@ -1406,7 +1406,7 @@ const SpeakerTest = (props) => {
     const audioElementRef = react.useRef(null);
     const [isPlaying, setIsPlaying] = react.useState(false);
     const { t } = videoReactBindings.useI18n();
-    const { audioUrl = `https://unpkg.com/${"@stream-io/video-react-sdk"}@${"1.40.0"}/assets/piano.mp3`, } = props;
+    const { audioUrl = `https://unpkg.com/${"@stream-io/video-react-sdk"}@${"1.40.2"}/assets/piano.mp3`, } = props;
     // Update audio output device when selection changes
     react.useEffect(() => {
         const audio = audioElementRef.current;
@@ -1512,7 +1512,7 @@ const Menu = () => {
     const { t } = videoReactBindings.useI18n();
     return (jsxRuntime.jsxs("div", { className: "str-video__device-settings", children: [jsxRuntime.jsx(DeviceSelectorVideo, { title: t('Select a Camera') }), jsxRuntime.jsx(DeviceSelectorAudioInput, { title: t('Select a Mic') }), jsxRuntime.jsx(DeviceSelectorAudioOutput, { title: t('Select Speakers') })] }));
 };
-const ToggleDeviceSettingsMenuButton = react.forwardRef(function ToggleDeviceSettingsMenuButton({ menuShown }, ref) {
+const ToggleDeviceSettingsMenuButton = react.forwardRef(function ToggleDeviceSettingsMenuButtonRender({ menuShown }, ref) {
     const { t } = videoReactBindings.useI18n();
     return (jsxRuntime.jsx(IconButton, { className: clsx('str-video__device-settings__button', {
             'str-video__device-settings__button--active': menuShown,
@@ -1637,7 +1637,7 @@ const EndCallMenu = (props) => {
     const { t } = videoReactBindings.useI18n();
     return (jsxRuntime.jsxs("div", { className: "str-video__end-call__confirmation", children: [jsxRuntime.jsxs("button", { className: "str-video__button str-video__end-call__leave", type: "button", "data-testid": "leave-call-button", onClick: onLeave, children: [jsxRuntime.jsx(Icon, { className: "str-video__button__icon str-video__end-call__leave-icon", icon: "logout" }), t('Leave call')] }), jsxRuntime.jsx(videoReactBindings.Restricted, { requiredGrants: [videoClient.OwnCapability.END_CALL], children: jsxRuntime.jsxs("button", { className: "str-video__button str-video__end-call__end", type: "button", "data-testid": "end-call-for-all-button", onClick: onEnd, children: [jsxRuntime.jsx(Icon, { className: "str-video__button__icon str-video__end-call__end-icon", icon: "call-end" }), t('End call for all')] }) })] }));
 };
-const CancelCallToggleMenuButton = react.forwardRef(function CancelCallToggleMenuButton({ menuShown }, ref) {
+const CancelCallToggleMenuButton = react.forwardRef(function CancelCallToggleMenuButtonRender({ menuShown }, ref) {
     const { t } = videoReactBindings.useI18n();
     return (jsxRuntime.jsx(WithTooltip, { title: t('Leave call'), tooltipDisabled: menuShown, children: jsxRuntime.jsx(IconButton, { icon: menuShown ? 'close' : 'call-end', variant: menuShown ? 'active' : 'danger', "data-testid": "leave-call-button", ref: ref }) }));
 });
@@ -1872,7 +1872,7 @@ const calculateSubscribeAudioBitrate = (previousCallStatsReport, callStatsReport
 };
 
 const CallStatsButton = () => (jsxRuntime.jsx(MenuToggle, { placement: "top-end", ToggleButton: ToggleMenuButton, children: jsxRuntime.jsx(CallStats, {}) }));
-const ToggleMenuButton = react.forwardRef(function ToggleMenuButton(props, ref) {
+const ToggleMenuButton = react.forwardRef(function ToggleMenuButtonRender(props, ref) {
     const { t } = videoReactBindings.useI18n();
     const { caption, menuShown } = props;
     return (jsxRuntime.jsx(CompositeButton, { ref: ref, active: menuShown, caption: caption, title: caption || t('Statistics'), "data-testid": "stats-button", children: jsxRuntime.jsx(Icon, { icon: "stats" }) }));
@@ -1910,7 +1910,7 @@ const CallParticipantListHeader = ({ onClose, }) => {
     return (jsxRuntime.jsxs("div", { className: "str-video__participant-list-header", children: [jsxRuntime.jsxs("div", { className: "str-video__participant-list-header__title", children: [t('Participants'), ' ', jsxRuntime.jsxs("span", { className: "str-video__participant-list-header__title-count", children: ["[", participants.length, "]"] }), anonymousParticipantCount > 0 && (jsxRuntime.jsx("span", { className: "str-video__participant-list-header__title-anonymous", children: t('Anonymous', { count: anonymousParticipantCount }) }))] }), jsxRuntime.jsx(IconButton, { onClick: onClose, className: "str-video__participant-list-header__close-button", icon: "close" })] }));
 };
 
-const CallParticipantListingItem = react.memo(function CallParticipantListingItem({ participant, DisplayName = DefaultDisplayName, }) {
+const CallParticipantListingItem = react.memo(function CallParticipantListingItemRender({ participant, DisplayName = DefaultDisplayName, }) {
     const isAudioOn = videoClient.hasAudio(participant);
     const isVideoOn = videoClient.hasVideo(participant);
     const isPinnedOn = videoClient.isPinned(participant);
@@ -1936,7 +1936,7 @@ const DefaultDisplayName = ({ participant }) => {
     }
     return (jsxRuntime.jsx(WithTooltip, { className: "str-video__participant-listing-item__display-name", title: displayName, children: displayName }));
 };
-const ToggleButton$2 = react.forwardRef(function ToggleButton(props, ref) {
+const ToggleButton$2 = react.forwardRef(function ToggleButtonRender(props, ref) {
     return jsxRuntime.jsx(IconButton, { enabled: props.menuShown, icon: "ellipsis", ref: ref });
 });
 
@@ -2067,7 +2067,7 @@ const BlockedUsersSearchResults = ({ blockedUsersSearchFn: blockedUsersSearchFnF
     });
     return (jsxRuntime.jsx(SearchResults, { EmptySearchResultComponent: EmptyParticipantSearchList, LoadingIndicator: LoadingIndicator, searchQueryInProgress: searchQueryInProgress, searchResults: searchQuery ? searchResults : blockedUsers, SearchResultList: BlockedUserListing }));
 };
-const ToggleButton$1 = react.forwardRef(function ToggleButton(props, ref) {
+const ToggleButton$1 = react.forwardRef(function ToggleButtonRender(props, ref) {
     return jsxRuntime.jsx(IconButton, { enabled: props.menuShown, icon: "filter", ref: ref });
 });
 
@@ -2315,7 +2315,7 @@ const PermissionRequests = () => {
                     overflowY: 'auto',
                 }, permissionRequests: permissionRequests, handleUpdatePermission: handleUpdatePermission }))] }));
 };
-const PermissionRequestList = react.forwardRef(function PermissionRequestList(props, ref) {
+const PermissionRequestList = react.forwardRef(function PermissionRequestListRender(props, ref) {
     const { permissionRequests, handleUpdatePermission, ...rest } = props;
     const { t } = videoReactBindings.useI18n();
     return (jsxRuntime.jsx("div", { className: "str-video__permission-requests-list", ref: ref, ...rest, children: permissionRequests.map((request, reqIndex) => {
@@ -2379,7 +2379,7 @@ const VideoPreview = ({ className, mirror = true, DisabledVideoPreview = Default
     return (jsxRuntime.jsx("div", { className: clsx('str-video__video-preview-container', className), children: contents }));
 };
 
-const ToggleButton = react.forwardRef(function ToggleButton(props, ref) {
+const ToggleButton = react.forwardRef(function ToggleButtonRender(props, ref) {
     return jsxRuntime.jsx(IconButton, { enabled: props.menuShown, icon: "ellipsis", ref: ref });
 });
 const DefaultScreenShareOverlay = () => {
@@ -2439,14 +2439,14 @@ const SpeechIndicator = () => {
     return (jsxRuntime.jsxs("span", { className: clsx('str-video__speech-indicator', isSpeaking && 'str-video__speech-indicator--speaking', isDominantSpeaker && 'str-video__speech-indicator--dominant'), children: [jsxRuntime.jsx("span", { className: "str-video__speech-indicator__bar" }), jsxRuntime.jsx("span", { className: "str-video__speech-indicator__bar" }), jsxRuntime.jsx("span", { className: "str-video__speech-indicator__bar" })] }));
 };
 
-const ParticipantView = react.memo(react.forwardRef(function ParticipantView({ participant, trackType = 'videoTrack', mirror, muteAudio, refs: { setVideoElement, setVideoPlaceholderElement } = {}, className, VideoPlaceholder, PictureInPicturePlaceholder, ParticipantViewUI = DefaultParticipantViewUI, }, ref) {
+const ParticipantView = react.memo(react.forwardRef(function ParticipantViewRender({ participant, trackType = 'videoTrack', mirror, muteAudio, refs: { setVideoElement, setVideoPlaceholderElement } = {}, className, VideoPlaceholder, PictureInPicturePlaceholder, ParticipantViewUI = DefaultParticipantViewUI, }, ref) {
     const { isLocalParticipant, isSpeaking, isDominantSpeaker, sessionId } = participant;
     const hasAudioTrack = videoClient.hasAudio(participant);
     const hasVideoTrack = videoClient.hasVideo(participant);
     const hasScreenShareAudioTrack = videoClient.hasScreenShareAudio(participant);
     const [trackedElement, setTrackedElement] = react.useState(null);
     const [contextVideoElement, setContextVideoElement] = react.useState(null);
-    const [contextVideoPlaceholderElement, setContextVideoPlaceholderElement] = react.useState(null);
+    const [contextVideoPlaceholderElement, setContextVideoPlaceholderElement,] = react.useState(null);
     useTrackElementVisibility({
         sessionId,
         trackedElement,
@@ -2480,7 +2480,8 @@ const ParticipantView = react.memo(react.forwardRef(function ParticipantView({ p
     return (jsxRuntime.jsx("div", { "data-testid": "participant-view", ref: (element) => {
             applyElementToRef(ref, element);
             setTrackedElement(element);
-        }, className: clsx('str-video__participant-view', isDominantSpeaker && 'str-video__participant-view--dominant-speaker', isSpeaking && 'str-video__participant-view--speaking', !hasVideoTrack && 'str-video__participant-view--no-video', !hasAudioTrack && 'str-video__participant-view--no-audio', className), children: jsxRuntime.jsxs(ParticipantViewContext.Provider, { value: participantViewContextValue, children: [!isLocalParticipant && !muteAudio && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [hasAudioTrack && (jsxRuntime.jsx(Audio, { participant: participant, trackType: "audioTrack" })), hasScreenShareAudioTrack && (jsxRuntime.jsx(Audio, { participant: participant, trackType: "screenShareAudioTrack" }))] })), jsxRuntime.jsx(Video$1, { VideoPlaceholder: VideoPlaceholder, PictureInPicturePlaceholder: PictureInPicturePlaceholder, participant: participant, trackType: trackType, refs: videoRefs, enabled: isLocalParticipant ||
+        }, className: clsx('str-video__participant-view', isDominantSpeaker &&
+            'str-video__participant-view--dominant-speaker', isSpeaking && 'str-video__participant-view--speaking', !hasVideoTrack && 'str-video__participant-view--no-video', !hasAudioTrack && 'str-video__participant-view--no-audio', className), children: jsxRuntime.jsxs(ParticipantViewContext.Provider, { value: participantViewContextValue, children: [!isLocalParticipant && !muteAudio && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [hasAudioTrack && (jsxRuntime.jsx(Audio, { participant: participant, trackType: "audioTrack" })), hasScreenShareAudioTrack && (jsxRuntime.jsx(Audio, { participant: participant, trackType: "screenShareAudioTrack" }))] })), jsxRuntime.jsx(Video$1, { VideoPlaceholder: VideoPlaceholder, PictureInPicturePlaceholder: PictureInPicturePlaceholder, participant: participant, trackType: trackType, refs: videoRefs, enabled: isLocalParticipant ||
                         trackType !== 'videoTrack' ||
                         isParticipantVideoEnabled(participant.sessionId), mirror: mirror, autoPlay: true }), isComponentType(ParticipantViewUI) ? (jsxRuntime.jsx(ParticipantViewUI, {})) : (ParticipantViewUI)] }) }));
 }));
@@ -3278,7 +3279,7 @@ const checkCanJoinEarly = (startsAt, joinAheadTimeSeconds) => {
     return Date.now() >= +startsAt - (joinAheadTimeSeconds ?? 0) * 1000;
 };
 
-const [major, minor, patch] = ("1.40.0").split('.');
+const [major, minor, patch] = ("1.40.2").split('.');
 videoClient.setSdkInfo({
     type: videoClient.SfuModels.SdkType.REACT,
     major,