@stream-io/video-client 1.61.0 → 2.0.0-beta.1

package/dist/index.browser.es.js

@@ -7,7 +7,7 @@ import { TwirpFetchTransport, TwirpErrorCode } from '@protobuf-ts/twirp-transpor
 import * as scopedLogger from '@stream-io/logger';
 export { LogLevelEnum } from '@stream-io/logger';
 import { parse, write } from 'sdp-transform';
-import { Subject, Observable, combineLatest, BehaviorSubject, ReplaySubject, shareReplay, map, distinctUntilChanged, startWith, takeWhile, distinctUntilKeyChanged, fromEventPattern, concatMap, merge, from, fromEvent, tap, debounceTime, pairwise, firstValueFrom, of, Subscription } from 'rxjs';
+import { Subject, Observable, BehaviorSubject, distinctUntilChanged, shareReplay, ReplaySubject, map, combineLatest, startWith, takeWhile, distinctUntilKeyChanged, fromEventPattern, concatMap, merge, from, fromEvent, tap, debounceTime, pairwise, firstValueFrom, of, Subscription } from 'rxjs';
 import { UAParser } from 'ua-parser-js';
 import { WorkerTimer } from '@stream-io/worker-timer';
 
@@ -5081,7 +5081,7 @@ const toIceCandidate = (iceTrickle) => {
     }
 };
 
