@stream-io/video-client 1.13.1 → 1.15.0

package/dist/index.es.js

@@ -4,9 +4,9 @@ import { ServiceType, stackIntercept, RpcError } from '@protobuf-ts/runtime-rpc'
 import axios from 'axios';
 export { AxiosError } from 'axios';
 import { TwirpFetchTransport, TwirpErrorCode } from '@protobuf-ts/twirp-transport';
-import { UAParser } from 'ua-parser-js';
 import { ReplaySubject, combineLatest, BehaviorSubject, map, shareReplay, distinctUntilChanged, takeWhile, distinctUntilKeyChanged, fromEventPattern, startWith, concatMap, from, fromEvent, debounceTime, merge, pairwise, of } from 'rxjs';
-import * as SDP from 'sdp-transform';
+import { parse } from 'sdp-transform';
+import { UAParser } from 'ua-parser-js';
 import https from 'https';
 
 /* tslint:disable */
@@ -57,6 +57,48 @@ const ChannelConfigWithInfoBlocklistBehaviorEnum = {
     BLOCK: 'block',
     SHADOW_BLOCK: 'shadow_block',
 };
+/**
+ * All possibility of string to use
+ * @export
+ */
+const ChannelOwnCapability = {
+    BAN_CHANNEL_MEMBERS: 'ban-channel-members',
+    CAST_POLL_VOTE: 'cast-poll-vote',
+    CONNECT_EVENTS: 'connect-events',
+    CREATE_ATTACHMENT: 'create-attachment',
+    CREATE_CALL: 'create-call',
+    DELETE_ANY_MESSAGE: 'delete-any-message',
+    DELETE_CHANNEL: 'delete-channel',
+    DELETE_OWN_MESSAGE: 'delete-own-message',
+    FLAG_MESSAGE: 'flag-message',
+    FREEZE_CHANNEL: 'freeze-channel',
+    JOIN_CALL: 'join-call',
+    JOIN_CHANNEL: 'join-channel',
+    LEAVE_CHANNEL: 'leave-channel',
+    MUTE_CHANNEL: 'mute-channel',
+    PIN_MESSAGE: 'pin-message',
+    QUERY_POLL_VOTES: 'query-poll-votes',
+    QUOTE_MESSAGE: 'quote-message',
+    READ_EVENTS: 'read-events',
+    SEARCH_MESSAGES: 'search-messages',
+    SEND_CUSTOM_EVENTS: 'send-custom-events',
+    SEND_LINKS: 'send-links',
+    SEND_MESSAGE: 'send-message',
+    SEND_POLL: 'send-poll',
+    SEND_REACTION: 'send-reaction',
+    SEND_REPLY: 'send-reply',
+    SEND_TYPING_EVENTS: 'send-typing-events',
+    SET_CHANNEL_COOLDOWN: 'set-channel-cooldown',
+    SKIP_SLOW_MODE: 'skip-slow-mode',
+    SLOW_MODE: 'slow-mode',
+    TYPING_EVENTS: 'typing-events',
+    UPDATE_ANY_MESSAGE: 'update-any-message',
+    UPDATE_CHANNEL: 'update-channel',
+    UPDATE_CHANNEL_MEMBERS: 'update-channel-members',
+    UPDATE_OWN_MESSAGE: 'update-own-message',
+    UPDATE_THREAD: 'update-thread',
+    UPLOAD_FILE: 'upload-file',
+};
 /**
  * @export
  */
