@whereby.com/browser-sdk 3.12.24 → 3.13.1

package/dist/react/index.esm.js

@@ -1,19 +1,17 @@
 import * as React from 'react';
-import { useRef, useEffect } from 'react';
-import { createStoreHook, createDispatchHook, createSelectorHook, Provider as Provider$1 } from 'react-redux';
-import { createServices, createStore, selectCurrentSpeakerDeviceId, debounce, doRtcReportStreamResolution, selectChatMessages, selectCloudRecordingRaw, selectBreakoutCurrentGroup, selectBreakoutActive, selectBreakoutGroupedParticipants, selectAllClientViewsInCurrentGroup, selectLocalParticipantRaw, selectLocalMediaStream, selectRemoteParticipants, selectScreenshares, selectRoomConnectionStatus, selectStreamingRaw, selectWaitingParticipants, selectNotificationsEmitter, selectSpotlightedClientViews, doAppStop, doSendChatMessage, doKnockRoom, doSetDisplayName, toggleCameraEnabled, toggleMicrophoneEnabled, toggleLowDataModeEnabled, doSetLocalStickyReaction, doRequestAudioEnable, doRequestVideoEnable, doAcceptWaitingParticipant, doRejectWaitingParticipant, doStartCloudRecording, doStartScreenshare, doStopCloudRecording, doStopScreenshare, doAppStart, doLockRoom, doSpotlightParticipant, doRemoveSpotlight, doKickParticipant, doEndMeeting, doBreakoutJoin, selectCameraDeviceError, selectCameraDevices, selectCurrentCameraDeviceId, selectCurrentMicrophoneDeviceId, selectIsSettingCameraDevice, selectIsSettingMicrophoneDevice, selectIsLocalMediaStarting, selectMicrophoneDeviceError, selectMicrophoneDevices, selectSpeakerDevices, selectLocalMediaStartError, doStartLocalMedia, doStopLocalMedia, setCurrentCameraDeviceId, setCurrentMicrophoneDeviceId, setCurrentSpeakerDeviceId, selectAllClientViews, selectNumParticipants } from '@whereby.com/core';
-import { createSelector } from '@reduxjs/toolkit';
+import { WherebyClient, CURRENT_SPEAKER_CHANGED, debounce } from '@whereby.com/core';
 import runes from 'runes';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 
 const WherebyContext = React.createContext(null);