-const version = "1.61.0";
+const version = "2.0.0-beta.1";
 const [major, minor, patch] = version.split('.');
 let sdkInfo = {
     type: SdkType.PLAIN_JAVASCRIPT,
@@ -5461,11 +5461,14 @@ const isFunctionPatch = (update) => typeof update === 'function';
  * @param observable$ the observable to get the value from.
  */
 const getCurrentValue = (observable$) => {
+    if (observable$ instanceof BehaviorSubject) {
+        return observable$.getValue();
+    }
     let value;
     let err = undefined;
-    combineLatest([observable$])
+    observable$
         .subscribe({
-        next: ([v]) => {
+        next: (v) => {
             value = v;
         },
         error: (e) => {
@@ -5614,38 +5617,39 @@ var CallingState;
     CallingState["OFFLINE"] = "offline";
 })(CallingState || (CallingState = {}));
 
-class StreamVideoWriteableStateStore {
-    /**
-     * A store keeping data of a successfully connected user over WS to the coordinator server.
-     */
-    connectedUserSubject = new BehaviorSubject(undefined);
-    /**
-     * A list of {@link Call} objects created/tracked by this client.
-     */
-    callsSubject = new BehaviorSubject([]);
-    constructor() {
-        this.connectedUserSubject.subscribe(async (user) => {
-            // leave all calls when the user disconnects.
-            if (!user) {
-                const logger = videoLoggerSystem.getLogger('client-state');
-                for (const call of this.calls) {
-                    if (call.state.callingState === CallingState.LEFT)
-                        continue;
-                    logger.info(`User disconnected, leaving call: ${call.cid}`);
-                    await call
-                        .leave({ message: 'client.disconnectUser() called' })
-                        .catch((err) => {
-                        logger.error(`Error leaving call: ${call.cid}`, err);
-                    });
-                }
-            }
-        });
-    }
-    /**
-     * The currently connected user.
-     */
+function subject(initialValue) {
+    return new BehaviorSubject(initialValue);
+}
+/**
+ * Creates an Observable from the given subject by piping it to the
+ * `distinctUntilChanged()` operator.
+ */
+const duc = (source, comparator) => source.pipe(distinctUntilChanged(comparator));
+/**
+ * Multicasts the given Observable, replaying the latest computed value to
+ * every new subscriber instead of re-running the pipeline for each of them.
+ */
+const shared = (source) => source.pipe(shareReplay({ bufferSize: 1, refCount: true }));
+
+/**
+ * Holds the state of the client, and the calls it created or tracks.
+ * You can subscribe to the exposed observables to get notified about changes.
+ */
+class ClientState {
+    logger = videoLoggerSystem.getLogger('ClientState');
+    connectedUserSubject = subject();
+    callsSubject = subject([]);
+    /** Data describing a user successfully connected over WS to the coordinator. */
+    connectedUser$ = this.connectedUserSubject.asObservable();
+    /** A list of {@link Call} objects created/tracked by this client. */
+    calls$ = this.callsSubject.asObservable();
+    /** The currently connected user. */
     get connectedUser() {
-        return this.connectedUserSubject.getValue();
+        return getCurrentValue(this.connectedUserSubject);
+    }
+    /** A list of {@link Call} objects created/tracked by this client. */
+    get calls() {
+        return getCurrentValue(this.callsSubject);
     }
     /**
      * Sets the currently connected user.
@@ -5656,22 +5660,19 @@ class StreamVideoWriteableStateStore {
     setConnectedUser = (user) => {
         return setCurrentValue(this.connectedUserSubject, user);
     };
-    /**
-     * A list of {@link Call} objects created/tracked by this client.
-     */
-    get calls() {
-        return getCurrentValue(this.callsSubject);
-    }
     /**
      * Sets the list of {@link Call} objects created/tracked by this client.
-     * @param calls
+     *
+     * @internal
+     * @param calls the calls to set.
      */
     setCalls = (calls) => {
         return setCurrentValue(this.callsSubject, calls);
     };
     /**
-     * Adds a {@link Call} object to the list of {@link Call} objects created/tracked by this client.
+     * Adds a {@link Call} object to the list of calls tracked by this client.
      *
+     * @internal
      * @param call the call to add.
      */
     registerCall = (call) => {
@@ -5682,6 +5683,7 @@ class StreamVideoWriteableStateStore {
     /**
      * Registers a {@link Call} object if it doesn't exist, otherwise updates it.
      *
+     * @internal
      * @param call the call to register or update.
      */
     registerOrUpdateCall = (call) => {
@@ -5693,17 +5695,17 @@ class StreamVideoWriteableStateStore {
         }
     };
     /**
-     * Removes a {@link Call} object from the list of {@link Call} objects created/tracked by this client.
+     * Removes a {@link Call} object from the list of calls tracked by this client.
      *
-     * @param call the call to remove
+     * @internal
+     * @param call the call to remove.
      */
     unregisterCall = (call) => {
-        const logger = videoLoggerSystem.getLogger('client-state');
-        logger.trace(`Unregistering call: ${call.cid}`);
+        this.logger.trace(`Unregistering call: ${call.cid}`);
         return this.setCalls((calls) => calls.filter((c) => c !== call));
     };
     /**
-     * Finds a {@link Call} object in the list of {@link Call} objects created/tracked by this client.
+     * Finds a {@link Call} object in the list of calls tracked by this client.
      *
      * @param type the type of call to find.
      * @param id the id of the call to find.
@@ -5712,38 +5714,6 @@ class StreamVideoWriteableStateStore {
         return this.calls.find((c) => c.type === type && c.id === id);
     };
 }
-/**
- * A reactive store that exposes state variables in a reactive manner.
- * You can subscribe to changes of the different state variables.
- * This central store contains all the state variables related to [`StreamVideoClient`](./StreamVideClient.md) and [`Call`](./Call.md).
- */
-class StreamVideoReadOnlyStateStore {
-    /**
-     * Data describing a user successfully connected over WS to coordinator server.
-     */
-    connectedUser$;
-    /**
-     * A list of {@link Call} objects created/tracked by this client.
-     */
-    calls$;
-    constructor(store) {
-        // convert and expose subjects as observables
-        this.connectedUser$ = store.connectedUserSubject.asObservable();
-        this.calls$ = store.callsSubject.asObservable();
-    }
-    /**
-     * The current user connected over WS to the backend.
-     */
-    get connectedUser() {
-        return getCurrentValue(this.connectedUser$);
-    }
-    /**
-     * A list of {@link Call} objects created/tracked by this client.
-     */
-    get calls() {
-        return getCurrentValue(this.calls$);
-    }
-}
 
 /**
  * Creates a new combined {@link Comparator<T>} which sorts items by the given comparators.
@@ -6076,9 +6046,7 @@ const paginatedLayoutSortPreset = combineComparators(pinned, ifInvisibleOrUnknow
  */
 const livestreamOrAudioRoomSortPreset = combineComparators(publishing, ifInvisibleOrUnknownBy(combineComparators(dominantSpeaker, speaking, reactionType('raised-hand'), withVideoIngressSource, publishingVideo, publishingAudio)), role('admin', 'host', 'speaker'));
 
-/**
- * Returns the default egress object - when no egress data is available.
- */
+/** Returns the default egress object - when no egress data is available. */
 const defaultEgress = {
     broadcasting: false,
     hls: { playlist_url: '', status: '' },
@@ -6089,93 +6057,120 @@ const defaultEgress = {
  * @react You don't have to use this class directly, as we are exposing the state through Hooks.
  */
 class CallState {
-    backstageSubject = new BehaviorSubject(true);
-    blockedUserIdsSubject = new BehaviorSubject([]);
-    createdAtSubject = new BehaviorSubject(new Date());
-    endedAtSubject = new BehaviorSubject(undefined);
-    startsAtSubject = new BehaviorSubject(undefined);
-    updatedAtSubject = new BehaviorSubject(new Date());
-    createdBySubject = new BehaviorSubject(undefined);
-    customSubject = new BehaviorSubject({});
-    egressSubject = new BehaviorSubject(undefined);
-    ingressSubject = new BehaviorSubject(undefined);
-    recordingSubject = new BehaviorSubject(false);
-    individualRecordingSubject = new BehaviorSubject(false);
-    rawRecordingSubject = new BehaviorSubject(false);
-    sessionSubject = new BehaviorSubject(undefined);
-    settingsSubject = new BehaviorSubject(undefined);
-    transcribingSubject = new BehaviorSubject(false);
-    captioningSubject = new BehaviorSubject(false);
-    e2eeEnabledSubject = new BehaviorSubject(false);
-    endedBySubject = new BehaviorSubject(undefined);
-    thumbnailsSubject = new BehaviorSubject(undefined);
-    membersSubject = new BehaviorSubject([]);
-    ownCapabilitiesSubject = new BehaviorSubject([]);
-    callingStateSubject = new BehaviorSubject(CallingState.UNKNOWN);
-    startedAtSubject = new BehaviorSubject(undefined);
-    participantCountSubject = new BehaviorSubject(0);
-    anonymousParticipantCountSubject = new BehaviorSubject(0);
-    participantsSubject = new BehaviorSubject([]);
-    callStatsReportSubject = new BehaviorSubject(undefined);
-    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.
-    // We keep these tracks around until we can associate them with a participant.
-    orphanedTracks = [];
+    logger = videoLoggerSystem.getLogger('CallState');
+    /** A list of comparators that are used to sort the participants. */
+    sortParticipantsBy = defaultSortPreset;
+    backstageSubject = subject(true);
+    blockedUserIdsSubject = subject([]);
+    createdAtSubject = subject(new Date());
+    endedAtSubject = subject();
+    startsAtSubject = subject();
+    updatedAtSubject = subject(new Date());
+    createdBySubject = subject();
+    customSubject = subject({});
+    egressSubject = subject();
+    ingressSubject = subject();
+    recordingSubject = subject(false);
+    individualRecordingSubject = subject(false);
+    rawRecordingSubject = subject(false);
+    sessionSubject = subject();
+    settingsSubject = subject();
+    transcribingSubject = subject(false);
+    captioningSubject = subject(false);
+    e2eeEnabledSubject = subject(false);
+    endedBySubject = subject();
+    thumbnailsSubject = subject();
+    membersSubject = subject([]);
+    ownCapabilitiesSubject = subject([]);
+    callingStateSubject = subject(CallingState.UNKNOWN);
+    startedAtSubject = subject();
+    participantCountSubject = subject(0);
+    anonymousParticipantCountSubject = subject(0);
+    participantsSubject = subject([]);
+    callStatsReportSubject = subject();
+    closedCaptionsSubject = subject([]);
     callGrantsSubject = new ReplaySubject(1);
-    // Derived state
+    /** The backstage state. */
+    backstage$ = duc(this.backstageSubject);
+    /** Will provide the list of blocked user IDs. */
+    blockedUserIds$ = duc(this.blockedUserIdsSubject, isShallowArrayEqual);
+    /** Will provide the time when this call has been created. */
+    createdAt$ = this.createdAtSubject.asObservable();
+    /** Will provide the time when this call has been ended. */
+    endedAt$ = this.endedAtSubject.asObservable();
+    /** Will provide the time when this call has been scheduled to start. */
+    startsAt$ = this.startsAtSubject.asObservable();
+    /** Will provide the time when this call has been updated. */
+    updatedAt$ = this.updatedAtSubject.asObservable();
+    /** Will provide the user who created this call. */
+    createdBy$ = this.createdBySubject.asObservable();
+    /** Will provide the custom data of this call. */
+    custom$ = this.customSubject.asObservable();
+    /** Will provide the egress data of this call. */
+    egress$ = this.egressSubject.asObservable();
+    /** Will provide the ingress data of this call. */
+    ingress$ = this.ingressSubject.asObservable();
+    /** Will provide the recording state of this call. */
+    recording$ = duc(this.recordingSubject);
+    /** Will provide the recording state of this call. */
+    individualRecording$ = duc(this.individualRecordingSubject);
+    /** Will provide the recording state of this call. */
+    rawRecording$ = duc(this.rawRecordingSubject);
+    /** Will provide the session data of this call. */
+    session$ = this.sessionSubject.asObservable();
+    /** Will provide the settings of this call. */
+    settings$ = this.settingsSubject.asObservable();
+    /** Will provide the transcribing state of this call. */
+    transcribing$ = duc(this.transcribingSubject);
+    /** Will provide the closed captioning state of this call. */
+    captioning$ = duc(this.captioningSubject);
+    /**
+     * Whether end-to-end encryption is active for this call, as reported by the
+     * SFU in the join response.
+     */
+    e2eeEnabled$ = duc(this.e2eeEnabledSubject);
+    /** Will provide the user who ended this call. */
+    endedBy$ = this.endedBySubject.asObservable();
+    /** Will provide the thumbnails of this call. */
+    thumbnails$ = this.thumbnailsSubject.asObservable();
+    /** The list of members in the current call. */
+    members$ = this.membersSubject.asObservable();
+    /** The calling state. */
+    callingState$ = duc(this.callingStateSubject);
     /**
      * The time the call session actually started.
      * Useful for displaying the call duration.
      */
-    startedAt$;
+    startedAt$ = this.startedAtSubject.asObservable();
     /**
      * The server-side counted number of participants connected to the current call.
      * This number includes the anonymous participants as well.
      */
-    participantCount$;
+    participantCount$ = duc(this.participantCountSubject);
     /**
      * The server-side counted number of anonymous participants connected to the current call.
      * This number excludes the regular participants.
      */
-    anonymousParticipantCount$;
+    anonymousParticipantCount$ = duc(this.anonymousParticipantCountSubject);
     /**
      * All participants of the current call (this includes the current user and other participants as well),
      * unsorted. This observable only updates when participants join or leave the call.
      */
-    rawParticipants$;
-    /**
-     * All participants of the current call (this includes the current user and other participants as well),
-     * sorted according to the current `sortByParticipantsBy` setting
-     */
-    participants$;
-    /**
-     * Remote participants of the current call (this includes every participant except the logged-in user).
-     */
-    remoteParticipants$;
-    /**
-     * The local participant of the current call (the logged-in user).
-     */
-    localParticipant$;
-    /**
-     * Pinned participants of the current call.
-     */
-    pinnedParticipants$;
-    /**
-     * The currently elected dominant speaker in the current call.
-     */
-    dominantSpeaker$;
-    /**
-     * Emits true whenever there is an active screen sharing session within
-     * the current call. Useful for displaying a "screen sharing" indicator and
-     * switching the layout to a screen sharing layout.
-     *
-     * The actual screen sharing track isn't exposed here, but can be retrieved
-     * from the list of call participants. We also don't want to be limiting
-     * to the number of share screen tracks are displayed in a call.
-     */
-    hasOngoingScreenShare$;
+    rawParticipants$ = shared(this.participantsSubject.asObservable());
+    /** All participants of the current call sorted according to the current `sortByParticipantsBy` setting. */
+    participants$ = shared(this.participantsSubject.asObservable().pipe(
+    // maintain stable-sort by mutating the participants stored in the original subject
+    map((ps) => ps.sort(this.sortParticipantsBy))));
+    /** The local participant of the current call. */
+    localParticipant$ = shared(this.participants$.pipe(map((ps) => ps.find((p) => p.isLocalParticipant))));
+    /** Remote participants of the current call (all except the local participant). */
+    remoteParticipants$ = shared(this.participants$.pipe(map((ps) => ps.filter((p) => !p.isLocalParticipant))));
+    /** Pinned participants of the current call. */
+    pinnedParticipants$ = shared(this.participants$.pipe(map((ps) => ps.filter((p) => !!p.pin))));
+    /** The currently elected dominant speaker in the current call. */
+    dominantSpeaker$ = shared(this.participants$.pipe(map((ps) => ps.find((p) => p.isDominantSpeaker))));
+    /** Emits true whenever there is an active screen sharing session within the current call. */
+    hasOngoingScreenShare$ = shared(this.participants$.pipe(map((ps) => ps.some((p) => hasScreenShare(p))), distinctUntilChanged()));
     /**
      * The latest stats report of the current call.
      * When stats gathering is enabled, this observable will emit a new value
@@ -6184,232 +6179,66 @@ class CallState {
      * Consumers of this observable can implement their own batching logic
      * in case they want to show historical stats data.
      */
-    callStatsReport$;
-    /**
-     * The list of members in the current call.
-     */
-    members$;
-    /**
-     * The list of capabilities of the current user.
-     */
-    ownCapabilities$;
-    /**
-     * The calling state.
-     */
-    callingState$;
-    /**
-     * The backstage state.
-     */
-    backstage$;
-    /**
-     * Will provide the list of blocked user IDs.
-     */
-    blockedUserIds$;
-    /**
-     * Will provide the time when this call has been created.
-     */
-    createdAt$;
-    /**
-     * Will provide the time when this call has been ended.
-     */
-    endedAt$;
-    /**
-     * Will provide the time when this call has been scheduled to start.
-     */
-    startsAt$;
-    /**
-     * Will provide the time when this call has been updated.
-     */
-    updatedAt$;
-    /**
-     * Will provide the user who created this call.
-     */
-    createdBy$;
-    /**
-     * Will provide the custom data of this call.
-     */
-    custom$;
-    /**
-     * Will provide the egress data of this call.
-     */
-    egress$;
-    /**
-     * Will provide the ingress data of this call.
-     */
-    ingress$;
-    /**
-     * Will provide the recording state of this call.
-     */
-    recording$;
-    /**
-     * Will provide the recording state of this call.
-     */
-    individualRecording$;
-    /**
-     * Will provide the recording state of this call.
-     */
-    rawRecording$;
-    /**
-     * Will provide the session data of this call.
-     */
-    session$;
-    /**
-     * Will provide the settings of this call.
-     */
-    settings$;
-    /**
-     * Will provide the transcribing state of this call.
-     */
-    transcribing$;
-    /**
-     * Will provide the closed captioning state of this call.
-     */
-    captioning$;
-    /**
-     * Whether end-to-end encryption is active for this call, as reported by the
-     * SFU in the join response.
-     */
-    e2eeEnabled$;
-    /**
-     * Will provide the user who ended this call.
-     */
-    endedBy$;
-    /**
-     * Will provide the thumbnails of this call.
-     */
-    thumbnails$;
-    /**
-     * The queue of closed captions.
-     */
-    closedCaptions$;
-    logger = videoLoggerSystem.getLogger('CallState');
-    /**
-     * A list of comparators that are used to sort the participants.
-     */
-    sortParticipantsBy = defaultSortPreset;
-    /**
-     * The closed captions configuration.
-     */
+    callStatsReport$ = this.callStatsReportSubject.asObservable();
+    /** The queue of closed captions. */
+    closedCaptions$ = this.closedCaptionsSubject.asObservable();
+    /** The list of capabilities of the current user. */
+    ownCapabilities$ = shared(combineLatest([
+        this.ownCapabilitiesSubject,
+        this.callGrantsSubject.pipe(startWith(undefined)),
+    ]).pipe(map(([capabilities, grants]) => {
+        if (!grants)
+            return capabilities;
+        const { canPublishAudio, canPublishVideo, canScreenshare } = grants;
+        const update = {
+            [OwnCapability.SEND_AUDIO]: canPublishAudio,
+            [OwnCapability.SEND_VIDEO]: canPublishVideo,
+            [OwnCapability.SCREENSHARE]: canScreenshare,
+        };
+        const nextCapabilities = [...capabilities];
+        for (const _capability in update) {
+            const capability = _capability;
+            const allowed = update[capability];
+            // grants take precedence over capabilities, reconstruct the capabilities
+            if (allowed && !nextCapabilities.includes(capability)) {
+                nextCapabilities.push(capability);
+            }
+            else if (!allowed && nextCapabilities.includes(capability)) {
+                const index = nextCapabilities.indexOf(capability);
+                nextCapabilities.splice(index, 1);
+            }
+        }
+        return nextCapabilities;
+    }), distinctUntilChanged(isShallowArrayEqual)));
+    // 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.
+    // We keep these tracks around until we can associate them with a participant.
+    orphanedTracks = [];
+    /** The closed captions configuration. */
     closedCaptionsSettings;
     closedCaptionsTasks = new Map();
     eventHandlers;
-    /**
-     * Creates a new instance of the CallState class.
-     *
-     */
+    /** Creates a new instance of the CallState class. */
     constructor() {
-        this.rawParticipants$ = this.participantsSubject
-            .asObservable()
-            .pipe(shareReplay({ bufferSize: 1, refCount: true }));
-        this.participants$ = this.participantsSubject.asObservable().pipe(
-        // maintain stable-sort by mutating the participants stored
-        // in the original subject
-        map((ps) => ps.sort(this.sortParticipantsBy)), shareReplay({ bufferSize: 1, refCount: true }));
-        this.localParticipant$ = this.participants$.pipe(map((participants) => participants.find((p) => p.isLocalParticipant)), shareReplay({ bufferSize: 1, refCount: true }));
-        this.remoteParticipants$ = this.participants$.pipe(map((participants) => participants.filter((p) => !p.isLocalParticipant)), shareReplay({ bufferSize: 1, refCount: true }));
-        this.pinnedParticipants$ = this.participants$.pipe(map((participants) => participants.filter((p) => !!p.pin)), shareReplay({ bufferSize: 1, refCount: true }));
-        this.dominantSpeaker$ = this.participants$.pipe(map((participants) => participants.find((p) => p.isDominantSpeaker)), shareReplay({ bufferSize: 1, refCount: true }));
-        this.hasOngoingScreenShare$ = this.participants$.pipe(map((participants) => participants.some((p) => hasScreenShare(p))), distinctUntilChanged(), shareReplay({ bufferSize: 1, refCount: true }));
-        // dates
-        this.createdAt$ = this.createdAtSubject.asObservable();
-        this.endedAt$ = this.endedAtSubject.asObservable();
-        this.startsAt$ = this.startsAtSubject.asObservable();
-        this.startedAt$ = this.startedAtSubject.asObservable();
-        this.updatedAt$ = this.updatedAtSubject.asObservable();
-        this.callStatsReport$ = this.callStatsReportSubject.asObservable();
-        this.members$ = this.membersSubject.asObservable();
-        // complex objects should work as streams of data
-        this.createdBy$ = this.createdBySubject.asObservable();
-        this.custom$ = this.customSubject.asObservable();
-        this.egress$ = this.egressSubject.asObservable();
-        this.ingress$ = this.ingressSubject.asObservable();
-        this.session$ = this.sessionSubject.asObservable();
-        this.settings$ = this.settingsSubject.asObservable();
-        this.endedBy$ = this.endedBySubject.asObservable();
-        this.thumbnails$ = this.thumbnailsSubject.asObservable();
-        this.closedCaptions$ = this.closedCaptionsSubject.asObservable();
-        /**
-         * Creates an Observable from the given subject by piping to the
-         * `distinctUntilChanged()` operator.
-         */
-        const duc = (subject, comparator) => subject.pipe(distinctUntilChanged(comparator));
-        // primitive values should only emit once the value they hold changes
-        this.anonymousParticipantCount$ = duc(this.anonymousParticipantCountSubject);
-        this.blockedUserIds$ = duc(this.blockedUserIdsSubject, isShallowArrayEqual);
-        this.backstage$ = duc(this.backstageSubject);
-        this.callingState$ = duc(this.callingStateSubject);
-        this.ownCapabilities$ = combineLatest([
-            this.ownCapabilitiesSubject,
-            this.callGrantsSubject.pipe(startWith(undefined)),
-        ]).pipe(map(([capabilities, grants]) => {
-            if (!grants)
-                return capabilities;
-            const { canPublishAudio, canPublishVideo, canScreenshare } = grants;
-            const update = {
-                [OwnCapability.SEND_AUDIO]: canPublishAudio,
-                [OwnCapability.SEND_VIDEO]: canPublishVideo,
-                [OwnCapability.SCREENSHARE]: canScreenshare,
-            };
-            const nextCapabilities = [...capabilities];
-            for (const _capability in update) {
-                const capability = _capability;
-                const allowed = update[capability];
-                // grants take precedence over capabilities, reconstruct the capabilities
-                if (allowed && !nextCapabilities.includes(capability)) {
-                    nextCapabilities.push(capability);
-                }
-                else if (!allowed && nextCapabilities.includes(capability)) {
-                    const index = nextCapabilities.indexOf(capability);
-                    nextCapabilities.splice(index, 1);
-                }
-            }
-            return nextCapabilities;
-        }), distinctUntilChanged(isShallowArrayEqual), shareReplay({ bufferSize: 1, refCount: true }));
-        this.participantCount$ = duc(this.participantCountSubject);
-        this.recording$ = duc(this.recordingSubject);
-        this.individualRecording$ = duc(this.individualRecordingSubject);
-        this.rawRecording$ = duc(this.rawRecordingSubject);
-        this.transcribing$ = duc(this.transcribingSubject);
-        this.captioning$ = duc(this.captioningSubject);
-        this.e2eeEnabled$ = duc(this.e2eeEnabledSubject);
         this.eventHandlers = {
-            // these events are not updating the call state:
-            'call.frame_recording_ready': undefined,
-            'call.kicked_user': undefined,
-            'call.moderation_blur': undefined,
-            'call.moderation_warning': undefined,
-            'call.permission_request': undefined,
-            'call.recording_ready': undefined,
-            'call.rtmp_broadcast_failed': undefined,
-            'call.rtmp_broadcast_started': undefined,
-            'call.rtmp_broadcast_stopped': undefined,
-            'call.stats_report_ready': undefined,
-            'call.transcription_ready': undefined,
-            'call.user_feedback_submitted': undefined,
-            'call.user_muted': undefined,
-            'connection.error': undefined,
-            'connection.ok': undefined,
-            'health.check': undefined,
-            'user.updated': undefined,
-            custom: undefined,
-            // 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);
+                setCurrentValue(this.captioningSubject, false);
             },
             'call.closed_captions_started': () => {
-                this.setCurrentValue(this.captioningSubject, true);
+                setCurrentValue(this.captioningSubject, true);
             },
             'call.closed_captions_stopped': () => {
-                this.setCurrentValue(this.captioningSubject, false);
+                setCurrentValue(this.captioningSubject, false);
             },
             'call.created': (e) => this.updateFromCallResponse(e.call),
             'call.deleted': (e) => this.updateFromCallResponse(e.call),
             'call.ended': (e) => {
                 this.updateFromCallResponse(e.call);
-                this.setCurrentValue(this.endedBySubject, e.user);
+                setCurrentValue(this.endedBySubject, e.user);
             },
             'call.frame_recording_failed': (e) => {
                 this.updateFromCallResponse(e.call);
@@ -6454,21 +6283,19 @@ class CallState {
             'call.session_participant_left': this.updateFromSessionParticipantLeft,
             'call.session_started': (e) => this.updateFromCallResponse(e.call),
             'call.transcription_started': () => {
-                this.setCurrentValue(this.transcribingSubject, true);
+                setCurrentValue(this.transcribingSubject, true);
             },
             'call.transcription_stopped': () => {
-                this.setCurrentValue(this.transcribingSubject, false);
+                setCurrentValue(this.transcribingSubject, false);
             },
             'call.transcription_failed': () => {
-                this.setCurrentValue(this.transcribingSubject, false);
+                setCurrentValue(this.transcribingSubject, false);
             },
             'call.unblocked_user': this.unblockUser,
             'call.updated': (e) => this.updateFromCallResponse(e.call),
         };
     }
-    /**
-     * Runs the cleanup tasks.
-     */
+    /** Runs the cleanup tasks. */
     dispose = () => {
         for (const [ccKey, taskId] of this.closedCaptionsTasks.entries()) {
             clearTimeout(taskId);
@@ -6485,39 +6312,18 @@ class CallState {
     setSortParticipantsBy = (comparator) => {
         this.sortParticipantsBy = comparator;
         // trigger re-sorting of participants
-        this.setCurrentValue(this.participantsSubject, (ps) => ps);
+        setCurrentValue(this.participantsSubject, (ps) => ps);
     };
-    /**
-     * Returns the comparator currently used to sort the participants.
-     */
+    /** Returns the comparator currently used to sort the participants. */
     getSortParticipantsBy = () => {
         return this.sortParticipantsBy;
     };
-    /**
-     * Gets the current value of an observable, or undefined if the observable has
-     * not emitted a value yet.
-     *
-     * @param observable$ the observable to get the value from.
-     */
-    getCurrentValue = getCurrentValue;
-    /**
-     * Updates the value of the provided Subject.
-     * An `update` can either be a new value or a function which takes
-     * the current value and returns a new value.
-     *
-     * @internal
-     *
-     * @param subject the subject to update.
-     * @param update the update to apply to the subject.
-     * @return the updated value.
-     */
-    setCurrentValue = setCurrentValue;
     /**
      * The server-side counted number of participants connected to the current call.
      * This number includes the anonymous participants as well.
      */
     get participantCount() {
-        return this.getCurrentValue(this.participantCount$);
+        return getCurrentValue(this.participantCountSubject);
     }
     /**
      * Sets the number of participants in the current call.
@@ -6526,14 +6332,14 @@ class CallState {
      * @param count the number of participants.
      */
     setParticipantCount = (count) => {
-        return this.setCurrentValue(this.participantCountSubject, count);
+        return setCurrentValue(this.participantCountSubject, count);
     };
     /**
      * The time the call session actually started.
      * Useful for displaying the call duration.
      */
     get startedAt() {
-        return this.getCurrentValue(this.startedAt$);
+        return getCurrentValue(this.startedAtSubject);
     }
     /**
      * Sets the time the call session actually started.
@@ -6542,13 +6348,11 @@ class CallState {
      * @param startedAt the time the call session actually started.
      */
     setStartedAt = (startedAt) => {
-        return this.setCurrentValue(this.startedAtSubject, startedAt);
+        return setCurrentValue(this.startedAtSubject, startedAt);
     };
-    /**
-     * Returns whether closed captions are enabled in the current call.
-     */
+    /** Returns whether closed captions are enabled in the current call. */
     get captioning() {
-        return this.getCurrentValue(this.captioning$);
+        return getCurrentValue(this.captioningSubject);
     }
     /**
      * Sets the closed captioning state of the current call.
@@ -6564,7 +6368,7 @@ class CallState {
      * This number includes the anonymous participants as well.
      */
     get anonymousParticipantCount() {
-        return this.getCurrentValue(this.anonymousParticipantCount$);
+        return getCurrentValue(this.anonymousParticipantCountSubject);
     }
     /**
      * Sets the number of anonymous participants in the current call.
@@ -6573,19 +6377,15 @@ class CallState {
      * @param count the number of anonymous participants.
      */
     setAnonymousParticipantCount = (count) => {
-        return this.setCurrentValue(this.anonymousParticipantCountSubject, count);
+        return setCurrentValue(this.anonymousParticipantCountSubject, count);
     };
-    /**
-     * The list of participants in the current call.
-     */
+    /** The list of participants in the current call. */
     get participants() {
-        return this.getCurrentValue(this.participants$);
+        return getCurrentValue(this.participants$);
     }
-    /**
-     * The stable list of participants in the current call, unsorted.
-     */
+    /** The stable list of participants in the current call, unsorted. */
     get rawParticipants() {
-        return this.getCurrentValue(this.rawParticipants$);
+        return getCurrentValue(this.rawParticipants$);
     }
     /**
      * Returns the current participants array directly from the BehaviorSubject.
@@ -6606,43 +6406,31 @@ class CallState {
      * @param participants the list of participants.
      */
     setParticipants = (participants) => {
-        return this.setCurrentValue(this.participantsSubject, participants);
+        return setCurrentValue(this.participantsSubject, participants);
     };
-    /**
-     * The local participant in the current call.
-     */
+    /** The local participant in the current call. */
     get localParticipant() {
-        return this.getCurrentValue(this.localParticipant$);
+        return getCurrentValue(this.localParticipant$);
     }
-    /**
-     * The list of remote participants in the current call.
-     */
+    /** The list of remote participants in the current call. */
     get remoteParticipants() {
-        return this.getCurrentValue(this.remoteParticipants$);
+        return getCurrentValue(this.remoteParticipants$);
     }
-    /**
-     * The dominant speaker in the current call.
-     */
+    /** The dominant speaker in the current call. */
     get dominantSpeaker() {
-        return this.getCurrentValue(this.dominantSpeaker$);
+        return getCurrentValue(this.dominantSpeaker$);
     }
-    /**
-     * The list of pinned participants in the current call.
-     */
+    /** The list of pinned participants in the current call. */
     get pinnedParticipants() {
-        return this.getCurrentValue(this.pinnedParticipants$);
+        return getCurrentValue(this.pinnedParticipants$);
     }
-    /**
-     * Tell if there is an ongoing screen share in this call.
-     */
+    /** Tell if there is an ongoing screen share in this call. */
     get hasOngoingScreenShare() {
-        return this.getCurrentValue(this.hasOngoingScreenShare$);
+        return getCurrentValue(this.hasOngoingScreenShare$);
     }
-    /**
-     * The calling state.
-     */
+    /** The calling state. */
     get callingState() {
-        return this.getCurrentValue(this.callingState$);
+        return getCurrentValue(this.callingStateSubject);
     }
     /**
      * Sets the calling state.
@@ -6651,13 +6439,11 @@ class CallState {
      * @param state the new calling state.
      */
     setCallingState = (state) => {
-        return this.setCurrentValue(this.callingStateSubject, state);
+        return setCurrentValue(this.callingStateSubject, state);
     };
-    /**
-     * The call stats report.
-     */
+    /** The call stats report. */
     get callStatsReport() {
-        return this.getCurrentValue(this.callStatsReport$);
+        return getCurrentValue(this.callStatsReportSubject);
     }
     /**
      * Returns whether the call stats report is being observed or not.
@@ -6673,13 +6459,11 @@ class CallState {
      * @param report the report to set.
      */
     setCallStatsReport = (report) => {
-        return this.setCurrentValue(this.callStatsReportSubject, report);
+        return setCurrentValue(this.callStatsReportSubject, report);
     };
-    /**
-     * The members of the current call.
-     */
+    /** The members of the current call. */
     get members() {
-        return this.getCurrentValue(this.members$);
+        return getCurrentValue(this.membersSubject);
     }
     /**
      * Sets the members of the current call.
@@ -6688,13 +6472,11 @@ class CallState {
      * @param members the members to set.
      */
     setMembers = (members) => {
-        this.setCurrentValue(this.membersSubject, members);
+        setCurrentValue(this.membersSubject, members);
     };
-    /**
-     * The capabilities of the current user for the current call.
-     */
+    /** The capabilities of the current user for the current call. */
     get ownCapabilities() {
-        return this.getCurrentValue(this.ownCapabilities$);
+        return getCurrentValue(this.ownCapabilities$);
     }
     /**
      * Sets the own capabilities.
@@ -6703,7 +6485,7 @@ class CallState {
      * @param capabilities the capabilities to set.
      */
     setOwnCapabilities = (capabilities) => {
-        return this.setCurrentValue(this.ownCapabilitiesSubject, capabilities);
+        return setCurrentValue(this.ownCapabilitiesSubject, capabilities);
     };
     /**
      * Sets the call grants (used for own capabilities).
@@ -6712,141 +6494,105 @@ class CallState {
      * @param grants the grants to set.
      */
     setCallGrants = (grants) => {
-        return this.setCurrentValue(this.callGrantsSubject, grants);
+        return setCurrentValue(this.callGrantsSubject, grants);
     };
-    /**
-     * The backstage state.
-     */
+    /** The backstage state. */
     get backstage() {
-        return this.getCurrentValue(this.backstage$);
+        return getCurrentValue(this.backstageSubject);
     }
     /**
      * Sets the backstage state.
      * @param backstage the backstage state.
      */
     setBackstage = (backstage) => {
-        return this.setCurrentValue(this.backstageSubject, backstage);
+        return setCurrentValue(this.backstageSubject, backstage);
     };
-    /**
-     * Will provide the list of blocked user IDs.
-     */
+    /** Will provide the list of blocked user IDs. */
     get blockedUserIds() {
-        return this.getCurrentValue(this.blockedUserIds$);
+        return getCurrentValue(this.blockedUserIdsSubject);
     }
-    /**
-     * Will provide the time when this call has been created.
-     */
+    /** Will provide the time when this call has been created. */
     get createdAt() {
-        return this.getCurrentValue(this.createdAt$);
+        return getCurrentValue(this.createdAtSubject);
     }
-    /**
-     * Will provide the time when this call has been ended.
-     */
+    /** Will provide the time when this call has been ended. */
     get endedAt() {
-        return this.getCurrentValue(this.endedAt$);
+        return getCurrentValue(this.endedAtSubject);
     }
     /**
      * Sets the time when this call has been ended.
      * @param endedAt the time when this call has been ended.
      */
     setEndedAt = (endedAt) => {
-        return this.setCurrentValue(this.endedAtSubject, endedAt);
+        return setCurrentValue(this.endedAtSubject, endedAt);
     };
-    /**
-     * Will provide the time when this call has been scheduled to start.
-     */
+    /** Will provide the time when this call has been scheduled to start. */
     get startsAt() {
-        return this.getCurrentValue(this.startsAt$);
+        return getCurrentValue(this.startsAtSubject);
     }
-    /**
-     * Will provide the time when this call has been updated.
-     */
+    /** Will provide the time when this call has been updated. */
     get updatedAt() {
-        return this.getCurrentValue(this.updatedAt$);
+        return getCurrentValue(this.updatedAtSubject);
     }
-    /**
-     * Will provide the user who created this call.
-     */
+    /** Will provide the user who created this call. */
     get createdBy() {
-        return this.getCurrentValue(this.createdBy$);
+        return getCurrentValue(this.createdBySubject);
     }
-    /**
-     * Will provide the custom data of this call.
-     */
+    /** Will provide the custom data of this call. */
     get custom() {
-        return this.getCurrentValue(this.custom$);
+        return getCurrentValue(this.customSubject);
     }
     /**
      * Will provide the egress data of this call.
      */
     get egress() {
-        return this.getCurrentValue(this.egress$);
+        return getCurrentValue(this.egressSubject);
     }
-    /**
-     * Will provide the ingress data of this call.
-     */
+    /** Will provide the ingress data of this call. */
     get ingress() {
-        return this.getCurrentValue(this.ingress$);
+        return getCurrentValue(this.ingressSubject);
     }
-    /**
-     * Will provide the composite recording state of this call.
-     */
+    /** Will provide the composite recording state of this call. */
     get recording() {
-        return this.getCurrentValue(this.recording$);
+        return getCurrentValue(this.recordingSubject);
     }
-    /**
-     * Will provide the individual recording state of this call.
-     */
+    /** Will provide the individual recording state of this call. */
     get individualRecording() {
-        return this.getCurrentValue(this.individualRecording$);
+        return getCurrentValue(this.individualRecordingSubject);
     }
-    /**
-     * Will provide the raw recording state of this call.
-     */
+    /** Will provide the raw recording state of this call. */
     get rawRecording() {
-        return this.getCurrentValue(this.rawRecording$);
+        return getCurrentValue(this.rawRecordingSubject);
     }
-    /**
-     * Will provide the session data of this call.
-     */
+    /** Will provide the session data of this call. */
     get session() {
-        return this.getCurrentValue(this.session$);
+        return getCurrentValue(this.sessionSubject);
     }
-    /**
-     * Will provide the settings of this call.
-     */
+    /** Will provide the settings of this call. */
     get settings() {
-        return this.getCurrentValue(this.settings$);
+        return getCurrentValue(this.settingsSubject);
     }
-    /**
-     * Will provide the transcribing state of this call.
-     */
+    /** Will provide the transcribing state of this call. */
     get transcribing() {
-        return this.getCurrentValue(this.transcribing$);
+        return getCurrentValue(this.transcribingSubject);
     }
-    /**
-     * Whether end-to-end encryption is active for this call.
-     */
+    /** Whether end-to-end encryption is active for this call. */
     get e2eeEnabled() {
-        return this.getCurrentValue(this.e2eeEnabled$);
+        return getCurrentValue(this.e2eeEnabledSubject);
     }
-    /**
-     * Will provide the user who ended this call.
-     */
+    /** Will provide the user who ended this call. */
     get endedBy() {
-        return this.getCurrentValue(this.endedBy$);
+        return getCurrentValue(this.endedBySubject);
     }
     /**
      * Will provide the thumbnails of this call, if enabled in the call settings.
      */
     get thumbnails() {
-        return this.getCurrentValue(this.thumbnails$);
+        return getCurrentValue(this.thumbnailsSubject);
     }
-    /**
-     * Returns the current queue of closed captions.
-     */
+    /** Returns the current queue of closed captions. */
     get closedCaptions() {
-        return this.getCurrentValue(this.closedCaptions$);
+        return getCurrentValue(this.closedCaptionsSubject);
     }
     /**
      * Will try to find the participant with the given sessionId in the current call.
@@ -6857,9 +6603,7 @@ class CallState {
     findParticipantBySessionId = (sessionId) => {
         return this.participants.find((p) => p.sessionId === sessionId);
     };
-    /**
-     * Returns a new lookup table of participants indexed by their session ID.
-     */
+    /** Returns a new lookup table of participants indexed by their session ID. */
     getParticipantLookupBySessionId = () => {
         return this.participants.reduce((lookupTable, participant) => {
             lookupTable[participant.sessionId] = participant;
@@ -7094,25 +6838,25 @@ class CallState {
      */
     updateFromCallResponse = (call) => {
         this.setBackstage(call.backstage);
-        this.setCurrentValue(this.blockedUserIdsSubject, call.blocked_user_ids);
-        this.setCurrentValue(this.createdAtSubject, new Date(call.created_at));
-        this.setCurrentValue(this.updatedAtSubject, new Date(call.updated_at));
-        this.setCurrentValue(this.startsAtSubject, call.starts_at ? new Date(call.starts_at) : undefined);
+        setCurrentValue(this.blockedUserIdsSubject, call.blocked_user_ids);
+        setCurrentValue(this.createdAtSubject, new Date(call.created_at));
+        setCurrentValue(this.updatedAtSubject, new Date(call.updated_at));
+        setCurrentValue(this.startsAtSubject, call.starts_at ? new Date(call.starts_at) : undefined);
         this.setEndedAt(call.ended_at ? new Date(call.ended_at) : undefined);
-        this.setCurrentValue(this.createdBySubject, call.created_by);
-        this.setCurrentValue(this.customSubject, call.custom);
-        this.setCurrentValue(this.egressSubject, call.egress);
-        this.setCurrentValue(this.ingressSubject, call.ingress);
+        setCurrentValue(this.createdBySubject, call.created_by);
+        setCurrentValue(this.customSubject, call.custom);
+        setCurrentValue(this.egressSubject, call.egress);
+        setCurrentValue(this.ingressSubject, call.ingress);
         const { individual_recording, composite_recording, raw_recording } = call.egress;
-        this.setCurrentValue(this.recordingSubject, call.recording || composite_recording?.status === 'running');
-        this.setCurrentValue(this.individualRecordingSubject, individual_recording?.status === 'running');
-        this.setCurrentValue(this.rawRecordingSubject, raw_recording?.status === 'running');
-        const s = this.setCurrentValue(this.sessionSubject, call.session);
+        setCurrentValue(this.recordingSubject, call.recording || composite_recording?.status === 'running');
+        setCurrentValue(this.individualRecordingSubject, individual_recording?.status === 'running');
+        setCurrentValue(this.rawRecordingSubject, raw_recording?.status === 'running');
+        const s = setCurrentValue(this.sessionSubject, call.session);
         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);
+        setCurrentValue(this.settingsSubject, call.settings);
+        setCurrentValue(this.transcribingSubject, call.transcribing);
+        setCurrentValue(this.captioningSubject, call.captioning);
+        setCurrentValue(this.thumbnailsSubject, call.thumbnails);
     };
     /**
      * Merges a polled ring state into the current session. Only the ring fields
@@ -7123,7 +6867,7 @@ class CallState {
      * @param ringState the ring state as returned by the coordinator.
      */
     updateFromRingState = (ringState) => {
-        this.setCurrentValue(this.sessionSubject, (session) => {
+        setCurrentValue(this.sessionSubject, (session) => {
             if (!session || session.id !== ringState.session_id)
                 return session;
             return {
@@ -7174,21 +6918,21 @@ class CallState {
         this.setAnonymousParticipantCount(participantCount?.anonymous || 0);
         this.setStartedAt(startedAt ? Timestamp.toDate(startedAt) : new Date());
         this.setServerSidePins(pins);
-        this.setCurrentValue(this.e2eeEnabledSubject, e2EeEnabled);
+        setCurrentValue(this.e2eeEnabledSubject, e2EeEnabled);
     };
     updateFromMemberRemoved = (event) => {
         this.updateFromCallResponse(event.call);
-        this.setCurrentValue(this.membersSubject, (members) => members.filter((m) => event.members.indexOf(m.user_id) === -1));
+        setCurrentValue(this.membersSubject, (members) => members.filter((m) => event.members.indexOf(m.user_id) === -1));
     };
     updateFromMemberAdded = (event) => {
         this.updateFromCallResponse(event.call);
-        this.setCurrentValue(this.membersSubject, (members) => [
+        setCurrentValue(this.membersSubject, (members) => [
             ...members,
             ...event.members,
         ]);
     };
     updateFromHLSBroadcastStopped = () => {
-        this.setCurrentValue(this.egressSubject, (egress = defaultEgress) => ({
+        setCurrentValue(this.egressSubject, (egress = defaultEgress) => ({
             ...egress,
             broadcasting: false,
             hls: {
@@ -7198,7 +6942,7 @@ class CallState {
         }));
     };
     updateFromHLSBroadcastingFailed = () => {
-        this.setCurrentValue(this.egressSubject, (egress = defaultEgress) => ({
+        setCurrentValue(this.egressSubject, (egress = defaultEgress) => ({
             ...egress,
             broadcasting: false,
             hls: {
@@ -7210,13 +6954,13 @@ class CallState {
     updateFromRecordingEvent = (type, running) => {
         // handle the legacy format, where `type` is absent in the emitted events
         if (type === undefined || type === 'composite') {
-            this.setCurrentValue(this.recordingSubject, running);
+            setCurrentValue(this.recordingSubject, running);
         }
         else if (type === 'individual') {
-            this.setCurrentValue(this.individualRecordingSubject, running);
+            setCurrentValue(this.individualRecordingSubject, running);
         }
         else if (type === 'raw') {
-            this.setCurrentValue(this.rawRecordingSubject, running);
+            setCurrentValue(this.rawRecordingSubject, running);
         }
         else {
             ensureExhausted(type, 'Unknown recording type');
@@ -7233,7 +6977,7 @@ class CallState {
         this.setAnonymousParticipantCount(session.anonymous_participant_count || 0);
     };
     updateFromSessionParticipantCountUpdate = (event) => {
-        const s = this.setCurrentValue(this.sessionSubject, (session) => {
+        const s = setCurrentValue(this.sessionSubject, (session) => {
             if (!session)
                 return session;
             return {
@@ -7245,7 +6989,7 @@ class CallState {
         this.updateParticipantCountFromSession(s);
     };
     updateFromSessionParticipantLeft = (event) => {
-        const s = this.setCurrentValue(this.sessionSubject, (session) => {
+        const s = setCurrentValue(this.sessionSubject, (session) => {
             if (!session)
                 return session;
             const { participants, participants_count_by_role } = session;
@@ -7262,7 +7006,7 @@ class CallState {
         this.updateParticipantCountFromSession(s);
     };
     updateFromSessionParticipantJoined = (event) => {
-        const s = this.setCurrentValue(this.sessionSubject, (session) => {
+        const s = setCurrentValue(this.sessionSubject, (session) => {
             if (!session)
                 return session;
             const { participants, participants_count_by_role } = session;
@@ -7299,7 +7043,7 @@ class CallState {
     };
     updateMembers = (event) => {
         this.updateFromCallResponse(event.call);
-        this.setCurrentValue(this.membersSubject, (members) => members.map((member) => {
+        setCurrentValue(this.membersSubject, (members) => members.map((member) => {
             const memberUpdate = event.members.find((m) => m.user_id === member.user_id);
             return memberUpdate ? memberUpdate : member;
         }));
@@ -7324,14 +7068,14 @@ class CallState {
         });
     };
     unblockUser = (event) => {
-        this.setCurrentValue(this.blockedUserIdsSubject, (current) => {
+        setCurrentValue(this.blockedUserIdsSubject, (current) => {
             if (!current)
                 return current;
             return current.filter((id) => id !== event.user.id);
         });
     };
     blockUser = (event) => {
-        this.setCurrentValue(this.blockedUserIdsSubject, (current) => [
+        setCurrentValue(this.blockedUserIdsSubject, (current) => [
             ...(current || []),
             event.user.id,
         ]);
@@ -7342,7 +7086,7 @@ class CallState {
         }
     };
     updateFromClosedCaptions = (event) => {
-        this.setCurrentValue(this.closedCaptionsSubject, (queue) => {
+        setCurrentValue(this.closedCaptionsSubject, (queue) => {
             const { closed_caption } = event;
             const keyOf = (c) => `${c.speaker_id}/${c.start_time}`;
             const currentKey = keyOf(closed_caption);
@@ -7354,7 +7098,7 @@ class CallState {
             // 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));
+                    setCurrentValue(this.closedCaptionsSubject, (captions) => captions.filter((caption) => caption !== closed_caption));
                     this.closedCaptionsTasks.delete(currentKey);
                 }, visibilityDurationMs);
                 this.closedCaptionsTasks.set(currentKey, taskId);
@@ -15576,7 +15320,7 @@ class Call {
     lastStatsOptions;
     ringTimeout;
     ringStatePoller;
-    clientStore;
+    clientState;
     streamClient;
     clientEventReporter;
     sfuClient;
@@ -15643,7 +15387,7 @@ class Call {
      * Use the [`StreamVideoClient.call`](./StreamVideoClient.md/#call)
      * method to construct a `Call` instance.
      */
-    constructor({ type, id, streamClient, clientEventReporter, members, ownCapabilities, sortParticipantsBy, clientStore, ringing = false, watching = false, }) {
+    constructor({ type, id, streamClient, clientEventReporter, members, ownCapabilities, sortParticipantsBy, clientState, ringing = false, watching = false, }) {
         this.type = type;
         this.id = id;
         this.cid = `${type}:${id}`;
@@ -15651,7 +15395,7 @@ class Call {
         this.watching = watching;
         this.streamClient = streamClient;
         this.clientEventReporter = clientEventReporter;
-        this.clientStore = clientStore;
+        this.clientState = clientState;
         this.streamClientBasePath = `/call/${this.type}/${this.id}`;
         this.logger = videoLoggerSystem.getLogger('Call');
         const callTypeConfig = CallTypes.get(type);
@@ -15770,7 +15514,7 @@ class Call {
     };
     handleRingingCall = () => {
         const callSession = this.state.session;
-        const receiver_id = this.clientStore.connectedUser?.id;
+        const receiver_id = this.clientState.connectedUser?.id;
         const ended_at = callSession?.ended_at;
         const created_by_id = this.state.createdBy?.id;
         if (this.currentUserId && created_by_id === this.currentUserId) {
@@ -15999,7 +15743,7 @@ class Call {
             this.ringingSubject.next(false);
             this.cancelAutoDrop();
             this.cancelRingStatePolling();
-            this.clientStore.unregisterCall(this);
+            this.clientState.unregisterCall(this);
             globalThis.streamRNVideoSDK?.callManager.stop({
                 isRingingTypeCall: this.ringing,
                 shouldStopCallManager: this.callManagerStarted,
@@ -16058,7 +15802,7 @@ class Call {
      * Retrieves the current user ID.
      */
     get currentUserId() {
-        return this.clientStore.connectedUser?.id;
+        return this.clientState.connectedUser?.id;
     }
     /**
      * A flag indicating whether self-subscription is enabled for the call.
@@ -16119,8 +15863,8 @@ class Call {
         this.ringingSubject.next(true);
         // we remove the instance from the calls list to enable the following filter in useCalls hook
         // const calls = useCalls().filter((c) => c.ringing);
-        const calls = this.clientStore.calls.filter((c) => c.cid !== this.cid);
-        this.clientStore.setCalls([this, ...calls]);
+        const calls = this.clientState.calls.filter((c) => c.cid !== this.cid);
+        this.clientState.setCalls([this, ...calls]);
         await this.applyDeviceConfig(settings, { publish: false });
     };
     /**
@@ -16154,7 +15898,7 @@ class Call {
         }
         if (this.streamClient._hasConnectionID()) {
             this.watching = true;
-            this.clientStore.registerOrUpdateCall(this);
+            this.clientState.registerOrUpdateCall(this);
         }
         await this.applyDeviceConfig(response.call.settings, { publish: false });
         return response;
@@ -16173,7 +15917,7 @@ class Call {
         }
         if (this.streamClient._hasConnectionID()) {
             this.watching = true;
-            this.clientStore.registerOrUpdateCall(this);
+            this.clientState.registerOrUpdateCall(this);
         }
         await this.applyDeviceConfig(response.call.settings, { publish: false });
         return response;
@@ -16294,7 +16038,7 @@ class Call {
             }
             if (callingX) {
                 // for Android/iOS, we need to start the call in the callingx library as soon as possible
-                await callingX.joinCall(this, this.clientStore.calls, supersededByLeave);
+                await callingX.joinCall(this, this.clientState.calls, supersededByLeave);
                 if (supersededByLeave()) {
                     this.logger.debug('Join superseded by leave; not setting up');
                     return;
@@ -16824,7 +16568,7 @@ class Call {
         }
         if (this.streamClient._hasConnectionID()) {
             this.watching = true;
-            this.clientStore.registerOrUpdateCall(this);
+            this.clientState.registerOrUpdateCall(this);
         }
         return joinResponse;
     };
@@ -17512,7 +17256,7 @@ class Call {
         });
     };
     /**
-     * Will enhance the reported stats with additional participant-specific information (`callStatsReport$` state [store variable](./StreamVideoClient.md/#readonlystatestore)).
+     * Will enhance the reported stats with additional participant-specific information (the `callStatsReport$` state variable).
      * This is usually helpful when detailed stats for a specific participant are needed.
      *
      * @param sessionId the sessionId to start reporting for.
@@ -19633,11 +19377,11 @@ class StreamClient {
         return await this.wsConnection.connect(this.defaultWSTimeout);
     };
     getSdkVersion = () => this.options.clientAppIdentifier?.sdkVersion ||
-        "1.61.0";
+        "2.0.0-beta.1";
     getUserAgent = () => {
         if (!this.cachedUserAgent) {
             const { clientAppIdentifier = {} } = this.options;
-            const { sdkName = 'js', sdkVersion = "1.61.0", ...extras } = clientAppIdentifier;
+            const { sdkName = 'js', sdkVersion = "2.0.0-beta.1", ...extras } = clientAppIdentifier;
             this.cachedUserAgent = [
                 `stream-video-${sdkName}-v${sdkVersion}`,
                 ...Object.entries(extras).map(([key, value]) => `${key}=${value}`),
@@ -20393,16 +20137,11 @@ const mapWsJoinError = (err) => {
  */
 class StreamVideoClient {
     /**
-     * A reactive store that exposes all the state variables reactively.
+     * The reactive state of this client.
      * You can subscribe to changes of the different state variables.
-     * Our library is built in a way that all state changes are exposed in this store,
-     * o all UI changes in your application should be handled by subscribing to these variables.
-     *
-     * @deprecated use the `client.state` getter.
      */
-    readOnlyStateStore;
+    state = new ClientState();
     logger;
-    writeableStateStore;
     streamClient;
     clientEventReporter;
     effectsRegistered = false;
@@ -20427,8 +20166,6 @@ class StreamVideoClient {
             streamClient: this.streamClient,
             enabled: clientOptions?.clientEventsReportingEnabled ?? true,
         });
-        this.writeableStateStore = new StreamVideoWriteableStateStore();
-        this.readOnlyStateStore = new StreamVideoReadOnlyStateStore(this.writeableStateStore);
         if (typeof apiKeyOrArgs !== 'string' && apiKeyOrArgs.user) {
             const user = apiKeyOrArgs.user;
             if (user.type === 'anonymous')
@@ -20465,19 +20202,13 @@ class StreamVideoClient {
         }
         StreamVideoClient._instances.set(instanceKey, this);
     };
-    /**
-     * Return the reactive state store, use this if you want to be notified about changes to the client state
-     */
-    get state() {
-        return this.readOnlyStateStore;
-    }
     registerEffects = () => {
         if (this.effectsRegistered)
             return;
         this.eventHandlersToUnregister.push(this.on('call.created', (event) => this.initCallFromEvent(event)), this.on('call.ring', (event) => this.initCallFromEvent(event)), this.on('connection.changed', (event) => {
             if (!event.online)
                 return;
-            const callsToReWatch = this.writeableStateStore.calls
+            const callsToReWatch = this.state.calls
                 .filter((call) => call.watching)
                 .map((call) => call.cid);
             if (callsToReWatch.length <= 0)
@@ -20497,7 +20228,7 @@ class StreamVideoClient {
             const concurrencyTag = getCallInitConcurrencyTag(e.call_cid);
             await withoutConcurrency(concurrencyTag, async () => {
                 const ringing = e.type === 'call.ring';
-                let call = this.writeableStateStore.findCall(e.call.type, e.call.id);
+                let call = this.state.findCall(e.call.type, e.call.id);
                 if (call) {
                     if (ringing) {
                         if (this.shouldRejectCall(call.cid)) {
@@ -20523,7 +20254,7 @@ class StreamVideoClient {
                     type: e.call.type,
                     id: e.call.id,
                     members: e.members,
-                    clientStore: this.writeableStateStore,
+                    clientState: this.state,
                     ringing,
                 });
                 if (ringing) {
@@ -20539,7 +20270,7 @@ class StreamVideoClient {
                 }
                 else {
                     call.state.updateFromCallResponse(e.call);
-                    this.writeableStateStore.registerCall(call);
+                    this.state.registerCall(call);
                     this.logger.info(`New call created and registered: ${call.cid}`);
                 }
             });
@@ -20570,7 +20301,7 @@ class StreamVideoClient {
                     filter_conditions: { cid: { $in: callsToReWatch } },
                 });
                 for (const c of response.calls) {
-                    const call = this.writeableStateStore.findCall(c.call.type, c.call.id);
+                    const call = this.state.findCall(c.call.type, c.call.id);
                     if (call) {
                         call.updateFromCallStateResponse(c);
                     }
@@ -20591,8 +20322,6 @@ class StreamVideoClient {
     };
     /**
      * Connects the given user to the client.
-     * Only one user can connect at a time, if you want to change users, call `disconnectUser` before connecting a new user.
-     * If the connection is successful, the connected user [state variable](#readonlystatestore) will be updated accordingly.
      *
      * @param user the user to connect.
      * @param tokenOrProvider a token or a function that returns a token.
@@ -20636,24 +20365,40 @@ class StreamVideoClient {
         });
         // connectUserResponse will be void if connectUser called twice for the same user
         if (connectUserResponse?.me) {
-            this.writeableStateStore.setConnectedUser(connectUserResponse.me);
+            this.state.setConnectedUser(connectUserResponse.me);
         }
         this.registerEffects();
         return connectUserResponse;
     };
+    /**
+     * Leaves every call this client still tracks. Runs while the coordinator
+     * connection is alive, so that the leave requests each call sends reach the
+     * backend.
+     */
+    leaveAllCalls = async () => {
+        for (const call of this.state.calls) {
+            if (call.state.callingState === CallingState.LEFT)
+                continue;
+            this.logger.info(`User disconnected, leaving call: ${call.cid}`);
+            await call
+                .leave({ message: 'client.disconnectUser() called' })
+                .catch((err) => {
+                this.logger.error(`Error leaving call: ${call.cid}`, err);
+            });
+        }
+    };
     /**
      * Disconnects the currently connected user from the client.
-     *
-     * If the connection is successfully disconnected, the connected user [state variable](#readonlystatestore) will be updated accordingly
+     * Leaves every call the user is still in, and updates `client.state`accordingly.
      *
      * @param timeout Max number of ms, to wait for close event of websocket, before forcefully assuming successful disconnection.
-     *                https://developer.mozilla.org/en-US/docs/Web/API/CloseEvent
      */
     disconnectUser = async (timeout) => {
         await withoutConcurrency(this.connectionConcurrencyTag, async () => {
             const { user, key } = this.streamClient;
             if (!user)
                 return;
+            await this.leaveAllCalls();
             await this.streamClient.disconnectUser(timeout);
             if (user.id) {
                 StreamVideoClient._instances.delete(getInstanceKey(key, user));
@@ -20661,13 +20406,15 @@ class StreamVideoClient {
             this.eventHandlersToUnregister.forEach((unregister) => unregister());
             this.eventHandlersToUnregister = [];
             this.effectsRegistered = false;
-            this.writeableStateStore.setConnectedUser(undefined);
+            this.state.setConnectedUser(undefined);
         });
     };
     /**
      * You can subscribe to WebSocket events provided by the API.
      * To remove a subscription, call the `off` method or, execute the returned unsubscribe function.
-     * Please note that subscribing to WebSocket events is an advanced use-case, for most use-cases it should be enough to watch for changes in the reactive [state store](#readonlystatestore).
+     * Please note that subscribing to WebSocket events is an advanced use-case,
+     * for most use-cases it should be enough to watch for changes in the reactive
+     * `client.state`.
      *
      * @param eventName the event name or 'all'.
      * @param callback the callback which will be called when the event is emitted.
@@ -20694,7 +20441,7 @@ class StreamVideoClient {
      */
     call = (type, id, options = {}) => {
         const call = options.reuseInstance
-            ? this.writeableStateStore.findCall(type, id)
+            ? this.state.findCall(type, id)
             : undefined;
         return (call ??
             new Call({
@@ -20702,7 +20449,7 @@ class StreamVideoClient {
                 clientEventReporter: this.clientEventReporter,
                 id: id,
                 type: type,
-                clientStore: this.writeableStateStore,
+                clientState: this.state,
             }));
     };
     /**
@@ -20732,7 +20479,7 @@ class StreamVideoClient {
                 members: c.members,
                 ownCapabilities: c.own_capabilities,
                 watching: data.watch,
-                clientStore: this.writeableStateStore,
+                clientState: this.state,
             });
             call.state.updateFromCallResponse(c.call);
             await call.applyDeviceConfig(c.call.settings, {
@@ -20741,7 +20488,7 @@ class StreamVideoClient {
             });
             if (data.watch) {
                 await call.setup();
-                this.writeableStateStore.registerCall(call);
+                this.state.registerCall(call);
             }
             calls.push(call);
         }
@@ -20840,7 +20587,7 @@ class StreamVideoClient {
                     clientEventReporter: this.clientEventReporter,
                     type: callType,
                     id: callId,
-                    clientStore: this.writeableStateStore,
+                    clientState: this.state,
                     ringing: true,
                 });
                 await call.get();
@@ -21404,5 +21151,5 @@ class EncryptionManager extends TypedEventEmitter {
     };
 }
 
-export { AudioSettingsRequestDefaultDeviceEnum, AudioSettingsResponseDefaultDeviceEnum, browsers as Browsers, Call, CallRecordingFailedEventRecordingTypeEnum, CallRecordingReadyEventRecordingTypeEnum, CallRecordingStartedEventRecordingTypeEnum, CallRecordingStoppedEventRecordingTypeEnum, CallState, CallType, CallTypes, CallingState, CameraManager, CameraManagerState, CreateDeviceRequestPushProviderEnum, DEFAULT_LOOPBACK_RECORDING_DURATION_MS, DebounceType, DeviceManager, DeviceManagerState, DynascaleManager, EncryptionManager, EncryptionSettingsRequestModeEnum, EncryptionSettingsResponseModeEnum, ErrorFromResponse, FrameRecordingSettingsRequestModeEnum, FrameRecordingSettingsRequestQualityEnum, FrameRecordingSettingsResponseModeEnum, HLSSettingsRequestQualityTracksEnum, IndividualRecordingSettingsRequestModeEnum, IndividualRecordingSettingsRequestOutputTypesEnum, IndividualRecordingSettingsResponseModeEnum, IngressAudioEncodingOptionsRequestChannelsEnum, IngressSourceRequestFpsEnum, IngressVideoLayerRequestCodecEnum, LOOPBACK_STREAMS_WAIT_TIMEOUT_MS, LayoutSettingsRequestNameEnum, LoopbackStreamsTimeoutError, MAX_LOOPBACK_RECORDING_DURATION_MS, MIN_LOOPBACK_RECORDING_DURATION_MS, MediaStreamRecorder, MicrophoneManager, MicrophoneManagerState, NoiseCancellationSettingsModeEnum, OwnCapability, RTMPBroadcastRequestQualityEnum, RTMPSettingsRequestQualityEnum, RawRecordingSettingsRequestModeEnum, RawRecordingSettingsResponseModeEnum, RecordSettingsRequestModeEnum, RecordSettingsRequestQualityEnum, RequestPermissionRequestPermissionsEnum, rxUtils as RxUtils, ScreenShareManager, ScreenShareState, events as SfuEvents, SfuJoinError, models as SfuModels, SfuTimeoutError, SpeakerManager, SpeakerState, StartClosedCaptionsRequestLanguageEnum, StartTranscriptionRequestLanguageEnum, StreamSfuClient, StreamVideoClient, StreamVideoReadOnlyStateStore, StreamVideoWriteableStateStore, TranscriptionSettingsRequestClosedCaptionModeEnum, TranscriptionSettingsRequestLanguageEnum, TranscriptionSettingsRequestModeEnum, TranscriptionSettingsResponseClosedCaptionModeEnum, TranscriptionSettingsResponseLanguageEnum, TranscriptionSettingsResponseModeEnum, TranslationSettingsLanguagesEnum, TypedEventEmitter, UpdateUserPermissionsRequestGrantPermissionsEnum, UpdateUserPermissionsRequestRevokePermissionsEnum, VideoSettingsRequestCameraFacingEnum, VideoSettingsResponseCameraFacingEnum, ViewportTracker, VisibilityState, WSAuthMessageProductsEnum, checkIfAudioOutputChangeSupported, clampLoopbackRecordingDuration, combineComparators, conditional, createSoundDetector, defaultSortPreset, descending, deviceIds$, disposeOfMediaStream, dominantSpeaker, enableLoopbackAudio, getAudioBrowserPermission, getAudioDevices, getAudioOutputDevices, getAudioStream, getCallMediaEngineProvider, getClientDetails, getDeviceState, getLoopbackStreams, getLoopbackTracks, getScreenShareStream, getSdkInfo, getVideoBrowserPermission, getVideoDevices, getVideoStream, getWebRTCInfo, hasAudio$1 as hasAudio, hasInterruptedTrack, hasPausedTrack, hasScreenShare, hasScreenShareAudio, hasVideo, humanize, isPinned, livestreamOrAudioRoomSortPreset, logToConsole, name, noopComparator, paginatedLayoutSortPreset, pinned, publishing, publishingAudio, publishingVideo, reactionType, resolveDeviceId, role, screenSharing, setCallMediaEngineProvider, setDeviceInfo, setOSInfo, setPowerState, setSdkInfo, setThermalState, setWebRTCInfo, speakerLayoutSortPreset, speaking, videoLoggerSystem, waitForLoopbackStreams, withLoopbackAudioEnabled, withParticipantSource };
+export { AudioSettingsRequestDefaultDeviceEnum, AudioSettingsResponseDefaultDeviceEnum, browsers as Browsers, Call, CallRecordingFailedEventRecordingTypeEnum, CallRecordingReadyEventRecordingTypeEnum, CallRecordingStartedEventRecordingTypeEnum, CallRecordingStoppedEventRecordingTypeEnum, CallState, CallType, CallTypes, CallingState, CameraManager, CameraManagerState, ClientState, CreateDeviceRequestPushProviderEnum, DEFAULT_LOOPBACK_RECORDING_DURATION_MS, DebounceType, DeviceManager, DeviceManagerState, DynascaleManager, EncryptionManager, EncryptionSettingsRequestModeEnum, EncryptionSettingsResponseModeEnum, ErrorFromResponse, FrameRecordingSettingsRequestModeEnum, FrameRecordingSettingsRequestQualityEnum, FrameRecordingSettingsResponseModeEnum, HLSSettingsRequestQualityTracksEnum, IndividualRecordingSettingsRequestModeEnum, IndividualRecordingSettingsRequestOutputTypesEnum, IndividualRecordingSettingsResponseModeEnum, IngressAudioEncodingOptionsRequestChannelsEnum, IngressSourceRequestFpsEnum, IngressVideoLayerRequestCodecEnum, LOOPBACK_STREAMS_WAIT_TIMEOUT_MS, LayoutSettingsRequestNameEnum, LoopbackStreamsTimeoutError, MAX_LOOPBACK_RECORDING_DURATION_MS, MIN_LOOPBACK_RECORDING_DURATION_MS, MediaStreamRecorder, MicrophoneManager, MicrophoneManagerState, NoiseCancellationSettingsModeEnum, OwnCapability, RTMPBroadcastRequestQualityEnum, RTMPSettingsRequestQualityEnum, RawRecordingSettingsRequestModeEnum, RawRecordingSettingsResponseModeEnum, RecordSettingsRequestModeEnum, RecordSettingsRequestQualityEnum, RequestPermissionRequestPermissionsEnum, rxUtils as RxUtils, ScreenShareManager, ScreenShareState, events as SfuEvents, SfuJoinError, models as SfuModels, SfuTimeoutError, SpeakerManager, SpeakerState, StartClosedCaptionsRequestLanguageEnum, StartTranscriptionRequestLanguageEnum, StreamSfuClient, StreamVideoClient, TranscriptionSettingsRequestClosedCaptionModeEnum, TranscriptionSettingsRequestLanguageEnum, TranscriptionSettingsRequestModeEnum, TranscriptionSettingsResponseClosedCaptionModeEnum, TranscriptionSettingsResponseLanguageEnum, TranscriptionSettingsResponseModeEnum, TranslationSettingsLanguagesEnum, TypedEventEmitter, UpdateUserPermissionsRequestGrantPermissionsEnum, UpdateUserPermissionsRequestRevokePermissionsEnum, VideoSettingsRequestCameraFacingEnum, VideoSettingsResponseCameraFacingEnum, ViewportTracker, VisibilityState, WSAuthMessageProductsEnum, checkIfAudioOutputChangeSupported, clampLoopbackRecordingDuration, combineComparators, conditional, createSoundDetector, defaultSortPreset, descending, deviceIds$, disposeOfMediaStream, dominantSpeaker, enableLoopbackAudio, getAudioBrowserPermission, getAudioDevices, getAudioOutputDevices, getAudioStream, getCallMediaEngineProvider, getClientDetails, getDeviceState, getLoopbackStreams, getLoopbackTracks, getScreenShareStream, getSdkInfo, getVideoBrowserPermission, getVideoDevices, getVideoStream, getWebRTCInfo, hasAudio$1 as hasAudio, hasInterruptedTrack, hasPausedTrack, hasScreenShare, hasScreenShareAudio, hasVideo, humanize, isPinned, livestreamOrAudioRoomSortPreset, logToConsole, name, noopComparator, paginatedLayoutSortPreset, pinned, publishing, publishingAudio, publishingVideo, reactionType, resolveDeviceId, role, screenSharing, setCallMediaEngineProvider, setDeviceInfo, setOSInfo, setPowerState, setSdkInfo, setThermalState, setWebRTCInfo, speakerLayoutSortPreset, speaking, videoLoggerSystem, waitForLoopbackStreams, withLoopbackAudioEnabled, withParticipantSource };
 //# sourceMappingURL=index.browser.es.js.map