@@ -96,9 +138,11 @@ const OwnCapability = {
     SEND_AUDIO: 'send-audio',
     SEND_VIDEO: 'send-video',
     START_BROADCAST_CALL: 'start-broadcast-call',
+    START_CLOSED_CAPTIONS_CALL: 'start-closed-captions-call',
     START_RECORD_CALL: 'start-record-call',
     START_TRANSCRIPTION_CALL: 'start-transcription-call',
     STOP_BROADCAST_CALL: 'stop-broadcast-call',
+    STOP_CLOSED_CAPTIONS_CALL: 'stop-closed-captions-call',
     STOP_RECORD_CALL: 'stop-record-call',
     STOP_TRANSCRIPTION_CALL: 'stop-transcription-call',
     UPDATE_CALL: 'update-call',
@@ -129,6 +173,14 @@ const RecordSettingsRequestQualityEnum = {
     PORTRAIT_1080X1920: 'portrait-1080x1920',
     PORTRAIT_1440X2560: 'portrait-1440x2560',
 };
+/**
+ * @export
+ */
+const TranscriptionSettingsRequestClosedCaptionModeEnum = {
+    AVAILABLE: 'available',
+    DISABLED: 'disabled',
+    AUTO_ON: 'auto-on',
+};
 /**
  * @export
  */
@@ -137,6 +189,14 @@ const TranscriptionSettingsRequestModeEnum = {
     DISABLED: 'disabled',
     AUTO_ON: 'auto-on',
 };
+/**
+ * @export
+ */
+const TranscriptionSettingsResponseClosedCaptionModeEnum = {
+    AVAILABLE: 'available',
+    DISABLED: 'disabled',
+    AUTO_ON: 'auto-on',
+};
 /**
  * @export
  */
@@ -1165,23 +1225,33 @@ class VideoLayer$Type extends MessageType {
  */
 const VideoLayer = new VideoLayer$Type();
 // @generated message type with reflection information, may provide speed optimized methods
-class PublishOptions$Type extends MessageType {
+class SubscribeOption$Type extends MessageType {
     constructor() {
-        super('stream.video.sfu.models.PublishOptions', [
+        super('stream.video.sfu.models.SubscribeOption', [
             {
                 no: 1,
+                name: 'track_type',
+                kind: 'enum',
+                T: () => [
+                    'stream.video.sfu.models.TrackType',
+                    TrackType,
+                    'TRACK_TYPE_',
+                ],
+            },
+            {
+                no: 2,
                 name: 'codecs',
                 kind: 'message',
                 repeat: 1 /*RepeatType.PACKED*/,
-                T: () => PublishOption,
+                T: () => Codec,
             },
         ]);
     }
 }
 /**
- * @generated MessageType for protobuf message stream.video.sfu.models.PublishOptions
+ * @generated MessageType for protobuf message stream.video.sfu.models.SubscribeOption
  */
-const PublishOptions = new PublishOptions$Type();
+const SubscribeOption = new SubscribeOption$Type();
 // @generated message type with reflection information, may provide speed optimized methods
 class PublishOption$Type extends MessageType {
     constructor() {
@@ -1211,6 +1281,13 @@ class PublishOption$Type extends MessageType {
                 kind: 'scalar',
                 T: 5 /*ScalarType.INT32*/,
             },
+            {
+                no: 7,
+                name: 'video_dimension',
+                kind: 'message',
+                T: () => VideoDimension,
+            },
+            { no: 8, name: 'id', kind: 'scalar', T: 5 /*ScalarType.INT32*/ },
         ]);
     }
 }
@@ -1223,7 +1300,7 @@ class Codec$Type extends MessageType {
     constructor() {
         super('stream.video.sfu.models.Codec', [
             {
-                no: 11,
+                no: 16,
                 name: 'payload_type',
                 kind: 'scalar',
                 T: 13 /*ScalarType.UINT32*/,
@@ -1236,7 +1313,7 @@ class Codec$Type extends MessageType {
                 T: 13 /*ScalarType.UINT32*/,
             },
             {
-                no: 13,
+                no: 15,
                 name: 'encoding_parameters',
                 kind: 'scalar',
                 T: 9 /*ScalarType.STRING*/,
@@ -1300,6 +1377,13 @@ class TrackInfo$Type extends MessageType {
             { no: 8, name: 'stereo', kind: 'scalar', T: 8 /*ScalarType.BOOL*/ },
             { no: 9, name: 'red', kind: 'scalar', T: 8 /*ScalarType.BOOL*/ },
             { no: 10, name: 'muted', kind: 'scalar', T: 8 /*ScalarType.BOOL*/ },
+            { no: 11, name: 'codec', kind: 'message', T: () => Codec },
+            {
+                no: 12,
+                name: 'publish_option_id',
+                kind: 'scalar',
+                T: 5 /*ScalarType.INT32*/,
+            },
         ]);
     }
 }
@@ -1573,10 +1657,10 @@ var models = /*#__PURE__*/Object.freeze({
     get PeerType () { return PeerType; },
     Pin: Pin,
     PublishOption: PublishOption,
-    PublishOptions: PublishOptions,
     Sdk: Sdk,
     get SdkType () { return SdkType; },
     StreamQuality: StreamQuality,
+    SubscribeOption: SubscribeOption,
     TrackInfo: TrackInfo,
     get TrackType () { return TrackType; },
     get TrackUnpublishReason () { return TrackUnpublishReason; },
@@ -2206,13 +2290,6 @@ class SfuEvent$Type extends MessageType {
                 oneof: 'eventPayload',
                 T: () => ParticipantMigrationComplete,
             },
-            {
-                no: 26,
-                name: 'codec_negotiation_complete',
-                kind: 'message',
-                oneof: 'eventPayload',
-                T: () => CodecNegotiationComplete,
-            },
             {
                 no: 27,
                 name: 'change_publish_options',
@@ -2233,10 +2310,12 @@ class ChangePublishOptions$Type extends MessageType {
         super('stream.video.sfu.event.ChangePublishOptions', [
             {
                 no: 1,
-                name: 'publish_option',
+                name: 'publish_options',
                 kind: 'message',
+                repeat: 1 /*RepeatType.PACKED*/,
                 T: () => PublishOption,
             },
+            { no: 2, name: 'reason', kind: 'scalar', T: 9 /*ScalarType.STRING*/ },
         ]);
     }
 }
@@ -2245,15 +2324,15 @@ class ChangePublishOptions$Type extends MessageType {
  */
 const ChangePublishOptions = new ChangePublishOptions$Type();
 // @generated message type with reflection information, may provide speed optimized methods
-class CodecNegotiationComplete$Type extends MessageType {
+class ChangePublishOptionsComplete$Type extends MessageType {
     constructor() {
-        super('stream.video.sfu.event.CodecNegotiationComplete', []);
+        super('stream.video.sfu.event.ChangePublishOptionsComplete', []);
     }
 }
 /**
- * @generated MessageType for protobuf message stream.video.sfu.event.CodecNegotiationComplete
+ * @generated MessageType for protobuf message stream.video.sfu.event.ChangePublishOptionsComplete
  */
-const CodecNegotiationComplete = new CodecNegotiationComplete$Type();
+const ChangePublishOptionsComplete = new ChangePublishOptionsComplete$Type();
 // @generated message type with reflection information, may provide speed optimized methods
 class ParticipantMigrationComplete$Type extends MessageType {
     constructor() {
@@ -2511,6 +2590,20 @@ class JoinRequest$Type extends MessageType {
                 kind: 'message',
                 T: () => ReconnectDetails,
             },
+            {
+                no: 9,
+                name: 'preferred_publish_options',
+                kind: 'message',
+                repeat: 1 /*RepeatType.PACKED*/,
+                T: () => PublishOption,
+            },
+            {
+                no: 10,
+                name: 'preferred_subscribe_options',
+                kind: 'message',
+                repeat: 1 /*RepeatType.PACKED*/,
+                T: () => SubscribeOption,
+            },
         ]);
     }
 }
@@ -2618,7 +2711,8 @@ class JoinResponse$Type extends MessageType {
                 no: 4,
                 name: 'publish_options',
                 kind: 'message',
-                T: () => PublishOptions,
+                repeat: 1 /*RepeatType.PACKED*/,
+                T: () => PublishOption,
             },
         ]);
     }
@@ -2783,6 +2877,22 @@ class AudioSender$Type extends MessageType {
     constructor() {
         super('stream.video.sfu.event.AudioSender', [
             { no: 2, name: 'codec', kind: 'message', T: () => Codec },
+            {
+                no: 3,
+                name: 'track_type',
+                kind: 'enum',
+                T: () => [
+                    'stream.video.sfu.models.TrackType',
+                    TrackType,
+                    'TRACK_TYPE_',
+                ],
+            },
+            {
+                no: 4,
+                name: 'publish_option_id',
+                kind: 'scalar',
+                T: 5 /*ScalarType.INT32*/,
+            },
         ]);
     }
 }
@@ -2835,6 +2945,22 @@ class VideoSender$Type extends MessageType {
                 repeat: 1 /*RepeatType.PACKED*/,
                 T: () => VideoLayerSetting,
             },
+            {
+                no: 4,
+                name: 'track_type',
+                kind: 'enum',
+                T: () => [
+                    'stream.video.sfu.models.TrackType',
+                    TrackType,
+                    'TRACK_TYPE_',
+                ],
+            },
+            {
+                no: 5,
+                name: 'publish_option_id',
+                kind: 'scalar',
+                T: 5 /*ScalarType.INT32*/,
+            },
         ]);
     }
 }
@@ -2931,8 +3057,8 @@ var events = /*#__PURE__*/Object.freeze({
     CallEnded: CallEnded,
     CallGrantsUpdated: CallGrantsUpdated,
     ChangePublishOptions: ChangePublishOptions,
+    ChangePublishOptionsComplete: ChangePublishOptionsComplete,
     ChangePublishQuality: ChangePublishQuality,
-    CodecNegotiationComplete: CodecNegotiationComplete,
     ConnectionQualityChanged: ConnectionQualityChanged,
     ConnectionQualityInfo: ConnectionQualityInfo,
     DominantSpeakerChanged: DominantSpeakerChanged,
@@ -3079,11 +3205,18 @@ const withHeaders = (headers) => {
 const withRequestLogger = (logger, level) => {
     return {
         interceptUnary: (next, method, input, options) => {
-            logger(level, `Calling SFU RPC method ${method.name}`, {
-                input,
-                options,
-            });
-            return next(method, input, options);
+            let invocation;
+            try {
+                invocation = next(method, input, options);
+            }
+            finally {
+                logger(level, `Invoked SFU RPC method ${method.name}`, {
+                    request: invocation?.request,
+                    headers: invocation?.requestHeaders,
+                    response: invocation?.response,
+                });
+            }
+            return invocation;
         },
     };
 };
@@ -3300,374 +3433,98 @@ const retryable = async (rpc, signal) => {
     return result;
 };
 
-const version = "1.13.1";
-const [major, minor, patch] = version.split('.');
-let sdkInfo = {
-    type: SdkType.PLAIN_JAVASCRIPT,
-    major,
-    minor,
-    patch,
-};
-let osInfo;
-let deviceInfo;
-let webRtcInfo;
-let deviceState = { oneofKind: undefined };
-const setSdkInfo = (info) => {
-    sdkInfo = info;
-};
-const getSdkInfo = () => {
-    return sdkInfo;
-};
-const setOSInfo = (info) => {
-    osInfo = info;
-};
-const getOSInfo = () => {
-    return osInfo;
-};
-const setDeviceInfo = (info) => {
-    deviceInfo = info;
+/**
+ * Returns a generic SDP for the given direction.
+ * We use this SDP to send it as part of our JoinRequest so that the SFU
+ * can use it to determine the client's codec capabilities.
+ *
+ * @param direction the direction of the transceiver.
+ */
+const getGenericSdp = async (direction) => {
+    const tempPc = new RTCPeerConnection();
+    tempPc.addTransceiver('video', { direction });
+    tempPc.addTransceiver('audio', { direction });
+    const offer = await tempPc.createOffer();
+    const sdp = offer.sdp ?? '';
+    tempPc.getTransceivers().forEach((t) => {
+        t.stop?.();
+    });
+    tempPc.close();
+    return sdp;
 };
-const getDeviceInfo = () => {
-    return deviceInfo;
+/**
+ * Returns whether the codec is an SVC codec.
+ *
+ * @param codecOrMimeType the codec to check.
+ */
+const isSvcCodec = (codecOrMimeType) => {
+    if (!codecOrMimeType)
+        return false;
+    codecOrMimeType = codecOrMimeType.toLowerCase();
+    return (codecOrMimeType === 'vp9' ||
+        codecOrMimeType === 'av1' ||
+        codecOrMimeType === 'video/vp9' ||
+        codecOrMimeType === 'video/av1');
 };
-const getWebRTCInfo = () => {
-    return webRtcInfo;
+
+const sfuEventKinds = {
+    subscriberOffer: undefined,
+    publisherAnswer: undefined,
+    connectionQualityChanged: undefined,
+    audioLevelChanged: undefined,
+    iceTrickle: undefined,
+    changePublishQuality: undefined,
+    participantJoined: undefined,
+    participantLeft: undefined,
+    dominantSpeakerChanged: undefined,
+    joinResponse: undefined,
+    healthCheckResponse: undefined,
+    trackPublished: undefined,
+    trackUnpublished: undefined,
+    error: undefined,
+    callGrantsUpdated: undefined,
+    goAway: undefined,
+    iceRestart: undefined,
+    pinsUpdated: undefined,
+    callEnded: undefined,
+    participantUpdated: undefined,
+    participantMigrationComplete: undefined,
+    changePublishOptions: undefined,
 };
-const setWebRTCInfo = (info) => {
-    webRtcInfo = info;
+const isSfuEvent = (eventName) => {
+    return Object.prototype.hasOwnProperty.call(sfuEventKinds, eventName);
 };
-const setThermalState = (state) => {
-    if (!osInfo) {
-        deviceState = { oneofKind: undefined };
-        return;
-    }
-    if (osInfo.name === 'android') {
-        const thermalState = AndroidThermalState[state] ||
-            AndroidThermalState.UNSPECIFIED;
-        deviceState = {
-            oneofKind: 'android',
-            android: {
-                thermalState,
-                isPowerSaverMode: deviceState?.oneofKind === 'android' &&
-                    deviceState.android.isPowerSaverMode,
-            },
+class Dispatcher {
+    constructor() {
+        this.logger = getLogger(['Dispatcher']);
+        this.subscribers = {};
+        this.dispatch = (message, logTag = '0') => {
+            const eventKind = message.eventPayload.oneofKind;
+            if (!eventKind)
+                return;
+            const payload = message.eventPayload[eventKind];
+            this.logger('debug', `Dispatching ${eventKind}, tag=${logTag}`, payload);
+            const listeners = this.subscribers[eventKind];
+            if (!listeners)
+                return;
+            for (const fn of listeners) {
+                try {
+                    fn(payload);
+                }
+                catch (e) {
+                    this.logger('warn', 'Listener failed with error', e);
+                }
+            }
         };
-    }
-    if (osInfo.name.toLowerCase() === 'ios') {
-        const thermalState = AppleThermalState[state] ||
-            AppleThermalState.UNSPECIFIED;
-        deviceState = {
-            oneofKind: 'apple',
-            apple: {
-                thermalState,
-                isLowPowerModeEnabled: deviceState?.oneofKind === 'apple' &&
-                    deviceState.apple.isLowPowerModeEnabled,
-            },
-        };
-    }
-};
-const setPowerState = (powerMode) => {
-    if (!osInfo) {
-        deviceState = { oneofKind: undefined };
-        return;
-    }
-    if (osInfo.name === 'android') {
-        deviceState = {
-            oneofKind: 'android',
-            android: {
-                thermalState: deviceState?.oneofKind === 'android'
-                    ? deviceState.android.thermalState
-                    : AndroidThermalState.UNSPECIFIED,
-                isPowerSaverMode: powerMode,
-            },
-        };
-    }
-    if (osInfo.name.toLowerCase() === 'ios') {
-        deviceState = {
-            oneofKind: 'apple',
-            apple: {
-                thermalState: deviceState?.oneofKind === 'apple'
-                    ? deviceState.apple.thermalState
-                    : AppleThermalState.UNSPECIFIED,
-                isLowPowerModeEnabled: powerMode,
-            },
-        };
-    }
-};
-const getDeviceState = () => {
-    return deviceState;
-};
-const getClientDetails = () => {
-    if (isReactNative()) {
-        // Since RN doesn't support web, sharing browser info is not required
-        return {
-            sdk: getSdkInfo(),
-            os: getOSInfo(),
-            device: getDeviceInfo(),
-        };
-    }
-    const userAgent = new UAParser(navigator.userAgent);
-    const { browser, os, device, cpu } = userAgent.getResult();
-    return {
-        sdk: getSdkInfo(),
-        browser: {
-            name: browser.name || navigator.userAgent,
-            version: browser.version || '',
-        },
-        os: {
-            name: os.name || '',
-            version: os.version || '',
-            architecture: cpu.architecture || '',
-        },
-        device: {
-            name: [device.vendor, device.model, device.type]
-                .filter(Boolean)
-                .join(' '),
-            version: '',
-        },
-    };
-};
-
-/**
- * Checks whether the current browser is Safari.
- */
-const isSafari = () => {
-    if (typeof navigator === 'undefined')
-        return false;
-    return /^((?!chrome|android).)*safari/i.test(navigator.userAgent || '');
-};
-/**
- * Checks whether the current browser is Firefox.
- */
-const isFirefox = () => {
-    if (typeof navigator === 'undefined')
-        return false;
-    return navigator.userAgent?.includes('Firefox');
-};
-/**
- * Checks whether the current browser is Google Chrome.
- */
-const isChrome = () => {
-    if (typeof navigator === 'undefined')
-        return false;
-    return navigator.userAgent?.includes('Chrome');
-};
-
-var browsers = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    isChrome: isChrome,
-    isFirefox: isFirefox,
-    isSafari: isSafari
-});
-
-/**
- * Returns back a list of sorted codecs, with the preferred codec first.
- *
- * @param kind the kind of codec to get.
- * @param preferredCodec the codec to prioritize (vp8, h264, vp9, av1...).
- * @param codecToRemove the codec to exclude from the list.
- * @param codecPreferencesSource the source of the codec preferences.
- */
-const getPreferredCodecs = (kind, preferredCodec, codecToRemove, codecPreferencesSource) => {
-    const source = codecPreferencesSource === 'receiver' ? RTCRtpReceiver : RTCRtpSender;
-    if (!('getCapabilities' in source))
-        return;
-    const capabilities = source.getCapabilities(kind);
-    if (!capabilities)
-        return;
-    const preferred = [];
-    const partiallyPreferred = [];
-    const unpreferred = [];
-    const preferredCodecMimeType = `${kind}/${preferredCodec.toLowerCase()}`;
-    const codecToRemoveMimeType = codecToRemove && `${kind}/${codecToRemove.toLowerCase()}`;
-    for (const codec of capabilities.codecs) {
-        const codecMimeType = codec.mimeType.toLowerCase();
-        const shouldRemoveCodec = codecMimeType === codecToRemoveMimeType;
-        if (shouldRemoveCodec)
-            continue; // skip this codec
-        const isPreferredCodec = codecMimeType === preferredCodecMimeType;
-        if (!isPreferredCodec) {
-            unpreferred.push(codec);
-            continue;
-        }
-        // h264 is a special case, we want to prioritize the baseline codec with
-        // profile-level-id is 42e01f and packetization-mode=0 for maximum
-        // cross-browser compatibility.
-        // this branch covers the other cases, such as vp8.
-        if (codecMimeType !== 'video/h264') {
-            preferred.push(codec);
-            continue;
-        }
-        const sdpFmtpLine = codec.sdpFmtpLine;
-        if (!sdpFmtpLine || !sdpFmtpLine.includes('profile-level-id=42')) {
-            // this is not the baseline h264 codec, prioritize it lower
-            partiallyPreferred.push(codec);
-            continue;
-        }
-        if (sdpFmtpLine.includes('packetization-mode=1')) {
-            preferred.unshift(codec);
-        }
-        else {
-            preferred.push(codec);
-        }
-    }
-    // return a sorted list of codecs, with the preferred codecs first
-    return [...preferred, ...partiallyPreferred, ...unpreferred];
-};
-/**
- * Returns a generic SDP for the given direction.
- * We use this SDP to send it as part of our JoinRequest so that the SFU
- * can use it to determine client's codec capabilities.
- *
- * @param direction the direction of the transceiver.
- */
-const getGenericSdp = async (direction) => {
-    const tempPc = new RTCPeerConnection();
-    tempPc.addTransceiver('video', { direction });
-    tempPc.addTransceiver('audio', { direction });
-    const offer = await tempPc.createOffer();
-    const sdp = offer.sdp ?? '';
-    tempPc.getTransceivers().forEach((t) => {
-        t.stop?.();
-    });
-    tempPc.close();
-    return sdp;
-};
-/**
- * Returns the optimal video codec for the device.
- */
-const getOptimalVideoCodec = (preferredCodec) => {
-    if (isReactNative()) {
-        const os = getOSInfo()?.name.toLowerCase();
-        if (os === 'android')
-            return preferredOr(preferredCodec, 'vp8');
-        if (os === 'ios' || os === 'ipados') {
-            return supportsH264Baseline() ? 'h264' : 'vp8';
-        }
-        return preferredOr(preferredCodec, 'h264');
-    }
-    if (isSafari())
-        return 'h264';
-    if (isFirefox())
-        return 'vp8';
-    return preferredOr(preferredCodec, 'vp8');
-};
-/**
- * Determines if the platform supports the preferred codec.
- * If not, it returns the fallback codec.
- */
-const preferredOr = (codec, fallback) => {
-    if (!codec)
-        return fallback;
-    if (!('getCapabilities' in RTCRtpSender))
-        return fallback;
-    const capabilities = RTCRtpSender.getCapabilities('video');
-    if (!capabilities)
-        return fallback;
-    // Safari and Firefox do not have a good support encoding to SVC codecs,
-    // so we disable it for them.
-    if (isSvcCodec(codec) && (isSafari() || isFirefox()))
-        return fallback;
-    const { codecs } = capabilities;
-    const codecMimeType = `video/${codec}`.toLowerCase();
-    return codecs.some((c) => c.mimeType.toLowerCase() === codecMimeType)
-        ? codec
-        : fallback;
-};
-/**
- * Returns whether the platform supports the H264 baseline codec.
- */
-const supportsH264Baseline = () => {
-    if (!('getCapabilities' in RTCRtpSender))
-        return false;
-    const capabilities = RTCRtpSender.getCapabilities('video');
-    if (!capabilities)
-        return false;
-    return capabilities.codecs.some((c) => c.mimeType.toLowerCase() === 'video/h264' &&
-        c.sdpFmtpLine?.includes('profile-level-id=42e01f'));
-};
-/**
- * Returns whether the codec is an SVC codec.
- *
- * @param codecOrMimeType the codec to check.
- */
-const isSvcCodec = (codecOrMimeType) => {
-    if (!codecOrMimeType)
-        return false;
-    codecOrMimeType = codecOrMimeType.toLowerCase();
-    return (codecOrMimeType === 'vp9' ||
-        codecOrMimeType === 'av1' ||
-        codecOrMimeType === 'video/vp9' ||
-        codecOrMimeType === 'video/av1');
-};
-
-const sfuEventKinds = {
-    subscriberOffer: undefined,
-    publisherAnswer: undefined,
-    connectionQualityChanged: undefined,
-    audioLevelChanged: undefined,
-    iceTrickle: undefined,
-    changePublishQuality: undefined,
-    participantJoined: undefined,
-    participantLeft: undefined,
-    dominantSpeakerChanged: undefined,
-    joinResponse: undefined,
-    healthCheckResponse: undefined,
-    trackPublished: undefined,
-    trackUnpublished: undefined,
-    error: undefined,
-    callGrantsUpdated: undefined,
-    goAway: undefined,
-    iceRestart: undefined,
-    pinsUpdated: undefined,
-    callEnded: undefined,
-    participantUpdated: undefined,
-    participantMigrationComplete: undefined,
-    codecNegotiationComplete: undefined,
-    changePublishOptions: undefined,
-};
-const isSfuEvent = (eventName) => {
-    return Object.prototype.hasOwnProperty.call(sfuEventKinds, eventName);
-};
-class Dispatcher {
-    constructor() {
-        this.logger = getLogger(['Dispatcher']);
-        this.subscribers = {};
-        this.dispatch = (message, logTag = '0') => {
-            const eventKind = message.eventPayload.oneofKind;
-            if (!eventKind)
-                return;
-            const payload = message.eventPayload[eventKind];
-            this.logger('debug', `Dispatching ${eventKind}, tag=${logTag}`, payload);
-            const listeners = this.subscribers[eventKind];
-            if (!listeners)
-                return;
-            for (const fn of listeners) {
-                try {
-                    fn(payload);
-                }
-                catch (e) {
-                    this.logger('warn', 'Listener failed with error', e);
-                }
-            }
-        };
-        this.on = (eventName, fn) => {
-            var _a;
-            ((_a = this.subscribers)[eventName] ?? (_a[eventName] = [])).push(fn);
-            return () => {
-                this.off(eventName, fn);
-            };
-        };
-        this.off = (eventName, fn) => {
-            this.subscribers[eventName] = (this.subscribers[eventName] || []).filter((f) => f !== fn);
-        };
-        this.offAll = (eventName) => {
-            if (eventName) {
-                this.subscribers[eventName] = [];
-            }
-            else {
-                this.subscribers = {};
-            }
+        this.on = (eventName, fn) => {
+            var _a;
+            ((_a = this.subscribers)[eventName] ?? (_a[eventName] = [])).push(fn);
+            return () => {
+                this.off(eventName, fn);
+            };
+        };
+        this.off = (eventName, fn) => {
+            this.subscribers[eventName] = (this.subscribers[eventName] || []).filter((f) => f !== fn);
         };
     }
 }
@@ -3681,284 +3538,34 @@ class IceTrickleBuffer {
         this.subscriberCandidates = new ReplaySubject();
         this.publisherCandidates = new ReplaySubject();
         this.push = (iceTrickle) => {
+            const iceCandidate = toIceCandidate(iceTrickle);
+            if (!iceCandidate)
+                return;
             if (iceTrickle.peerType === PeerType.SUBSCRIBER) {
-                this.subscriberCandidates.next(iceTrickle);
+                this.subscriberCandidates.next(iceCandidate);
             }
             else if (iceTrickle.peerType === PeerType.PUBLISHER_UNSPECIFIED) {
-                this.publisherCandidates.next(iceTrickle);
+                this.publisherCandidates.next(iceCandidate);
             }
             else {
                 const logger = getLogger(['sfu-client']);
                 logger('warn', `ICETrickle, Unknown peer type`, iceTrickle);
             }
         };
-    }
-}
-
-function getIceCandidate(candidate) {
-    if (!candidate.usernameFragment) {
-        // react-native-webrtc doesn't include usernameFragment in the candidate
-        const splittedCandidate = candidate.candidate.split(' ');
-        const ufragIndex = splittedCandidate.findIndex((s) => s === 'ufrag') + 1;
-        const usernameFragment = splittedCandidate[ufragIndex];
-        return JSON.stringify({ ...candidate, usernameFragment });
-    }
-    else {
-        return JSON.stringify(candidate.toJSON());
-    }
-}
-
-const bitrateLookupTable = {
-    h264: {
-        2160: 5000000,
-        1440: 3000000,
-        1080: 2000000,
-        720: 1250000,
-        540: 750000,
-        360: 400000,
-        default: 1250000,
-    },
-    vp8: {
-        2160: 5000000,
-        1440: 2750000,
-        1080: 2000000,
-        720: 1250000,
-        540: 600000,
-        360: 350000,
-        default: 1250000,
-    },
-    vp9: {
-        2160: 3000000,
-        1440: 2000000,
-        1080: 1500000,
-        720: 1250000,
-        540: 500000,
-        360: 275000,
-        default: 1250000,
-    },
-    av1: {
-        2160: 2000000,
-        1440: 1550000,
-        1080: 1000000,
-        720: 600000,
-        540: 350000,
-        360: 200000,
-        default: 600000,
-    },
-};
-const getOptimalBitrate = (codec, frameHeight) => {
-    const codecLookup = bitrateLookupTable[codec];
-    if (!codecLookup)
-        throw new Error(`Unknown codec: ${codec}`);
-    let bitrate = codecLookup[frameHeight];
-    if (!bitrate) {
-        const keys = Object.keys(codecLookup).map(Number);
-        const nearest = keys.reduce((a, b) => Math.abs(b - frameHeight) < Math.abs(a - frameHeight) ? b : a);
-        bitrate = codecLookup[nearest];
-    }
-    return bitrate ?? codecLookup.default;
-};
-
-const DEFAULT_BITRATE = 1250000;
-const defaultTargetResolution = {
-    bitrate: DEFAULT_BITRATE,
-    width: 1280,
-    height: 720,
-};
-const defaultBitratePerRid = {
-    q: 300000,
-    h: 750000,
-    f: DEFAULT_BITRATE,
-};
-/**
- * In SVC, we need to send only one video encoding (layer).
- * this layer will have the additional spatial and temporal layers
- * defined via the scalabilityMode property.
- *
- * @param layers the layers to process.
- */
-const toSvcEncodings = (layers) => {
-    // we take the `f` layer, and we rename it to `q`.
-    return layers?.filter((l) => l.rid === 'f').map((l) => ({ ...l, rid: 'q' }));
-};
-/**
- * Converts the rid to a video quality.
- */
-const ridToVideoQuality = (rid) => {
-    return rid === 'q'
-        ? VideoQuality.LOW_UNSPECIFIED
-        : rid === 'h'
-            ? VideoQuality.MID
-            : VideoQuality.HIGH; // default to HIGH
-};
-/**
- * Determines the most optimal video layers for simulcasting
- * for the given track.
- *
- * @param videoTrack the video track to find optimal layers for.
- * @param targetResolution the expected target resolution.
- * @param codecInUse the codec in use.
- * @param publishOptions the publish options for the track.
- */
-const findOptimalVideoLayers = (videoTrack, targetResolution = defaultTargetResolution, codecInUse, publishOptions) => {
-    const optimalVideoLayers = [];
-    const settings = videoTrack.getSettings();
-    const { width = 0, height = 0 } = settings;
-    const { scalabilityMode, bitrateDownscaleFactor = 2, maxSimulcastLayers = 3, } = publishOptions || {};
-    const maxBitrate = getComputedMaxBitrate(targetResolution, width, height, codecInUse, publishOptions);
-    let downscaleFactor = 1;
-    let bitrateFactor = 1;
-    const svcCodec = isSvcCodec(codecInUse);
-    const totalLayers = svcCodec ? 3 : Math.min(3, maxSimulcastLayers);
-    for (const rid of ['f', 'h', 'q'].slice(0, totalLayers)) {
-        const layer = {
-            active: true,
-            rid,
-            width: Math.round(width / downscaleFactor),
-            height: Math.round(height / downscaleFactor),
-            maxBitrate: Math.round(maxBitrate / bitrateFactor) || defaultBitratePerRid[rid],
-            maxFramerate: 30,
+        this.dispose = () => {
+            this.subscriberCandidates.complete();
+            this.publisherCandidates.complete();
         };
-        if (svcCodec) {
-            // for SVC codecs, we need to set the scalability mode, and the
-            // codec will handle the rest (layers, temporal layers, etc.)
-            layer.scalabilityMode = scalabilityMode || 'L3T2_KEY';
-        }
-        else {
-            // for non-SVC codecs, we need to downscale proportionally (simulcast)
-            layer.scaleResolutionDownBy = downscaleFactor;
-        }
-        downscaleFactor *= 2;
-        bitrateFactor *= bitrateDownscaleFactor;
-        // Reversing the order [f, h, q] to [q, h, f] as Chrome uses encoding index
-        // when deciding which layer to disable when CPU or bandwidth is constrained.
-        // Encodings should be ordered in increasing spatial resolution order.
-        optimalVideoLayers.unshift(layer);
-    }
-    // for simplicity, we start with all layers enabled, then this function
-    // will clear/reassign the layers that are not needed
-    return withSimulcastConstraints(settings, optimalVideoLayers);
-};
-/**
- * Computes the maximum bitrate for a given resolution.
- * If the current resolution is lower than the target resolution,
- * we want to proportionally reduce the target bitrate.
- * If the current resolution is higher than the target resolution,
- * we want to use the target bitrate.
- *
- * @param targetResolution the target resolution.
- * @param currentWidth the current width of the track.
- * @param currentHeight the current height of the track.
- * @param codecInUse the codec in use.
- * @param publishOptions the publish options.
- */
-const getComputedMaxBitrate = (targetResolution, currentWidth, currentHeight, codecInUse, publishOptions) => {
-    // if the current resolution is lower than the target resolution,
-    // we want to proportionally reduce the target bitrate
-    const { width: targetWidth, height: targetHeight, bitrate: targetBitrate, } = targetResolution;
-    const { preferredBitrate } = publishOptions || {};
-    const frameHeight = currentWidth > currentHeight ? currentHeight : currentWidth;
-    const bitrate = preferredBitrate ||
-        (codecInUse ? getOptimalBitrate(codecInUse, frameHeight) : targetBitrate);
-    if (currentWidth < targetWidth || currentHeight < targetHeight) {
-        const currentPixels = currentWidth * currentHeight;
-        const targetPixels = targetWidth * targetHeight;
-        const reductionFactor = currentPixels / targetPixels;
-        return Math.round(bitrate * reductionFactor);
-    }
-    return bitrate;
-};
-/**
- * Browsers have different simulcast constraints for different video resolutions.
- *
- * This function modifies the provided list of video layers according to the
- * current implementation of simulcast constraints in the Chromium based browsers.
- *
- * https://chromium.googlesource.com/external/webrtc/+/refs/heads/main/media/engine/simulcast.cc#90
- */
-const withSimulcastConstraints = (settings, optimalVideoLayers) => {
-    let layers;
-    const size = Math.max(settings.width || 0, settings.height || 0);
-    if (size <= 320) {
-        // provide only one layer 320x240 (q), the one with the highest quality
-        layers = optimalVideoLayers.filter((layer) => layer.rid === 'f');
-    }
-    else if (size <= 640) {
-        // provide two layers, 160x120 (q) and 640x480 (h)
-        layers = optimalVideoLayers.filter((layer) => layer.rid !== 'h');
-    }
-    else {
-        // provide three layers for sizes > 640x480
-        layers = optimalVideoLayers;
-    }
-    const ridMapping = ['q', 'h', 'f'];
-    return layers.map((layer, index) => ({
-        ...layer,
-        rid: ridMapping[index], // reassign rid
-    }));
-};
-const findOptimalScreenSharingLayers = (videoTrack, publishOptions, defaultMaxBitrate = 3000000) => {
-    const { screenShareSettings: preferences } = publishOptions || {};
-    const settings = videoTrack.getSettings();
-    return [
-        {
-            active: true,
-            rid: 'q', // single track, start from 'q'
-            width: settings.width || 0,
-            height: settings.height || 0,
-            scaleResolutionDownBy: 1,
-            maxBitrate: preferences?.maxBitrate ?? defaultMaxBitrate,
-            maxFramerate: preferences?.maxFramerate ?? 30,
-        },
-    ];
-};
-
-const ensureExhausted = (x, message) => {
-    getLogger(['helpers'])('warn', message, x);
-};
-
-const trackTypeToParticipantStreamKey = (trackType) => {
-    switch (trackType) {
-        case TrackType.SCREEN_SHARE:
-            return 'screenShareStream';
-        case TrackType.SCREEN_SHARE_AUDIO:
-            return 'screenShareAudioStream';
-        case TrackType.VIDEO:
-            return 'videoStream';
-        case TrackType.AUDIO:
-            return 'audioStream';
-        case TrackType.UNSPECIFIED:
-            throw new Error('Track type is unspecified');
-        default:
-            ensureExhausted(trackType, 'Unknown track type');
     }
-};
-const muteTypeToTrackType = (muteType) => {
-    switch (muteType) {
-        case 'audio':
-            return TrackType.AUDIO;
-        case 'video':
-            return TrackType.VIDEO;
-        case 'screenshare':
-            return TrackType.SCREEN_SHARE;
-        case 'screenshare_audio':
-            return TrackType.SCREEN_SHARE_AUDIO;
-        default:
-            ensureExhausted(muteType, 'Unknown mute type');
+}
+const toIceCandidate = (iceTrickle) => {
+    try {
+        return JSON.parse(iceTrickle.iceCandidate);
     }
-};
-const toTrackType = (trackType) => {
-    switch (trackType) {
-        case 'TRACK_TYPE_AUDIO':
-            return TrackType.AUDIO;
-        case 'TRACK_TYPE_VIDEO':
-            return TrackType.VIDEO;
-        case 'TRACK_TYPE_SCREEN_SHARE':
-            return TrackType.SCREEN_SHARE;
-        case 'TRACK_TYPE_SCREEN_SHARE_AUDIO':
-            return TrackType.SCREEN_SHARE_AUDIO;
-        default:
-            return undefined;
+    catch (e) {
+        const logger = getLogger(['sfu-client']);
+        logger('error', `Failed to parse ICE Trickle`, e, iceTrickle);
+        return undefined;
     }
 };
 
@@ -4102,6 +3709,24 @@ const setCurrentValue = (subject, update) => {
     subject.next(next);
     return next;
 };
+/**
+ * Updates the value of the provided Subject and returns the previous value
+ * and a function to roll back the update.
+ * This is useful when you want to optimistically update a value
+ * and roll back the update if an error occurs.
+ *
+ * @param subject the subject to update.
+ * @param update the update to apply to the subject.
+ */
+const updateValue = (subject, update) => {
+    const lastValue = subject.getValue();
+    const value = setCurrentValue(subject, update);
+    return {
+        lastValue,
+        value,
+        rollback: () => setCurrentValue(subject, lastValue),
+    };
+};
 /**
  * Creates a subscription and returns a function to unsubscribe.
  *
@@ -4135,7 +3760,8 @@ var rxUtils = /*#__PURE__*/Object.freeze({
     createSafeAsyncSubscription: createSafeAsyncSubscription,
     createSubscription: createSubscription,
     getCurrentValue: getCurrentValue,
-    setCurrentValue: setCurrentValue
+    setCurrentValue: setCurrentValue,
+    updateValue: updateValue
 });
 
 /**
@@ -4582,6 +4208,7 @@ class CallState {
         this.sessionSubject = new BehaviorSubject(undefined);
         this.settingsSubject = new BehaviorSubject(undefined);
         this.transcribingSubject = new BehaviorSubject(false);
+        this.captioningSubject = new BehaviorSubject(false);
         this.endedBySubject = new BehaviorSubject(undefined);
         this.thumbnailsSubject = new BehaviorSubject(undefined);
         this.membersSubject = new BehaviorSubject([]);
@@ -4592,6 +4219,7 @@ class CallState {
         this.anonymousParticipantCountSubject = new BehaviorSubject(0);
         this.participantsSubject = new BehaviorSubject([]);
         this.callStatsReportSubject = new BehaviorSubject(undefined);
+        this.closedCaptionsSubject = new BehaviorSubject([]);
         // These are tracks that were delivered to the Subscriber's onTrack event
         // that we couldn't associate with a participant yet.
         // This happens when the participantJoined event hasn't been received yet.
@@ -4600,10 +4228,18 @@ class CallState {
         this.logger = getLogger(['CallState']);
         /**
          * A list of comparators that are used to sort the participants.
-         *
-         * @private
          */
         this.sortParticipantsBy = defaultSortPreset;
+        this.closedCaptionsTasks = new Map();
+        /**
+         * Runs the cleanup tasks.
+         */
+        this.dispose = () => {
+            for (const [ccKey, taskId] of this.closedCaptionsTasks.entries()) {
+                clearTimeout(taskId);
+                this.closedCaptionsTasks.delete(ccKey);
+            }
+        };
         /**
          * Sets the list of criteria that are used to sort the participants.
          * To disable sorting, you can pass `noopComparator()`.
@@ -4652,6 +4288,15 @@ class CallState {
         this.setStartedAt = (startedAt) => {
             return this.setCurrentValue(this.startedAtSubject, startedAt);
         };
+        /**
+         * Sets the closed captioning state of the current call.
+         *
+         * @internal
+         * @param captioning the closed captioning state.
+         */
+        this.setCaptioning = (captioning) => {
+            return updateValue(this.captioningSubject, captioning);
+        };
         /**
          * Sets the number of anonymous participants in the current call.
          *
@@ -4750,7 +4395,6 @@ class CallState {
             }
             const thePatch = typeof patch === 'function' ? patch(participant) : patch;
             const updatedParticipant = {
-                // FIXME OL: this is not a deep merge, we might want to revisit this
                 ...participant,
                 ...thePatch,
             };
@@ -4812,7 +4456,6 @@ class CallState {
          *
          * @param trackType the kind of subscription to update.
          * @param changes the list of subscription changes to do.
-         * @param type the debounce type to use for the update.
          */
         this.updateParticipantTracks = (trackType, changes) => {
             return this.updateParticipants(Object.entries(changes).reduce((acc, [sessionId, change]) => {
@@ -4915,6 +4558,14 @@ class CallState {
             }
             return orphans;
         };
+        /**
+         * Updates the closed captions settings.
+         *
+         * @param config the new closed captions settings.
+         */
+        this.updateClosedCaptionSettings = (config) => {
+            this.closedCaptionsSettings = { ...this.closedCaptionsSettings, ...config };
+        };
         /**
          * Updates the call state with the data received from the server.
          *
@@ -4938,6 +4589,7 @@ class CallState {
             this.updateParticipantCountFromSession(s);
             this.setCurrentValue(this.settingsSubject, call.settings);
             this.setCurrentValue(this.transcribingSubject, call.transcribing);
+            this.setCurrentValue(this.captioningSubject, call.captioning);
             this.setCurrentValue(this.thumbnailsSubject, call.thumbnails);
         };
         /**
@@ -5129,6 +4781,35 @@ class CallState {
                 this.setCurrentValue(this.ownCapabilitiesSubject, event.own_capabilities);
             }
         };
+        this.updateFromClosedCaptions = (event) => {
+            this.setCurrentValue(this.closedCaptionsSubject, (queue) => {
+                const { closed_caption } = event;
+                const keyOf = (c) => `${c.speaker_id}/${c.start_time}`;
+                const currentKey = keyOf(closed_caption);
+                const duplicate = queue.some((caption) => keyOf(caption) === currentKey);
+                if (duplicate)
+                    return queue;
+                const nextQueue = [...queue, closed_caption];
+                const { visibilityDurationMs = 2700, maxVisibleCaptions = 2 } = this.closedCaptionsSettings || {};
+                // schedule the removal of the closed caption after the retention time
+                if (visibilityDurationMs > 0) {
+                    const taskId = setTimeout(() => {
+                        this.setCurrentValue(this.closedCaptionsSubject, (captions) => captions.filter((caption) => caption !== closed_caption));
+                        this.closedCaptionsTasks.delete(currentKey);
+                    }, visibilityDurationMs);
+                    this.closedCaptionsTasks.set(currentKey, taskId);
+                    // cancel the cleanup tasks for the closed captions that are no longer in the queue
+                    for (let i = 0; i < nextQueue.length - maxVisibleCaptions; i++) {
+                        const key = keyOf(nextQueue[i]);
+                        const task = this.closedCaptionsTasks.get(key);
+                        clearTimeout(task);
+                        this.closedCaptionsTasks.delete(key);
+                    }
+                }
+                // trim the queue
+                return nextQueue.slice(-maxVisibleCaptions);
+            });
+        };
         this.participants$ = this.participantsSubject.asObservable().pipe(
         // maintain stable-sort by mutating the participants stored
         // in the original subject
@@ -5155,6 +4836,7 @@ class CallState {
         this.settings$ = this.settingsSubject.asObservable();
         this.endedBy$ = this.endedBySubject.asObservable();
         this.thumbnails$ = this.thumbnailsSubject.asObservable();
+        this.closedCaptions$ = this.closedCaptionsSubject.asObservable();
         /**
          * Performs shallow comparison of two arrays.
          * Expects primitive values: [1, 2, 3] is equal to [2, 1, 3].
@@ -5184,9 +4866,9 @@ class CallState {
         this.participantCount$ = duc(this.participantCountSubject);
         this.recording$ = duc(this.recordingSubject);
         this.transcribing$ = duc(this.transcribingSubject);
+        this.captioning$ = duc(this.captioningSubject);
         this.eventHandlers = {
             // these events are not updating the call state:
-            'call.closed_caption': undefined,
             'call.deleted': undefined,
             'call.permission_request': undefined,
             'call.recording_ready': undefined,
@@ -5207,6 +4889,16 @@ class CallState {
             // events that update call state:
             'call.accepted': (e) => this.updateFromCallResponse(e.call),
             'call.blocked_user': this.blockUser,
+            'call.closed_caption': this.updateFromClosedCaptions,
+            'call.closed_captions_failed': () => {
+                this.setCurrentValue(this.captioningSubject, false);
+            },
+            'call.closed_captions_started': () => {
+                this.setCurrentValue(this.captioningSubject, true);
+            },
+            'call.closed_captions_stopped': () => {
+                this.setCurrentValue(this.captioningSubject, false);
+            },
             'call.created': (e) => this.updateFromCallResponse(e.call),
             'call.ended': (e) => {
                 this.updateFromCallResponse(e.call);
@@ -5264,6 +4956,12 @@ class CallState {
     get startedAt() {
         return this.getCurrentValue(this.startedAt$);
     }
+    /**
+     * Returns whether closed captions are enabled in the current call.
+     */
+    get captioning() {
+        return this.getCurrentValue(this.captioning$);
+    }
     /**
      * The server-side counted number of anonymous participants connected to the current call.
      * This number includes the anonymous participants as well.
@@ -5427,200 +5125,454 @@ class CallState {
     get thumbnails() {
         return this.getCurrentValue(this.thumbnails$);
     }
+    /**
+     * Returns the current queue of closed captions.
+     */
+    get closedCaptions() {
+        return this.getCurrentValue(this.closedCaptions$);
+    }
 }
 
-const getRtpMap = (line) => {
-    // Example: a=rtpmap:110 opus/48000/2
-    const rtpRegex = /^a=rtpmap:(\d*) ([\w\-.]*)(?:\s*\/(\d*)(?:\s*\/(\S*))?)?/;
-    // The first captured group is the payload type number, the second captured group is the encoding name, the third captured group is the clock rate, and the fourth captured group is any additional parameters.
-    const rtpMatch = rtpRegex.exec(line);
-    if (rtpMatch) {
-        return {
-            original: rtpMatch[0],
-            payload: rtpMatch[1],
-            codec: rtpMatch[2],
+/**
+ * A base class for the `Publisher` and `Subscriber` classes.
+ * @internal
+ */
+class BasePeerConnection {
+    /**
+     * Constructs a new `BasePeerConnection` instance.
+     */
+    constructor(peerType, { sfuClient, connectionConfig, state, dispatcher, onUnrecoverableError, logTag, }) {
+        this.isIceRestarting = false;
+        this.subscriptions = [];
+        /**
+         * Disposes the `RTCPeerConnection` instance.
+         */
+        this.dispose = () => {
+            this.detachEventHandlers();
+            this.pc.close();
+        };
+        /**
+         * Handles events synchronously.
+         * Consecutive events are queued and executed one after the other.
+         */
+        this.on = (event, fn) => {
+            this.subscriptions.push(this.dispatcher.on(event, (e) => {
+                withoutConcurrency(`pc.${event}`, async () => fn(e)).catch((err) => {
+                    this.logger('warn', `Error handling ${event}`, err);
+                });
+            }));
+        };
+        /**
+         * Appends the trickled ICE candidates to the `RTCPeerConnection`.
+         */
+        this.addTrickledIceCandidates = () => {
+            const { iceTrickleBuffer } = this.sfuClient;
+            const observable = this.peerType === PeerType.SUBSCRIBER
+                ? iceTrickleBuffer.subscriberCandidates
+                : iceTrickleBuffer.publisherCandidates;
+            this.unsubscribeIceTrickle?.();
+            this.unsubscribeIceTrickle = createSafeAsyncSubscription(observable, async (candidate) => {
+                return this.pc.addIceCandidate(candidate).catch((e) => {
+                    this.logger('warn', `ICE candidate error`, e, candidate);
+                });
+            });
+        };
+        /**
+         * Sets the SFU client to use.
+         *
+         * @param sfuClient the SFU client to use.
+         */
+        this.setSfuClient = (sfuClient) => {
+            this.sfuClient = sfuClient;
+        };
+        /**
+         * Returns the result of the `RTCPeerConnection.getStats()` method
+         * @param selector an optional `MediaStreamTrack` to get the stats for.
+         */
+        this.getStats = (selector) => {
+            return this.pc.getStats(selector);
+        };
+        /**
+         * Handles the ICECandidate event and
+         * Initiates an ICE Trickle process with the SFU.
+         */
+        this.onIceCandidate = (e) => {
+            const { candidate } = e;
+            if (!candidate) {
+                this.logger('debug', 'null ice candidate');
+                return;
+            }
+            const iceCandidate = this.toJSON(candidate);
+            this.sfuClient
+                .iceTrickle({ peerType: this.peerType, iceCandidate })
+                .catch((err) => this.logger('warn', `ICETrickle failed`, err));
+        };
+        /**
+         * Converts the ICE candidate to a JSON string.
+         */
+        this.toJSON = (candidate) => {
+            if (!candidate.usernameFragment) {
+                // react-native-webrtc doesn't include usernameFragment in the candidate
+                const segments = candidate.candidate.split(' ');
+                const ufragIndex = segments.findIndex((s) => s === 'ufrag') + 1;
+                const usernameFragment = segments[ufragIndex];
+                return JSON.stringify({ ...candidate, usernameFragment });
+            }
+            return JSON.stringify(candidate.toJSON());
+        };
+        /**
+         * Handles the ICE connection state change event.
+         */
+        this.onIceConnectionStateChange = () => {
+            const state = this.pc.iceConnectionState;
+            this.logger('debug', `ICE connection state changed`, state);
+            if (this.state.callingState === CallingState.RECONNECTING)
+                return;
+            // do nothing when ICE is restarting
+            if (this.isIceRestarting)
+                return;
+            if (state === 'failed' || state === 'disconnected') {
+                this.logger('debug', `Attempting to restart ICE`);
+                this.restartIce().catch((e) => {
+                    this.logger('error', `ICE restart failed`, e);
+                    this.onUnrecoverableError?.();
+                });
+            }
+        };
+        /**
+         * Handles the ICE candidate error event.
+         */
+        this.onIceCandidateError = (e) => {
+            const errorMessage = e instanceof RTCPeerConnectionIceErrorEvent &&
+                `${e.errorCode}: ${e.errorText}`;
+            const iceState = this.pc.iceConnectionState;
+            const logLevel = iceState === 'connected' || iceState === 'checking' ? 'debug' : 'warn';
+            this.logger(logLevel, `ICE Candidate error`, errorMessage);
+        };
+        /**
+         * Handles the ICE gathering state change event.
+         */
+        this.onIceGatherChange = () => {
+            this.logger('debug', `ICE Gathering State`, this.pc.iceGatheringState);
+        };
+        /**
+         * Handles the signaling state change event.
+         */
+        this.onSignalingChange = () => {
+            this.logger('debug', `Signaling state changed`, this.pc.signalingState);
         };
+        this.peerType = peerType;
+        this.sfuClient = sfuClient;
+        this.state = state;
+        this.dispatcher = dispatcher;
+        this.onUnrecoverableError = onUnrecoverableError;
+        this.logger = getLogger([
+            peerType === PeerType.SUBSCRIBER ? 'Subscriber' : 'Publisher',
+            logTag,
+        ]);
+        this.pc = new RTCPeerConnection(connectionConfig);
+        this.pc.addEventListener('icecandidate', this.onIceCandidate);
+        this.pc.addEventListener('icecandidateerror', this.onIceCandidateError);
+        this.pc.addEventListener('iceconnectionstatechange', this.onIceConnectionStateChange);
+        this.pc.addEventListener('icegatheringstatechange', this.onIceGatherChange);
+        this.pc.addEventListener('signalingstatechange', this.onSignalingChange);
     }
-};
-const getFmtp = (line) => {
-    // Example: a=fmtp:111 minptime=10; useinbandfec=1
-    const fmtpRegex = /^a=fmtp:(\d*) (.*)/;
-    const fmtpMatch = fmtpRegex.exec(line);
-    // The first captured group is the payload type number, the second captured group is any additional parameters.
-    if (fmtpMatch) {
-        return {
-            original: fmtpMatch[0],
-            payload: fmtpMatch[1],
-            config: fmtpMatch[2],
+    /**
+     * Detaches the event handlers from the `RTCPeerConnection`.
+     */
+    detachEventHandlers() {
+        this.pc.removeEventListener('icecandidate', this.onIceCandidate);
+        this.pc.removeEventListener('icecandidateerror', this.onIceCandidateError);
+        this.pc.removeEventListener('signalingstatechange', this.onSignalingChange);
+        this.pc.removeEventListener('iceconnectionstatechange', this.onIceConnectionStateChange);
+        this.pc.removeEventListener('icegatheringstatechange', this.onIceGatherChange);
+        this.unsubscribeIceTrickle?.();
+        this.subscriptions.forEach((unsubscribe) => unsubscribe());
+    }
+}
+
+class TransceiverCache {
+    constructor() {
+        this.cache = [];
+        this.layers = [];
+        /**
+         * An array maintaining the order how transceivers were added to the peer connection.
+         * This is needed because some browsers (Firefox) don't reliably report
+         * trackId and `mid` parameters.
+         */
+        this.transceiverOrder = [];
+        /**
+         * Adds a transceiver to the cache.
+         */
+        this.add = (publishOption, transceiver) => {
+            this.cache.push({ publishOption, transceiver });
+            this.transceiverOrder.push(transceiver);
+        };
+        /**
+         * Gets the transceiver for the given publish option.
+         */
+        this.get = (publishOption) => {
+            return this.findTransceiver(publishOption)?.transceiver;
+        };
+        /**
+         * Gets the last transceiver for the given track type and publish option id.
+         */
+        this.getWith = (trackType, id) => {
+            return this.findTransceiver({ trackType, id })?.transceiver;
+        };
+        /**
+         * Checks if the cache has the given publish option.
+         */
+        this.has = (publishOption) => {
+            return !!this.get(publishOption);
+        };
+        /**
+         * Finds the first transceiver that satisfies the given predicate.
+         */
+        this.find = (predicate) => {
+            return this.cache.find(predicate);
+        };
+        /**
+         * Provides all the items in the cache.
+         */
+        this.items = () => {
+            return this.cache;
+        };
+        /**
+         * Init index of the transceiver in the cache.
+         */
+        this.indexOf = (transceiver) => {
+            return this.transceiverOrder.indexOf(transceiver);
         };
+        /**
+         * Gets cached video layers for the given track.
+         */
+        this.getLayers = (publishOption) => {
+            const entry = this.layers.find((item) => item.publishOption.id === publishOption.id &&
+                item.publishOption.trackType === publishOption.trackType);
+            return entry?.layers;
+        };
+        /**
+         * Sets the video layers for the given track.
+         */
+        this.setLayers = (publishOption, layers = []) => {
+            const entry = this.findLayer(publishOption);
+            if (entry) {
+                entry.layers = layers;
+            }
+            else {
+                this.layers.push({ publishOption, layers });
+            }
+        };
+        this.findTransceiver = (publishOption) => {
+            return this.cache.find((item) => item.publishOption.id === publishOption.id &&
+                item.publishOption.trackType === publishOption.trackType);
+        };
+        this.findLayer = (publishOption) => {
+            return this.layers.find((item) => item.publishOption.id === publishOption.id &&
+                item.publishOption.trackType === publishOption.trackType);
+        };
+    }
+}
+
+const ensureExhausted = (x, message) => {
+    getLogger(['helpers'])('warn', message, x);
+};
+
+const trackTypeToParticipantStreamKey = (trackType) => {
+    switch (trackType) {
+        case TrackType.SCREEN_SHARE:
+            return 'screenShareStream';
+        case TrackType.SCREEN_SHARE_AUDIO:
+            return 'screenShareAudioStream';
+        case TrackType.VIDEO:
+            return 'videoStream';
+        case TrackType.AUDIO:
+            return 'audioStream';
+        case TrackType.UNSPECIFIED:
+            throw new Error('Track type is unspecified');
+        default:
+            ensureExhausted(trackType, 'Unknown track type');
     }
 };
+const muteTypeToTrackType = (muteType) => {
+    switch (muteType) {
+        case 'audio':
+            return TrackType.AUDIO;
+        case 'video':
+            return TrackType.VIDEO;
+        case 'screenshare':
+            return TrackType.SCREEN_SHARE;
+        case 'screenshare_audio':
+            return TrackType.SCREEN_SHARE_AUDIO;
+        default:
+            ensureExhausted(muteType, 'Unknown mute type');
+    }
+};
+const toTrackType = (trackType) => {
+    switch (trackType) {
+        case 'TRACK_TYPE_AUDIO':
+            return TrackType.AUDIO;
+        case 'TRACK_TYPE_VIDEO':
+            return TrackType.VIDEO;
+        case 'TRACK_TYPE_SCREEN_SHARE':
+            return TrackType.SCREEN_SHARE;
+        case 'TRACK_TYPE_SCREEN_SHARE_AUDIO':
+            return TrackType.SCREEN_SHARE_AUDIO;
+        default:
+            return undefined;
+    }
+};
+const isAudioTrackType = (trackType) => trackType === TrackType.AUDIO || trackType === TrackType.SCREEN_SHARE_AUDIO;
+
+const defaultBitratePerRid = {
+    q: 300000,
+    h: 750000,
+    f: 1250000,
+};
 /**
- * gets the media section for the specified media type.
- * The media section contains the media type, port, codec, and payload type.
- * Example: m=video 9 UDP/TLS/RTP/SAVPF 100 101 96 97 35 36 102 125 127
+ * In SVC, we need to send only one video encoding (layer).
+ * this layer will have the additional spatial and temporal layers
+ * defined via the scalabilityMode property.
+ *
+ * @param layers the layers to process.
  */
-const getMedia = (line, mediaType) => {
-    const regex = new RegExp(`(m=${mediaType} \\d+ [\\w/]+) ([\\d\\s]+)`);
-    const match = regex.exec(line);
-    if (match) {
-        return {
-            original: match[0],
-            mediaWithPorts: match[1],
-            codecOrder: match[2],
-        };
-    }
+const toSvcEncodings = (layers) => {
+    if (!layers)
+        return;
+    // we take the highest quality layer, and we assign it to `q` encoder.
+    const withRid = (rid) => (l) => l.rid === rid;
+    const highestLayer = layers.find(withRid('f')) ||
+        layers.find(withRid('h')) ||
+        layers.find(withRid('q'));
+    return [{ ...highestLayer, rid: 'q' }];
 };
-const getMediaSection = (sdp, mediaType) => {
-    let media;
-    const rtpMap = [];
-    const fmtp = [];
-    let isTheRequiredMediaSection = false;
-    sdp.split(/(\r\n|\r|\n)/).forEach((line) => {
-        const isValidLine = /^([a-z])=(.*)/.test(line);
-        if (!isValidLine)
-            return;
-        /*
-          NOTE: according to https://www.rfc-editor.org/rfc/rfc8866.pdf
-          Each media description starts with an "m=" line and continues to the next media description or the end of the whole session description, whichever comes first
-        */
-        const type = line[0];
-        if (type === 'm') {
-            const _media = getMedia(line, mediaType);
-            isTheRequiredMediaSection = !!_media;
-            if (_media) {
-                media = _media;
-            }
+/**
+ * Converts the rid to a video quality.
+ */
+const ridToVideoQuality = (rid) => {
+    return rid === 'q'
+        ? VideoQuality.LOW_UNSPECIFIED
+        : rid === 'h'
+            ? VideoQuality.MID
+            : VideoQuality.HIGH; // default to HIGH
+};
+/**
+ * Converts the given video layers to SFU video layers.
+ */
+const toVideoLayers = (layers = []) => {
+    return layers.map((layer) => ({
+        rid: layer.rid || '',
+        bitrate: layer.maxBitrate || 0,
+        fps: layer.maxFramerate || 0,
+        quality: ridToVideoQuality(layer.rid || ''),
+        videoDimension: { width: layer.width, height: layer.height },
+    }));
+};
+/**
+ * Converts the spatial and temporal layers to a scalability mode.
+ */
+const toScalabilityMode = (spatialLayers, temporalLayers) => `L${spatialLayers}T${temporalLayers}${spatialLayers > 1 ? '_KEY' : ''}`;
+/**
+ * Determines the most optimal video layers for the given track.
+ *
+ * @param videoTrack the video track to find optimal layers for.
+ * @param publishOption the publish options for the track.
+ */
+const computeVideoLayers = (videoTrack, publishOption) => {
+    if (isAudioTrackType(publishOption.trackType))
+        return;
+    const optimalVideoLayers = [];
+    const settings = videoTrack.getSettings();
+    const { width = 0, height = 0 } = settings;
+    const { bitrate, codec, fps, maxSpatialLayers = 3, maxTemporalLayers = 3, videoDimension = { width: 1280, height: 720 }, } = publishOption;
+    const maxBitrate = getComputedMaxBitrate(videoDimension, width, height, bitrate);
+    let downscaleFactor = 1;
+    let bitrateFactor = 1;
+    const svcCodec = isSvcCodec(codec?.name);
+    for (const rid of ['f', 'h', 'q'].slice(0, maxSpatialLayers)) {
+        const layer = {
+            active: true,
+            rid,
+            width: Math.round(width / downscaleFactor),
+            height: Math.round(height / downscaleFactor),
+            maxBitrate: maxBitrate / bitrateFactor || defaultBitratePerRid[rid],
+            maxFramerate: fps,
+        };
+        if (svcCodec) {
+            // for SVC codecs, we need to set the scalability mode, and the
+            // codec will handle the rest (layers, temporal layers, etc.)
+            layer.scalabilityMode = toScalabilityMode(maxSpatialLayers, maxTemporalLayers);
         }
-        else if (isTheRequiredMediaSection && type === 'a') {
-            const rtpMapLine = getRtpMap(line);
-            const fmtpLine = getFmtp(line);
-            if (rtpMapLine) {
-                rtpMap.push(rtpMapLine);
-            }
-            else if (fmtpLine) {
-                fmtp.push(fmtpLine);
-            }
+        else {
+            // for non-SVC codecs, we need to downscale proportionally (simulcast)
+            layer.scaleResolutionDownBy = downscaleFactor;
         }
-    });
-    if (media) {
-        return {
-            media,
-            rtpMap,
-            fmtp,
-        };
+        downscaleFactor *= 2;
+        bitrateFactor *= 2;
+        // Reversing the order [f, h, q] to [q, h, f] as Chrome uses encoding index
+        // when deciding which layer to disable when CPU or bandwidth is constrained.
+        // Encodings should be ordered in increasing spatial resolution order.
+        optimalVideoLayers.unshift(layer);
     }
+    // for simplicity, we start with all layers enabled, then this function
+    // will clear/reassign the layers that are not needed
+    return withSimulcastConstraints(settings, optimalVideoLayers);
 };
 /**
- * Gets the fmtp line corresponding to opus
+ * Computes the maximum bitrate for a given resolution.
+ * If the current resolution is lower than the target resolution,
+ * we want to proportionally reduce the target bitrate.
+ * If the current resolution is higher than the target resolution,
+ * we want to use the target bitrate.
+ *
+ * @param targetResolution the target resolution.
+ * @param currentWidth the current width of the track.
+ * @param currentHeight the current height of the track.
+ * @param bitrate the target bitrate.
  */
-const getOpusFmtp = (sdp) => {
-    const section = getMediaSection(sdp, 'audio');
-    const rtpMap = section?.rtpMap.find((r) => r.codec.toLowerCase() === 'opus');
-    const codecId = rtpMap?.payload;
-    if (codecId) {
-        return section?.fmtp.find((f) => f.payload === codecId);
+const getComputedMaxBitrate = (targetResolution, currentWidth, currentHeight, bitrate) => {
+    // if the current resolution is lower than the target resolution,
+    // we want to proportionally reduce the target bitrate
+    const { width: targetWidth, height: targetHeight } = targetResolution;
+    if (currentWidth < targetWidth || currentHeight < targetHeight) {
+        const currentPixels = currentWidth * currentHeight;
+        const targetPixels = targetWidth * targetHeight;
+        const reductionFactor = currentPixels / targetPixels;
+        return Math.round(bitrate * reductionFactor);
     }
+    return bitrate;
 };
 /**
- * Returns an SDP with DTX enabled or disabled.
- */
-const toggleDtx = (sdp, enable) => {
-    const opusFmtp = getOpusFmtp(sdp);
-    if (!opusFmtp)
-        return sdp;
-    const matchDtx = /usedtx=(\d)/.exec(opusFmtp.config);
-    const requiredDtxConfig = `usedtx=${enable ? '1' : '0'}`;
-    const newFmtp = matchDtx
-        ? opusFmtp.original.replace(/usedtx=(\d)/, requiredDtxConfig)
-        : `${opusFmtp.original};${requiredDtxConfig}`;
-    return sdp.replace(opusFmtp.original, newFmtp);
-};
-/**
- * Returns and SDP with all the codecs except the given codec removed.
- */
-const preserveCodec = (sdp, mid, codec) => {
-    const [kind, codecName] = codec.mimeType.toLowerCase().split('/');
-    const toSet = (fmtpLine) => new Set(fmtpLine.split(';').map((f) => f.trim().toLowerCase()));
-    const equal = (a, b) => {
-        if (a.size !== b.size)
-            return false;
-        for (const item of a)
-            if (!b.has(item))
-                return false;
-        return true;
-    };
-    const codecFmtp = toSet(codec.sdpFmtpLine || '');
-    const parsedSdp = SDP.parse(sdp);
-    for (const media of parsedSdp.media) {
-        if (media.type !== kind || String(media.mid) !== mid)
-            continue;
-        // find the payload id of the desired codec
-        const payloads = new Set();
-        for (const rtp of media.rtp) {
-            if (rtp.codec.toLowerCase() !== codecName)
-                continue;
-            const match = 
-            // vp8 doesn't have any fmtp, we preserve it without any additional checks
-            codecName === 'vp8'
-                ? true
-                : media.fmtp.some((f) => f.payload === rtp.payload && equal(toSet(f.config), codecFmtp));
-            if (match) {
-                payloads.add(rtp.payload);
-            }
-        }
-        // find the corresponding rtx codec by matching apt=<preserved-codec-payload>
-        for (const fmtp of media.fmtp) {
-            const match = fmtp.config.match(/(apt)=(\d+)/);
-            if (!match)
-                continue;
-            const [, , preservedCodecPayload] = match;
-            if (payloads.has(Number(preservedCodecPayload))) {
-                payloads.add(fmtp.payload);
-            }
-        }
-        media.rtp = media.rtp.filter((r) => payloads.has(r.payload));
-        media.fmtp = media.fmtp.filter((f) => payloads.has(f.payload));
-        media.rtcpFb = media.rtcpFb?.filter((f) => payloads.has(f.payload));
-        media.payloads = Array.from(payloads).join(' ');
-    }
-    return SDP.write(parsedSdp);
-};
-/**
- * Enables high-quality audio through SDP munging for the given trackMid.
+ * Browsers have different simulcast constraints for different video resolutions.
  *
- * @param sdp the SDP to munge.
- * @param trackMid the trackMid.
- * @param maxBitrate the max bitrate to set.
- */
-const enableHighQualityAudio = (sdp, trackMid, maxBitrate = 510000) => {
-    maxBitrate = Math.max(Math.min(maxBitrate, 510000), 96000);
-    const parsedSdp = SDP.parse(sdp);
-    const audioMedia = parsedSdp.media.find((m) => m.type === 'audio' && String(m.mid) === trackMid);
-    if (!audioMedia)
-        return sdp;
-    const opusRtp = audioMedia.rtp.find((r) => r.codec === 'opus');
-    if (!opusRtp)
-        return sdp;
-    const opusFmtp = audioMedia.fmtp.find((f) => f.payload === opusRtp.payload);
-    if (!opusFmtp)
-        return sdp;
-    // enable stereo, if not already enabled
-    if (opusFmtp.config.match(/stereo=(\d)/)) {
-        opusFmtp.config = opusFmtp.config.replace(/stereo=(\d)/, 'stereo=1');
-    }
-    else {
-        opusFmtp.config = `${opusFmtp.config};stereo=1`;
+ * This function modifies the provided list of video layers according to the
+ * current implementation of simulcast constraints in the Chromium based browsers.
+ *
+ * https://chromium.googlesource.com/external/webrtc/+/refs/heads/main/media/engine/simulcast.cc#90
+ */
+const withSimulcastConstraints = (settings, optimalVideoLayers) => {
+    let layers;
+    const size = Math.max(settings.width || 0, settings.height || 0);
+    if (size <= 320) {
+        // provide only one layer 320x240 (q), the one with the highest quality
+        layers = optimalVideoLayers.filter((layer) => layer.rid === 'f');
     }
-    // set maxaveragebitrate, to the given value
-    if (opusFmtp.config.match(/maxaveragebitrate=(\d*)/)) {
-        opusFmtp.config = opusFmtp.config.replace(/maxaveragebitrate=(\d*)/, `maxaveragebitrate=${maxBitrate}`);
+    else if (size <= 640) {
+        // provide two layers, 160x120 (q) and 640x480 (h)
+        layers = optimalVideoLayers.filter((layer) => layer.rid !== 'h');
     }
     else {
-        opusFmtp.config = `${opusFmtp.config};maxaveragebitrate=${maxBitrate}`;
+        // provide three layers for sizes > 640x480
+        layers = optimalVideoLayers;
     }
-    return SDP.write(parsedSdp);
+    const ridMapping = ['q', 'h', 'f'];
+    return layers.map((layer, index) => ({
+        ...layer,
+        rid: ridMapping[index], // reassign rid
+    }));
 };
+
 /**
  * Extracts the mid from the transceiver or the SDP.
  *
@@ -5632,9 +5584,9 @@ const extractMid = (transceiver, transceiverInitIndex, sdp) => {
     if (transceiver.mid)
         return transceiver.mid;
     if (!sdp)
-        return '';
+        return String(transceiverInitIndex);
     const track = transceiver.sender.track;
-    const parsedSdp = SDP.parse(sdp);
+    const parsedSdp = parse(sdp);
     const media = parsedSdp.media.find((m) => {
         return (m.type === track.kind &&
             // if `msid` is not present, we assume that the track is the first one
@@ -5642,7 +5594,7 @@ const extractMid = (transceiver, transceiverInitIndex, sdp) => {
     });
     if (typeof media?.mid !== 'undefined')
         return String(media.mid);
-    if (transceiverInitIndex === -1)
+    if (transceiverInitIndex < 0)
         return '';
     return String(transceiverInitIndex);
 };
@@ -5652,164 +5604,87 @@ const extractMid = (transceiver, transceiverInitIndex, sdp) => {
  *
  * @internal
  */
-class Publisher {
+class Publisher extends BasePeerConnection {
     /**
      * Constructs a new `Publisher` instance.
      */
-    constructor({ connectionConfig, sfuClient, dispatcher, state, isDtxEnabled, isRedEnabled, onUnrecoverableError, logTag, }) {
-        this.transceiverCache = new Map();
-        this.trackLayersCache = new Map();
-        this.publishOptsForTrack = new Map();
-        /**
-         * An array maintaining the order how transceivers were added to the peer connection.
-         * This is needed because some browsers (Firefox) don't reliably report
-         * trackId and `mid` parameters.
-         *
-         * @internal
-         */
-        this.transceiverInitOrder = [];
-        this.isIceRestarting = false;
-        this.createPeerConnection = (connectionConfig) => {
-            const pc = new RTCPeerConnection(connectionConfig);
-            pc.addEventListener('icecandidate', this.onIceCandidate);
-            pc.addEventListener('negotiationneeded', this.onNegotiationNeeded);
-            pc.addEventListener('icecandidateerror', this.onIceCandidateError);
-            pc.addEventListener('iceconnectionstatechange', this.onIceConnectionStateChange);
-            pc.addEventListener('icegatheringstatechange', this.onIceGatheringStateChange);
-            pc.addEventListener('signalingstatechange', this.onSignalingStateChange);
-            return pc;
-        };
-        /**
-         * Closes the publisher PeerConnection and cleans up the resources.
-         */
-        this.close = ({ stopTracks }) => {
-            if (stopTracks) {
-                this.stopPublishing();
-                this.transceiverCache.clear();
-                this.trackLayersCache.clear();
-            }
-            this.detachEventHandlers();
-            this.pc.close();
-        };
-        /**
-         * Detaches the event handlers from the `RTCPeerConnection`.
-         * This is useful when we want to replace the `RTCPeerConnection`
-         * instance with a new one (in case of migration).
-         */
-        this.detachEventHandlers = () => {
-            this.unsubscribeOnIceRestart();
-            this.unsubscribeChangePublishQuality();
-            this.pc.removeEventListener('icecandidate', this.onIceCandidate);
-            this.pc.removeEventListener('negotiationneeded', this.onNegotiationNeeded);
-            this.pc.removeEventListener('icecandidateerror', this.onIceCandidateError);
-            this.pc.removeEventListener('iceconnectionstatechange', this.onIceConnectionStateChange);
-            this.pc.removeEventListener('icegatheringstatechange', this.onIceGatheringStateChange);
-            this.pc.removeEventListener('signalingstatechange', this.onSignalingStateChange);
-        };
+    constructor({ publishOptions, ...baseOptions }) {
+        super(PeerType.PUBLISHER_UNSPECIFIED, baseOptions);
+        this.transceiverCache = new TransceiverCache();
         /**
          * Starts publishing the given track of the given media stream.
          *
          * Consecutive calls to this method will replace the stream.
          * The previous stream will be stopped.
          *
-         * @param mediaStream the media stream to publish.
          * @param track the track to publish.
          * @param trackType the track type to publish.
-         * @param opts the optional publish options to use.
          */
-        this.publishStream = async (mediaStream, track, trackType, opts = {}) => {
-            if (track.readyState === 'ended') {
-                throw new Error(`Can't publish a track that has ended already.`);
-            }
-            // enable the track if it is disabled
-            if (!track.enabled)
-                track.enabled = true;
-            const transceiver = this.transceiverCache.get(trackType);
-            if (!transceiver || !transceiver.sender.track) {
-                // listen for 'ended' event on the track as it might be ended abruptly
-                // by an external factors such as permission revokes, a disconnected device, etc.
-                // keep in mind that `track.stop()` doesn't trigger this event.
-                const handleTrackEnded = () => {
-                    this.logger('info', `Track ${TrackType[trackType]} has ended abruptly`);
-                    track.removeEventListener('ended', handleTrackEnded);
-                    this.notifyTrackMuteStateChanged(mediaStream, trackType, true).catch((err) => this.logger('warn', `Couldn't notify track mute state`, err));
-                };
-                track.addEventListener('ended', handleTrackEnded);
-                this.addTransceiver(trackType, track, opts, mediaStream);
+        this.publish = async (track, trackType) => {
+            if (!this.publishOptions.some((o) => o.trackType === trackType)) {
+                throw new Error(`No publish options found for ${TrackType[trackType]}`);
             }
-            else {
-                await this.updateTransceiver(transceiver, track);
+            for (const publishOption of this.publishOptions) {
+                if (publishOption.trackType !== trackType)
+                    continue;
+                // create a clone of the track as otherwise the same trackId will
+                // appear in the SDP in multiple transceivers
+                const trackToPublish = track.clone();
+                const transceiver = this.transceiverCache.get(publishOption);
+                if (!transceiver) {
+                    this.addTransceiver(trackToPublish, publishOption);
+                }
+                else {
+                    await transceiver.sender.replaceTrack(trackToPublish);
+                }
             }
-            await this.notifyTrackMuteStateChanged(mediaStream, trackType, false);
         };
         /**
-         * Adds a new transceiver to the peer connection.
-         * This needs to be called when a new track kind is added to the peer connection.
-         * In other cases, use `updateTransceiver` method.
+         * Adds a new transceiver carrying the given track to the peer connection.
          */
-        this.addTransceiver = (trackType, track, opts, mediaStream) => {
-            const { forceCodec, preferredCodec } = opts;
-            const codecInUse = forceCodec || getOptimalVideoCodec(preferredCodec);
-            const videoEncodings = this.computeLayers(trackType, track, opts);
+        this.addTransceiver = (track, publishOption) => {
+            const videoEncodings = computeVideoLayers(track, publishOption);
+            const sendEncodings = isSvcCodec(publishOption.codec?.name)
+                ? toSvcEncodings(videoEncodings)
+                : videoEncodings;
             const transceiver = this.pc.addTransceiver(track, {
                 direction: 'sendonly',
-                streams: trackType === TrackType.VIDEO || trackType === TrackType.SCREEN_SHARE
-                    ? [mediaStream]
-                    : undefined,
-                sendEncodings: isSvcCodec(codecInUse)
-                    ? toSvcEncodings(videoEncodings)
-                    : videoEncodings,
+                sendEncodings,
             });
+            const trackType = publishOption.trackType;
             this.logger('debug', `Added ${TrackType[trackType]} transceiver`);
-            this.transceiverInitOrder.push(trackType);
-            this.transceiverCache.set(trackType, transceiver);
-            this.publishOptsForTrack.set(trackType, opts);
-            // handle codec preferences
-            if (!('setCodecPreferences' in transceiver))
-                return;
-            const codecPreferences = this.getCodecPreferences(trackType, trackType === TrackType.VIDEO ? codecInUse : undefined, 'receiver');
-            if (!codecPreferences)
-                return;
-            try {
-                this.logger('info', `Setting ${TrackType[trackType]} codec preferences`, codecPreferences);
-                transceiver.setCodecPreferences(codecPreferences);
-            }
-            catch (err) {
-                this.logger('warn', `Couldn't set codec preferences`, err);
-            }
-        };
-        /**
-         * Updates the given transceiver with the new track.
-         * Stops the previous track and replaces it with the new one.
-         */
-        this.updateTransceiver = async (transceiver, track) => {
-            const previousTrack = transceiver.sender.track;
-            // don't stop the track if we are re-publishing the same track
-            if (previousTrack && previousTrack !== track) {
-                previousTrack.stop();
-            }
-            await transceiver.sender.replaceTrack(track);
+            this.transceiverCache.add(publishOption, transceiver);
         };
         /**
-         * Stops publishing the given track type to the SFU, if it is currently being published.
-         * Underlying track will be stopped and removed from the publisher.
-         * @param trackType the track type to unpublish.
-         * @param stopTrack specifies whether track should be stopped or just disabled
+         * Synchronizes the current Publisher state with the provided publish options.
          */
-        this.unpublishStream = async (trackType, stopTrack) => {
-            const transceiver = this.transceiverCache.get(trackType);
-            if (transceiver &&
-                transceiver.sender.track &&
-                (stopTrack
-                    ? transceiver.sender.track.readyState === 'live'
-                    : transceiver.sender.track.enabled)) {
-                stopTrack
-                    ? transceiver.sender.track.stop()
-                    : (transceiver.sender.track.enabled = false);
-                // We don't need to notify SFU if unpublishing in response to remote soft mute
-                if (this.state.localParticipant?.publishedTracks.includes(trackType)) {
-                    await this.notifyTrackMuteStateChanged(undefined, trackType, true);
-                }
+        this.syncPublishOptions = async () => {
+            // enable publishing with new options -> [av1, vp9]
+            for (const publishOption of this.publishOptions) {
+                const { trackType } = publishOption;
+                if (!this.isPublishing(trackType))
+                    continue;
+                if (this.transceiverCache.has(publishOption))
+                    continue;
+                const item = this.transceiverCache.find((i) => !!i.transceiver.sender.track &&
+                    i.publishOption.trackType === trackType);
+                if (!item || !item.transceiver)
+                    continue;
+                // take the track from the existing transceiver for the same track type,
+                // clone it and publish it with the new publish options
+                const track = item.transceiver.sender.track.clone();
+                this.addTransceiver(track, publishOption);
+            }
+            // stop publishing with options not required anymore -> [vp9]
+            for (const item of this.transceiverCache.items()) {
+                const { publishOption, transceiver } = item;
+                const hasPublishOption = this.publishOptions.some((option) => option.id === publishOption.id &&
+                    option.trackType === publishOption.trackType);
+                if (hasPublishOption)
+                    continue;
+                // it is safe to stop the track here, it is a clone
+                transceiver.sender.track?.stop();
+                await transceiver.sender.replaceTrack(null);
             }
         };
         /**
@@ -5818,57 +5693,52 @@ class Publisher {
          * @param trackType the track type to check.
          */
         this.isPublishing = (trackType) => {
-            const transceiver = this.transceiverCache.get(trackType);
-            if (!transceiver || !transceiver.sender)
-                return false;
-            const track = transceiver.sender.track;
-            return !!track && track.readyState === 'live' && track.enabled;
-        };
-        this.notifyTrackMuteStateChanged = async (mediaStream, trackType, isMuted) => {
-            await this.sfuClient.updateMuteState(trackType, isMuted);
-            const audioOrVideoOrScreenShareStream = trackTypeToParticipantStreamKey(trackType);
-            if (!audioOrVideoOrScreenShareStream)
-                return;
-            if (isMuted) {
-                this.state.updateParticipant(this.sfuClient.sessionId, (p) => ({
-                    publishedTracks: p.publishedTracks.filter((t) => t !== trackType),
-                    [audioOrVideoOrScreenShareStream]: undefined,
-                }));
-            }
-            else {
-                this.state.updateParticipant(this.sfuClient.sessionId, (p) => {
-                    return {
-                        publishedTracks: p.publishedTracks.includes(trackType)
-                            ? p.publishedTracks
-                            : [...p.publishedTracks, trackType],
-                        [audioOrVideoOrScreenShareStream]: mediaStream,
-                    };
-                });
+            for (const item of this.transceiverCache.items()) {
+                if (item.publishOption.trackType !== trackType)
+                    continue;
+                const track = item.transceiver.sender.track;
+                if (!track)
+                    continue;
+                if (track.readyState === 'live' && track.enabled)
+                    return true;
             }
+            return false;
         };
         /**
-         * Stops publishing all tracks and stop all tracks.
+         * Maps the given track ID to the corresponding track type.
          */
-        this.stopPublishing = () => {
-            this.logger('debug', 'Stopping publishing all tracks');
-            this.pc.getSenders().forEach((s) => {
-                s.track?.stop();
-                if (this.pc.signalingState !== 'closed') {
-                    this.pc.removeTrack(s);
+        this.getTrackType = (trackId) => {
+            for (const transceiverId of this.transceiverCache.items()) {
+                const { publishOption, transceiver } = transceiverId;
+                if (transceiver.sender.track?.id === trackId) {
+                    return publishOption.trackType;
                 }
-            });
+            }
+            return undefined;
         };
-        this.changePublishQuality = async (enabledLayers) => {
-            this.logger('info', 'Update publish quality, requested layers by SFU:', enabledLayers);
-            const videoSender = this.transceiverCache.get(TrackType.VIDEO)?.sender;
-            if (!videoSender) {
-                this.logger('warn', 'Update publish quality, no video sender found.');
-                return;
+        /**
+         * Stops the cloned track that is being published to the SFU.
+         */
+        this.stopTracks = (...trackTypes) => {
+            for (const item of this.transceiverCache.items()) {
+                const { publishOption, transceiver } = item;
+                if (!trackTypes.includes(publishOption.trackType))
+                    continue;
+                transceiver.sender.track?.stop();
+            }
+        };
+        this.changePublishQuality = async (videoSender) => {
+            const { trackType, layers, publishOptionId } = videoSender;
+            const enabledLayers = layers.filter((l) => l.active);
+            const tag = 'Update publish quality:';
+            this.logger('info', `${tag} requested layers by SFU:`, enabledLayers);
+            const sender = this.transceiverCache.getWith(trackType, publishOptionId)?.sender;
+            if (!sender) {
+                return this.logger('warn', `${tag} no video sender found.`);
             }
-            const params = videoSender.getParameters();
+            const params = sender.getParameters();
             if (params.encodings.length === 0) {
-                this.logger('warn', 'Update publish quality, No suitable video encoding quality found');
-                return;
+                return this.logger('warn', `${tag} there are no encodings set.`);
             }
             const [codecInUse] = params.codecs;
             const usesSvcCodec = codecInUse && isSvcCodec(codecInUse.mimeType);
@@ -5910,54 +5780,12 @@ class Publisher {
                     changed = true;
                 }
             }
-            const activeLayers = params.encodings.filter((e) => e.active);
+            const activeEncoders = params.encodings.filter((e) => e.active);
             if (!changed) {
-                this.logger('info', `Update publish quality, no change:`, activeLayers);
-                return;
-            }
-            await videoSender.setParameters(params);
-            this.logger('info', `Update publish quality, enabled rids:`, activeLayers);
-        };
-        /**
-         * Returns the result of the `RTCPeerConnection.getStats()` method
-         * @param selector
-         * @returns
-         */
-        this.getStats = (selector) => {
-            return this.pc.getStats(selector);
-        };
-        this.getCodecPreferences = (trackType, preferredCodec, codecPreferencesSource) => {
-            if (trackType === TrackType.VIDEO) {
-                return getPreferredCodecs('video', preferredCodec || 'vp8', undefined, codecPreferencesSource);
-            }
-            if (trackType === TrackType.AUDIO) {
-                const defaultAudioCodec = this.isRedEnabled ? 'red' : 'opus';
-                const codecToRemove = !this.isRedEnabled ? 'red' : undefined;
-                return getPreferredCodecs('audio', preferredCodec ?? defaultAudioCodec, codecToRemove, codecPreferencesSource);
-            }
-        };
-        this.onIceCandidate = (e) => {
-            const { candidate } = e;
-            if (!candidate) {
-                this.logger('debug', 'null ice candidate');
-                return;
+                return this.logger('info', `${tag} no change:`, activeEncoders);
             }
-            this.sfuClient
-                .iceTrickle({
-                iceCandidate: getIceCandidate(candidate),
-                peerType: PeerType.PUBLISHER_UNSPECIFIED,
-            })
-                .catch((err) => {
-                this.logger('warn', `ICETrickle failed`, err);
-            });
-        };
-        /**
-         * Sets the SFU client to use.
-         *
-         * @param sfuClient the SFU client to use.
-         */
-        this.setSfuClient = (sfuClient) => {
-            this.sfuClient = sfuClient;
+            await sender.setParameters(params);
+            this.logger('info', `${tag} enabled rids:`, activeEncoders);
         };
         /**
          * Restarts the ICE connection and renegotiates with the SFU.
@@ -5972,7 +5800,7 @@ class Publisher {
             await this.negotiate({ iceRestart: true });
         };
         this.onNegotiationNeeded = () => {
-            this.negotiate().catch((err) => {
+            withoutConcurrency('publisher.negotiate', () => this.negotiate()).catch((err) => {
                 this.logger('error', `Negotiation failed.`, err);
                 this.onUnrecoverableError?.();
             });
@@ -5984,18 +5812,6 @@ class Publisher {
          */
         this.negotiate = async (options) => {
             const offer = await this.pc.createOffer(options);
-            if (offer.sdp) {
-                offer.sdp = toggleDtx(offer.sdp, this.isDtxEnabled);
-                if (this.isPublishing(TrackType.SCREEN_SHARE_AUDIO)) {
-                    offer.sdp = this.enableHighQualityAudio(offer.sdp);
-                }
-                if (this.isPublishing(TrackType.VIDEO)) {
-                    // Hotfix for platforms that don't respect the ordered codec list
-                    // (Firefox, Android, Linux, etc...).
-                    // We remove all the codecs from the SDP except the one we want to use.
-                    offer.sdp = this.removeUnpreferredCodecs(offer.sdp, TrackType.VIDEO);
-                }
-            }
             const trackInfos = this.getAnnouncedTracks(offer.sdp);
             if (trackInfos.length === 0) {
                 throw new Error(`Can't negotiate without announcing any tracks`);
@@ -6014,238 +5830,121 @@ class Publisher {
             finally {
                 this.isIceRestarting = false;
             }
-            this.sfuClient.iceTrickleBuffer.publisherCandidates.subscribe(async (candidate) => {
-                try {
-                    const iceCandidate = JSON.parse(candidate.iceCandidate);
-                    await this.pc.addIceCandidate(iceCandidate);
-                }
-                catch (e) {
-                    this.logger('warn', `ICE candidate error`, e, candidate);
-                }
-            });
-        };
-        this.enableHighQualityAudio = (sdp) => {
-            const transceiver = this.transceiverCache.get(TrackType.SCREEN_SHARE_AUDIO);
-            if (!transceiver)
-                return sdp;
-            const transceiverInitIndex = this.transceiverInitOrder.indexOf(TrackType.SCREEN_SHARE_AUDIO);
-            const mid = extractMid(transceiver, transceiverInitIndex, sdp);
-            return enableHighQualityAudio(sdp, mid);
+            this.addTrickledIceCandidates();
         };
         /**
          * Returns a list of tracks that are currently being published.
-         *
-         * @internal
-         * @param sdp an optional SDP to extract the `mid` from.
          */
-        this.getAnnouncedTracks = (sdp) => {
-            sdp = sdp || this.pc.localDescription?.sdp;
-            return this.pc
-                .getTransceivers()
-                .filter((t) => t.direction === 'sendonly' && t.sender.track)
-                .map((transceiver) => {
-                let trackType;
-                this.transceiverCache.forEach((value, key) => {
-                    if (value === transceiver)
-                        trackType = key;
-                });
+        this.getPublishedTracks = () => {
+            const tracks = [];
+            for (const { transceiver } of this.transceiverCache.items()) {
                 const track = transceiver.sender.track;
-                let optimalLayers;
-                const isTrackLive = track.readyState === 'live';
-                if (isTrackLive) {
-                    optimalLayers = this.computeLayers(trackType, track) || [];
-                    this.trackLayersCache.set(trackType, optimalLayers);
-                }
-                else {
-                    // we report the last known optimal layers for ended tracks
-                    optimalLayers = this.trackLayersCache.get(trackType) || [];
-                    this.logger('debug', `Track ${TrackType[trackType]} is ended. Announcing last known optimal layers`, optimalLayers);
-                }
-                const layers = optimalLayers.map((optimalLayer) => ({
-                    rid: optimalLayer.rid || '',
-                    bitrate: optimalLayer.maxBitrate || 0,
-                    fps: optimalLayer.maxFramerate || 0,
-                    quality: ridToVideoQuality(optimalLayer.rid || ''),
-                    videoDimension: {
-                        width: optimalLayer.width,
-                        height: optimalLayer.height,
-                    },
-                }));
-                const isAudioTrack = [
-                    TrackType.AUDIO,
-                    TrackType.SCREEN_SHARE_AUDIO,
-                ].includes(trackType);
-                const trackSettings = track.getSettings();
-                const isStereo = isAudioTrack && trackSettings.channelCount === 2;
-                const transceiverInitIndex = this.transceiverInitOrder.indexOf(trackType);
-                return {
-                    trackId: track.id,
-                    layers: layers,
-                    trackType,
-                    mid: extractMid(transceiver, transceiverInitIndex, sdp),
-                    stereo: isStereo,
-                    dtx: isAudioTrack && this.isDtxEnabled,
-                    red: isAudioTrack && this.isRedEnabled,
-                    muted: !isTrackLive,
-                };
-            });
-        };
-        this.computeLayers = (trackType, track, opts) => {
-            const { settings } = this.state;
-            const targetResolution = settings?.video
-                .target_resolution;
-            const screenShareBitrate = settings?.screensharing.target_resolution?.bitrate;
-            const publishOpts = opts || this.publishOptsForTrack.get(trackType);
-            const codecInUse = opts?.forceCodec || getOptimalVideoCodec(opts?.preferredCodec);
-            return trackType === TrackType.VIDEO
-                ? findOptimalVideoLayers(track, targetResolution, codecInUse, publishOpts)
-                : trackType === TrackType.SCREEN_SHARE
-                    ? findOptimalScreenSharingLayers(track, publishOpts, screenShareBitrate)
-                    : undefined;
-        };
-        this.onIceCandidateError = (e) => {
-            const errorMessage = e instanceof RTCPeerConnectionIceErrorEvent &&
-                `${e.errorCode}: ${e.errorText}`;
-            const iceState = this.pc.iceConnectionState;
-            const logLevel = iceState === 'connected' || iceState === 'checking' ? 'debug' : 'warn';
-            this.logger(logLevel, `ICE Candidate error`, errorMessage);
-        };
-        this.onIceConnectionStateChange = () => {
-            const state = this.pc.iceConnectionState;
-            this.logger('debug', `ICE Connection state changed to`, state);
-            if (this.state.callingState === CallingState.RECONNECTING)
-                return;
-            if (state === 'failed' || state === 'disconnected') {
-                this.logger('debug', `Attempting to restart ICE`);
-                this.restartIce().catch((e) => {
-                    this.logger('error', `ICE restart error`, e);
-                    this.onUnrecoverableError?.();
-                });
+                if (track && track.readyState === 'live')
+                    tracks.push(track);
             }
-        };
-        this.onIceGatheringStateChange = () => {
-            this.logger('debug', `ICE Gathering State`, this.pc.iceGatheringState);
-        };
-        this.onSignalingStateChange = () => {
-            this.logger('debug', `Signaling state changed`, this.pc.signalingState);
-        };
-        this.logger = getLogger(['Publisher', logTag]);
-        this.pc = this.createPeerConnection(connectionConfig);
-        this.sfuClient = sfuClient;
-        this.state = state;
-        this.isDtxEnabled = isDtxEnabled;
-        this.isRedEnabled = isRedEnabled;
-        this.onUnrecoverableError = onUnrecoverableError;
-        this.unsubscribeOnIceRestart = dispatcher.on('iceRestart', (iceRestart) => {
-            if (iceRestart.peerType !== PeerType.PUBLISHER_UNSPECIFIED)
-                return;
-            this.restartIce().catch((err) => {
-                this.logger('warn', `ICERestart failed`, err);
-                this.onUnrecoverableError?.();
-            });
-        });
-        this.unsubscribeChangePublishQuality = dispatcher.on('changePublishQuality', ({ videoSenders }) => {
-            withoutConcurrency('publisher.changePublishQuality', async () => {
-                for (const videoSender of videoSenders) {
-                    const { layers } = videoSender;
-                    const enabledLayers = layers.filter((l) => l.active);
-                    await this.changePublishQuality(enabledLayers);
-                }
-            }).catch((err) => {
-                this.logger('warn', 'Failed to change publish quality', err);
-            });
-        });
-    }
-    removeUnpreferredCodecs(sdp, trackType) {
-        const opts = this.publishOptsForTrack.get(trackType);
-        const forceSingleCodec = !!opts?.forceSingleCodec || isReactNative() || isFirefox();
-        if (!opts || !forceSingleCodec)
-            return sdp;
-        const codec = opts.forceCodec || getOptimalVideoCodec(opts.preferredCodec);
-        const orderedCodecs = this.getCodecPreferences(trackType, codec, 'sender');
-        if (!orderedCodecs || orderedCodecs.length === 0)
-            return sdp;
-        const transceiver = this.transceiverCache.get(trackType);
-        if (!transceiver)
-            return sdp;
-        const index = this.transceiverInitOrder.indexOf(trackType);
-        const mid = extractMid(transceiver, index, sdp);
-        const [codecToPreserve] = orderedCodecs;
-        return preserveCodec(sdp, mid, codecToPreserve);
-    }
-}
-
-/**
- * A wrapper around the `RTCPeerConnection` that handles the incoming
- * media streams from the SFU.
- *
- * @internal
- */
-class Subscriber {
-    /**
-     * Constructs a new `Subscriber` instance.
-     *
-     * @param sfuClient the SFU client to use.
-     * @param dispatcher the dispatcher to use.
-     * @param state the state of the call.
-     * @param connectionConfig the connection configuration to use.
-     * @param iceRestartDelay the delay in milliseconds to wait before restarting ICE when connection goes to `disconnected` state.
-     * @param onUnrecoverableError a callback to call when an unrecoverable error occurs.
-     * @param logTag a tag to use for logging.
-     */
-    constructor({ sfuClient, dispatcher, state, connectionConfig, onUnrecoverableError, logTag, }) {
-        this.isIceRestarting = false;
-        /**
-         * Creates a new `RTCPeerConnection` instance with the given configuration.
-         *
-         * @param connectionConfig the connection configuration to use.
-         */
-        this.createPeerConnection = (connectionConfig) => {
-            const pc = new RTCPeerConnection(connectionConfig);
-            pc.addEventListener('icecandidate', this.onIceCandidate);
-            pc.addEventListener('track', this.handleOnTrack);
-            pc.addEventListener('icecandidateerror', this.onIceCandidateError);
-            pc.addEventListener('iceconnectionstatechange', this.onIceConnectionStateChange);
-            pc.addEventListener('icegatheringstatechange', this.onIceGatheringStateChange);
-            return pc;
-        };
-        /**
-         * Closes the `RTCPeerConnection` and unsubscribes from the dispatcher.
-         */
-        this.close = () => {
-            this.detachEventHandlers();
-            this.pc.close();
+            return tracks;
         };
         /**
-         * Detaches the event handlers from the `RTCPeerConnection`.
-         * This is useful when we want to replace the `RTCPeerConnection`
-         * instance with a new one (in case of migration).
+         * Returns a list of tracks that are currently being published.
+         * @param sdp an optional SDP to extract the `mid` from.
          */
-        this.detachEventHandlers = () => {
-            this.unregisterOnSubscriberOffer();
-            this.unregisterOnIceRestart();
-            this.pc.removeEventListener('icecandidate', this.onIceCandidate);
-            this.pc.removeEventListener('track', this.handleOnTrack);
-            this.pc.removeEventListener('icecandidateerror', this.onIceCandidateError);
-            this.pc.removeEventListener('iceconnectionstatechange', this.onIceConnectionStateChange);
-            this.pc.removeEventListener('icegatheringstatechange', this.onIceGatheringStateChange);
+        this.getAnnouncedTracks = (sdp) => {
+            const trackInfos = [];
+            for (const bundle of this.transceiverCache.items()) {
+                const { transceiver, publishOption } = bundle;
+                const track = transceiver.sender.track;
+                if (!track)
+                    continue;
+                trackInfos.push(this.toTrackInfo(transceiver, publishOption, sdp));
+            }
+            return trackInfos;
         };
         /**
-         * Returns the result of the `RTCPeerConnection.getStats()` method
-         * @param selector
-         * @returns
-         */
-        this.getStats = (selector) => {
-            return this.pc.getStats(selector);
+         * Returns a list of tracks that are currently being published.
+         * This method shall be used for the reconnection flow.
+         * There we shouldn't announce the tracks that have been stopped due to a codec switch.
+         */
+        this.getAnnouncedTracksForReconnect = () => {
+            const sdp = this.pc.localDescription?.sdp;
+            const trackInfos = [];
+            for (const publishOption of this.publishOptions) {
+                const transceiver = this.transceiverCache.get(publishOption);
+                if (!transceiver || !transceiver.sender.track)
+                    continue;
+                trackInfos.push(this.toTrackInfo(transceiver, publishOption, sdp));
+            }
+            return trackInfos;
         };
         /**
-         * Sets the SFU client to use.
-         *
-         * @param sfuClient the SFU client to use.
+         * Converts the given transceiver to a `TrackInfo` object.
          */
-        this.setSfuClient = (sfuClient) => {
-            this.sfuClient = sfuClient;
+        this.toTrackInfo = (transceiver, publishOption, sdp) => {
+            const track = transceiver.sender.track;
+            const isTrackLive = track.readyState === 'live';
+            const layers = isTrackLive
+                ? computeVideoLayers(track, publishOption)
+                : this.transceiverCache.getLayers(publishOption);
+            this.transceiverCache.setLayers(publishOption, layers);
+            const isAudioTrack = isAudioTrackType(publishOption.trackType);
+            const isStereo = isAudioTrack && track.getSettings().channelCount === 2;
+            const transceiverIndex = this.transceiverCache.indexOf(transceiver);
+            const audioSettings = this.state.settings?.audio;
+            return {
+                trackId: track.id,
+                layers: toVideoLayers(layers),
+                trackType: publishOption.trackType,
+                mid: extractMid(transceiver, transceiverIndex, sdp),
+                stereo: isStereo,
+                dtx: isAudioTrack && !!audioSettings?.opus_dtx_enabled,
+                red: isAudioTrack && !!audioSettings?.redundant_coding_enabled,
+                muted: !isTrackLive,
+                codec: publishOption.codec,
+                publishOptionId: publishOption.id,
+            };
         };
+        this.publishOptions = publishOptions;
+        this.pc.addEventListener('negotiationneeded', this.onNegotiationNeeded);
+        this.on('iceRestart', (iceRestart) => {
+            if (iceRestart.peerType !== PeerType.PUBLISHER_UNSPECIFIED)
+                return;
+            this.restartIce().catch((err) => {
+                this.logger('warn', `ICERestart failed`, err);
+                this.onUnrecoverableError?.();
+            });
+        });
+        this.on('changePublishQuality', async (event) => {
+            for (const videoSender of event.videoSenders) {
+                await this.changePublishQuality(videoSender);
+            }
+        });
+        this.on('changePublishOptions', (event) => {
+            this.publishOptions = event.publishOptions;
+            return this.syncPublishOptions();
+        });
+    }
+    /**
+     * Detaches the event handlers from the `RTCPeerConnection`.
+     * This is useful when we want to replace the `RTCPeerConnection`
+     * instance with a new one (in case of migration).
+     */
+    detachEventHandlers() {
+        super.detachEventHandlers();
+        this.pc.removeEventListener('negotiationneeded', this.onNegotiationNeeded);
+    }
+}
+
+/**
+ * A wrapper around the `RTCPeerConnection` that handles the incoming
+ * media streams from the SFU.
+ *
+ * @internal
+ */
+class Subscriber extends BasePeerConnection {
+    /**
+     * Constructs a new `Subscriber` instance.
+     */
+    constructor(opts) {
+        super(PeerType.SUBSCRIBER, opts);
         /**
          * Restarts the ICE connection and renegotiates with the SFU.
          */
@@ -6308,7 +6007,15 @@ class Subscriber {
                 this.logger('error', `Unknown track type: ${rawTrackType}`);
                 return;
             }
+            // get the previous stream to dispose it later
+            // usually this happens during migration, when the stream is replaced
+            // with a new one but the old one is still in the state
             const previousStream = participantToUpdate[streamKindProp];
+            // replace the previous stream with the new one, prevents flickering
+            this.state.updateParticipant(participantToUpdate.sessionId, {
+                [streamKindProp]: primaryStream,
+            });
+            // now, dispose the previous stream if it exists
             if (previousStream) {
                 this.logger('info', `[onTrack]: Cleaning up previous remote ${e.track.kind} tracks for userId: ${participantToUpdate.userId}`);
                 previousStream.getTracks().forEach((t) => {
@@ -6316,24 +6023,6 @@ class Subscriber {
                     previousStream.removeTrack(t);
                 });
             }
-            this.state.updateParticipant(participantToUpdate.sessionId, {
-                [streamKindProp]: primaryStream,
-            });
-        };
-        this.onIceCandidate = (e) => {
-            const { candidate } = e;
-            if (!candidate) {
-                this.logger('debug', 'null ice candidate');
-                return;
-            }
-            this.sfuClient
-                .iceTrickle({
-                iceCandidate: getIceCandidate(candidate),
-                peerType: PeerType.SUBSCRIBER,
-            })
-                .catch((err) => {
-                this.logger('warn', `ICETrickle failed`, err);
-            });
         };
         this.negotiate = async (subscriberOffer) => {
             this.logger('info', `Received subscriberOffer`, subscriberOffer);
@@ -6341,15 +6030,7 @@ class Subscriber {
                 type: 'offer',
                 sdp: subscriberOffer.sdp,
             });
-            this.sfuClient.iceTrickleBuffer.subscriberCandidates.subscribe(async (candidate) => {
-                try {
-                    const iceCandidate = JSON.parse(candidate.iceCandidate);
-                    await this.pc.addIceCandidate(iceCandidate);
-                }
-                catch (e) {
-                    this.logger('warn', `ICE candidate error`, [e, candidate]);
-                }
-            });
+            this.addTrickledIceCandidates();
             const answer = await this.pc.createAnswer();
             await this.pc.setLocalDescription(answer);
             await this.sfuClient.sendAnswer({
@@ -6358,56 +6039,21 @@ class Subscriber {
             });
             this.isIceRestarting = false;
         };
-        this.onIceConnectionStateChange = () => {
-            const state = this.pc.iceConnectionState;
-            this.logger('debug', `ICE connection state changed`, state);
-            if (this.state.callingState === CallingState.RECONNECTING)
-                return;
-            // do nothing when ICE is restarting
-            if (this.isIceRestarting)
-                return;
-            if (state === 'failed' || state === 'disconnected') {
-                this.logger('debug', `Attempting to restart ICE`);
-                this.restartIce().catch((e) => {
-                    this.logger('error', `ICE restart failed`, e);
-                    this.onUnrecoverableError?.();
-                });
-            }
-        };
-        this.onIceGatheringStateChange = () => {
-            this.logger('debug', `ICE gathering state changed`, this.pc.iceGatheringState);
-        };
-        this.onIceCandidateError = (e) => {
-            const errorMessage = e instanceof RTCPeerConnectionIceErrorEvent &&
-                `${e.errorCode}: ${e.errorText}`;
-            const iceState = this.pc.iceConnectionState;
-            const logLevel = iceState === 'connected' || iceState === 'checking' ? 'debug' : 'warn';
-            this.logger(logLevel, `ICE Candidate error`, errorMessage);
-        };
-        this.logger = getLogger(['Subscriber', logTag]);
-        this.sfuClient = sfuClient;
-        this.state = state;
-        this.onUnrecoverableError = onUnrecoverableError;
-        this.pc = this.createPeerConnection(connectionConfig);
-        const subscriberOfferConcurrencyTag = Symbol('subscriberOffer');
-        this.unregisterOnSubscriberOffer = dispatcher.on('subscriberOffer', (subscriberOffer) => {
-            withoutConcurrency(subscriberOfferConcurrencyTag, () => {
-                return this.negotiate(subscriberOffer);
-            }).catch((err) => {
+        this.pc.addEventListener('track', this.handleOnTrack);
+        this.on('subscriberOffer', async (subscriberOffer) => {
+            return this.negotiate(subscriberOffer).catch((err) => {
                 this.logger('error', `Negotiation failed.`, err);
             });
         });
-        const iceRestartConcurrencyTag = Symbol('iceRestart');
-        this.unregisterOnIceRestart = dispatcher.on('iceRestart', (iceRestart) => {
-            withoutConcurrency(iceRestartConcurrencyTag, async () => {
-                if (iceRestart.peerType !== PeerType.SUBSCRIBER)
-                    return;
-                await this.restartIce();
-            }).catch((err) => {
-                this.logger('error', `ICERestart failed`, err);
-                this.onUnrecoverableError?.();
-            });
-        });
+    }
+    /**
+     * Detaches the event handlers from the `RTCPeerConnection`.
+     * This is useful when we want to replace the `RTCPeerConnection`
+     * instance with a new one (in case of migration).
+     */
+    detachEventHandlers() {
+        super.detachEventHandlers();
+        this.pc.removeEventListener('track', this.handleOnTrack);
     }
 }
 
@@ -6439,6 +6085,16 @@ const createWebSocketSignalChannel = (opts) => {
     return ws;
 };
 
+const toRtcConfiguration = (config) => {
+    return {
+        iceServers: config.map((ice) => ({
+            urls: ice.urls,
+            username: ice.username,
+            credential: ice.password,
+        })),
+    };
+};
+
 /**
  * Saving a long-lived reference to a promise that can reject can be unsafe,
  * since rejecting the promise causes an unhandled rejection error (even if the
@@ -6723,6 +6379,7 @@ class StreamSfuClient {
             clearTimeout(this.migrateAwayTimeout);
             this.abortController.abort();
             this.migrationTask?.resolve();
+            this.iceTrickleBuffer.dispose();
         };
         this.leaveAndClose = async (reason) => {
             await this.joinTask;
@@ -6755,13 +6412,9 @@ class StreamSfuClient {
             await this.joinTask;
             return retryable(() => this.rpc.iceRestart({ ...data, sessionId: this.sessionId }), this.abortController.signal);
         };
-        this.updateMuteState = async (trackType, muted) => {
+        this.updateMuteStates = async (muteStates) => {
             await this.joinTask;
-            return this.updateMuteStates({ muteStates: [{ trackType, muted }] });
-        };
-        this.updateMuteStates = async (data) => {
-            await this.joinTask;
-            return retryable(() => this.rpc.updateMuteStates({ ...data, sessionId: this.sessionId }), this.abortController.signal);
+            return retryable(() => this.rpc.updateMuteStates({ muteStates, sessionId: this.sessionId }), this.abortController.signal);
         };
         this.sendStats = async (stats) => {
             await this.joinTask;
@@ -6941,16 +6594,6 @@ StreamSfuClient.ERROR_CONNECTION_UNHEALTHY = 4001;
  */
 StreamSfuClient.DISPOSE_OLD_SOCKET = 4002;
 
-const toRtcConfiguration = (config) => {
-    return {
-        iceServers: config.map((ice) => ({
-            urls: ice.urls,
-            username: ice.username,
-            credential: ice.password,
-        })),
-    };
-};
-
 /**
  * Event handler that watched the delivery of `call.accepted`.
  * Once the event is received, the call is joined.
@@ -7169,6 +6812,21 @@ const handleRemoteSoftMute = (call) => {
     });
 };
 
+/**
+ * Adds unique values to an array.
+ *
+ * @param arr the array to add to.
+ * @param values the values to add.
+ */
+const pushToIfMissing = (arr, ...values) => {
+    for (const v of values) {
+        if (!arr.includes(v)) {
+            arr.push(v);
+        }
+    }
+    return arr;
+};
+
 /**
  * An event responder which handles the `participantJoined` event.
  */
@@ -7234,7 +6892,7 @@ const watchTrackPublished = (state) => {
         }
         else {
             state.updateParticipant(sessionId, (p) => ({
-                publishedTracks: [...p.publishedTracks, type].filter(unique),
+                publishedTracks: pushToIfMissing([...p.publishedTracks], type),
             }));
         }
     };
@@ -7259,7 +6917,6 @@ const watchTrackUnpublished = (state) => {
         }
     };
 };
-const unique = (v, i, arr) => arr.indexOf(v) === i;
 /**
  * Reconciles orphaned tracks (if any) for the given participant.
  *
@@ -7409,6 +7066,38 @@ const getSdkVersion = (sdk) => {
     return sdk ? `${sdk.major}.${sdk.minor}.${sdk.patch}` : '0.0.0-development';
 };
 
+/**
+ * Checks whether the current browser is Safari.
+ */
+const isSafari = () => {
+    if (typeof navigator === 'undefined')
+        return false;
+    return /^((?!chrome|android).)*safari/i.test(navigator.userAgent || '');
+};
+/**
+ * Checks whether the current browser is Firefox.
+ */
+const isFirefox = () => {
+    if (typeof navigator === 'undefined')
+        return false;
+    return navigator.userAgent?.includes('Firefox');
+};
+/**
+ * Checks whether the current browser is Google Chrome.
+ */
+const isChrome = () => {
+    if (typeof navigator === 'undefined')
+        return false;
+    return navigator.userAgent?.includes('Chrome');
+};
+
+var browsers = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    isChrome: isChrome,
+    isFirefox: isFirefox,
+    isSafari: isSafari
+});
+
 /**
  * Creates a new StatsReporter instance that collects metrics about the ongoing call and reports them to the state store
  */
@@ -7425,12 +7114,12 @@ const createStatsReporter = ({ subscriber, publisher, state, datacenter, polling
             return undefined;
         }
     };
-    const getStatsForStream = async (kind, mediaStream) => {
+    const getStatsForStream = async (kind, tracks) => {
         const pc = kind === 'subscriber' ? subscriber : publisher;
         if (!pc)
             return [];
         const statsForStream = [];
-        for (let track of mediaStream.getTracks()) {
+        for (const track of tracks) {
             const report = await pc.getStats(track);
             const stats = transform(report, {
                 // @ts-ignore
@@ -7455,26 +7144,24 @@ const createStatsReporter = ({ subscriber, publisher, state, datacenter, polling
      */
     const run = async () => {
         const participantStats = {};
-        const sessionIds = new Set(sessionIdsToTrack);
-        if (sessionIds.size > 0) {
-            for (let participant of state.participants) {
+        if (sessionIdsToTrack.size > 0) {
+            const sessionIds = new Set(sessionIdsToTrack);
+            for (const participant of state.participants) {
                 if (!sessionIds.has(participant.sessionId))
                     continue;
-                const kind = participant.isLocalParticipant
-                    ? 'publisher'
-                    : 'subscriber';
+                const { audioStream, isLocalParticipant, sessionId, userId, videoStream, } = participant;
+                const kind = isLocalParticipant ? 'publisher' : 'subscriber';
                 try {
-                    const mergedStream = new MediaStream([
-                        ...(participant.videoStream?.getVideoTracks() || []),
-                        ...(participant.audioStream?.getAudioTracks() || []),
-                    ]);
-                    participantStats[participant.sessionId] = await getStatsForStream(kind, mergedStream);
-                    mergedStream.getTracks().forEach((t) => {
-                        mergedStream.removeTrack(t);
-                    });
+                    const tracks = isLocalParticipant
+                        ? publisher?.getPublishedTracks() || []
+                        : [
+                            ...(videoStream?.getVideoTracks() || []),
+                            ...(audioStream?.getAudioTracks() || []),
+                        ];
+                    participantStats[sessionId] = await getStatsForStream(kind, tracks);
                 }
                 catch (e) {
-                    logger('error', `Failed to collect stats for ${kind} of ${participant.userId}`, e);
+                    logger('warn', `Failed to collect ${kind} stats for ${userId}`, e);
                 }
             }
         }
@@ -7484,6 +7171,7 @@ const createStatsReporter = ({ subscriber, publisher, state, datacenter, polling
                 .then((report) => transform(report, {
                 kind: 'subscriber',
                 trackKind: 'video',
+                publisher,
             }))
                 .then(aggregate),
             publisher
@@ -7492,6 +7180,7 @@ const createStatsReporter = ({ subscriber, publisher, state, datacenter, polling
                     .then((report) => transform(report, {
                     kind: 'publisher',
                     trackKind: 'video',
+                    publisher,
                 }))
                     .then(aggregate)
                 : getEmptyStats(),
@@ -7540,7 +7229,7 @@ const createStatsReporter = ({ subscriber, publisher, state, datacenter, polling
  * @param opts the transform options.
  */
 const transform = (report, opts) => {
-    const { trackKind, kind } = opts;
+    const { trackKind, kind, publisher } = opts;
     const direction = kind === 'subscriber' ? 'inbound-rtp' : 'outbound-rtp';
     const stats = flatten(report);
     const streams = stats
@@ -7556,6 +7245,16 @@ const transform = (report, opts) => {
                 s.id === transport.selectedCandidatePairId);
             roundTripTime = candidatePair?.currentRoundTripTime;
         }
+        let trackType;
+        if (kind === 'publisher' && publisher) {
+            const firefox = isFirefox();
+            const mediaSource = stats.find((s) => s.type === 'media-source' &&
+                // Firefox doesn't have mediaSourceId, so we need to guess the media source
+                (firefox ? true : s.id === rtcStreamStats.mediaSourceId));
+            if (mediaSource) {
+                trackType = publisher.getTrackType(mediaSource.trackIdentifier);
+            }
+        }
         return {
             bytesSent: rtcStreamStats.bytesSent,
             bytesReceived: rtcStreamStats.bytesReceived,
@@ -7566,10 +7265,12 @@ const transform = (report, opts) => {
             framesPerSecond: rtcStreamStats.framesPerSecond,
             jitter: rtcStreamStats.jitter,
             kind: rtcStreamStats.kind,
+            mediaSourceId: rtcStreamStats.mediaSourceId,
             // @ts-ignore: available in Chrome only, TS doesn't recognize this
             qualityLimitationReason: rtcStreamStats.qualityLimitationReason,
             rid: rtcStreamStats.rid,
             ssrc: rtcStreamStats.ssrc,
+            trackType,
         };
     });
     return {
@@ -7590,6 +7291,7 @@ const getEmptyStats = (stats) => {
         highestFrameHeight: 0,
         highestFramesPerSecond: 0,
         codec: '',
+        codecPerTrackType: {},
         timestamp: Date.now(),
     };
 };
@@ -7625,6 +7327,12 @@ const aggregate = (stats) => {
         report.averageRoundTripTimeInMs = Math.round((report.averageRoundTripTimeInMs / streams.length) * 1000);
         // we take the first codec we find, as it should be the same for all streams
         report.codec = streams[0].codec || '';
+        report.codecPerTrackType = streams.reduce((acc, stream) => {
+            if (stream.trackType) {
+                acc[stream.trackType] = stream.codec || '';
+            }
+            return acc;
+        }, {});
     }
     const qualityLimitationReason = [
         qualityLimitationReasons.has('cpu') && 'cpu',
@@ -7636,7 +7344,135 @@ const aggregate = (stats) => {
     if (qualityLimitationReason) {
         report.qualityLimitationReasons = qualityLimitationReason;
     }
-    return report;
+    return report;
+};
+
+const version = "1.15.0";
+const [major, minor, patch] = version.split('.');
+let sdkInfo = {
+    type: SdkType.PLAIN_JAVASCRIPT,
+    major,
+    minor,
+    patch,
+};
+let osInfo;
+let deviceInfo;
+let webRtcInfo;
+let deviceState = { oneofKind: undefined };
+const setSdkInfo = (info) => {
+    sdkInfo = info;
+};
+const getSdkInfo = () => {
+    return sdkInfo;
+};
+const setOSInfo = (info) => {
+    osInfo = info;
+};
+const getOSInfo = () => {
+    return osInfo;
+};
+const setDeviceInfo = (info) => {
+    deviceInfo = info;
+};
+const getDeviceInfo = () => {
+    return deviceInfo;
+};
+const getWebRTCInfo = () => {
+    return webRtcInfo;
+};
+const setWebRTCInfo = (info) => {
+    webRtcInfo = info;
+};
+const setThermalState = (state) => {
+    if (!osInfo) {
+        deviceState = { oneofKind: undefined };
+        return;
+    }
+    if (osInfo.name === 'android') {
+        const thermalState = AndroidThermalState[state] ||
+            AndroidThermalState.UNSPECIFIED;
+        deviceState = {
+            oneofKind: 'android',
+            android: {
+                thermalState,
+                isPowerSaverMode: deviceState?.oneofKind === 'android' &&
+                    deviceState.android.isPowerSaverMode,
+            },
+        };
+    }
+    if (osInfo.name.toLowerCase() === 'ios') {
+        const thermalState = AppleThermalState[state] ||
+            AppleThermalState.UNSPECIFIED;
+        deviceState = {
+            oneofKind: 'apple',
+            apple: {
+                thermalState,
+                isLowPowerModeEnabled: deviceState?.oneofKind === 'apple' &&
+                    deviceState.apple.isLowPowerModeEnabled,
+            },
+        };
+    }
+};
+const setPowerState = (powerMode) => {
+    if (!osInfo) {
+        deviceState = { oneofKind: undefined };
+        return;
+    }
+    if (osInfo.name === 'android') {
+        deviceState = {
+            oneofKind: 'android',
+            android: {
+                thermalState: deviceState?.oneofKind === 'android'
+                    ? deviceState.android.thermalState
+                    : AndroidThermalState.UNSPECIFIED,
+                isPowerSaverMode: powerMode,
+            },
+        };
+    }
+    if (osInfo.name.toLowerCase() === 'ios') {
+        deviceState = {
+            oneofKind: 'apple',
+            apple: {
+                thermalState: deviceState?.oneofKind === 'apple'
+                    ? deviceState.apple.thermalState
+                    : AppleThermalState.UNSPECIFIED,
+                isLowPowerModeEnabled: powerMode,
+            },
+        };
+    }
+};
+const getDeviceState = () => {
+    return deviceState;
+};
+const getClientDetails = () => {
+    if (isReactNative()) {
+        // Since RN doesn't support web, sharing browser info is not required
+        return {
+            sdk: getSdkInfo(),
+            os: getOSInfo(),
+            device: getDeviceInfo(),
+        };
+    }
+    const userAgent = new UAParser(navigator.userAgent);
+    const { browser, os, device, cpu } = userAgent.getResult();
+    return {
+        sdk: getSdkInfo(),
+        browser: {
+            name: browser.name || navigator.userAgent,
+            version: browser.version || '',
+        },
+        os: {
+            name: os.name || '',
+            version: os.version || '',
+            architecture: cpu.architecture || '',
+        },
+        device: {
+            name: [device.vendor, device.model, device.type]
+                .filter(Boolean)
+                .join(' '),
+            version: '',
+        },
+    };
 };
 
 class SfuStatsReporter {
@@ -7672,8 +7508,28 @@ class SfuStatsReporter {
                 });
             });
         };
-        this.sendTelemetryData = async (telemetryData) => {
-            return this.run(telemetryData);
+        this.sendConnectionTime = (connectionTimeSeconds) => {
+            this.sendTelemetryData({
+                data: {
+                    oneofKind: 'connectionTimeSeconds',
+                    connectionTimeSeconds,
+                },
+            });
+        };
+        this.sendReconnectionTime = (strategy, timeSeconds) => {
+            this.sendTelemetryData({
+                data: {
+                    oneofKind: 'reconnection',
+                    reconnection: { strategy, timeSeconds },
+                },
+            });
+        };
+        this.sendTelemetryData = (telemetryData) => {
+            // intentionally not awaiting the promise here
+            // to avoid impeding with the ongoing actions.
+            this.run(telemetryData).catch((err) => {
+                this.logger('warn', 'Failed to send telemetry data', err);
+            });
         };
         this.run = async (telemetryData) => {
             const [subscriberStats, publisherStats] = await Promise.all([
@@ -8241,6 +8097,25 @@ class PermissionsContext {
         this.hasPermission = (permission) => {
             return this.permissions.includes(permission);
         };
+        /**
+         * Helper method that checks whether the current user has the permission
+         * to publish the given track type.
+         */
+        this.canPublish = (trackType) => {
+            switch (trackType) {
+                case TrackType.AUDIO:
+                    return this.hasPermission(OwnCapability.SEND_AUDIO);
+                case TrackType.VIDEO:
+                    return this.hasPermission(OwnCapability.SEND_VIDEO);
+                case TrackType.SCREEN_SHARE:
+                case TrackType.SCREEN_SHARE_AUDIO:
+                    return this.hasPermission(OwnCapability.SCREENSHARE);
+                case TrackType.UNSPECIFIED:
+                    return false;
+                default:
+                    ensureExhausted(trackType, 'Unknown track type');
+            }
+        };
         /**
          * Checks if the current user can request a specific permission
          * within the call.
@@ -8879,36 +8754,42 @@ class InputMediaDeviceManager {
             }
         });
     }
+    publishStream(stream) {
+        return this.call.publish(stream, this.trackType);
+    }
+    stopPublishStream() {
+        return this.call.stopPublish(this.trackType);
+    }
     getTracks() {
         return this.state.mediaStream?.getTracks() ?? [];
     }
     async muteStream(stopTracks = true) {
-        if (!this.state.mediaStream)
+        const mediaStream = this.state.mediaStream;
+        if (!mediaStream)
             return;
         this.logger('debug', `${stopTracks ? 'Stopping' : 'Disabling'} stream`);
         if (this.call.state.callingState === CallingState.JOINED) {
-            await this.stopPublishStream(stopTracks);
+            await this.stopPublishStream();
         }
         this.muteLocalStream(stopTracks);
         const allEnded = this.getTracks().every((t) => t.readyState === 'ended');
         if (allEnded) {
-            if (this.state.mediaStream &&
-                // @ts-expect-error release() is present in react-native-webrtc
-                typeof this.state.mediaStream.release === 'function') {
+            // @ts-expect-error release() is present in react-native-webrtc
+            if (typeof mediaStream.release === 'function') {
                 // @ts-expect-error called to dispose the stream in RN
-                this.state.mediaStream.release();
+                mediaStream.release();
             }
             this.state.setMediaStream(undefined, undefined);
             this.filters.forEach((entry) => entry.stop?.());
         }
     }
-    muteTracks() {
+    disableTracks() {
         this.getTracks().forEach((track) => {
             if (track.enabled)
                 track.enabled = false;
         });
     }
-    unmuteTracks() {
+    enableTracks() {
         this.getTracks().forEach((track) => {
             if (!track.enabled)
                 track.enabled = true;
@@ -8928,7 +8809,7 @@ class InputMediaDeviceManager {
             this.stopTracks();
         }
         else {
-            this.muteTracks();
+            this.disableTracks();
         }
     }
     async unmuteStream() {
@@ -8938,7 +8819,7 @@ class InputMediaDeviceManager {
         if (this.state.mediaStream &&
             this.getTracks().every((t) => t.readyState === 'live')) {
             stream = this.state.mediaStream;
-            this.unmuteTracks();
+            this.enableTracks();
         }
         else {
             const defaultConstraints = this.state.defaultConstraints;
@@ -9032,9 +8913,22 @@ class InputMediaDeviceManager {
                     await this.disable();
                 }
             };
-            this.getTracks().forEach((track) => {
+            const createTrackMuteHandler = (muted) => () => {
+                this.call.notifyTrackMuteState(muted, this.trackType).catch((err) => {
+                    this.logger('warn', 'Error while notifying track mute state', err);
+                });
+            };
+            stream.getTracks().forEach((track) => {
+                const muteHandler = createTrackMuteHandler(true);
+                const unmuteHandler = createTrackMuteHandler(false);
+                track.addEventListener('mute', muteHandler);
+                track.addEventListener('unmute', unmuteHandler);
                 track.addEventListener('ended', handleTrackEnded);
-                this.subscriptions.push(() => track.removeEventListener('ended', handleTrackEnded));
+                this.subscriptions.push(() => {
+                    track.removeEventListener('mute', muteHandler);
+                    track.removeEventListener('unmute', unmuteHandler);
+                    track.removeEventListener('ended', handleTrackEnded);
+                });
             });
         }
     }
@@ -9058,8 +8952,8 @@ class InputMediaDeviceManager {
                 await this.statusChangeSettled();
                 let isDeviceDisconnected = false;
                 let isDeviceReplaced = false;
-                const currentDevice = this.findDeviceInList(currentDevices, deviceId);
-                const prevDevice = this.findDeviceInList(prevDevices, deviceId);
+                const currentDevice = this.findDevice(currentDevices, deviceId);
+                const prevDevice = this.findDevice(prevDevices, deviceId);
                 if (!currentDevice && prevDevice) {
                     isDeviceDisconnected = true;
                 }
@@ -9089,8 +8983,9 @@ class InputMediaDeviceManager {
             }
         }));
     }
-    findDeviceInList(devices, deviceId) {
-        return devices.find((d) => d.deviceId === deviceId && d.kind === this.mediaDeviceKind);
+    findDevice(devices, deviceId) {
+        const kind = this.mediaDeviceKind;
+        return devices.find((d) => d.deviceId === deviceId && d.kind === kind);
     }
 }
 
@@ -9354,14 +9249,35 @@ class CameraManager extends InputMediaDeviceManager {
         }
     }
     /**
-     * Sets the preferred codec for encoding the video.
+     * Applies the video settings to the camera.
      *
-     * @internal internal use only, not part of the public API.
-     * @deprecated use {@link call.updatePublishOptions} instead.
-     * @param codec the codec to use for encoding the video.
+     * @param settings the video settings to apply.
+     * @param publish whether to publish the stream after applying the settings.
      */
-    setPreferredCodec(codec) {
-        this.call.updatePublishOptions({ preferredCodec: codec });
+    async apply(settings, publish) {
+        const hasPublishedVideo = !!this.call.state.localParticipant?.videoStream;
+        const hasPermission = this.call.permissionsContext.hasPermission(OwnCapability.SEND_AUDIO);
+        if (hasPublishedVideo || !hasPermission)
+            return;
+        // Wait for any in progress camera operation
+        await this.statusChangeSettled();
+        const { target_resolution, camera_facing, camera_default_on } = settings;
+        await this.selectTargetResolution(target_resolution);
+        // Set camera direction if it's not yet set
+        if (!this.state.direction && !this.state.selectedDevice) {
+            this.state.setDirection(camera_facing === 'front' ? 'front' : 'back');
+        }
+        if (!publish)
+            return;
+        const { mediaStream } = this.state;
+        if (this.enabled && mediaStream) {
+            // The camera is already enabled (e.g. lobby screen). Publish the stream
+            await this.publishStream(mediaStream);
+        }
+        else if (this.state.status === undefined && camera_default_on) {
+            // Start camera if backend config specifies, and there is no local setting
+            await this.enable();
+        }
     }
     getDevices() {
         return getVideoDevices();
@@ -9379,12 +9295,6 @@ class CameraManager extends InputMediaDeviceManager {
         }
         return getVideoStream(constraints);
     }
-    publishStream(stream) {
-        return this.call.publishVideoStream(stream);
-    }
-    stopPublishStream(stopTracks) {
-        return this.call.stopPublish(TrackType.VIDEO, stopTracks);
-    }
 }
 
 class MicrophoneManagerState extends InputMediaDeviceManagerState {
@@ -9712,18 +9622,37 @@ class MicrophoneManager extends InputMediaDeviceManager {
         this.speakingWhileMutedNotificationEnabled = false;
         await this.stopSpeakingWhileMutedDetection();
     }
+    /**
+     * Applies the audio settings to the microphone.
+     * @param settings the audio settings to apply.
+     * @param publish whether to publish the stream after applying the settings.
+     */
+    async apply(settings, publish) {
+        if (!publish)
+            return;
+        const hasPublishedAudio = !!this.call.state.localParticipant?.audioStream;
+        const hasPermission = this.call.permissionsContext.hasPermission(OwnCapability.SEND_AUDIO);
+        if (hasPublishedAudio || !hasPermission)
+            return;
+        // Wait for any in progress mic operation
+        await this.statusChangeSettled();
+        // Publish media stream that was set before we joined
+        const { mediaStream } = this.state;
+        if (this.enabled && mediaStream) {
+            // The mic is already enabled (e.g. lobby screen). Publish the stream
+            await this.publishStream(mediaStream);
+        }
+        else if (this.state.status === undefined && settings.mic_default_on) {
+            // Start mic if backend config specifies, and there is no local setting
+            await this.enable();
+        }
+    }
     getDevices() {
         return getAudioDevices();
     }
     getStream(constraints) {
         return getAudioStream(constraints);
     }
-    publishStream(stream) {
-        return this.call.publishAudioStream(stream);
-    }
-    stopPublishStream(stopTracks) {
-        return this.call.stopPublish(TrackType.AUDIO, stopTracks);
-    }
     async startSpeakingWhileMutedDetection(deviceId) {
         await withoutConcurrency(this.soundDetectorConcurrencyTag, async () => {
             await this.stopSpeakingWhileMutedDetection();
@@ -9843,7 +9772,7 @@ class ScreenShareManager extends InputMediaDeviceManager {
     async disableScreenShareAudio() {
         this.state.setAudioEnabled(false);
         if (this.call.publisher?.isPublishing(TrackType.SCREEN_SHARE_AUDIO)) {
-            await this.call.stopPublish(TrackType.SCREEN_SHARE_AUDIO, true);
+            await this.call.stopPublish(TrackType.SCREEN_SHARE_AUDIO);
         }
     }
     /**
@@ -9869,12 +9798,8 @@ class ScreenShareManager extends InputMediaDeviceManager {
         }
         return getScreenShareStream(constraints);
     }
-    publishStream(stream) {
-        return this.call.publishScreenShareStream(stream);
-    }
-    async stopPublishStream(stopTracks) {
-        await this.call.stopPublish(TrackType.SCREEN_SHARE, stopTracks);
-        await this.call.stopPublish(TrackType.SCREEN_SHARE_AUDIO, stopTracks);
+    async stopPublishStream() {
+        return this.call.stopPublish(TrackType.SCREEN_SHARE, TrackType.SCREEN_SHARE_AUDIO);
     }
     /**
      * Overrides the default `select` method to throw an error.
@@ -10084,6 +10009,112 @@ class Call {
          */
         this.leaveCallHooks = new Set();
         this.streamClientEventHandlers = new Map();
+        this.setup = async () => {
+            await withoutConcurrency(this.joinLeaveConcurrencyTag, async () => {
+                if (this.initialized)
+                    return;
+                this.leaveCallHooks.add(this.on('all', (event) => {
+                    // update state with the latest event data
+                    this.state.updateFromEvent(event);
+                }));
+                this.leaveCallHooks.add(this.on('changePublishOptions', (event) => {
+                    this.currentPublishOptions = event.publishOptions;
+                }));
+                this.leaveCallHooks.add(registerEventHandlers(this, this.dispatcher));
+                this.registerEffects();
+                this.registerReconnectHandlers();
+                if (this.state.callingState === CallingState.LEFT) {
+                    this.state.setCallingState(CallingState.IDLE);
+                }
+                this.initialized = true;
+            });
+        };
+        this.registerEffects = () => {
+            this.leaveCallHooks.add(
+            // handles updating the permissions context when the settings change.
+            createSubscription(this.state.settings$, (settings) => {
+                if (!settings)
+                    return;
+                this.permissionsContext.setCallSettings(settings);
+            }));
+            this.leaveCallHooks.add(
+            // handle the case when the user permissions are modified.
+            createSafeAsyncSubscription(this.state.ownCapabilities$, this.handleOwnCapabilitiesUpdated));
+            this.leaveCallHooks.add(
+            // handles the case when the user is blocked by the call owner.
+            createSubscription(this.state.blockedUserIds$, async (blockedUserIds) => {
+                if (!blockedUserIds || blockedUserIds.length === 0)
+                    return;
+                const currentUserId = this.currentUserId;
+                if (currentUserId && blockedUserIds.includes(currentUserId)) {
+                    this.logger('info', 'Leaving call because of being blocked');
+                    await this.leave({ reason: 'user blocked' }).catch((err) => {
+                        this.logger('error', 'Error leaving call after being blocked', err);
+                    });
+                }
+            }));
+            this.leaveCallHooks.add(
+            // cancel auto-drop when call is
+            createSubscription(this.state.session$, (session) => {
+                if (!this.ringing)
+                    return;
+                const receiverId = this.clientStore.connectedUser?.id;
+                if (!receiverId)
+                    return;
+                const isAcceptedByMe = Boolean(session?.accepted_by[receiverId]);
+                const isRejectedByMe = Boolean(session?.rejected_by[receiverId]);
+                if (isAcceptedByMe || isRejectedByMe) {
+                    this.cancelAutoDrop();
+                }
+            }));
+            this.leaveCallHooks.add(
+            // "ringing" mode effects and event handlers
+            createSubscription(this.ringingSubject, (isRinging) => {
+                if (!isRinging)
+                    return;
+                const callSession = this.state.session;
+                const receiver_id = this.clientStore.connectedUser?.id;
+                const ended_at = callSession?.ended_at;
+                const created_by_id = this.state.createdBy?.id;
+                const rejected_by = callSession?.rejected_by;
+                const accepted_by = callSession?.accepted_by;
+                let leaveCallIdle = false;
+                if (ended_at) {
+                    // call was ended before it was accepted or rejected so we should leave it to idle
+                    leaveCallIdle = true;
+                }
+                else if (created_by_id && rejected_by) {
+                    if (rejected_by[created_by_id]) {
+                        // call was cancelled by the caller
+                        leaveCallIdle = true;
+                    }
+                }
+                else if (receiver_id && rejected_by) {
+                    if (rejected_by[receiver_id]) {
+                        // call was rejected by the receiver in some other device
+                        leaveCallIdle = true;
+                    }
+                }
+                else if (receiver_id && accepted_by) {
+                    if (accepted_by[receiver_id]) {
+                        // call was accepted by the receiver in some other device
+                        leaveCallIdle = true;
+                    }
+                }
+                if (leaveCallIdle) {
+                    if (this.state.callingState !== CallingState.IDLE) {
+                        this.state.setCallingState(CallingState.IDLE);
+                    }
+                }
+                else {
+                    if (this.state.callingState === CallingState.IDLE) {
+                        this.state.setCallingState(CallingState.RINGING);
+                    }
+                    this.scheduleAutoDrop();
+                    this.leaveCallHooks.add(registerRingingCallEventHandlers(this));
+                }
+            }));
+        };
         this.handleOwnCapabilitiesUpdated = async (ownCapabilities) => {
             // update the permission context.
             this.permissionsContext.setPermissions(ownCapabilities);
@@ -10196,14 +10227,15 @@ class Call {
                 this.statsReporter = undefined;
                 this.sfuStatsReporter?.stop();
                 this.sfuStatsReporter = undefined;
-                this.subscriber?.close();
+                this.subscriber?.dispose();
                 this.subscriber = undefined;
-                this.publisher?.close({ stopTracks: true });
+                this.publisher?.dispose();
                 this.publisher = undefined;
                 await this.sfuClient?.leaveAndClose(reason);
                 this.sfuClient = undefined;
                 this.dynascaleManager.setSfuClient(undefined);
                 this.state.setCallingState(CallingState.LEFT);
+                this.state.dispose();
                 // Call all leave call hooks, e.g. to clean up global event handlers
                 this.leaveCallHooks.forEach((hook) => hook());
                 this.initialized = false;
@@ -10235,7 +10267,8 @@ class Call {
             // call.ring event excludes the call creator in the members list
             // as the creator does not get the ring event
             // so update the member list accordingly
-            const creator = this.state.members.find((m) => m.user.id === event.call.created_by.id);
+            const { created_by, settings } = event.call;
+            const creator = this.state.members.find((m) => m.user.id === created_by.id);
             if (!creator) {
                 this.state.setMembers(event.members);
             }
@@ -10250,7 +10283,7 @@ class Call {
             // const calls = useCalls().filter((c) => c.ringing);
             const calls = this.clientStore.calls.filter((c) => c.cid !== this.cid);
             this.clientStore.setCalls([this, ...calls]);
-            await this.applyDeviceConfig(false);
+            await this.applyDeviceConfig(settings, false);
         };
         /**
          * Loads the information about the call.
@@ -10273,7 +10306,7 @@ class Call {
                 this.watching = true;
                 this.clientStore.registerCall(this);
             }
-            await this.applyDeviceConfig(false);
+            await this.applyDeviceConfig(response.call.settings, false);
             return response;
         };
         /**
@@ -10295,7 +10328,7 @@ class Call {
                 this.watching = true;
                 this.clientStore.registerCall(this);
             }
-            await this.applyDeviceConfig(false);
+            await this.applyDeviceConfig(response.call.settings, false);
             return response;
         };
         /**
@@ -10397,19 +10430,32 @@ class Call {
             // we don't need to send JoinRequest if we are re-using an existing healthy SFU client
             if (previousSfuClient !== sfuClient) {
                 // prepare a generic SDP and send it to the SFU.
-                // this is a throw-away SDP that the SFU will use to determine
+                // these are throw-away SDPs that the SFU will use to determine
                 // the capabilities of the client (codec support, etc.)
-                const receivingCapabilitiesSdp = await getGenericSdp('recvonly');
-                const reconnectDetails = this.reconnectStrategy !== WebsocketReconnectStrategy.UNSPECIFIED
+                const [subscriberSdp, publisherSdp] = await Promise.all([
+                    getGenericSdp('recvonly'),
+                    getGenericSdp('sendonly'),
+                ]);
+                const isReconnecting = this.reconnectStrategy !== WebsocketReconnectStrategy.UNSPECIFIED;
+                const reconnectDetails = isReconnecting
                     ? this.getReconnectDetails(data?.migrating_from, previousSessionId)
                     : undefined;
-                const { callState, fastReconnectDeadlineSeconds } = await sfuClient.join({
-                    subscriberSdp: receivingCapabilitiesSdp,
-                    publisherSdp: '',
+                const preferredPublishOptions = !isReconnecting
+                    ? this.getPreferredPublishOptions()
+                    : this.currentPublishOptions || [];
+                const preferredSubscribeOptions = !isReconnecting
+                    ? this.getPreferredSubscribeOptions()
+                    : [];
+                const { callState, fastReconnectDeadlineSeconds, publishOptions } = await sfuClient.join({
+                    subscriberSdp,
+                    publisherSdp,
                     clientDetails,
                     fastReconnect: performingFastReconnect,
                     reconnectDetails,
+                    preferredPublishOptions,
+                    preferredSubscribeOptions,
                 });
+                this.currentPublishOptions = publishOptions;
                 this.fastReconnectDeadlineSeconds = fastReconnectDeadlineSeconds;
                 if (callState) {
                     this.state.updateFromSfuCallState(callState, sfuClient.sessionId, reconnectDetails);
@@ -10434,17 +10480,13 @@ class Call {
                     connectionConfig,
                     clientDetails,
                     statsOptions,
+                    publishOptions: this.currentPublishOptions || [],
                     closePreviousInstances: !performingMigration,
                 });
             }
             // make sure we only track connection timing if we are not calling this method as part of a reconnection flow
             if (!performingRejoin && !performingFastReconnect && !performingMigration) {
-                this.sfuStatsReporter?.sendTelemetryData({
-                    data: {
-                        oneofKind: 'connectionTimeSeconds',
-                        connectionTimeSeconds: (Date.now() - connectStartTime) / 1000,
-                    },
-                });
+                this.sfuStatsReporter?.sendConnectionTime((Date.now() - connectStartTime) / 1000);
             }
             if (performingRejoin) {
                 const strategy = WebsocketReconnectStrategy[this.reconnectStrategy];
@@ -10455,8 +10497,8 @@ class Call {
             }
             // device settings should be applied only once, we don't have to
             // re-apply them on later reconnections or server-side data fetches
-            if (!this.deviceSettingsAppliedOnce) {
-                await this.applyDeviceConfig(true);
+            if (!this.deviceSettingsAppliedOnce && this.state.settings) {
+                await this.applyDeviceConfig(this.state.settings, true);
                 this.deviceSettingsAppliedOnce = true;
             }
             // We shouldn't persist the `ring` and `notify` state after joining the call
@@ -10465,6 +10507,8 @@ class Call {
             // we will spam the other participants with push notifications and `call.ring` events.
             delete this.joinCallData?.ring;
             delete this.joinCallData?.notify;
+            // reset the reconnect strategy to unspecified after a successful reconnection
+            this.reconnectStrategy = WebsocketReconnectStrategy.UNSPECIFIED;
             this.logger('info', `Joined call ${this.cid}`);
         };
         /**
@@ -10474,7 +10518,7 @@ class Call {
         this.getReconnectDetails = (migratingFromSfuId, previousSessionId) => {
             const strategy = this.reconnectStrategy;
             const performingRejoin = strategy === WebsocketReconnectStrategy.REJOIN;
-            const announcedTracks = this.publisher?.getAnnouncedTracks() || [];
+            const announcedTracks = this.publisher?.getAnnouncedTracksForReconnect() || [];
             return {
                 strategy,
                 announcedTracks,
@@ -10484,6 +10528,54 @@ class Call {
                 previousSessionId: performingRejoin ? previousSessionId || '' : '',
             };
         };
+        /**
+         * Prepares the preferred codec for the call.
+         * This is an experimental client feature and subject to change.
+         * @internal
+         */
+        this.getPreferredPublishOptions = () => {
+            const { preferredCodec, fmtpLine, preferredBitrate, maxSimulcastLayers } = this.clientPublishOptions || {};
+            if (!preferredCodec && !preferredBitrate && !maxSimulcastLayers)
+                return [];
+            const codec = preferredCodec
+                ? Codec.create({ name: preferredCodec.split('/').pop(), fmtp: fmtpLine })
+                : undefined;
+            const preferredPublishOptions = [
+                PublishOption.create({
+                    trackType: TrackType.VIDEO,
+                    codec,
+                    bitrate: preferredBitrate,
+                    maxSpatialLayers: maxSimulcastLayers,
+                }),
+            ];
+            const screenShareSettings = this.screenShare.getSettings();
+            if (screenShareSettings) {
+                preferredPublishOptions.push(PublishOption.create({
+                    trackType: TrackType.SCREEN_SHARE,
+                    fps: screenShareSettings.maxFramerate,
+                    bitrate: screenShareSettings.maxBitrate,
+                }));
+            }
+            return preferredPublishOptions;
+        };
+        /**
+         * Prepares the preferred options for subscribing to tracks.
+         * This is an experimental client feature and subject to change.
+         * @internal
+         */
+        this.getPreferredSubscribeOptions = () => {
+            const { subscriberCodec, subscriberFmtpLine } = this.clientPublishOptions || {};
+            if (!subscriberCodec || !subscriberFmtpLine)
+                return [];
+            return [
+                SubscribeOption.create({
+                    trackType: TrackType.VIDEO,
+                    codecs: [
+                        { name: subscriberCodec.split('/').pop(), fmtp: subscriberFmtpLine },
+                    ],
+                }),
+            ];
+        };
         /**
          * Performs an ICE restart on both the Publisher and Subscriber Peer Connections.
          * Uses the provided SFU client to restore the ICE connection.
@@ -10514,9 +10606,9 @@ class Call {
          * @internal
          */
         this.initPublisherAndSubscriber = (opts) => {
-            const { sfuClient, connectionConfig, clientDetails, statsOptions, closePreviousInstances, } = opts;
+            const { sfuClient, connectionConfig, clientDetails, statsOptions, publishOptions, closePreviousInstances, } = opts;
             if (closePreviousInstances && this.subscriber) {
-                this.subscriber.close();
+                this.subscriber.dispose();
             }
             this.subscriber = new Subscriber({
                 sfuClient,
@@ -10535,18 +10627,14 @@ class Call {
             const isAnonymous = this.streamClient.user?.type === 'anonymous';
             if (!isAnonymous) {
                 if (closePreviousInstances && this.publisher) {
-                    this.publisher.close({ stopTracks: false });
+                    this.publisher.dispose();
                 }
-                const audioSettings = this.state.settings?.audio;
-                const isDtxEnabled = !!audioSettings?.opus_dtx_enabled;
-                const isRedEnabled = !!audioSettings?.redundant_coding_enabled;
                 this.publisher = new Publisher({
                     sfuClient,
                     dispatcher: this.dispatcher,
                     state: this.state,
                     connectionConfig,
-                    isDtxEnabled,
-                    isRedEnabled,
+                    publishOptions,
                     logTag: String(this.sfuClientTag),
                     onUnrecoverableError: () => {
                         this.reconnect(WebsocketReconnectStrategy.REJOIN).catch((err) => {
@@ -10693,47 +10781,31 @@ class Call {
          * @internal
          */
         this.reconnectFast = async () => {
-            let reconnectStartTime = Date.now();
+            const reconnectStartTime = Date.now();
             this.reconnectStrategy = WebsocketReconnectStrategy.FAST;
             this.state.setCallingState(CallingState.RECONNECTING);
             await this.join(this.joinCallData);
-            this.sfuStatsReporter?.sendTelemetryData({
-                data: {
-                    oneofKind: 'reconnection',
-                    reconnection: {
-                        timeSeconds: (Date.now() - reconnectStartTime) / 1000,
-                        strategy: WebsocketReconnectStrategy.FAST,
-                    },
-                },
-            });
+            this.sfuStatsReporter?.sendReconnectionTime(WebsocketReconnectStrategy.FAST, (Date.now() - reconnectStartTime) / 1000);
         };
         /**
          * Initiates the reconnection flow with the "rejoin" strategy.
          * @internal
          */
         this.reconnectRejoin = async () => {
-            let reconnectStartTime = Date.now();
+            const reconnectStartTime = Date.now();
             this.reconnectStrategy = WebsocketReconnectStrategy.REJOIN;
             this.state.setCallingState(CallingState.RECONNECTING);
             await this.join(this.joinCallData);
             await this.restorePublishedTracks();
             this.restoreSubscribedTracks();
-            this.sfuStatsReporter?.sendTelemetryData({
-                data: {
-                    oneofKind: 'reconnection',
-                    reconnection: {
-                        timeSeconds: (Date.now() - reconnectStartTime) / 1000,
-                        strategy: WebsocketReconnectStrategy.REJOIN,
-                    },
-                },
-            });
+            this.sfuStatsReporter?.sendReconnectionTime(WebsocketReconnectStrategy.REJOIN, (Date.now() - reconnectStartTime) / 1000);
         };
         /**
          * Initiates the reconnection flow with the "migrate" strategy.
          * @internal
          */
         this.reconnectMigrate = async () => {
-            let reconnectStartTime = Date.now();
+            const reconnectStartTime = Date.now();
             const currentSfuClient = this.sfuClient;
             if (!currentSfuClient) {
                 throw new Error('Cannot migrate without an active SFU client');
@@ -10767,20 +10839,12 @@ class Call {
                 this.state.setCallingState(CallingState.JOINED);
             }
             finally {
-                currentSubscriber?.close();
-                currentPublisher?.close({ stopTracks: false });
+                currentSubscriber?.dispose();
+                currentPublisher?.dispose();
                 // and close the previous SFU client, without specifying close code
                 currentSfuClient.close();
             }
-            this.sfuStatsReporter?.sendTelemetryData({
-                data: {
-                    oneofKind: 'reconnection',
-                    reconnection: {
-                        timeSeconds: (Date.now() - reconnectStartTime) / 1000,
-                        strategy: WebsocketReconnectStrategy.MIGRATE,
-                    },
-                },
-            });
+            this.sfuStatsReporter?.sendReconnectionTime(WebsocketReconnectStrategy.MIGRATE, (Date.now() - reconnectStartTime) / 1000);
         };
         /**
          * Registers the various event handlers for reconnection.
@@ -10857,23 +10921,16 @@ class Call {
             // the tracks need to be restored in their original order of publishing
             // otherwise, we might get `m-lines order mismatch` errors
             for (const trackType of this.trackPublishOrder) {
+                let mediaStream;
                 switch (trackType) {
                     case TrackType.AUDIO:
-                        const audioStream = this.microphone.state.mediaStream;
-                        if (audioStream) {
-                            await this.publishAudioStream(audioStream);
-                        }
+                        mediaStream = this.microphone.state.mediaStream;
                         break;
                     case TrackType.VIDEO:
-                        const videoStream = this.camera.state.mediaStream;
-                        if (videoStream)
-                            await this.publishVideoStream(videoStream);
+                        mediaStream = this.camera.state.mediaStream;
                         break;
                     case TrackType.SCREEN_SHARE:
-                        const screenShareStream = this.screenShare.state.mediaStream;
-                        if (screenShareStream) {
-                            await this.publishScreenShareStream(screenShareStream);
-                        }
+                        mediaStream = this.screenShare.state.mediaStream;
                         break;
                     // screen share audio can't exist without a screen share, so we handle it there
                     case TrackType.SCREEN_SHARE_AUDIO:
@@ -10883,6 +10940,8 @@ class Call {
                         ensureExhausted(trackType, 'Unknown track type');
                         break;
                 }
+                if (mediaStream)
+                    await this.publish(mediaStream, trackType);
             }
         };
         /**
@@ -10897,105 +10956,111 @@ class Call {
         };
         /**
          * Starts publishing the given video stream to the call.
-         * The stream will be stopped if the user changes an input device, or if the user leaves the call.
-         *
-         * Consecutive calls to this method will replace the previously published stream.
-         * The previous video stream will be stopped.
-         *
-         * @param videoStream the video stream to publish.
+         * @deprecated use `call.publish()`.
          */
         this.publishVideoStream = async (videoStream) => {
-            if (!this.sfuClient)
-                throw new Error(`Call not joined yet.`);
-            // joining is in progress, and we should wait until the client is ready
-            await this.sfuClient.joinTask;
-            if (!this.permissionsContext.hasPermission(OwnCapability.SEND_VIDEO)) {
-                throw new Error('No permission to publish video');
-            }
-            if (!this.publisher)
-                throw new Error('Publisher is not initialized');
-            const [videoTrack] = videoStream.getVideoTracks();
-            if (!videoTrack)
-                throw new Error('There is no video track in the stream');
-            if (!this.trackPublishOrder.includes(TrackType.VIDEO)) {
-                this.trackPublishOrder.push(TrackType.VIDEO);
-            }
-            await this.publisher.publishStream(videoStream, videoTrack, TrackType.VIDEO, this.publishOptions);
+            await this.publish(videoStream, TrackType.VIDEO);
         };
         /**
          * Starts publishing the given audio stream to the call.
-         * The stream will be stopped if the user changes an input device, or if the user leaves the call.
-         *
-         * Consecutive calls to this method will replace the audio stream that is currently being published.
-         * The previous audio stream will be stopped.
-         *
-         * @param audioStream the audio stream to publish.
+         * @deprecated use `call.publish()`
          */
         this.publishAudioStream = async (audioStream) => {
-            if (!this.sfuClient)
-                throw new Error(`Call not joined yet.`);
-            // joining is in progress, and we should wait until the client is ready
-            await this.sfuClient.joinTask;
-            if (!this.permissionsContext.hasPermission(OwnCapability.SEND_AUDIO)) {
-                throw new Error('No permission to publish audio');
-            }
-            if (!this.publisher)
-                throw new Error('Publisher is not initialized');
-            const [audioTrack] = audioStream.getAudioTracks();
-            if (!audioTrack)
-                throw new Error('There is no audio track in the stream');
-            if (!this.trackPublishOrder.includes(TrackType.AUDIO)) {
-                this.trackPublishOrder.push(TrackType.AUDIO);
-            }
-            await this.publisher.publishStream(audioStream, audioTrack, TrackType.AUDIO);
+            await this.publish(audioStream, TrackType.AUDIO);
         };
         /**
          * Starts publishing the given screen-share stream to the call.
-         *
-         * Consecutive calls to this method will replace the previous screen-share stream.
-         * The previous screen-share stream will be stopped.
-         *
-         * @param screenShareStream the screen-share stream to publish.
+         * @deprecated use `call.publish()`
          */
         this.publishScreenShareStream = async (screenShareStream) => {
+            await this.publish(screenShareStream, TrackType.SCREEN_SHARE);
+        };
+        /**
+         * Publishes the given media stream.
+         *
+         * @param mediaStream the media stream to publish.
+         * @param trackType the type of the track to announce.
+         */
+        this.publish = async (mediaStream, trackType) => {
             if (!this.sfuClient)
                 throw new Error(`Call not joined yet.`);
             // joining is in progress, and we should wait until the client is ready
             await this.sfuClient.joinTask;
-            if (!this.permissionsContext.hasPermission(OwnCapability.SCREENSHARE)) {
-                throw new Error('No permission to publish screen share');
+            if (!this.permissionsContext.canPublish(trackType)) {
+                throw new Error(`No permission to publish ${TrackType[trackType]}`);
             }
             if (!this.publisher)
                 throw new Error('Publisher is not initialized');
-            const [screenShareTrack] = screenShareStream.getVideoTracks();
-            if (!screenShareTrack) {
-                throw new Error('There is no screen share track in the stream');
+            const [track] = isAudioTrackType(trackType)
+                ? mediaStream.getAudioTracks()
+                : mediaStream.getVideoTracks();
+            if (!track) {
+                throw new Error(`There is no ${TrackType[trackType]} track in the stream`);
             }
-            if (!this.trackPublishOrder.includes(TrackType.SCREEN_SHARE)) {
-                this.trackPublishOrder.push(TrackType.SCREEN_SHARE);
-            }
-            const opts = {
-                screenShareSettings: this.screenShare.getSettings(),
-            };
-            await this.publisher.publishStream(screenShareStream, screenShareTrack, TrackType.SCREEN_SHARE, opts);
-            const [screenShareAudioTrack] = screenShareStream.getAudioTracks();
-            if (screenShareAudioTrack) {
-                if (!this.trackPublishOrder.includes(TrackType.SCREEN_SHARE_AUDIO)) {
-                    this.trackPublishOrder.push(TrackType.SCREEN_SHARE_AUDIO);
+            if (track.readyState === 'ended') {
+                throw new Error(`Can't publish ended tracks.`);
+            }
+            pushToIfMissing(this.trackPublishOrder, trackType);
+            await this.publisher.publish(track, trackType);
+            const trackTypes = [trackType];
+            if (trackType === TrackType.SCREEN_SHARE) {
+                const [audioTrack] = mediaStream.getAudioTracks();
+                if (audioTrack) {
+                    pushToIfMissing(this.trackPublishOrder, TrackType.SCREEN_SHARE_AUDIO);
+                    await this.publisher.publish(audioTrack, TrackType.SCREEN_SHARE_AUDIO);
+                    trackTypes.push(TrackType.SCREEN_SHARE_AUDIO);
                 }
-                await this.publisher.publishStream(screenShareStream, screenShareAudioTrack, TrackType.SCREEN_SHARE_AUDIO, opts);
             }
+            await this.updateLocalStreamState(mediaStream, ...trackTypes);
         };
         /**
          * Stops publishing the given track type to the call, if it is currently being published.
-         * Underlying track will be stopped and removed from the publisher.
          *
-         * @param trackType the track type to stop publishing.
-         * @param stopTrack if `true` the track will be stopped, else it will be just disabled
+         * @param trackTypes the track types to stop publishing.
+         */
+        this.stopPublish = async (...trackTypes) => {
+            if (!this.sfuClient || !this.publisher)
+                return;
+            this.publisher.stopTracks(...trackTypes);
+            await this.updateLocalStreamState(undefined, ...trackTypes);
+        };
+        /**
+         * Updates the call state with the new stream.
+         *
+         * @param mediaStream the new stream to update the call state with.
+         * If undefined, the stream will be removed from the call state.
+         * @param trackTypes the track types to update the call state with.
+         */
+        this.updateLocalStreamState = async (mediaStream, ...trackTypes) => {
+            if (!this.sfuClient || !this.sfuClient.sessionId)
+                return;
+            await this.notifyTrackMuteState(!mediaStream, ...trackTypes);
+            const { sessionId } = this.sfuClient;
+            for (const trackType of trackTypes) {
+                const streamStateProp = trackTypeToParticipantStreamKey(trackType);
+                if (!streamStateProp)
+                    continue;
+                this.state.updateParticipant(sessionId, (p) => ({
+                    publishedTracks: mediaStream
+                        ? pushToIfMissing([...p.publishedTracks], trackType)
+                        : p.publishedTracks.filter((t) => t !== trackType),
+                    [streamStateProp]: mediaStream,
+                }));
+            }
+        };
+        /**
+         * Updates the preferred publishing options
+         *
+         * @internal
+         * @param options the options to use.
          */
-        this.stopPublish = async (trackType, stopTrack = true) => {
-            this.logger('info', `stopPublish ${TrackType[trackType]}, stop tracks: ${stopTrack}`);
-            await this.publisher?.unpublishStream(trackType, stopTrack);
+        this.updatePublishOptions = (options) => {
+            this.logger('warn', '[call.updatePublishOptions]: You are manually overriding the publish options for this call. ' +
+                'This is not recommended, and it can cause call stability/compatibility issues. Use with caution.');
+            if (this.state.callingState === CallingState.JOINED) {
+                this.logger('warn', 'Updating publish options after joining the call does not have an effect');
+            }
+            this.clientPublishOptions = { ...this.clientPublishOptions, ...options };
         };
         /**
          * Notifies the SFU that a noise cancellation process has started.
@@ -11017,6 +11082,15 @@ class Call {
                 this.logger('warn', 'Failed to notify stop of noise cancellation', err);
             });
         };
+        /**
+         * Notifies the SFU about the mute state of the given track types.
+         * @internal
+         */
+        this.notifyTrackMuteState = async (muted, ...trackTypes) => {
+            if (!this.sfuClient)
+                return;
+            await this.sfuClient.updateMuteStates(trackTypes.map((trackType) => ({ trackType, muted })));
+        };
         /**
          * Will enhance the reported stats with additional participant-specific information (`callStatsReport$` state [store variable](./StreamVideoClient.md/#readonlystatestore)).
          * This is usually helpful when detailed stats for a specific participant are needed.
@@ -11161,7 +11235,43 @@ class Call {
             return this.streamClient.post(`${this.streamClientBasePath}/stop_transcription`);
         };
         /**
-         * Sends a `call.permission_request` event to all users connected to the call. The call settings object contains infomration about which permissions can be requested during a call (for example a user might be allowed to request permission to publish audio, but not video).
+         * Starts the closed captions of the call.
+         */
+        this.startClosedCaptions = async (options) => {
+            const trx = this.state.setCaptioning(true); // optimistic update
+            try {
+                return await this.streamClient.post(`${this.streamClientBasePath}/start_closed_captions`, options);
+            }
+            catch (err) {
+                trx.rollback(); // revert the optimistic update
+                throw err;
+            }
+        };
+        /**
+         * Stops the closed captions of the call.
+         */
+        this.stopClosedCaptions = async (options) => {
+            const trx = this.state.setCaptioning(false); // optimistic update
+            try {
+                return await this.streamClient.post(`${this.streamClientBasePath}/stop_closed_captions`, options);
+            }
+            catch (err) {
+                trx.rollback(); // revert the optimistic update
+                throw err;
+            }
+        };
+        /**
+         * Updates the closed caption settings.
+         *
+         * @param config the closed caption settings to apply
+         */
+        this.updateClosedCaptionSettings = (config) => {
+            this.state.updateClosedCaptionSettings(config);
+        };
+        /**
+         * Sends a `call.permission_request` event to all users connected to the call.
+         * The call settings object contains information about which permissions can be requested during a call
+         * (for example, a user might be allowed to request permission to publish audio, but not video).
          */
         this.requestPermissions = async (data) => {
             const { permissions } = data;
@@ -11444,70 +11554,14 @@ class Call {
          *
          * @internal
          */
-        this.applyDeviceConfig = async (status) => {
-            await this.initCamera({ setStatus: status }).catch((err) => {
+        this.applyDeviceConfig = async (settings, publish) => {
+            await this.camera.apply(settings.video, publish).catch((err) => {
                 this.logger('warn', 'Camera init failed', err);
             });
-            await this.initMic({ setStatus: status }).catch((err) => {
+            await this.microphone.apply(settings.audio, publish).catch((err) => {
                 this.logger('warn', 'Mic init failed', err);
             });
         };
-        this.initCamera = async (options) => {
-            // Wait for any in progress camera operation
-            await this.camera.statusChangeSettled();
-            if (this.state.localParticipant?.videoStream ||
-                !this.permissionsContext.hasPermission('send-video')) {
-                return;
-            }
-            // Set camera direction if it's not yet set
-            if (!this.camera.state.direction && !this.camera.state.selectedDevice) {
-                let defaultDirection = 'front';
-                const backendSetting = this.state.settings?.video.camera_facing;
-                if (backendSetting) {
-                    defaultDirection = backendSetting === 'front' ? 'front' : 'back';
-                }
-                this.camera.state.setDirection(defaultDirection);
-            }
-            // Set target resolution
-            const targetResolution = this.state.settings?.video.target_resolution;
-            if (targetResolution) {
-                await this.camera.selectTargetResolution(targetResolution);
-            }
-            if (options.setStatus) {
-                // Publish already that was set before we joined
-                if (this.camera.enabled &&
-                    this.camera.state.mediaStream &&
-                    !this.publisher?.isPublishing(TrackType.VIDEO)) {
-                    await this.publishVideoStream(this.camera.state.mediaStream);
-                }
-                // Start camera if backend config specifies, and there is no local setting
-                if (this.camera.state.status === undefined &&
-                    this.state.settings?.video.camera_default_on) {
-                    await this.camera.enable();
-                }
-            }
-        };
-        this.initMic = async (options) => {
-            // Wait for any in progress mic operation
-            await this.microphone.statusChangeSettled();
-            if (this.state.localParticipant?.audioStream ||
-                !this.permissionsContext.hasPermission('send-audio')) {
-                return;
-            }
-            if (options.setStatus) {
-                // Publish media stream that was set before we joined
-                if (this.microphone.enabled &&
-                    this.microphone.state.mediaStream &&
-                    !this.publisher?.isPublishing(TrackType.AUDIO)) {
-                    await this.publishAudioStream(this.microphone.state.mediaStream);
-                }
-                // Start mic if backend config specifies, and there is no local setting
-                if (this.microphone.state.status === undefined &&
-                    this.state.settings?.audio.mic_default_on) {
-                    await this.microphone.enable();
-                }
-            }
-        };
         /**
          * Will begin tracking the given element for visibility changes within the
          * configured viewport element (`call.setViewport`).
@@ -11656,109 +11710,6 @@ class Call {
         this.screenShare = new ScreenShareManager(this);
         this.dynascaleManager = new DynascaleManager(this.state, this.speaker);
     }
-    async setup() {
-        await withoutConcurrency(this.joinLeaveConcurrencyTag, async () => {
-            if (this.initialized)
-                return;
-            this.leaveCallHooks.add(this.on('all', (event) => {
-                // update state with the latest event data
-                this.state.updateFromEvent(event);
-            }));
-            this.leaveCallHooks.add(registerEventHandlers(this, this.dispatcher));
-            this.registerEffects();
-            this.registerReconnectHandlers();
-            if (this.state.callingState === CallingState.LEFT) {
-                this.state.setCallingState(CallingState.IDLE);
-            }
-            this.initialized = true;
-        });
-    }
-    registerEffects() {
-        this.leaveCallHooks.add(
-        // handles updating the permissions context when the settings change.
-        createSubscription(this.state.settings$, (settings) => {
-            if (!settings)
-                return;
-            this.permissionsContext.setCallSettings(settings);
-        }));
-        this.leaveCallHooks.add(
-        // handle the case when the user permissions are modified.
-        createSafeAsyncSubscription(this.state.ownCapabilities$, this.handleOwnCapabilitiesUpdated));
-        this.leaveCallHooks.add(
-        // handles the case when the user is blocked by the call owner.
-        createSubscription(this.state.blockedUserIds$, async (blockedUserIds) => {
-            if (!blockedUserIds || blockedUserIds.length === 0)
-                return;
-            const currentUserId = this.currentUserId;
-            if (currentUserId && blockedUserIds.includes(currentUserId)) {
-                this.logger('info', 'Leaving call because of being blocked');
-                await this.leave({ reason: 'user blocked' }).catch((err) => {
-                    this.logger('error', 'Error leaving call after being blocked', err);
-                });
-            }
-        }));
-        this.leaveCallHooks.add(
-        // cancel auto-drop when call is
-        createSubscription(this.state.session$, (session) => {
-            if (!this.ringing)
-                return;
-            const receiverId = this.clientStore.connectedUser?.id;
-            if (!receiverId)
-                return;
-            const isAcceptedByMe = Boolean(session?.accepted_by[receiverId]);
-            const isRejectedByMe = Boolean(session?.rejected_by[receiverId]);
-            if (isAcceptedByMe || isRejectedByMe) {
-                this.cancelAutoDrop();
-            }
-        }));
-        this.leaveCallHooks.add(
-        // "ringing" mode effects and event handlers
-        createSubscription(this.ringingSubject, (isRinging) => {
-            if (!isRinging)
-                return;
-            const callSession = this.state.session;
-            const receiver_id = this.clientStore.connectedUser?.id;
-            const ended_at = callSession?.ended_at;
-            const created_by_id = this.state.createdBy?.id;
-            const rejected_by = callSession?.rejected_by;
-            const accepted_by = callSession?.accepted_by;
-            let leaveCallIdle = false;
-            if (ended_at) {
-                // call was ended before it was accepted or rejected so we should leave it to idle
-                leaveCallIdle = true;
-            }
-            else if (created_by_id && rejected_by) {
-                if (rejected_by[created_by_id]) {
-                    // call was cancelled by the caller
-                    leaveCallIdle = true;
-                }
-            }
-            else if (receiver_id && rejected_by) {
-                if (rejected_by[receiver_id]) {
-                    // call was rejected by the receiver in some other device
-                    leaveCallIdle = true;
-                }
-            }
-            else if (receiver_id && accepted_by) {
-                if (accepted_by[receiver_id]) {
-                    // call was accepted by the receiver in some other device
-                    leaveCallIdle = true;
-                }
-            }
-            if (leaveCallIdle) {
-                if (this.state.callingState !== CallingState.IDLE) {
-                    this.state.setCallingState(CallingState.IDLE);
-                }
-            }
-            else {
-                if (this.state.callingState === CallingState.IDLE) {
-                    this.state.setCallingState(CallingState.RINGING);
-                }
-                this.scheduleAutoDrop();
-                this.leaveCallHooks.add(registerRingingCallEventHandlers(this));
-            }
-        }));
-    }
     /**
      * A flag indicating whether the call is "ringing" type of call.
      */
@@ -11777,15 +11728,6 @@ class Call {
     get isCreatedByMe() {
         return this.state.createdBy?.id === this.currentUserId;
     }
-    /**
-     * Updates the preferred publishing options
-     *
-     * @internal
-     * @param options the options to use.
-     */
-    updatePublishOptions(options) {
-        this.publishOptions = { ...this.publishOptions, ...options };
-    }
 }
 
 /**
@@ -12893,7 +12835,7 @@ class StreamClient {
             return await this.wsConnection.connect(this.defaultWSTimeout);
         };
         this.getUserAgent = () => {
-            const version = "1.13.1";
+            const version = "1.15.0";
             return (this.userAgent ||
                 `stream-video-javascript-client-${this.node ? 'node' : 'browser'}-${version}`);
         };
@@ -13193,7 +13135,7 @@ class StreamVideoClient {
                     clientStore: this.writeableStateStore,
                 });
                 call.state.updateFromCallResponse(c.call);
-                await call.applyDeviceConfig(false);
+                await call.applyDeviceConfig(c.call.settings, false);
                 if (data.watch) {
                     this.writeableStateStore.registerCall(call);
                 }
@@ -13402,5 +13344,5 @@ class StreamVideoClient {
 }
 StreamVideoClient._instanceMap = new Map();
 
-export { AudioSettingsRequestDefaultDeviceEnum, AudioSettingsResponseDefaultDeviceEnum, BlockListOptionsBehaviorEnum, browsers as Browsers, Call, CallState, CallType, CallTypes, CallingState, CameraManager, CameraManagerState, ChannelConfigWithInfoAutomodBehaviorEnum, ChannelConfigWithInfoAutomodEnum, ChannelConfigWithInfoBlocklistBehaviorEnum, CreateDeviceRequestPushProviderEnum, DebounceType, DynascaleManager, ErrorFromResponse, InputMediaDeviceManager, InputMediaDeviceManagerState, MicrophoneManager, MicrophoneManagerState, NoiseCancellationSettingsModeEnum, OwnCapability, RecordSettingsRequestModeEnum, RecordSettingsRequestQualityEnum, rxUtils as RxUtils, ScreenShareManager, ScreenShareState, events as SfuEvents, models as SfuModels, SpeakerManager, SpeakerState, StreamSfuClient, StreamVideoClient, StreamVideoReadOnlyStateStore, StreamVideoWriteableStateStore, TranscriptionSettingsRequestModeEnum, TranscriptionSettingsResponseModeEnum, VideoSettingsRequestCameraFacingEnum, VideoSettingsResponseCameraFacingEnum, ViewportTracker, VisibilityState, checkIfAudioOutputChangeSupported, combineComparators, conditional, createSoundDetector, defaultSortPreset, descending, deviceIds$, disposeOfMediaStream, dominantSpeaker, getAudioBrowserPermission, getAudioDevices, getAudioOutputDevices, getAudioStream, getClientDetails, getDeviceInfo, getDeviceState, getLogLevel, getLogger, getOSInfo, getScreenShareStream, getSdkInfo, getVideoBrowserPermission, getVideoDevices, getVideoStream, getWebRTCInfo, hasAudio, hasScreenShare, hasScreenShareAudio, hasVideo, isPinned, livestreamOrAudioRoomSortPreset, logLevels, logToConsole, name, noopComparator, paginatedLayoutSortPreset, pinned, publishingAudio, publishingVideo, reactionType, role, screenSharing, setDeviceInfo, setLogLevel, setLogger, setOSInfo, setPowerState, setSdkInfo, setThermalState, setWebRTCInfo, speakerLayoutSortPreset, speaking };
+export { AudioSettingsRequestDefaultDeviceEnum, AudioSettingsResponseDefaultDeviceEnum, BlockListOptionsBehaviorEnum, browsers as Browsers, Call, CallState, CallType, CallTypes, CallingState, CameraManager, CameraManagerState, ChannelConfigWithInfoAutomodBehaviorEnum, ChannelConfigWithInfoAutomodEnum, ChannelConfigWithInfoBlocklistBehaviorEnum, ChannelOwnCapability, CreateDeviceRequestPushProviderEnum, DebounceType, DynascaleManager, ErrorFromResponse, InputMediaDeviceManager, InputMediaDeviceManagerState, MicrophoneManager, MicrophoneManagerState, NoiseCancellationSettingsModeEnum, OwnCapability, RecordSettingsRequestModeEnum, RecordSettingsRequestQualityEnum, rxUtils as RxUtils, ScreenShareManager, ScreenShareState, events as SfuEvents, models as SfuModels, SpeakerManager, SpeakerState, StreamSfuClient, StreamVideoClient, StreamVideoReadOnlyStateStore, StreamVideoWriteableStateStore, TranscriptionSettingsRequestClosedCaptionModeEnum, TranscriptionSettingsRequestModeEnum, TranscriptionSettingsResponseClosedCaptionModeEnum, TranscriptionSettingsResponseModeEnum, VideoSettingsRequestCameraFacingEnum, VideoSettingsResponseCameraFacingEnum, ViewportTracker, VisibilityState, checkIfAudioOutputChangeSupported, combineComparators, conditional, createSoundDetector, defaultSortPreset, descending, deviceIds$, disposeOfMediaStream, dominantSpeaker, getAudioBrowserPermission, getAudioDevices, getAudioOutputDevices, getAudioStream, getClientDetails, getDeviceInfo, getDeviceState, getLogLevel, getLogger, getOSInfo, getScreenShareStream, getSdkInfo, getVideoBrowserPermission, getVideoDevices, getVideoStream, getWebRTCInfo, hasAudio, hasScreenShare, hasScreenShareAudio, hasVideo, isPinned, livestreamOrAudioRoomSortPreset, logLevels, logToConsole, name, noopComparator, paginatedLayoutSortPreset, pinned, publishingAudio, publishingVideo, reactionType, role, screenSharing, setDeviceInfo, setLogLevel, setLogger, setOSInfo, setPowerState, setSdkInfo, setThermalState, setWebRTCInfo, speakerLayoutSortPreset, speaking };
 //# sourceMappingURL=index.es.js.map