@stream-io/video-client 0.0.13 → 0.0.15

package/dist/index.browser.es.js

@@ -4246,7 +4246,7 @@ var DebounceType;
     DebounceType[DebounceType["SLOW"] = 1200] = "SLOW";
 })(DebounceType || (DebounceType = {}));
 const isStreamVideoLocalParticipant = (p) => {
-    return !!p.isLoggedInUser;
+    return !!p.isLocalParticipant;
 };
 
 /******************************************************************************
@@ -5273,13 +5273,41 @@ const toggleDtx = (sdp, enable) => {
     return sdp;
 };
 
+let logger;
+const logToConsole = (logLevel, message, extraData, tags) => {
+    let logMethod;
+    if (logLevel === 'error') {
+        logMethod = console.error;
+    }
+    else if (logLevel === 'warn') {
+        logMethod = console.warn;
+    }
+    else {
+        logMethod = console.log;
+    }
+    logMethod(logLevel, `${tags === null || tags === void 0 ? void 0 : tags.join(':')} - ${message}`, extraData ? extraData : '');
+};
+const setLogger = (l) => {
+    logger = l;
+};
+const getLogger = (withTags) => {
+    const loggerMethod = logger || (() => { });
+    const result = (logLevel, messeage, extraData, tags) => {
+        loggerMethod(logLevel, messeage, extraData, [
+            ...(tags || []),
+            ...(withTags || []),
+        ]);
+    };
+    return result;
+};
+
 const getPreferredCodecs = (kind, preferredCodec, codecToRemove) => {
+    const logger = getLogger(['codecs']);
     if (!('getCapabilities' in RTCRtpSender)) {
-        console.warn('RTCRtpSender.getCapabilities is not supported');
+        logger === null || logger === void 0 ? void 0 : logger('warn', 'RTCRtpSender.getCapabilities is not supported');
         return;
     }
     const cap = RTCRtpSender.getCapabilities(kind);
-    console.log('s4e');
     if (!cap)
         return;
     const matched = [];
@@ -5287,7 +5315,7 @@ const getPreferredCodecs = (kind, preferredCodec, codecToRemove) => {
     const unmatched = [];
     cap.codecs.forEach((c) => {
         const codec = c.mimeType.toLowerCase();
-        console.log(c);
+        logger === null || logger === void 0 ? void 0 : logger('debug', `Found supported codec: ${codec}`);
         const shouldRemoveCodec = codecToRemove && codec === `${kind}/${codecToRemove}`;
         if (shouldRemoveCodec)
             return;
@@ -5307,10 +5335,11 @@ const getPreferredCodecs = (kind, preferredCodec, codecToRemove) => {
             }
             return;
         }
-        console.log('matched', matched);
         matched.push(c);
     });
-    return [...matched, ...partialMatched, ...unmatched];
+    const result = [...matched, ...partialMatched, ...unmatched];
+    logger === null || logger === void 0 ? void 0 : logger('info', `Preffered codecs: `, result);
+    return result;
 };
 const getGenericSdp = (direction, isRedEnabled, preferredVideoCodec) => __awaiter(void 0, void 0, void 0, function* () {
     var _a;
@@ -5376,17 +5405,19 @@ class Dispatcher {
     constructor() {
         this.subscribers = {};
         this.dispatch = (message) => {
+            var _a, _b;
             const eventKind = message.eventPayload.oneofKind;
             if (eventKind) {
-                // @ts-ignore
-                console.log(`Dispatching`, eventKind, message.eventPayload[eventKind]);
+                (_a = this.logger) === null || _a === void 0 ? void 0 : _a.call(this, 'info', `Dispatching ${eventKind}`);
+                (_b = this.logger) === null || _b === void 0 ? void 0 : _b.call(this, 'debug', `Event payload`, message.eventPayload[eventKind]);
                 const listeners = this.subscribers[eventKind];
                 listeners === null || listeners === void 0 ? void 0 : listeners.forEach((fn) => {
+                    var _a;
                     try {
                         fn(message);
                     }
                     catch (e) {
-                        console.warn(`Listener failed with error`, e);
+                        (_a = this.logger) === null || _a === void 0 ? void 0 : _a.call(this, 'warn', 'Listener failed with error', e);
                     }
                 });
             }
@@ -5410,6 +5441,7 @@ class Dispatcher {
                 this.subscribers = {};
             }
         };
+        this.logger = getLogger(['sfu-client']);
     }
 }
 
@@ -5422,6 +5454,7 @@ class IceTrickleBuffer {
         this.subscriberCandidates = new ReplaySubject();
         this.publisherCandidates = new ReplaySubject();
         this.push = (iceTrickle) => {
+            var _a;
             if (iceTrickle.peerType === PeerType.SUBSCRIBER) {
                 this.subscriberCandidates.next(iceTrickle);
             }
@@ -5429,9 +5462,10 @@ class IceTrickleBuffer {
                 this.publisherCandidates.next(iceTrickle);
             }
             else {
-                console.warn(`ICETrickle, Unknown peer type`, iceTrickle);
+                (_a = this.logger) === null || _a === void 0 ? void 0 : _a.call(this, 'warn', `ICETrickle, Unknown peer type`, iceTrickle);
             }
         };
+        this.logger = getLogger(['sfu-client']);
     }
 }
 
@@ -5622,6 +5656,7 @@ class Publisher {
          * @param opts
          */
         this.publishStream = (mediaStream, track, trackType, opts = {}) => __awaiter(this, void 0, void 0, function* () {
+            var _a;
             let transceiver = this.publisher
                 .getTransceivers()
                 .find((t) => {
@@ -5635,7 +5670,8 @@ class Publisher {
              * Once the track has ended, it will notify the SFU and update the state.
              */
             const handleTrackEnded = () => __awaiter(this, void 0, void 0, function* () {
-                console.log(`Track ${TrackType[trackType]} has ended, notifying the SFU`);
+                var _b;
+                (_b = this.logger) === null || _b === void 0 ? void 0 : _b.call(this, 'info', `Track ${TrackType[trackType]} has ended, notifying the SFU`);
                 yield this.notifyTrackMuteStateChanged(mediaStream, track, trackType, true);
                 // clean-up, this event listener needs to run only once.
                 track.removeEventListener('ended', handleTrackEnded);
@@ -5660,7 +5696,7 @@ class Publisher {
                 });
                 this.transceiverRegistry[trackType] = transceiver;
                 if ('setCodecPreferences' in transceiver && codecPreferences) {
-                    console.log(`Setting ${TrackType[trackType]} codec preferences`, codecPreferences);
+                    (_a = this.logger) === null || _a === void 0 ? void 0 : _a.call(this, 'info', `Setting ${TrackType[trackType]} codec preferences`, codecPreferences);
                     transceiver.setCodecPreferences(codecPreferences);
                 }
             }
@@ -5744,9 +5780,9 @@ class Publisher {
             this.publisher.close();
         };
         this.updateVideoPublishQuality = (enabledRids) => __awaiter(this, void 0, void 0, function* () {
-            var _a;
-            console.log('Update publish quality, requested rids by SFU:', enabledRids);
-            const videoSender = (_a = this.transceiverRegistry[TrackType.VIDEO]) === null || _a === void 0 ? void 0 : _a.sender;
+            var _c, _d, _e, _f;
+            (_c = this.logger) === null || _c === void 0 ? void 0 : _c.call(this, 'info', 'Update publish quality, requested rids by SFU:', enabledRids);
+            const videoSender = (_d = this.transceiverRegistry[TrackType.VIDEO]) === null || _d === void 0 ? void 0 : _d.sender;
             if (!videoSender)
                 return;
             const params = videoSender.getParameters();
@@ -5761,10 +5797,10 @@ class Publisher {
             });
             if (changed) {
                 if (params.encodings.length === 0) {
-                    console.warn('No suitable video encoding quality found');
+                    (_e = this.logger) === null || _e === void 0 ? void 0 : _e.call(this, 'warn', 'No suitable video encoding quality found');
                 }
                 yield videoSender.setParameters(params);
-                console.log(`Update publish quality, enabled rids: ${params.encodings
+                (_f = this.logger) === null || _f === void 0 ? void 0 : _f.call(this, 'info', `Update publish quality, enabled rids: ${params.encodings
                     .filter((e) => e.active)
                     .map((e) => e.rid)
                     .join(', ')}`);
@@ -5781,9 +5817,10 @@ class Publisher {
             }
         };
         this.onIceCandidate = (e) => __awaiter(this, void 0, void 0, function* () {
+            var _g;
             const { candidate } = e;
             if (!candidate) {
-                console.log('null ice candidate');
+                (_g = this.logger) === null || _g === void 0 ? void 0 : _g.call(this, 'warn', 'null ice candidate');
                 return;
             }
             yield this.sfuClient.iceTrickle({
@@ -5792,7 +5829,8 @@ class Publisher {
             });
         });
         this.onNegotiationNeeded = () => __awaiter(this, void 0, void 0, function* () {
-            console.log('AAA onNegotiationNeeded');
+            var _h, _j;
+            (_h = this.logger) === null || _h === void 0 ? void 0 : _h.call(this, 'info', 'AAA onNegotiationNeeded');
             const offer = yield this.publisher.createOffer();
             let sdp = offer.sdp;
             if (sdp) {
@@ -5855,28 +5893,38 @@ class Publisher {
                 });
             }
             catch (e) {
-                console.error(`Publisher: setRemoteDescription error`, response.sdp, e);
+                (_j = this.logger) === null || _j === void 0 ? void 0 : _j.call(this, 'error', `Publisher: setRemoteDescription error`, {
+                    sdp: response.sdp,
+                    error: e,
+                });
             }
             this.sfuClient.iceTrickleBuffer.publisherCandidates.subscribe((candidate) => __awaiter(this, void 0, void 0, function* () {
+                var _k;
                 try {
                     const iceCandidate = JSON.parse(candidate.iceCandidate);
                     yield this.publisher.addIceCandidate(iceCandidate);
                 }
                 catch (e) {
-                    console.error(`Publisher: ICE candidate error`, e, candidate);
+                    (_k = this.logger) === null || _k === void 0 ? void 0 : _k.call(this, 'error', `Publisher: ICE candidate error`, {
+                        error: e,
+                        candidate,
+                    });
                 }
             }));
         });
         this.onIceCandidateError = (e) => {
+            var _a;
             const errorMessage = e instanceof RTCPeerConnectionIceErrorEvent &&
                 `${e.errorCode}: ${e.errorText}`;
-            console.error(`Publisher: ICE Candidate error`, errorMessage);
+            (_a = this.logger) === null || _a === void 0 ? void 0 : _a.call(this, 'error', `Publisher: ICE Candidate error`, errorMessage);
         };
         this.onIceConnectionStateChange = () => {
-            console.log(`Publisher: ICE Connection state changed`, this.publisher.iceConnectionState);
+            var _a;
+            (_a = this.logger) === null || _a === void 0 ? void 0 : _a.call(this, 'error', `Publisher: ICE Connection state changed`, this.publisher.iceConnectionState);
         };
         this.onIceGatheringStateChange = () => {
-            console.log(`Publisher: ICE Gathering State`, this.publisher.iceGatheringState);
+            var _a;
+            (_a = this.logger) === null || _a === void 0 ? void 0 : _a.call(this, 'error', `Publisher: ICE Gathering State`, this.publisher.iceGatheringState);
         };
         this.ridToVideoQuality = (rid) => {
             return rid === 'q'
@@ -5909,12 +5957,13 @@ class Publisher {
 }
 
 const createSubscriber = ({ sfuClient, dispatcher, connectionConfig, onTrack, }) => {
+    const logger = getLogger(['sfu-client']);
     const subscriber = new RTCPeerConnection(connectionConfig);
     attachDebugEventListeners(subscriber);
     subscriber.addEventListener('icecandidate', (e) => __awaiter(void 0, void 0, void 0, function* () {
         const { candidate } = e;
         if (!candidate) {
-            console.log('null ice candidate');
+            logger === null || logger === void 0 ? void 0 : logger('warn', 'null ice candidate');
             return;
         }
         yield sfuClient.iceTrickle({
@@ -5930,7 +5979,7 @@ const createSubscriber = ({ sfuClient, dispatcher, connectionConfig, onTrack, })
         if (message.eventPayload.oneofKind !== 'subscriberOffer')
             return;
         const { subscriberOffer } = message.eventPayload;
-        console.log(`Received subscriberOffer`, subscriberOffer);
+        logger === null || logger === void 0 ? void 0 : logger('info', 'Received subscriberOffer', subscriberOffer);
         yield subscriber.setRemoteDescription({
             type: 'offer',
             sdp: subscriberOffer.sdp,
@@ -5941,7 +5990,10 @@ const createSubscriber = ({ sfuClient, dispatcher, connectionConfig, onTrack, })
                 yield subscriber.addIceCandidate(iceCandidate);
             }
             catch (e) {
-                console.error(`Subscriber: ICE candidate error`, e, candidate);
+                logger === null || logger === void 0 ? void 0 : logger('error', `Subscriber: ICE candidate error`, {
+                    error: e,
+                    candidate,
+                });
             }
         }));
         // apply ice candidates
@@ -5964,31 +6016,33 @@ const createSubscriber = ({ sfuClient, dispatcher, connectionConfig, onTrack, })
     return subscriber;
 };
 const attachDebugEventListeners = (subscriber) => {
+    const logger = getLogger(['sfu-client']);
     subscriber.addEventListener('icecandidateerror', (e) => {
         const errorMessage = e instanceof RTCPeerConnectionIceErrorEvent &&
             `${e.errorCode}: ${e.errorText}`;
-        console.error(`Subscriber: ICE Candidate error`, errorMessage);
+        logger === null || logger === void 0 ? void 0 : logger('error', `Subscriber: ICE Candidate error: ${errorMessage}`);
     });
     subscriber.addEventListener('iceconnectionstatechange', () => {
-        console.log(`Subscriber: ICE Connection state changed`, subscriber.iceConnectionState);
+        logger === null || logger === void 0 ? void 0 : logger('info', `Subscriber: ICE Connection state changed: ${subscriber.iceConnectionState}`);
     });
     subscriber.addEventListener('icegatheringstatechange', () => {
-        console.log(`Subscriber: ICE Gathering State`, subscriber.iceGatheringState);
+        logger === null || logger === void 0 ? void 0 : logger('info', `Subscriber: ICE Gathering State: ${subscriber.iceGatheringState}`);
     });
 };
 
 const createWebSocketSignalChannel = (opts) => {
+    const logger = getLogger(['sfu-client']);
     const { endpoint, onMessage } = opts;
     const ws = new WebSocket(endpoint);
     ws.binaryType = 'arraybuffer'; // do we need this?
     ws.addEventListener('error', (e) => {
-        console.log('Signaling WS channel error', e);
+        logger === null || logger === void 0 ? void 0 : logger('error', 'Signaling WS channel error', e);
     });
     ws.addEventListener('close', (e) => {
-        console.log('Signaling WS channel is closed', e);
+        logger === null || logger === void 0 ? void 0 : logger('info', 'Signaling WS channel is closed', e);
     });
     ws.addEventListener('open', (e) => {
-        console.log('Signaling WS channel is open', e);
+        logger === null || logger === void 0 ? void 0 : logger('info', 'Signaling WS channel is open', e);
     });
     if (onMessage) {
         ws.addEventListener('message', (e) => {
@@ -5999,7 +6053,7 @@ const createWebSocketSignalChannel = (opts) => {
                 onMessage(message);
             }
             catch (err) {
-                console.error('Failed to decode a message. Check whether the Proto models match.', e.data, e, err);
+                logger === null || logger === void 0 ? void 0 : logger('error', 'Failed to decode a message. Check whether the Proto models match.', { event: e, error: err });
             }
         });
     }
@@ -6100,14 +6154,14 @@ function convertErrorToJson(err) {
  * isOnline safely return the navigator.online value for browser env
  * if navigator is not in global object, it always return true
  */
-function isOnline() {
+function isOnline(logger) {
     const nav = typeof navigator !== 'undefined'
         ? navigator
         : typeof window !== 'undefined' && window.navigator
             ? window.navigator
             : undefined;
     if (!nav) {
-        console.warn('isOnline failed to access window.navigator and assume browser is online');
+        logger('warn', 'isOnline failed to access window.navigator and assume browser is online');
         return true;
     }
     // RN navigator has undefined for onLine
@@ -6163,16 +6217,16 @@ class StreamSfuClient {
             return retryable(() => this.rpc.updateSubscriptions({
                 sessionId: this.sessionId,
                 tracks: subscriptions,
-            }));
+            }), this.logger);
         });
         this.setPublisher = (data) => __awaiter(this, void 0, void 0, function* () {
-            return retryable(() => this.rpc.setPublisher(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })));
+            return retryable(() => this.rpc.setPublisher(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })), this.logger);
         });
         this.sendAnswer = (data) => __awaiter(this, void 0, void 0, function* () {
-            return retryable(() => this.rpc.sendAnswer(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })));
+            return retryable(() => this.rpc.sendAnswer(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })), this.logger);
         });
         this.iceTrickle = (data) => __awaiter(this, void 0, void 0, function* () {
-            return retryable(() => this.rpc.iceTrickle(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })));
+            return retryable(() => this.rpc.iceTrickle(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })), this.logger);
         });
         this.updateMuteState = (trackType, muted) => __awaiter(this, void 0, void 0, function* () {
             return this.updateMuteStates({
@@ -6185,7 +6239,7 @@ class StreamSfuClient {
             });
         });
         this.updateMuteStates = (data) => __awaiter(this, void 0, void 0, function* () {
-            return retryable(() => this.rpc.updateMuteStates(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })));
+            return retryable(() => this.rpc.updateMuteStates(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })), this.logger);
         });
         this.join = (data) => __awaiter(this, void 0, void 0, function* () {
             const joinRequest = JoinRequest.create(Object.assign(Object.assign({}, data), { sessionId: this.sessionId, token: this.token }));
@@ -6206,7 +6260,7 @@ class StreamSfuClient {
                 clearInterval(this.keepAliveInterval);
             }
             this.keepAliveInterval = setInterval(() => {
-                console.log('Sending healthCheckRequest to SFU');
+                this.logger('info', 'Sending healthCheckRequest to SFU');
                 const message = SfuRequest.create({
                     requestPayload: {
                         oneofKind: 'healthCheckRequest',
@@ -6224,7 +6278,7 @@ class StreamSfuClient {
                 if (this.lastMessageTimestamp) {
                     const timeSinceLastMessage = new Date().getTime() - this.lastMessageTimestamp.getTime();
                     if (timeSinceLastMessage > this.unhealthyTimeoutInMs) {
-                        console.log('SFU connection unhealthy, closing');
+                        this.logger('error', 'SFU connection unhealthy, closing');
                         this.close(4001, `SFU connection unhealthy. Didn't receive any healthcheck messages for ${this.unhealthyTimeoutInMs}ms`);
                     }
                 }
@@ -6232,12 +6286,22 @@ class StreamSfuClient {
         };
         this.sessionId = sessionId || generateUUIDv4();
         this.token = token;
+        this.logger = getLogger(['sfu-client']);
+        const logger = this.logger;
+        const logInterceptor = {
+            interceptUnary(next, method, input, options) {
+                logger('info', `Calling SFU RPC method ${method.name}`);
+                logger('debug', `Method call payload`, { input, options });
+                return next(method, input, options);
+            },
+        };
         this.rpc = createSignalClient({
             baseUrl: url,
             interceptors: [
                 withHeaders({
                     Authorization: `Bearer ${token}`,
                 }),
+                logInterceptor,
             ],
         });
         // Special handling for the ICETrickle kind of events.
@@ -6279,7 +6343,7 @@ const MAX_RETRIES = 5;
  * @param <I> the type of the request object.
  * @param <O> the type of the response object.
  */
-const retryable = (rpc) => __awaiter(void 0, void 0, void 0, function* () {
+const retryable = (rpc, logger) => __awaiter(void 0, void 0, void 0, function* () {
     var _a;
     let retryAttempt = 0;
     let rpcCallResult;
@@ -6289,9 +6353,11 @@ const retryable = (rpc) => __awaiter(void 0, void 0, void 0, function* () {
             yield sleep(retryInterval(retryAttempt));
         }
         rpcCallResult = yield rpc();
+        logger('info', `SFU RPC response received for ${rpcCallResult.method.name}`);
+        logger('debug', `Response payload`, rpcCallResult);
         // if the RPC call failed, log the error and retry
         if (rpcCallResult.response.error) {
-            console.error('SFU Error:', rpcCallResult.response.error);
+            logger('error', 'SFU RPC Error:', rpcCallResult.response.error);
         }
         retryAttempt++;
     } while (((_a = rpcCallResult.response.error) === null || _a === void 0 ? void 0 : _a.shouldRetry) &&
@@ -6974,7 +7040,7 @@ class CallState {
         this.updateParticipant = (sessionId, patch) => {
             const participant = this.findParticipantBySessionId(sessionId);
             if (!participant) {
-                console.warn(`Participant with sessionId ${sessionId} not found`);
+                this.logger('warn', `Participant with sessionId ${sessionId} not found`);
                 return;
             }
             const thePatch = typeof patch === 'function' ? patch(participant) : patch;
@@ -7023,9 +7089,10 @@ class CallState {
                 return p;
             }));
         };
+        this.logger = getLogger(['call-state']);
         this.participants$ = this.participantsSubject.pipe(map$1((ps) => ps.sort(this.sortParticipantsBy)));
         this.localParticipant$ = this.participants$.pipe(map$1((participants) => participants.find(isStreamVideoLocalParticipant)));
-        this.remoteParticipants$ = this.participants$.pipe(map$1((participants) => participants.filter((p) => !p.isLoggedInUser)));
+        this.remoteParticipants$ = this.participants$.pipe(map$1((participants) => participants.filter((p) => !p.isLocalParticipant)));
         this.pinnedParticipants$ = this.participants$.pipe(map$1((participants) => participants.filter((p) => p.pinnedAt)));
         this.dominantSpeaker$ = this.participants$.pipe(map$1((participants) => participants.find((p) => p.isDominantSpeaker)));
         this.hasOngoingScreenShare$ = this.participants$.pipe(map$1((participants) => {
@@ -7179,13 +7246,13 @@ const watchCallRejected = (call) => {
             const { call: eventCall } = event;
             const { session: callSession } = eventCall;
             if (!callSession) {
-                console.log('No call session provided. Ignoring call.rejected event.');
+                call.logger('warn', 'No call session provided. Ignoring call.rejected event.', event);
                 return;
             }
             const rejectedBy = callSession.rejected_by;
             const { members, callingState } = call.state;
             if (callingState !== CallingState.RINGING) {
-                console.log('Call is not in ringing mode (it is either accepted or rejected already). Ignoring call.rejected event.');
+                call.logger('warn', 'Call is not in ringing mode (it is either accepted or rejected already). Ignoring call.rejected event.', event);
                 return;
             }
             if (call.isCreatedByMe) {
@@ -7193,13 +7260,13 @@ const watchCallRejected = (call) => {
                     .filter((m) => m.user_id !== call.currentUserId)
                     .every((m) => rejectedBy[m.user_id]);
                 if (everyoneElseRejected) {
-                    console.log('everyone rejected, leaving the call');
+                    call.logger('info', 'everyone rejected, leaving the call');
                     yield call.leave();
                 }
             }
             else {
                 if (rejectedBy[eventCall.created_by.id]) {
-                    console.log('call creator rejected, leaving call');
+                    call.logger('info', 'call creator rejected, leaving call');
                     yield call.leave();
                 }
             }
@@ -7607,7 +7674,7 @@ const watchCallSessionParticipantJoined = (state) => {
         const { user } = event;
         state.setMetadata((metadata) => {
             if (!metadata || !metadata.session) {
-                console.warn(`Received call.session_participant_joined event but the metadata structure is invalid.`);
+                state.logger('warn', `Received call.session_participant_joined event but the metadata structure is invalid.`, event);
                 return metadata;
             }
             const { session } = metadata;
@@ -7635,7 +7702,7 @@ const watchCallSessionParticipantLeft = (state) => {
         const { user } = event;
         state.setMetadata((metadata) => {
             if (!metadata || !metadata.session) {
-                console.warn(`Received call.session_participant_left event but the metadata structure is invalid.`);
+                state.logger('warn', `Received call.session_participant_left event but the metadata structure is invalid.`, event);
                 return metadata;
             }
             const { session } = metadata;
@@ -7780,16 +7847,18 @@ const getLocationHint = () => __awaiter(void 0, void 0, void 0, function* () {
     const hintURL = `https://hint.stream-io-video.com/`;
     const abortController = new AbortController();
     const timeoutId = setTimeout(() => abortController.abort(), 1000);
+    const logger = getLogger(['call']);
     try {
         const response = yield fetch(hintURL, {
             method: 'HEAD',
             signal: abortController.signal,
         });
         const awsPop = response.headers.get('x-amz-cf-pop') || 'ERR';
+        logger === null || logger === void 0 ? void 0 : logger('info', `Location header: ${awsPop}`);
         return awsPop.substring(0, 3); // AMS1-P2 -> AMS
     }
     catch (e) {
-        console.error(`Failed to get location hint from ${hintURL}`, e);
+        logger === null || logger === void 0 ? void 0 : logger('error', `Failed to get location hint from ${hintURL}`, e);
         return 'ERR';
     }
     finally {
@@ -7828,6 +7897,7 @@ const getCascadingModeParams = () => {
  * Creates a new StatsReporter instance that collects metrics about the ongoing call and reports them to the state store
  */
 const createStatsReporter = ({ subscriber, publisher, state, edgeName, pollingIntervalInMs = 2000, }) => {
+    const logger = getLogger(['stats']);
     const getRawStatsForTrack = (kind, selector) => __awaiter(void 0, void 0, void 0, function* () {
         if (kind === 'subscriber' && subscriber) {
             return subscriber.getStats(selector);
@@ -7836,7 +7906,7 @@ const createStatsReporter = ({ subscriber, publisher, state, edgeName, pollingIn
             return publisher.getStats(selector);
         }
         else {
-            console.warn(`Can't retrieve RTC stats for`, kind);
+            logger('warn', `Can't retrieve RTC stats for ${kind}`);
             return undefined;
         }
     });
@@ -7874,7 +7944,9 @@ const createStatsReporter = ({ subscriber, publisher, state, edgeName, pollingIn
             for (let participant of state.participants) {
                 if (!sessionIds.has(participant.sessionId))
                     continue;
-                const kind = participant.isLoggedInUser ? 'publisher' : 'subscriber';
+                const kind = participant.isLocalParticipant
+                    ? 'publisher'
+                    : 'subscriber';
                 try {
                     const mergedStream = new MediaStream([
                         ...(((_a = participant.videoStream) === null || _a === void 0 ? void 0 : _a.getVideoTracks()) || []),
@@ -7886,7 +7958,7 @@ const createStatsReporter = ({ subscriber, publisher, state, edgeName, pollingIn
                     });
                 }
                 catch (e) {
-                    console.error(`Failed to collect stats for ${kind}`, participant, e);
+                    logger('error', `Failed to collect stats for ${kind} if ${participant.userId}`, e);
                 }
             }
         }
@@ -7924,7 +7996,7 @@ const createStatsReporter = ({ subscriber, publisher, state, edgeName, pollingIn
     if (pollingIntervalInMs > 0) {
         const loop = () => __awaiter(void 0, void 0, void 0, function* () {
             yield run().catch((e) => {
-                console.log('Failed to collect stats', e);
+                logger('warn', 'Failed to collect stats', e);
             });
             timeoutId = setTimeout(loop, pollingIntervalInMs);
         });
@@ -8467,6 +8539,9 @@ class Call {
             if ([CallingState.JOINED, CallingState.JOINING].includes(this.state.callingState)) {
                 throw new Error(`Illegal State: Already joined.`);
             }
+            if (this.state.callingState === CallingState.LEFT) {
+                throw new Error('Illegal State: Cannot join already left call. Create a new Call instance to join a call.');
+            }
             const previousCallingState = this.state.callingState;
             this.state.setCallingState(CallingState.JOINING);
             if ((data === null || data === void 0 ? void 0 : data.ring) && !this.ringing) {
@@ -8522,7 +8597,7 @@ class Call {
              */
             const rejoin = () => __awaiter(this, void 0, void 0, function* () {
                 var _g, _h, _j;
-                console.log(`Rejoining call ${this.cid} (${this.reconnectAttempts})...`);
+                this.logger('debug', `Rejoining call ${this.cid} (${this.reconnectAttempts})...`);
                 this.reconnectAttempts++;
                 this.state.setCallingState(CallingState.RECONNECTING);
                 // take a snapshot of the current "local participant" state
@@ -8534,7 +8609,7 @@ class Call {
                 sfuClient.close(); // clean up previous connection
                 yield sleep(retryInterval(this.reconnectAttempts));
                 yield this.join(data);
-                console.log(`Rejoin: ${this.reconnectAttempts} successful!`);
+                this.logger('info', `Rejoin: ${this.reconnectAttempts} successful!`);
                 if (localParticipant && !isReactNative()) {
                     const { audioStream, videoStream, screenShareStream: screenShare, } = localParticipant;
                     // restore previous publishing state
@@ -8545,7 +8620,7 @@ class Call {
                     if (screenShare)
                         yield this.publishScreenShareStream(screenShare);
                 }
-                console.log(`Rejoin: state restored ${this.reconnectAttempts}`);
+                this.logger('info', `Rejoin: state restored ${this.reconnectAttempts}`);
             });
             this.rejoinPromise = rejoin;
             // reconnect if the connection was closed unexpectedly. example:
@@ -8565,12 +8640,12 @@ class Call {
                         return;
                     if (this.reconnectAttempts < this.maxReconnectAttempts) {
                         rejoin().catch(() => {
-                            console.log(`Rejoin failed for ${this.reconnectAttempts} times. Giving up.`);
+                            this.logger('error', `Rejoin failed for ${this.reconnectAttempts} times. Giving up.`);
                             this.state.setCallingState(CallingState.RECONNECTING_FAILED);
                         });
                     }
                     else {
-                        console.log('Reconnect attempts exceeded. Giving up...');
+                        this.logger('error', 'Reconnect attempts exceeded. Giving up...');
                         this.state.setCallingState(CallingState.RECONNECTING_FAILED);
                     }
                 });
@@ -8580,15 +8655,15 @@ class Call {
             if (typeof window !== 'undefined' && window.addEventListener) {
                 const handleOnOffline = () => {
                     window.removeEventListener('offline', handleOnOffline);
-                    console.log('Join: Going offline...');
+                    this.logger('warn', 'Join: Going offline...');
                     this.state.setCallingState(CallingState.OFFLINE);
                 };
                 const handleOnOnline = () => {
                     window.removeEventListener('online', handleOnOnline);
                     if (this.state.callingState === CallingState.OFFLINE) {
-                        console.log('Join: Going online...');
+                        this.logger('info', 'Join: Going online...');
                         rejoin().catch(() => {
-                            console.log(`Rejoin failed for ${this.reconnectAttempts} times. Giving up.`);
+                            this.logger('error', `Rejoin failed for ${this.reconnectAttempts} times. Giving up.`);
                             this.state.setCallingState(CallingState.RECONNECTING_FAILED);
                         });
                     }
@@ -8645,15 +8720,20 @@ class Call {
                 clientDetails.sdk = getSdkInfo();
                 // 1. wait for the signal server to be ready before sending "joinRequest"
                 sfuClient.signalReady
-                    .catch((err) => console.warn('Signal ready failed', err))
+                    .catch((err) => this.logger('error', 'Signal ready failed', err))
                     // prepare a generic SDP and send it to the SFU.
                     // this is a throw-away SDP that the SFU will use to determine
                     // the capabilities of the client (codec support, etc.)
                     .then(() => getGenericSdp('recvonly', isRedEnabled, this.streamClient.options.preferredVideoCodec))
-                    .then((sdp) => sfuClient.join({
-                    subscriberSdp: sdp || '',
-                    clientDetails,
-                }));
+                    .then((sdp) => {
+                    const joinRequest = {
+                        subscriberSdp: sdp || '',
+                        clientDetails,
+                    };
+                    this.logger('info', 'Sending join request to SFU');
+                    this.logger('debug', 'Join request payload', joinRequest);
+                    sfuClient.join(joinRequest);
+                });
                 // 2. in parallel, wait for the SFU to send us the "joinResponse"
                 // this will throw an error if the SFU rejects the join request or
                 // fails to respond in time
@@ -8663,22 +8743,22 @@ class Call {
                 const startedAt = (callState === null || callState === void 0 ? void 0 : callState.startedAt)
                     ? Timestamp.toDate(callState.startedAt)
                     : new Date();
-                this.state.setParticipants(currentParticipants.map((participant) => (Object.assign(Object.assign({}, participant), { isLoggedInUser: participant.sessionId === sfuClient.sessionId, viewportVisibilityState: VisibilityState.UNKNOWN }))));
+                this.state.setParticipants(currentParticipants.map((participant) => (Object.assign(Object.assign({}, participant), { isLocalParticipant: participant.sessionId === sfuClient.sessionId, viewportVisibilityState: VisibilityState.UNKNOWN }))));
                 this.state.setParticipantCount((participantCount === null || participantCount === void 0 ? void 0 : participantCount.total) || 0);
                 this.state.setAnonymousParticipantCount((participantCount === null || participantCount === void 0 ? void 0 : participantCount.anonymous) || 0);
                 this.state.setStartedAt(startedAt);
                 this.reconnectAttempts = 0; // reset the reconnect attempts counter
                 this.state.setCallingState(CallingState.JOINED);
-                console.log(`Joined call ${this.cid}`);
+                this.logger('info', `Joined call ${this.cid}`);
             }
             catch (err) {
                 // join failed, try to rejoin
                 if (this.reconnectAttempts < this.maxReconnectAttempts) {
                     yield rejoin();
-                    console.log(`Rejoin ${this.reconnectAttempts} successful!`);
+                    this.logger('info', `Rejoin ${this.reconnectAttempts} successful!`);
                 }
                 else {
-                    console.log(`Rejoin failed for ${this.reconnectAttempts} times. Giving up.`);
+                    this.logger('error', `Rejoin failed for ${this.reconnectAttempts} times. Giving up.`);
                     this.state.setCallingState(CallingState.RECONNECTING_FAILED);
                     throw new Error('Join failed');
                 }
@@ -8703,7 +8783,8 @@ class Call {
             }
             const [videoTrack] = videoStream.getVideoTracks();
             if (!videoTrack) {
-                return console.error(`There is no video track in the stream.`);
+                this.logger('error', `There is no video track to publish in the stream.`);
+                return;
             }
             yield this.publisher.publishStream(videoStream, videoTrack, TrackType.VIDEO, opts);
         });
@@ -8726,7 +8807,8 @@ class Call {
             }
             const [audioTrack] = audioStream.getAudioTracks();
             if (!audioTrack) {
-                return console.error(`There is no audio track in the stream`);
+                this.logger('error', `There is no audio track in the stream to publish`);
+                return;
             }
             yield this.publisher.publishStream(audioStream, audioTrack, TrackType.AUDIO);
         });
@@ -8748,7 +8830,8 @@ class Call {
             }
             const [screenShareTrack] = screenShareStream.getVideoTracks();
             if (!screenShareTrack) {
-                return console.error(`There is no video track in the stream`);
+                this.logger('error', `There is no video track in the screen share stream to publish`);
+                return;
             }
             yield this.publisher.publishStream(screenShareStream, screenShareTrack, TrackType.SCREEN_SHARE);
         });
@@ -8763,7 +8846,7 @@ class Call {
          */
         this.stopPublish = (trackType) => __awaiter(this, void 0, void 0, function* () {
             var _k;
-            console.log(`stopPublish`, TrackType[trackType]);
+            this.logger('info', `stopPublish ${TrackType[trackType]}`);
             yield ((_k = this.publisher) === null || _k === void 0 ? void 0 : _k.unpublishStream(trackType));
         });
         /**
@@ -8797,7 +8880,7 @@ class Call {
             const subscriptions = [];
             participants.forEach((p) => {
                 // we don't want to subscribe to our own tracks
-                if (p.isLoggedInUser)
+                if (p.isLocalParticipant)
                     return;
                 // NOTE: audio tracks don't have to be requested explicitly
                 // as the SFU will implicitly subscribe us to all of them,
@@ -8912,20 +8995,21 @@ class Call {
             const [primaryStream] = e.streams;
             // example: `e3f6aaf8-b03d-4911-be36-83f47d37a76a:TRACK_TYPE_VIDEO`
             const [trackId, trackType] = primaryStream.id.split(':');
-            console.log(`Got remote ${trackType} track:`, e.track);
+            this.logger('info', `Got remote ${trackType} track:`);
+            this.logger('debug', `Track: `, e.track);
             const participantToUpdate = this.state.participants.find((p) => p.trackLookupPrefix === trackId);
             if (!participantToUpdate) {
-                console.error('Received track for unknown participant', trackId, e);
+                this.logger('error', `'Received track for unknown participant: ${trackId}'`, e);
                 return;
             }
             e.track.addEventListener('mute', () => {
-                console.log(`Track muted:`, participantToUpdate.userId, `${trackType}:${trackId}`, e.track);
+                this.logger('info', `Track muted: ${participantToUpdate.userId} ${trackType}:${trackId}`);
             });
             e.track.addEventListener('unmute', () => {
-                console.log(`Track unmuted:`, participantToUpdate.userId, `${trackType}:${trackId}`, e.track);
+                this.logger('info', `Track unmuted: ${participantToUpdate.userId} ${trackType}:${trackId}`);
             });
             e.track.addEventListener('ended', () => {
-                console.log(`Track ended:`, participantToUpdate.userId, `${trackType}:${trackId}`, e.track);
+                this.logger('info', `Track ended: ${participantToUpdate.userId} ${trackType}:${trackId}`);
             });
             const streamKindProp = {
                 TRACK_TYPE_AUDIO: 'audioStream',
@@ -8933,12 +9017,12 @@ class Call {
                 TRACK_TYPE_SCREEN_SHARE: 'screenShareStream',
             }[trackType];
             if (!streamKindProp) {
-                console.error('Unknown track type', trackType);
+                this.logger('error', `Unknown track type: ${trackType}`);
                 return;
             }
             const previousStream = participantToUpdate[streamKindProp];
             if (previousStream) {
-                console.log(`Cleaning up previous remote tracks`, e.track.kind);
+                this.logger('info', `Cleaning up previous remote tracks: ${e.track.kind}`);
                 previousStream.getTracks().forEach((t) => {
                     t.stop();
                     previousStream.removeTrack(t);
@@ -9238,6 +9322,7 @@ class Call {
         this.streamClient = streamClient;
         this.clientStore = clientStore;
         this.streamClientBasePath = `/call/${this.type}/${this.id}`;
+        this.logger = getLogger(['call']);
         const callTypeConfig = CallTypes.get(type);
         const participantSorter = sortParticipantsBy || callTypeConfig.options.sortParticipantsBy;
         if (participantSorter) {
@@ -9275,7 +9360,7 @@ class Call {
                 const hasPermission = this.permissionsContext.hasPermission(permission);
                 if (!hasPermission && this.publisher.isPublishing(trackType)) {
                     this.stopPublish(trackType).catch((err) => {
-                        console.error('Error stopping publish', trackType, err);
+                        this.logger('error', `Error stopping publish ${trackType}`, err);
                     });
                 }
             }
@@ -9496,12 +9581,12 @@ class StableWSConnection {
                 return;
             const user = this.client.user;
             if (!user) {
-                console.error(`User not set, can't connect to WS`);
+                this.client.logger('error', `User not set, can't connect to WS`);
                 return;
             }
             const token = this.client._getToken();
             if (!token) {
-                console.error(`Token not set, can't connect authenticate`);
+                this.client.logger('error', `Token not set, can't connect authenticate`);
                 return;
             }
             const authMessage = {
@@ -9734,7 +9819,7 @@ class StableWSConnection {
         addConnectionEventListeners(this.onlineStatusChanged);
     }
     _log(msg, extra = {}, level = 'info') {
-        this.client.logger(level, 'connection:' + msg, Object.assign({ tags: ['connection'] }, extra));
+        this.client.logger(level, 'connection:' + msg, Object.assign({}, extra));
     }
     /**
      * connect - Connect to the WS URL
@@ -10451,7 +10536,7 @@ class WSConnectionFallback {
         addConnectionEventListeners(this._onlineStatusChanged);
     }
     _log(msg, extra = {}, level = 'info') {
-        this.client.logger(level, 'WSConnectionFallback:' + msg, Object.assign({ tags: ['connection_fallback', 'connection'] }, extra));
+        this.client.logger(level, 'WSConnectionFallback:' + msg, Object.assign({}, extra));
     }
     _setState(state) {
         this._log(`_setState() - ${state}`);
@@ -10511,7 +10596,7 @@ class StreamClient {
              * If the user id remains the same we don't throw error
              */
             if (this.userID === user.id && this.setUserPromise) {
-                console.warn('Consecutive calls to connectUser is detected, ideally you should only call this function once in your app.');
+                this.logger('warn', 'Consecutive calls to connectUser is detected, ideally you should only call this function once in your app.');
                 return this.setUserPromise;
             }
             if (this.userID) {
@@ -10519,7 +10604,7 @@ class StreamClient {
             }
             if ((this._isUsingServerAuth() || this.node) &&
                 !this.options.allowServerSideConnect) {
-                console.warn('Please do not use connectUser server side. connectUser impacts MAU and concurrent connection usage and thus your bill. If you have a valid use-case, add "allowServerSideConnect: true" to the client options to disable this warning.');
+                this.logger('warn', 'Please do not use connectUser server side. connectUser impacts MAU and concurrent connection usage and thus your bill. If you have a valid use-case, add "allowServerSideConnect: true" to the client options to disable this warning.');
             }
             // we generate the client id client side
             this.userID = user.id;
@@ -10582,16 +10667,12 @@ class StreamClient {
                 throw Error('UserWithId is not set on client, use client.connectUser or client.connectAnonymousUser instead');
             }
             if (((_d = this.wsConnection) === null || _d === void 0 ? void 0 : _d.isConnecting) && this.wsPromise) {
-                this.logger('info', 'client:openConnection() - connection already in progress', {
-                    tags: ['connection', 'client'],
-                });
+                this.logger('info', 'client:openConnection() - connection already in progress');
                 return this.wsPromise;
             }
             if ((((_e = this.wsConnection) === null || _e === void 0 ? void 0 : _e.isHealthy) || ((_f = this.wsFallback) === null || _f === void 0 ? void 0 : _f.isHealthy())) &&
                 this._hasConnectionID()) {
-                this.logger('info', 'client:openConnection() - openConnection called twice, healthy connection already exists', {
-                    tags: ['connection', 'client'],
-                });
+                this.logger('info', 'client:openConnection() - openConnection called twice, healthy connection already exists');
                 return Promise.resolve();
             }
             this.clientID = `${this.userID}--${randomId()}`;
@@ -10614,9 +10695,7 @@ class StreamClient {
          *                https://developer.mozilla.org/en-US/docs/Web/API/CloseEvent
          */
         this.disconnectUser = (timeout) => __awaiter(this, void 0, void 0, function* () {
-            this.logger('info', 'client:disconnect() - Disconnecting the client', {
-                tags: ['connection', 'client'],
-            });
+            this.logger('info', 'client:disconnect() - Disconnecting the client');
             // remove the user specific fields
             delete this.user;
             delete this._user;
@@ -10706,7 +10785,8 @@ class StreamClient {
         this.dispatchEvent = (event) => {
             if (!event.received_at)
                 event.received_at = new Date();
-            console.log(`Dispatching event: ${event.type}`, event);
+            this.logger('info', `Dispatching event: ${event.type}`);
+            this.logger('debug', 'Event payload:', event);
             this._callClientListeners(event);
         };
         this.handleEvent = (messageEvent) => {
@@ -10839,9 +10919,7 @@ class StreamClient {
         if (!(key in this.listeners)) {
             this.listeners[key] = [];
         }
-        this.logger('info', `Attaching listener for ${key} event`, {
-            tags: ['event', 'client'],
-        });
+        this.logger('info', `Attaching listener for ${key} event`);
         this.listeners[key].push(callback);
         return () => {
             this.off(key, callback);
@@ -10859,29 +10937,26 @@ class StreamClient {
         if (!(key in this.listeners)) {
             this.listeners[key] = [];
         }
-        this.logger('info', `Removing listener for ${key} event`, {
-            tags: ['event', 'client'],
-        });
+        this.logger('info', `Removing listener for ${key} event`);
         this.listeners[key] = this.listeners[key].filter((value) => value !== callback);
     }
     _logApiRequest(type, url, data, config) {
-        this.logger('info', `client: ${type} - Request - ${url}`, {
-            tags: ['api', 'api_request', 'client'],
-            url,
+        this.logger('info', `client: ${type} - Request - ${url}`);
+        this.logger('debug', `client: ${type} - Request payload`, {
             payload: data,
             config,
         });
     }
     _logApiResponse(type, url, response) {
         this.logger('info', `client:${type} - Response - url: ${url} > status ${response.status}`, {
-            tags: ['api', 'api_response', 'client'],
-            url,
+            response,
+        });
+        this.logger('debug', `client:${type} - Response payload`, {
             response,
         });
     }
     _logApiError(type, url, error) {
         this.logger('error', `client:${type} - Error - url: ${url}`, {
-            tags: ['api', 'api_response', 'client'],
             url,
             error,
         });
@@ -10956,7 +11031,7 @@ class StreamClient {
                 if (this.wsFallback) {
                     return yield this.wsFallback.connect();
                 }
-                console.log('StreamClient.connect: this.wsConnection.connect()');
+                this.logger('info', 'StreamClient.connect: this.wsConnection.connect()');
                 // if WSFallback is enabled, ws connect should timeout faster so fallback can try
                 return yield this.wsConnection.connect(this.options.enableWSFallback
                     ? this.defaultWSTimeoutWithFallback
@@ -10965,9 +11040,11 @@ class StreamClient {
             catch (err) {
                 // run fallback only if it's WS/Network error and not a normal API error
                 // make sure browser is online before even trying the longpoll
-                // @ts-ignore
-                if (this.options.enableWSFallback && isWSFailure(err) && isOnline()) {
-                    this.logger('info', 'client:connect() - WS failed, fallback to longpoll', { tags: ['connection', 'client'] });
+                if (this.options.enableWSFallback &&
+                    // @ts-ignore
+                    isWSFailure(err) &&
+                    isOnline(this.logger)) {
+                    this.logger('warn', 'client:connect() - WS failed, fallback to longpoll');
                     this.dispatchEvent({ type: 'transport.changed', mode: 'longpoll' });
                     this.wsConnection._destroyCurrentWSConnection();
                     this.wsConnection.disconnect().then(); // close WS so no retry
@@ -11002,7 +11079,7 @@ class StreamClient {
     }
     getUserAgent() {
         return (this.userAgent ||
-            `stream-video-javascript-client-${this.node ? 'node' : 'browser'}-${"0.0.12"}`);
+            `stream-video-javascript-client-${this.node ? 'node' : 'browser'}-${"0.0.14"}`);
     }
     setUserAgent(userAgent) {
         this.userAgent = userAgent;
@@ -11071,7 +11148,10 @@ class StreamClient {
  */
 class StreamVideoClient {
     constructor(apiKeyOrArgs, opts) {
+        var _a, _b;
+        this.logLevel = 'warn';
         this.eventHandlersToUnregister = [];
+        this.logLevels = ['debug', 'info', 'warn', 'error'];
         /**
          * Disconnects the currently connected user from the client.
          *
@@ -11230,11 +11310,30 @@ class StreamVideoClient {
             this.connectionPromise.finally(() => (this.connectionPromise = undefined));
             return this.connectionPromise;
         });
+        this.filterLogs = (logMethod) => {
+            return (logLevel, messeage, extraData, tags) => {
+                if (this.logLevels.indexOf(logLevel) >=
+                    this.logLevels.indexOf(this.logLevel)) {
+                    logMethod(logLevel, messeage, extraData, tags);
+                }
+            };
+        };
+        let defaultLogger = logToConsole;
         if (typeof apiKeyOrArgs === 'string') {
-            this.streamClient = new StreamClient(apiKeyOrArgs, Object.assign({ persistUserOnConnectionFailure: true }, opts));
+            this.logLevel = (opts === null || opts === void 0 ? void 0 : opts.logLevel) || this.logLevel;
+            this.logger = (opts === null || opts === void 0 ? void 0 : opts.logger) || defaultLogger;
         }
         else {
-            this.streamClient = new StreamClient(apiKeyOrArgs.apiKey, Object.assign({ persistUserOnConnectionFailure: true }, apiKeyOrArgs.options));
+            this.logLevel = ((_a = apiKeyOrArgs.options) === null || _a === void 0 ? void 0 : _a.logLevel) || this.logLevel;
+            this.logger = ((_b = apiKeyOrArgs.options) === null || _b === void 0 ? void 0 : _b.logger) || defaultLogger;
+        }
+        setLogger(this.filterLogs(defaultLogger));
+        const clientLogger = getLogger(['client']);
+        if (typeof apiKeyOrArgs === 'string') {
+            this.streamClient = new StreamClient(apiKeyOrArgs, Object.assign(Object.assign({ persistUserOnConnectionFailure: true }, opts), { logLevel: this.logLevel, logger: clientLogger }));
+        }
+        else {
+            this.streamClient = new StreamClient(apiKeyOrArgs.apiKey, Object.assign(Object.assign({ persistUserOnConnectionFailure: true }, apiKeyOrArgs.options), { logLevel: this.logLevel, logger: clientLogger }));
             this.user = apiKeyOrArgs.user;
             this.token = apiKeyOrArgs.token || apiKeyOrArgs.tokenProvider;
             if (this.user) {
@@ -11296,7 +11395,7 @@ class StreamVideoClient {
                             },
                             sort: [{ field: 'cid', direction: 1 }],
                         }).catch((err) => {
-                            console.warn('Failed to re-watch calls', err);
+                            this.logger('error', 'Failed to re-watch calls', err);
                         });
                     }
                 }
@@ -11306,7 +11405,7 @@ class StreamVideoClient {
                     return;
                 const { call, members } = event;
                 if (userToConnect.id === call.created_by.id) {
-                    console.warn('Received `call.created` sent by the current user');
+                    this.logger('warn', 'Received `call.created` sent by the current user');
                     return;
                 }
                 this.writeableStateStore.registerCall(new Call({
@@ -11323,7 +11422,7 @@ class StreamVideoClient {
                     return;
                 const { call, members } = event;
                 if (userToConnect.id === call.created_by.id) {
-                    console.warn('Received `call.ring` sent by the current user');
+                    this.logger('warn', 'Received `call.ring` sent by the current user');
                     return;
                 }
                 // The call might already be tracked by the client,
@@ -11390,7 +11489,10 @@ const getDevices = (constraints) => {
             });
         })
             .catch((error) => {
-            console.error('Failed to get devices', error);
+            const logger = getLogger(['devices']);
+            if (logger) {
+                logger('error', 'Failed to get devices', error);
+            }
             subscriber.error(error);
         });
     });
@@ -11461,11 +11563,15 @@ const getAudioOutputDevices = () => {
     return audioDevices$.pipe(map$2((values) => values.filter((d) => d.kind === 'audiooutput')));
 };
 const getStream = (constraints) => __awaiter(void 0, void 0, void 0, function* () {
+    var _a;
     try {
         return yield navigator.mediaDevices.getUserMedia(constraints);
     }
     catch (e) {
-        console.error(`Failed get user media`, constraints, e);
+        (_a = getLogger(['devices'])) === null || _a === void 0 ? void 0 : _a('error', `Failed get user media`, {
+            error: e,
+            constraints: constraints,
+        });
         throw e;
     }
 });
@@ -11508,11 +11614,12 @@ const getVideoStream = (trackConstraints) => __awaiter(void 0, void 0, void 0, f
  * @param options any additional options to pass to the [`getDisplayMedia`](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia) API.
  */
 const getScreenShareStream = (options) => __awaiter(void 0, void 0, void 0, function* () {
+    var _b;
     try {
         return yield navigator.mediaDevices.getDisplayMedia(Object.assign({ video: true, audio: false }, options));
     }
     catch (e) {
-        console.error('Failed to get screen share stream', e);
+        (_b = getLogger(['devices'])) === null || _b === void 0 ? void 0 : _b('error', 'Failed to get screen share stream', e);
         throw e;
     }
 });
@@ -11695,5 +11802,5 @@ var browsers = /*#__PURE__*/Object.freeze({
     isSafari: isSafari
 });
 
-export { APIErrorCodeEnum, browsers as Browsers, Call, CallState, CallType, CallTypes, CallingState, CreateDeviceRequestPushProviderEnum, DebounceType, ErrorFromResponse, OwnCapability, RecordSettingsModeEnum, RecordSettingsQualityEnum, RecordSettingsRequestModeEnum, RecordSettingsRequestQualityEnum, rxUtils as RxUtils, events as SfuEvents, models as SfuModels, StreamSfuClient, StreamVideoClient, StreamVideoReadOnlyStateStore, StreamVideoWriteableStateStore, TranscriptionSettingsModeEnum, TranscriptionSettingsRequestModeEnum, VideoSettingsCameraFacingEnum, VideoSettingsRequestCameraFacingEnum, ViewportTracker, VisibilityState, checkIfAudioOutputChangeSupported, combineComparators, conditional, createSoundDetector, defaultSortPreset, descending, disposeOfMediaStream, dominantSpeaker, getAudioDevices, getAudioOutputDevices, getAudioStream, getScreenShareStream, getSdkInfo, getVideoDevices, getVideoStream, isStreamVideoLocalParticipant, livestreamOrAudioRoomSortPreset, name, noopComparator, pinned, publishingAudio, publishingVideo, reactionType, role, screenSharing, setSdkInfo, speakerLayoutSortPreset, speaking, watchForAddedDefaultAudioDevice, watchForAddedDefaultAudioOutputDevice, watchForAddedDefaultVideoDevice, watchForDisconnectedAudioDevice, watchForDisconnectedAudioOutputDevice, watchForDisconnectedVideoDevice };
+export { APIErrorCodeEnum, browsers as Browsers, Call, CallState, CallType, CallTypes, CallingState, CreateDeviceRequestPushProviderEnum, DebounceType, ErrorFromResponse, OwnCapability, RecordSettingsModeEnum, RecordSettingsQualityEnum, RecordSettingsRequestModeEnum, RecordSettingsRequestQualityEnum, rxUtils as RxUtils, events as SfuEvents, models as SfuModels, StreamSfuClient, StreamVideoClient, StreamVideoReadOnlyStateStore, StreamVideoWriteableStateStore, TranscriptionSettingsModeEnum, TranscriptionSettingsRequestModeEnum, VideoSettingsCameraFacingEnum, VideoSettingsRequestCameraFacingEnum, ViewportTracker, VisibilityState, checkIfAudioOutputChangeSupported, combineComparators, conditional, createSoundDetector, defaultSortPreset, descending, disposeOfMediaStream, dominantSpeaker, getAudioDevices, getAudioOutputDevices, getAudioStream, getLogger, getScreenShareStream, getSdkInfo, getVideoDevices, getVideoStream, isStreamVideoLocalParticipant, livestreamOrAudioRoomSortPreset, logToConsole, name, noopComparator, pinned, publishingAudio, publishingVideo, reactionType, role, screenSharing, setLogger, setSdkInfo, speakerLayoutSortPreset, speaking, watchForAddedDefaultAudioDevice, watchForAddedDefaultAudioOutputDevice, watchForAddedDefaultVideoDevice, watchForDisconnectedAudioDevice, watchForDisconnectedAudioOutputDevice, watchForDisconnectedVideoDevice };
 //# sourceMappingURL=index.browser.es.js.map