-createStoreHook(WherebyContext);
-const useDispatch = createDispatchHook(WherebyContext);
-const useSelector = createSelectorHook(WherebyContext);
 function Provider({ children }) {
-    const services = createServices();
-    const store = createStore({ injectServices: services });
-    return (React.createElement(Provider$1, { context: WherebyContext, store: store }, children));
+    const client = React.useMemo(() => new WherebyClient(), []);
+    React.useEffect(() => {
+        return () => {
+            client.destroy();
+        };
+    }, [client]);
+    return React.createElement(WherebyContext.Provider, { value: client }, children);
 }
 
 /******************************************************************************
@@ -50,13 +48,21 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-const useAppDispatch = useDispatch.withTypes();
-const useAppSelector = useSelector.withTypes();
-
 const useAudioElement = ({ stream, muted }) => {
-    const audioEl = useRef(null);
-    const currentSpeakerId = useAppSelector(selectCurrentSpeakerDeviceId);
-    useEffect(() => {
+    var _a;
+    const audioEl = React.useRef(null);
+    const client = (_a = React.useContext(WherebyContext)) === null || _a === void 0 ? void 0 : _a.getLocalMedia();
+    const [currentSpeakerId, setCurrentSpeakerId] = React.useState();
+    const listener = React.useCallback((speakerId) => {
+        setCurrentSpeakerId(speakerId);
+    }, []);
+    React.useEffect(() => {
+        client === null || client === void 0 ? void 0 : client.addListener(CURRENT_SPEAKER_CHANGED, listener);
+        return () => {
+            client === null || client === void 0 ? void 0 : client.removeListener(CURRENT_SPEAKER_CHANGED, listener);
+        };
+    }, [client]);
+    React.useEffect(() => {
         if (!audioEl.current || muted || !stream || !currentSpeakerId) {
             return;
         }
@@ -71,8 +77,9 @@ const useAudioElement = ({ stream, muted }) => {
 };
 
 const VideoView = React.forwardRef((_a, ref) => {
+    var _b;
     var { muted, mirror = false, stream, onVideoResize } = _a, rest = __rest(_a, ["muted", "mirror", "stream", "onVideoResize"]);
-    const dispatch = useAppDispatch();
+    const client = (_b = React.useContext(WherebyContext)) === null || _b === void 0 ? void 0 : _b.getRoomConnection();
     const videoEl = React.useRef(null);
     const audioEl = useAudioElement({ muted, stream });
     React.useImperativeHandle(ref, () => {
@@ -98,11 +105,7 @@ const VideoView = React.forwardRef((_a, ref) => {
             if (videoEl.current && (stream === null || stream === void 0 ? void 0 : stream.id)) {
                 const width = videoEl.current.clientWidth;
                 const height = videoEl.current.clientHeight;
-                dispatch(doRtcReportStreamResolution({
-                    streamId: stream.id,
-                    width,
-                    height,
-                }));
+                client === null || client === void 0 ? void 0 : client.reportStreamResolution(stream.id, width, height);
                 if (onVideoResize) {
                     onVideoResize({
                         width,
@@ -134,35 +137,24 @@ const VideoView = React.forwardRef((_a, ref) => {
 });
 VideoView.displayName = "VideoView";
 
-const selectRoomConnectionState = createSelector(selectChatMessages, selectCloudRecordingRaw, selectBreakoutCurrentGroup, selectBreakoutActive, selectBreakoutGroupedParticipants, selectAllClientViewsInCurrentGroup, selectLocalParticipantRaw, selectLocalMediaStream, selectRemoteParticipants, selectScreenshares, selectRoomConnectionStatus, selectStreamingRaw, selectWaitingParticipants, selectNotificationsEmitter, selectSpotlightedClientViews, (chatMessages, cloudRecording, breakoutCurrentGroup, breakoutActive, breakoutGroupedParticipants, clientViewsInCurrentGroup, localParticipant, localMediaStream, remoteParticipants, screenshares, connectionStatus, streaming, waitingParticipants, notificationsEmitter, spotlightedClientViews) => {
-    const state = {
-        chatMessages,
-        cloudRecording: cloudRecording.isRecording ? { status: "recording" } : undefined,
-        breakout: {
-            isActive: breakoutActive,
-            currentGroup: breakoutCurrentGroup,
-            groupedParticipants: breakoutGroupedParticipants,
-            participantsInCurrentGroup: clientViewsInCurrentGroup,
-        },
-        connectionStatus,
-        events: notificationsEmitter,
-        liveStream: streaming.isStreaming
-            ? {
-                status: "streaming",
-                startedAt: streaming.startedAt,
-            }
-            : undefined,
-        localScreenshareStatus: localParticipant.isScreenSharing ? "active" : undefined,
-        localParticipant: Object.assign(Object.assign({}, localParticipant), { stream: localMediaStream }),
-        remoteParticipants,
-        screenshares,
-        waitingParticipants,
-        spotlightedParticipants: spotlightedClientViews,
-    };
-    return state;
-});
+const browserSdkVersion = "3.13.1";
 
-const browserSdkVersion = "3.12.24";
+const initialState$1 = {
+    chatMessages: [],
+    cloudRecording: undefined,
+    breakout: {
+        isActive: false,
+        currentGroup: null,
+        groupedParticipants: [],
+        participantsInCurrentGroup: [],
+    },
+    localParticipant: undefined,
+    remoteParticipants: [],
+    screenshares: [],
+    connectionStatus: "ready",
+    waitingParticipants: [],
+    spotlightedParticipants: [],
+};
 
 const defaultRoomConnectionOptions = {
     localMediaOptions: {
@@ -171,8 +163,12 @@ const defaultRoomConnectionOptions = {
     },
 };
 function useRoomConnection(roomUrl, roomConnectionOptions = defaultRoomConnectionOptions) {
-    const dispatch = useAppDispatch();
-    const roomConnectionState = useAppSelector(selectRoomConnectionState);
+    var _a;
+    const client = (_a = React.useContext(WherebyContext)) === null || _a === void 0 ? void 0 : _a.getRoomConnection();
+    const [roomConnectionState, setRoomConnectionState] = React.useState(() => initialState$1);
+    if (!client) {
+        throw new Error("WherebyClient is not initialized. Please wrap your component with WherebyProvider.");
+    }
     const roomConfig = React.useMemo(() => {
         const url = new URL(roomUrl);
         const searchParams = new URLSearchParams(url.search);
@@ -187,36 +183,45 @@ function useRoomConnection(roomUrl, roomConnectionOptions = defaultRoomConnectio
         };
     }, [roomUrl, roomConnectionOptions]);
     React.useEffect(() => {
+        const unsubscribe = client.subscribe((state) => {
+            setRoomConnectionState((prev) => (Object.assign(Object.assign({}, prev), state)));
+        });
+        const eventEmitter = client.getNotificationsEventEmitter();
+        setRoomConnectionState((prev) => (Object.assign(Object.assign({}, prev), { events: eventEmitter })));
         return () => {
-            dispatch(doAppStop());
+            unsubscribe();
+            client.leaveRoom();
         };
     }, []);
-    const sendChatMessage = React.useCallback((text) => dispatch(doSendChatMessage({ text })), [dispatch]);
-    const knock = React.useCallback(() => dispatch(doKnockRoom()), [dispatch]);
-    const setDisplayName = React.useCallback((displayName) => dispatch(doSetDisplayName({ displayName })), [dispatch]);
-    const toggleCamera = React.useCallback((enabled) => dispatch(toggleCameraEnabled({ enabled })), [dispatch]);
-    const toggleMicrophone = React.useCallback((enabled) => dispatch(toggleMicrophoneEnabled({ enabled })), [dispatch]);
-    const toggleLowDataMode = React.useCallback((enabled) => dispatch(toggleLowDataModeEnabled({ enabled })), [dispatch]);
-    const toggleRaiseHand = React.useCallback((enabled) => dispatch(doSetLocalStickyReaction({ enabled })), [dispatch]);
-    const askToSpeak = React.useCallback((participantId) => dispatch(doRequestAudioEnable({ clientIds: [participantId], enable: true })), [dispatch]);
-    const askToTurnOnCamera = React.useCallback((participantId) => dispatch(doRequestVideoEnable({ clientIds: [participantId], enable: true })), [dispatch]);
-    const acceptWaitingParticipant = React.useCallback((participantId) => dispatch(doAcceptWaitingParticipant({ participantId })), [dispatch]);
-    const rejectWaitingParticipant = React.useCallback((participantId) => dispatch(doRejectWaitingParticipant({ participantId })), [dispatch]);
-    const startCloudRecording = React.useCallback(() => dispatch(doStartCloudRecording()), [dispatch]);
-    const startScreenshare = React.useCallback(() => dispatch(doStartScreenshare()), [dispatch]);
-    const stopCloudRecording = React.useCallback(() => dispatch(doStopCloudRecording()), [dispatch]);
-    const stopScreenshare = React.useCallback(() => dispatch(doStopScreenshare()), [dispatch]);
-    const joinRoom = React.useCallback(() => dispatch(doAppStart(roomConfig)), [dispatch]);
-    const leaveRoom = React.useCallback(() => dispatch(doAppStop()), [dispatch]);
-    const lockRoom = React.useCallback((locked) => dispatch(doLockRoom({ locked })), [dispatch]);
-    const muteParticipants = React.useCallback((participantIds) => dispatch(doRequestAudioEnable({ clientIds: participantIds, enable: false })), [dispatch]);
-    const turnOffParticipantCameras = React.useCallback((participantIds) => dispatch(doRequestVideoEnable({ clientIds: participantIds, enable: false })), [dispatch]);
-    const spotlightParticipant = React.useCallback((participantId) => dispatch(doSpotlightParticipant({ id: participantId })), [dispatch]);
-    const removeSpotlight = React.useCallback((participantId) => dispatch(doRemoveSpotlight({ id: participantId })), [dispatch]);
-    const kickParticipant = React.useCallback((participantId) => dispatch(doKickParticipant({ clientId: participantId })), [dispatch]);
-    const endMeeting = React.useCallback((stayBehind) => dispatch(doEndMeeting({ stayBehind })), [dispatch]);
-    const joinBreakoutGroup = React.useCallback((group) => dispatch(doBreakoutJoin({ group })), [dispatch]);
-    const joinBreakoutMainRoom = React.useCallback(() => dispatch(doBreakoutJoin({ group: "" })), [dispatch]);
+    const joinRoom = React.useCallback(() => {
+        client.initialize(roomConfig);
+        client.joinRoom();
+    }, [client]);
+    const sendChatMessage = React.useCallback((text) => client.sendChatMessage(text), [client]);
+    const knock = React.useCallback(() => client.knock(), [client]);
+    const setDisplayName = React.useCallback((displayName) => client.setDisplayName(displayName), [client]);
+    const toggleCamera = React.useCallback((enabled) => client.toggleCamera(enabled), [client]);
+    const toggleMicrophone = React.useCallback((enabled) => client.toggleMicrophone(enabled), [client]);
+    const toggleLowDataMode = React.useCallback((enabled) => client.toggleLowDataMode(enabled), [client]);
+    const toggleRaiseHand = React.useCallback((enabled) => client.toggleRaiseHand(enabled), [client]);
+    const askToSpeak = React.useCallback((participantId) => client.askToSpeak(participantId), [client]);
+    const askToTurnOnCamera = React.useCallback((participantId) => client.askToTurnOnCamera(participantId), [client]);
+    const acceptWaitingParticipant = React.useCallback((participantId) => client.acceptWaitingParticipant(participantId), [client]);
+    const rejectWaitingParticipant = React.useCallback((participantId) => client.rejectWaitingParticipant(participantId), [client]);
+    const startCloudRecording = React.useCallback(() => client.startCloudRecording(), [client]);
+    const startScreenshare = React.useCallback(() => client.startScreenshare(), [client]);
+    const stopCloudRecording = React.useCallback(() => client.stopCloudRecording(), [client]);
+    const stopScreenshare = React.useCallback(() => client.stopScreenshare(), [client]);
+    const leaveRoom = React.useCallback(() => client.leaveRoom(), [client]);
+    const lockRoom = React.useCallback((locked) => client.lockRoom(locked), [client]);
+    const muteParticipants = React.useCallback((participantIds) => client.muteParticipants(participantIds), [client]);
+    const turnOffParticipantCameras = React.useCallback((participantIds) => client.turnOffParticipantCameras(participantIds), [client]);
+    const spotlightParticipant = React.useCallback((participantId) => client.spotlightParticipant(participantId), [client]);
+    const removeSpotlight = React.useCallback((participantId) => client.removeSpotlight(participantId), [client]);
+    const kickParticipant = React.useCallback((participantId) => client.kickParticipant(participantId), [client]);
+    const endMeeting = React.useCallback((stayBehind) => client.endMeeting(stayBehind), [client]);
+    const joinBreakoutGroup = React.useCallback((group) => client.joinBreakoutGroup(group), [client]);
+    const joinBreakoutMainRoom = React.useCallback(() => client.joinBreakoutMainRoom(), [client]);
     const { events } = roomConnectionState, state = __rest(roomConnectionState, ["events"]);
     return {
         state,
@@ -252,40 +257,41 @@ function useRoomConnection(roomUrl, roomConnectionOptions = defaultRoomConnectio
     };
 }
 
-const selectLocalMediaState = createSelector(selectCameraDeviceError, selectCameraDevices, selectCurrentCameraDeviceId, selectCurrentMicrophoneDeviceId, selectCurrentSpeakerDeviceId, selectIsSettingCameraDevice, selectIsSettingMicrophoneDevice, selectIsLocalMediaStarting, selectLocalMediaStream, selectMicrophoneDeviceError, selectMicrophoneDevices, selectSpeakerDevices, selectLocalMediaStartError, (cameraDeviceError, cameraDevices, currentCameraDeviceId, currentMicrophoneDeviceId, currentSpeakerDeviceId, isSettingCameraDevice, isSettingMicrophoneDevice, isStarting, localStream, microphoneDeviceError, microphoneDevices, speakerDevices, startError) => {
-    const state = {
-        cameraDeviceError,
-        cameraDevices,
-        currentCameraDeviceId,
-        currentMicrophoneDeviceId,
-        currentSpeakerDeviceId,
-        isSettingCameraDevice,
-        isSettingMicrophoneDevice,
-        isStarting,
-        localStream,
-        microphoneDeviceError,
-        microphoneDevices,
-        speakerDevices,
-        startError,
-    };
-    return state;
-});
+const initialState = {
+    cameraDeviceError: null,
+    isStarting: false,
+    isSettingCameraDevice: false,
+    isSettingMicrophoneDevice: false,
+    microphoneDeviceError: null,
+    startError: null,
+    cameraDevices: [],
+    microphoneDevices: [],
+    speakerDevices: [],
+};
 
 function useLocalMedia(optionsOrStream = { audio: true, video: true }) {
-    const dispatch = useAppDispatch();
-    const localMediaState = useAppSelector(selectLocalMediaState);
+    var _a;
+    const client = (_a = React.useContext(WherebyContext)) === null || _a === void 0 ? void 0 : _a.getLocalMedia();
+    const [localMediaState, setLocalMediaState] = React.useState(() => initialState);
+    if (!client) {
+        throw new Error("WherebyClient is not initialized. Please wrap your component with WherebyProvider.");
+    }
     React.useEffect(() => {
-        dispatch(doStartLocalMedia(optionsOrStream));
+        client.startMedia(optionsOrStream);
+        const unsubscribe = client.subscribe((state) => {
+            setLocalMediaState((prevState) => (Object.assign(Object.assign({}, prevState), state)));
+        });
         return () => {
-            dispatch(doStopLocalMedia());
+            unsubscribe();
+            client.stopMedia();
         };
     }, []);
-    const setCameraDevice = React.useCallback((deviceId) => dispatch(setCurrentCameraDeviceId({ deviceId })), [dispatch]);
-    const setMicrophoneDevice = React.useCallback((deviceId) => dispatch(setCurrentMicrophoneDeviceId({ deviceId })), [dispatch]);
-    const setSpeakerDevice = React.useCallback((deviceId) => dispatch(setCurrentSpeakerDeviceId({ deviceId })), [dispatch]);
-    const toggleCamera = React.useCallback((enabled) => dispatch(toggleCameraEnabled({ enabled })), [dispatch]);
-    const toggleMicrophone = React.useCallback((enabled) => dispatch(toggleMicrophoneEnabled({ enabled })), [dispatch]);
-    const toggleLowDataMode = React.useCallback((enabled) => dispatch(toggleLowDataModeEnabled({ enabled })), [dispatch]);
+    const setCameraDevice = React.useCallback((deviceId) => client.setCameraDevice(deviceId), [client]);
+    const setMicrophoneDevice = React.useCallback((deviceId) => client.setMicrophoneDevice(deviceId), [client]);
+    const setSpeakerDevice = React.useCallback((deviceId) => client.setSpeakerDevice(deviceId), [client]);
+    const toggleCamera = React.useCallback((enabled) => client.toggleCamera(enabled), [client]);
+    const toggleMicrophone = React.useCallback((enabled) => client.toggleMicrophone(enabled), [client]);
+    const toggleLowDataMode = React.useCallback((enabled) => client.toggleLowDataMode(enabled), [client]);
     return {
         state: localMediaState,
         actions: {
@@ -1724,9 +1730,38 @@ function calculateSubgridViews({ clientViews, activeVideosSubgridTrigger, should
     return noVideoViews;
 }
 function useGridParticipants({ activeVideosSubgridTrigger = ACTIVE_VIDEO_SUBGRID_TRIGGER, stageParticipantLimit = STAGE_PARTICIPANT_LIMIT, forceSubgrid = true, enableSubgrid = true, maximizedParticipant, floatingParticipant, isConstrained = false, } = {}) {
-    const allClientViews = useAppSelector(selectAllClientViews);
-    const spotlightedParticipants = useAppSelector(selectSpotlightedClientViews);
-    const numParticipants = useAppSelector(selectNumParticipants);
+    var _a;
+    const [state, setState] = React.useState({
+        allClientViews: [],
+        spotlightedParticipants: [],
+        numParticipants: 0,
+    });
+    const client = (_a = React.useContext(WherebyContext)) === null || _a === void 0 ? void 0 : _a.getGrid();
+    if (!client) {
+        throw new Error("useGridParticipants must be used within a WherebyProvider");
+    }
+    const handleClientViewChanged = React.useCallback((clientViews) => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { allClientViews: clientViews })));
+    }, [setState]);
+    const handleSpotlightedParticipantsChanged = React.useCallback((spotlighted) => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { spotlightedParticipants: spotlighted })));
+    }, [setState]);
+    const handleNumParticipantsChanged = React.useCallback((num) => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { numParticipants: num })));
+    }, [setState]);
+    React.useEffect(() => {
+        const unsubscribeClientViews = client.subscribeClientViews(handleClientViewChanged);
+        const unsubscribeSpotlighted = client.subscribeSpotlightedParticipants(handleSpotlightedParticipantsChanged);
+        const unsubscribeNumParticipants = client.subscribeNumberOfClientViews(handleNumParticipantsChanged);
+        return () => {
+            unsubscribeClientViews();
+            unsubscribeSpotlighted();
+            unsubscribeNumParticipants();
+        };
+    }, [client]);
+    const allClientViews = React.useMemo(() => state.allClientViews, [state.allClientViews]);
+    const spotlightedParticipants = React.useMemo(() => state.spotlightedParticipants, [state.spotlightedParticipants]);
+    const numParticipants = React.useMemo(() => state.numParticipants, [state.numParticipants]);
     const floatingClientView = React.useMemo(() => {
         return floatingParticipant;
     }, [floatingParticipant]);
@@ -1769,6 +1804,7 @@ function useGridParticipants({ activeVideosSubgridTrigger = ACTIVE_VIDEO_SUBGRID
         clientViewsInGrid,
         clientViewsInPresentationGrid,
         clientViewsInSubgrid,
+        spotlightedParticipants,
     };
 }
 
@@ -1985,10 +2021,11 @@ const ParticipantMenuTrigger = React.forwardRef((_a, ref) => {
 });
 ParticipantMenuTrigger.displayName = PopoverTrigger.displayName;
 const ParticipantMenuItem = React.forwardRef((_a, ref) => {
+    var _b;
     var { children, style, participantAction } = _a, props = __rest(_a, ["children", "style", "participantAction"]);
     const { participant, setOpen, maximizedParticipant, setMaximizedParticipant, setFloatingParticipant, floatingParticipant, } = useParticipantMenu();
-    const dispatch = useAppDispatch();
-    const spotlightedParticipants = useAppSelector(selectSpotlightedClientViews);
+    const client = (_b = React.useContext(WherebyContext)) === null || _b === void 0 ? void 0 : _b.getGrid();
+    const { spotlightedParticipants } = useGridParticipants();
     const isSpotlighted = spotlightedParticipants.find((p) => p.id === participant.id);
     const isMaximized = (maximizedParticipant === null || maximizedParticipant === void 0 ? void 0 : maximizedParticipant.id) === participant.id;
     const isFloating = (floatingParticipant === null || floatingParticipant === void 0 ? void 0 : floatingParticipant.id) === participant.id;
@@ -2008,10 +2045,10 @@ const ParticipantMenuItem = React.forwardRef((_a, ref) => {
         case "spotlight":
             onClick = () => {
                 if (isSpotlighted) {
-                    dispatch(doRemoveSpotlight({ id: participant.id }));
+                    client === null || client === void 0 ? void 0 : client.removeSpotlight(participant.id);
                 }
                 else {
-                    dispatch(doSpotlightParticipant({ id: participant.id }));
+                    client === null || client === void 0 ? void 0 : client.spotlightParticipant(participant.id);
                 }
                 setOpen(false);
             };
@@ -2061,7 +2098,7 @@ function PopInIcon(props) {
 }
 
 function DefaultParticipantMenu({ participant }) {
-    const spotlightedParticipants = useAppSelector(selectSpotlightedClientViews);
+    const { spotlightedParticipants } = useGridParticipants();
     const isSpotlighted = spotlightedParticipants.find((p) => p.id === participant.id);
     const { isHovered, maximizedParticipant, floatingParticipant } = useGridCell();
     const isMaximized = (maximizedParticipant === null || maximizedParticipant === void 0 ? void 0 : maximizedParticipant.id) === participant.id;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whereby.com/browser-sdk",
-  "version": "3.12.24",
+  "version": "3.13.1",
   "description": "Modules for integration Whereby video in web apps",
   "author": "Whereby AS",
   "license": "MIT",
@@ -68,17 +68,15 @@
     "@whereby.com/eslint-config": "0.1.0",
     "@whereby.com/jest-config": "0.1.0",
     "@whereby.com/prettier-config": "0.1.0",
-    "@whereby.com/tsconfig": "0.1.0",
-    "@whereby.com/rollup-config": "0.1.0"
+    "@whereby.com/rollup-config": "0.1.0",
+    "@whereby.com/tsconfig": "0.1.0"
   },
   "dependencies": {
     "@radix-ui/react-popover": "^1.0.7",
-    "@reduxjs/toolkit": "^2.2.3",
-    "@whereby.com/media": "1.32.1",
-    "@whereby.com/core": "0.36.1",
+    "@whereby.com/media": "1.33.0",
+    "@whereby.com/core": "1.0.1",
     "clsx": "^2.1.1",
     "heresy": "^1.0.4",
-    "react-redux": "^9.1.1",
     "runes": "^0.4.3"
   },
   "peerDependencies": {