livekit-client 0.18.5 → 1.0.1

package/dist/livekit-client.esm.mjs

@@ -9260,10 +9260,15 @@ var RoomEvent;
   /**
    * Whenever the connection state of the room changes
    *
-   * args: ([[RoomState]])
+   * args: ([[ConnectionState]])
    */
 
-  RoomEvent["StateChanged"] = "stateChanged";
+  RoomEvent["ConnectionStateChanged"] = "connectionStateChanged";
+  /**
+   * @deprecated StateChanged has been renamed to ConnectionStateChanged
+   */
+
+  RoomEvent["StateChanged"] = "connectionStateChanged";
   /**
    * When input or output devices on the machine have changed.
    */
@@ -9370,12 +9375,6 @@ var RoomEvent;
    */
 
   RoomEvent["ActiveSpeakersChanged"] = "activeSpeakersChanged";
-  /**
-   * @deprecated Use ParticipantMetadataChanged instead
-   * @internal
-   */
-
-  RoomEvent["MetadataChanged"] = "metadataChanged";
   /**
    * Participant metadata is a simple way for app-specific state to be pushed to
    * all users.
@@ -9541,12 +9540,6 @@ var ParticipantEvent;
    */
 
   ParticipantEvent["LocalTrackUnpublished"] = "localTrackUnpublished";
-  /**
-   * @deprecated Use ParticipantMetadataChanged instead
-   * @internal
-   */
-
-  ParticipantEvent["MetadataChanged"] = "metadataChanged";
   /**
    * Participant metadata is a simple way for app-specific state to be pushed to
    * all users.
@@ -9737,8 +9730,11 @@ class DeviceManager {
           video: kind !== 'audioinput' && kind !== 'audiooutput',
           audio: kind !== 'videoinput'
         };
-        await navigator.mediaDevices.getUserMedia(permissionsToAcquire);
+        const stream = await navigator.mediaDevices.getUserMedia(permissionsToAcquire);
         devices = await navigator.mediaDevices.enumerateDevices();
+        stream.getTracks().forEach(track => {
+          track.stop();
+        });
       }
     }
 
@@ -9783,7 +9779,7 @@ class DeviceManager {
 }
 DeviceManager.mediaDeviceKinds = ['audioinput', 'audiooutput', 'videoinput'];
 
-const version = '0.18.5';
+const version = '1.0.1';
 const protocolVersion = 7;
 
 const separator = '|';
@@ -10336,6 +10332,7 @@ function eventTargetAgnosticAddListener(emitter, name, listener, flags) {
   }
 }
 
+const BACKGROUND_REACTION_DELAY = 5000; // keep old audio elements when detached, we would re-use them since on iOS
 // Safari tracks which audio elements have been "blessed" by the user.
 
 const recycledElements = [];
@@ -10347,7 +10344,17 @@ class Track extends events.exports.EventEmitter {
     this._currentBitrate = 0;
 
     this.appVisibilityChangedListener = () => {
-      this.handleAppVisibilityChanged();
+      if (this.backgroundTimeout) {
+        clearTimeout(this.backgroundTimeout);
+      } // delay app visibility update if it goes to hidden
+      // update immediately if it comes back to focus
+
+
+      if (document.visibilityState === 'hidden') {
+        this.backgroundTimeout = setTimeout(() => this.handleAppVisibilityChanged(), BACKGROUND_REACTION_DELAY);
+      } else {
+        this.handleAppVisibilityChanged();
+      }
     };
 
     this.kind = kind;
@@ -11256,7 +11263,7 @@ class LocalVideoTrack extends LocalTrack {
           bytesSent: v.bytesSent,
           framesSent: v.framesSent,
           timestamp: v.timestamp,
-          rid: (_a = v.rid) !== null && _a !== void 0 ? _a : '',
+          rid: (_a = v.rid) !== null && _a !== void 0 ? _a : v.id,
           retransmittedPacketsSent: v.retransmittedPacketsSent,
           qualityLimitationReason: v.qualityLimitationReason,
           qualityLimitationResolutionChanges: v.qualityLimitationResolutionChanges
@@ -11641,6 +11648,7 @@ class RemoteVideoTrack extends RemoteTrack {
   constructor(mediaTrack, sid, receiver, adaptiveStreamSettings) {
     super(mediaTrack, sid, Track.Kind.Video, receiver);
     this.elementInfos = [];
+    this.hasUsedAttach = false;
 
     this.monitorReceiver = async () => {
       if (!this.receiver) {
@@ -11660,21 +11668,6 @@ class RemoteVideoTrack extends RemoteTrack {
       }, monitorFrequency);
     };
 
-    this.handleVisibilityChanged = entry => {
-      const {
-        target,
-        isIntersecting
-      } = entry;
-      const elementInfo = this.elementInfos.find(info => info.element === target);
-
-      if (elementInfo) {
-        elementInfo.visible = isIntersecting;
-        elementInfo.visibilityChangedAt = Date.now();
-      }
-
-      this.updateVisibility();
-    };
-
     this.debouncedHandleResize = r(() => {
       this.updateDimensions();
     }, REACTION_DELAY);
@@ -11690,8 +11683,8 @@ class RemoteVideoTrack extends RemoteTrack {
   }
 
   get mediaStreamTrack() {
-    if (this.isAdaptiveStream && this.attachedElements.length === 0) {
-      throw Error('When using adaptiveStream, you need to use remoteVideoTrack.attach() to add the track to a HTMLVideoElement, direct usage of mediaStreamTrack is unsupported in this case');
+    if (this.isAdaptiveStream && !this.hasUsedAttach) {
+      livekitLogger.warn('When using adaptiveStream, you need to use remoteVideoTrack.attach() to add the track to a HTMLVideoElement, otherwise your video tracks might never start');
     }
 
     return this._mediaStreamTrack;
@@ -11721,22 +11714,55 @@ class RemoteVideoTrack extends RemoteTrack {
 
 
     if (this.adaptiveStreamSettings && this.elementInfos.find(info => info.element === element) === undefined) {
-      this.elementInfos.push({
-        element,
-        visible: true // default visible
+      const elementInfo = new HTMLElementInfo(element);
+      this.observeElementInfo(elementInfo);
+    }
 
-      });
-      element.handleResize = this.debouncedHandleResize;
-      element.handleVisibilityChanged = this.handleVisibilityChanged;
-      getIntersectionObserver().observe(element);
-      getResizeObserver().observe(element); // trigger the first resize update cycle
+    this.hasUsedAttach = true;
+    return element;
+  }
+  /**
+   * Observe an ElementInfo for changes when adaptive streaming.
+   * @param elementInfo
+   * @internal
+   */
+
+
+  observeElementInfo(elementInfo) {
+    if (this.adaptiveStreamSettings && this.elementInfos.find(info => info === elementInfo) === undefined) {
+      elementInfo.handleResize = () => {
+        this.debouncedHandleResize();
+      };
+
+      elementInfo.handleVisibilityChanged = () => {
+        this.updateVisibility();
+      };
+
+      this.elementInfos.push(elementInfo);
+      elementInfo.observe(); // trigger the first resize update cycle
       // if the tab is backgrounded, the initial resize event does not fire until
       // the tab comes into focus for the first time.
 
       this.debouncedHandleResize();
+      this.updateVisibility();
     }
+  }
+  /**
+   * Stop observing an ElementInfo for changes.
+   * @param elementInfo
+   * @internal
+   */
 
-    return element;
+
+  stopObservingElementInfo(elementInfo) {
+    const stopElementInfos = this.elementInfos.filter(info => info === elementInfo);
+
+    for (const info of stopElementInfos) {
+      info.stopObserving();
+    }
+
+    this.elementInfos = this.elementInfos.filter(info => info !== elementInfo);
+    this.updateVisibility();
   }
 
   detach(element) {
@@ -11787,24 +11813,28 @@ class RemoteVideoTrack extends RemoteTrack {
   }
 
   stopObservingElement(element) {
-    var _a, _b;
+    const stopElementInfos = this.elementInfos.filter(info => info.element === element);
+
+    for (const info of stopElementInfos) {
+      info.stopObserving();
+    }
 
-    (_a = getIntersectionObserver()) === null || _a === void 0 ? void 0 : _a.unobserve(element);
-    (_b = getResizeObserver()) === null || _b === void 0 ? void 0 : _b.unobserve(element);
     this.elementInfos = this.elementInfos.filter(info => info.element !== element);
   }
 
   async handleAppVisibilityChanged() {
     await super.handleAppVisibilityChanged();
-    if (!this.isAdaptiveStream) return; // on desktop don't pause when tab is backgrounded
-
-    if (!isMobile()) return;
+    if (!this.isAdaptiveStream) return;
     this.updateVisibility();
   }
 
   updateVisibility() {
+    var _a, _b;
+
     const lastVisibilityChange = this.elementInfos.reduce((prev, info) => Math.max(prev, info.visibilityChangedAt || 0), 0);
-    const isVisible = this.elementInfos.some(info => info.visible) && !this.isInBackground;
+    const backgroundPause = ((_b = (_a = this.adaptiveStreamSettings) === null || _a === void 0 ? void 0 : _a.pauseVideoInBackground) !== null && _b !== void 0 ? _b : true // default to true
+    ) ? this.isInBackground : false;
+    const isVisible = this.elementInfos.some(info => info.visible) && !backgroundPause;
 
     if (this.lastVisible === isVisible) {
       return;
@@ -11831,8 +11861,8 @@ class RemoteVideoTrack extends RemoteTrack {
     for (const info of this.elementInfos) {
       const pixelDensity = (_b = (_a = this.adaptiveStreamSettings) === null || _a === void 0 ? void 0 : _a.pixelDensity) !== null && _b !== void 0 ? _b : 1;
       const pixelDensityValue = pixelDensity === 'screen' ? window.devicePixelRatio : pixelDensity;
-      const currentElementWidth = info.element.clientWidth * pixelDensityValue;
-      const currentElementHeight = info.element.clientHeight * pixelDensityValue;
+      const currentElementWidth = info.width() * pixelDensityValue;
+      const currentElementHeight = info.height() * pixelDensityValue;
 
       if (currentElementWidth + currentElementHeight > maxWidth + maxHeight) {
         maxWidth = currentElementWidth;
@@ -11853,6 +11883,59 @@ class RemoteVideoTrack extends RemoteTrack {
 
 }
 
+class HTMLElementInfo {
+  constructor(element) {
+    let visible = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+    this.onVisibilityChanged = entry => {
+      var _a;
+
+      const {
+        target,
+        isIntersecting
+      } = entry;
+
+      if (target === this.element) {
+        this.visible = isIntersecting;
+        this.visibilityChangedAt = Date.now();
+        (_a = this.handleVisibilityChanged) === null || _a === void 0 ? void 0 : _a.call(this);
+      }
+    };
+
+    this.element = element;
+    this.visible = visible;
+    this.visibilityChangedAt = 0;
+  }
+
+  width() {
+    return this.element.clientWidth;
+  }
+
+  height() {
+    return this.element.clientWidth;
+  }
+
+  observe() {
+    this.element.handleResize = () => {
+      var _a;
+
+      (_a = this.handleResize) === null || _a === void 0 ? void 0 : _a.call(this);
+    };
+
+    this.element.handleVisibilityChanged = this.onVisibilityChanged;
+    getIntersectionObserver().observe(this.element);
+    getResizeObserver().observe(this.element);
+  }
+
+  stopObserving() {
+    var _a, _b;
+
+    (_a = getIntersectionObserver()) === null || _a === void 0 ? void 0 : _a.unobserve(this.element);
+    (_b = getResizeObserver()) === null || _b === void 0 ? void 0 : _b.unobserve(this.element);
+  }
+
+}
+
 class TrackPublication extends events.exports.EventEmitter {
   constructor(kind, id, name) {
     super();
@@ -12087,25 +12170,10 @@ const VideoPresets = {
   h216: new VideoPreset(384, 216, 180000, 15),
   h360: new VideoPreset(640, 360, 300000, 20),
   h540: new VideoPreset(960, 540, 600000, 25),
-  h720: new VideoPreset(1280, 720, 2000000, 30),
+  h720: new VideoPreset(1280, 720, 1700000, 30),
   h1080: new VideoPreset(1920, 1080, 3000000, 30),
   h1440: new VideoPreset(2560, 1440, 5000000, 30),
-  h2160: new VideoPreset(3840, 2160, 8000000, 30),
-
-  /** @deprecated */
-  qvga: new VideoPreset(320, 180, 120000, 10),
-
-  /** @deprecated */
-  vga: new VideoPreset(640, 360, 300000, 20),
-
-  /** @deprecated */
-  qhd: new VideoPreset(960, 540, 600000, 25),
-
-  /** @deprecated */
-  hd: new VideoPreset(1280, 720, 2000000, 30),
-
-  /** @deprecated */
-  fhd: new VideoPreset(1920, 1080, 3000000, 30)
+  h2160: new VideoPreset(3840, 2160, 8000000, 30)
 };
 /**
  * Four by three presets
@@ -12120,44 +12188,14 @@ const VideoPresets43 = {
   h540: new VideoPreset(720, 540, 450000, 25),
   h720: new VideoPreset(960, 720, 1500000, 30),
   h1080: new VideoPreset(1440, 1080, 2500000, 30),
-  h1440: new VideoPreset(1920, 1440, 3500000, 30),
-
-  /** @deprecated */
-  qvga: new VideoPreset(240, 180, 90000, 10),
-
-  /** @deprecated */
-  vga: new VideoPreset(480, 360, 225000, 20),
-
-  /** @deprecated */
-  qhd: new VideoPreset(720, 540, 450000, 25),
-
-  /** @deprecated */
-  hd: new VideoPreset(960, 720, 1500000, 30),
-
-  /** @deprecated */
-  fhd: new VideoPreset(1440, 1080, 2800000, 30)
+  h1440: new VideoPreset(1920, 1440, 3500000, 30)
 };
 const ScreenSharePresets = {
   h360fps3: new VideoPreset(640, 360, 200000, 3),
   h720fps5: new VideoPreset(1280, 720, 400000, 5),
   h720fps15: new VideoPreset(1280, 720, 1000000, 15),
   h1080fps15: new VideoPreset(1920, 1080, 1500000, 15),
-  h1080fps30: new VideoPreset(1920, 1080, 3000000, 30),
-
-  /** @deprecated */
-  vga: new VideoPreset(640, 360, 200000, 3),
-
-  /** @deprecated */
-  hd_8: new VideoPreset(1280, 720, 400000, 5),
-
-  /** @deprecated */
-  hd_15: new VideoPreset(1280, 720, 1000000, 15),
-
-  /** @deprecated */
-  fhd_15: new VideoPreset(1920, 1080, 1500000, 15),
-
-  /** @deprecated */
-  fhd_30: new VideoPreset(1920, 1080, 3000000, 30)
+  h1080fps30: new VideoPreset(1920, 1080, 3000000, 30)
 };
 
 var ConnectionQuality;
@@ -12315,7 +12353,6 @@ class Participant extends events.exports.EventEmitter {
     this.metadata = md;
 
     if (changed) {
-      this.emit(ParticipantEvent.MetadataChanged, prevMetadata);
       this.emit(ParticipantEvent.ParticipantMetadataChanged, prevMetadata);
     }
   }
@@ -12907,29 +12944,32 @@ class RemoteParticipant extends Participant {
     }
   }
   /**
-   * sets the volume on the participant's microphone track if it exists.
+   * sets the volume on the participant's microphone track
+   * if no track exists the volume will be applied when the microphone track is added
    */
 
 
   setVolume(volume) {
+    this.volume = volume;
     const audioPublication = this.getTrack(Track.Source.Microphone);
 
-    if (audioPublication) {
+    if (audioPublication && audioPublication.track) {
       audioPublication.track.setVolume(volume);
     }
   }
   /**
    * gets the volume on the participant's microphone track
-   * returns undefined if no microphone track exists
    */
 
 
   getVolume() {
     const audioPublication = this.getTrack(Track.Source.Microphone);
 
-    if (audioPublication) {
+    if (audioPublication && audioPublication.track) {
       return audioPublication.track.getVolume();
     }
+
+    return this.volume;
   }
   /** @internal */
 
@@ -12985,7 +13025,12 @@ class RemoteParticipant extends Participant {
     track.isMuted = publication.isMuted;
     track.setMediaStream(mediaStream);
     track.start();
-    publication.setTrack(track);
+    publication.setTrack(track); // set participant volume on new microphone tracks
+
+    if (this.volume !== undefined && track instanceof RemoteAudioTrack && track.source === Track.Source.Microphone) {
+      track.setVolume(this.volume);
+    }
+
     this.emit(ParticipantEvent.TrackSubscribed, track, publication);
     return publication;
   }
@@ -13590,6 +13635,10 @@ class LocalParticipant extends Participant {
       }];
     }
 
+    if (!this.engine || this.engine.isClosed) {
+      throw new UnexpectedConnectionState('cannot publish track when not connected');
+    }
+
     const ti = await this.engine.addTrack(req);
     const publication = new LocalTrackPublication(track.kind, ti, track);
     track.sid = ti.sid;
@@ -17439,7 +17488,7 @@ class SignalClient {
     this.requestQueue = new Queue();
   }
 
-  async join(url, token, opts) {
+  async join(url, token, opts, abortSignal) {
     // during a full reconnect, we'd want to start the sequence even if currently
     // connected
     this.isConnected = false;
@@ -17447,7 +17496,7 @@ class SignalClient {
       autoSubscribe: opts === null || opts === void 0 ? void 0 : opts.autoSubscribe,
       publishOnly: opts === null || opts === void 0 ? void 0 : opts.publishOnly,
       adaptiveStream: opts === null || opts === void 0 ? void 0 : opts.adaptiveStream
-    });
+    }, abortSignal);
     return res;
   }
 
@@ -17458,7 +17507,7 @@ class SignalClient {
     });
   }
 
-  connect(url, token, opts) {
+  connect(url, token, opts, abortSignal) {
     if (url.startsWith('http')) {
       url = url.replace('http', 'ws');
     } // strip trailing slash
@@ -17469,6 +17518,17 @@ class SignalClient {
     const clientInfo = getClientInfo();
     const params = createConnectionParams(token, clientInfo, opts);
     return new Promise((resolve, reject) => {
+      const abortHandler = () => {
+        ws.close();
+        this.close();
+        reject(new ConnectionError('room connection has been cancelled'));
+      };
+
+      if (abortSignal === null || abortSignal === void 0 ? void 0 : abortSignal.aborted) {
+        abortHandler();
+      }
+
+      abortSignal === null || abortSignal === void 0 ? void 0 : abortSignal.addEventListener('abort', abortHandler);
       livekitLogger.debug("connecting to ".concat(url + params));
       this.ws = undefined;
       const ws = new WebSocket(url + params);
@@ -17524,6 +17584,7 @@ class SignalClient {
           // handle join message only
           if (msg.join) {
             this.isConnected = true;
+            abortSignal === null || abortSignal === void 0 ? void 0 : abortSignal.removeEventListener('abort', abortHandler);
             resolve(msg.join);
           } else {
             reject(new ConnectionError('did not receive join response'));
@@ -17946,7 +18007,7 @@ class RTCEngine extends events.exports.EventEmitter {
     this.rtcConfig = {};
     this.subscriberPrimary = false;
     this.pcState = PCState.New;
-    this.isClosed = true;
+    this._isClosed = true;
     this.pendingTrackResolvers = {}; // true if publisher connection has already been established.
     // this is helpful to know if we need to restart ICE on the publisher connection
 
@@ -18017,7 +18078,7 @@ class RTCEngine extends events.exports.EventEmitter {
 
 
     this.handleDisconnect = connection => {
-      if (this.isClosed) {
+      if (this._isClosed) {
         return;
       }
 
@@ -18032,7 +18093,7 @@ class RTCEngine extends events.exports.EventEmitter {
       setTimeout(async () => {
         var _a;
 
-        if (this.isClosed) {
+        if (this._isClosed) {
           return;
         }
 
@@ -18085,12 +18146,16 @@ class RTCEngine extends events.exports.EventEmitter {
     this.client = new SignalClient();
   }
 
-  async join(url, token, opts) {
+  get isClosed() {
+    return this._isClosed;
+  }
+
+  async join(url, token, opts, abortSignal) {
     this.url = url;
     this.token = token;
     this.signalOpts = opts;
-    const joinResponse = await this.client.join(url, token, opts);
-    this.isClosed = false;
+    const joinResponse = await this.client.join(url, token, opts, abortSignal);
+    this._isClosed = false;
     this.subscriberPrimary = joinResponse.subscriberPrimary;
 
     if (!this.publisher) {
@@ -18107,7 +18172,7 @@ class RTCEngine extends events.exports.EventEmitter {
   }
 
   close() {
-    this.isClosed = true;
+    this._isClosed = true;
     this.removeAllListeners();
 
     if (this.publisher && this.publisher.pc.signalingState !== 'closed') {
@@ -18617,13 +18682,18 @@ const videoDefaults = {
   resolution: VideoPresets.h720.resolution
 };
 
-var RoomState;
+var ConnectionState;
+
+(function (ConnectionState) {
+  ConnectionState["Disconnected"] = "disconnected";
+  ConnectionState["Connecting"] = "connecting";
+  ConnectionState["Connected"] = "connected";
+  ConnectionState["Reconnecting"] = "reconnecting";
+})(ConnectionState || (ConnectionState = {}));
+/** @deprecated RoomState has been renamed to [[ConnectionState]] */
 
-(function (RoomState) {
-  RoomState["Disconnected"] = "disconnected";
-  RoomState["Connected"] = "connected";
-  RoomState["Reconnecting"] = "reconnecting";
-})(RoomState || (RoomState = {}));
+
+const RoomState = ConnectionState;
 /**
  * In LiveKit, a room is the logical grouping for a list of participants.
  * Participants in a room can publish tracks, and subscribe to others' tracks.
@@ -18633,7 +18703,6 @@ var RoomState;
  * @noInheritDoc
  */
 
-
 class Room extends events.exports.EventEmitter {
   /**
    * Creates a new Room, the primary construct for a LiveKit session.
@@ -18646,7 +18715,7 @@ class Room extends events.exports.EventEmitter {
 
     super();
     _this = this;
-    this.state = RoomState.Disconnected;
+    this.state = ConnectionState.Disconnected;
     /**
      * list of participants that are actively speaking. when this changes
      * a [[RoomEvent.ActiveSpeakersChanged]] event is fired
@@ -18669,9 +18738,15 @@ class Room extends events.exports.EventEmitter {
       var _a, _b; // guard against calling connect
 
 
-      if (this.state !== RoomState.Disconnected) {
+      if (this.state !== ConnectionState.Disconnected) {
         livekitLogger.warn("already connected to room ".concat(this.name));
         return;
+      }
+
+      this.setAndEmitConnectionState(ConnectionState.Connecting);
+
+      if (!this.abortController || this.abortController.signal.aborted) {
+        this.abortController = new AbortController();
       } // recreate engine if previously disconnected
 
 
@@ -18689,7 +18764,7 @@ class Room extends events.exports.EventEmitter {
           autoSubscribe: opts === null || opts === void 0 ? void 0 : opts.autoSubscribe,
           publishOnly: opts === null || opts === void 0 ? void 0 : opts.publishOnly,
           adaptiveStream: typeof ((_a = this.options) === null || _a === void 0 ? void 0 : _a.adaptiveStream) === 'object' ? true : (_b = this.options) === null || _b === void 0 ? void 0 : _b.adaptiveStream
-        });
+        }, this.abortController.signal);
         livekitLogger.debug("connected to Livekit Server version: ".concat(joinResponse.serverVersion, ", region: ").concat(joinResponse.serverRegion));
 
         if (!joinResponse.serverVersion) {
@@ -18702,15 +18777,12 @@ class Room extends events.exports.EventEmitter {
           this.options.dynacast = false;
         }
 
-        this.state = RoomState.Connected;
         const pi = joinResponse.participant;
         this.localParticipant.sid = pi.sid;
         this.localParticipant.identity = pi.identity;
         this.localParticipant.updateInfo(pi); // forward metadata changed for the local participant
 
-        this.localParticipant.on(ParticipantEvent.MetadataChanged, metadata => {
-          this.emit(RoomEvent.MetadataChanged, metadata, this.localParticipant);
-        }).on(ParticipantEvent.ParticipantMetadataChanged, metadata => {
+        this.localParticipant.on(ParticipantEvent.ParticipantMetadataChanged, metadata => {
           this.emit(RoomEvent.ParticipantMetadataChanged, metadata, this.localParticipant);
         }).on(ParticipantEvent.TrackMuted, pub => {
           this.emit(RoomEvent.TrackMuted, pub, this.localParticipant);
@@ -18734,29 +18806,48 @@ class Room extends events.exports.EventEmitter {
         this.name = joinResponse.room.name;
         this.sid = joinResponse.room.sid;
         this.metadata = joinResponse.room.metadata;
-        this.emit(RoomEvent.StateChanged, this.state);
       } catch (err) {
         this.engine.close();
+        this.setAndEmitConnectionState(ConnectionState.Disconnected);
         throw err;
       } // don't return until ICE connected
 
 
       return new Promise((resolve, reject) => {
+        var _a, _b;
+
         const connectTimeout = setTimeout(() => {
           // timeout
           this.engine.close();
+          this.setAndEmitConnectionState(ConnectionState.Disconnected);
           reject(new ConnectionError('could not connect after timeout'));
         }, maxICEConnectTimeout);
+
+        const abortHandler = () => {
+          livekitLogger.warn('closing engine');
+          clearTimeout(connectTimeout);
+          this.engine.close();
+          this.setAndEmitConnectionState(ConnectionState.Disconnected);
+          reject(new ConnectionError('room connection has been cancelled'));
+        };
+
+        if ((_a = this.abortController) === null || _a === void 0 ? void 0 : _a.signal.aborted) {
+          abortHandler();
+        }
+
+        (_b = this.abortController) === null || _b === void 0 ? void 0 : _b.signal.addEventListener('abort', abortHandler);
         this.engine.once(EngineEvent.Connected, () => {
-          var _a;
+          var _a, _b;
 
-          clearTimeout(connectTimeout); // also hook unload event
+          clearTimeout(connectTimeout);
+          (_a = this.abortController) === null || _a === void 0 ? void 0 : _a.signal.removeEventListener('abort', abortHandler); // also hook unload event
 
           if (isWeb()) {
             window.addEventListener('beforeunload', this.onBeforeUnload);
-            (_a = navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.addEventListener('devicechange', this.handleDeviceChange);
+            (_b = navigator.mediaDevices) === null || _b === void 0 ? void 0 : _b.addEventListener('devicechange', this.handleDeviceChange);
           }
 
+          this.setAndEmitConnectionState(ConnectionState.Connected);
           resolve(this);
         });
       });
@@ -18769,7 +18860,16 @@ class Room extends events.exports.EventEmitter {
     this.disconnect = function () {
       let stopTracks = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
 
-      // send leave
+      var _a;
+
+      if (_this.state === ConnectionState.Connecting) {
+        // try aborting pending connection attempt
+        livekitLogger.warn('abort connection attempt');
+        (_a = _this.abortController) === null || _a === void 0 ? void 0 : _a.abort();
+        return;
+      } // send leave
+
+
       if (_this.engine) {
         _this.engine.client.sendLeave();
 
@@ -18788,9 +18888,8 @@ class Room extends events.exports.EventEmitter {
     };
 
     this.handleRestarting = () => {
-      this.state = RoomState.Reconnecting;
-      this.emit(RoomEvent.Reconnecting);
-      this.emit(RoomEvent.StateChanged, this.state); // also unwind existing participants & existing subscriptions
+      this.setAndEmitConnectionState(ConnectionState.Reconnecting);
+      this.emit(RoomEvent.Reconnecting); // also unwind existing participants & existing subscriptions
 
       for (const p of this.participants.values()) {
         this.handleParticipantDisconnected(p.sid, p);
@@ -18799,9 +18898,8 @@ class Room extends events.exports.EventEmitter {
 
     this.handleRestarted = async joinResponse => {
       livekitLogger.debug("reconnected to server region ".concat(joinResponse.serverRegion));
-      this.state = RoomState.Connected;
-      this.emit(RoomEvent.Reconnected);
-      this.emit(RoomEvent.StateChanged, this.state); // rehydrate participants
+      this.setAndEmitConnectionState(ConnectionState.Connected);
+      this.emit(RoomEvent.Reconnected); // rehydrate participants
 
       if (joinResponse.participant) {
         // with a restart, the sid will have changed, we'll map our understanding to it
@@ -19043,16 +19141,14 @@ class Room extends events.exports.EventEmitter {
     }).on(EngineEvent.Disconnected, () => {
       this.handleDisconnect();
     }).on(EngineEvent.ActiveSpeakersUpdate, this.handleActiveSpeakersUpdate).on(EngineEvent.DataPacketReceived, this.handleDataPacket).on(EngineEvent.Resuming, () => {
-      this.state = RoomState.Reconnecting;
+      this.setAndEmitConnectionState(ConnectionState.Reconnecting);
       this.emit(RoomEvent.Reconnecting);
-      this.emit(RoomEvent.StateChanged, this.state);
     }).on(EngineEvent.Resumed, () => {
-      this.state = RoomState.Connected;
+      this.setAndEmitConnectionState(ConnectionState.Connected);
       this.emit(RoomEvent.Reconnected);
-      this.emit(RoomEvent.StateChanged, this.state);
       this.updateSubscriptions();
     }).on(EngineEvent.SignalResumed, () => {
-      if (this.state === RoomState.Reconnecting) {
+      if (this.state === ConnectionState.Reconnecting) {
         this.sendSyncState();
       }
     }).on(EngineEvent.Restarting, this.handleRestarting).on(EngineEvent.Restarted, this.handleRestarted);
@@ -19238,10 +19334,6 @@ class Room extends events.exports.EventEmitter {
 
     var _a;
 
-    if (this.state === RoomState.Disconnected) {
-      return;
-    }
-
     this.participants.forEach(p => {
       p.tracks.forEach(pub => {
         p.unpublishTrack(pub.trackSid);
@@ -19251,7 +19343,7 @@ class Room extends events.exports.EventEmitter {
       var _a, _b;
 
       if (pub.track) {
-        this.localParticipant.unpublishTrack(pub.track);
+        this.localParticipant.unpublishTrack(pub.track, shouldStopTracks);
       }
 
       if (shouldStopTracks) {
@@ -19272,9 +19364,8 @@ class Room extends events.exports.EventEmitter {
       (_a = navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.removeEventListener('devicechange', this.handleDeviceChange);
     }
 
-    this.state = RoomState.Disconnected;
+    this.setAndEmitConnectionState(ConnectionState.Disconnected);
     this.emit(RoomEvent.Disconnected);
-    this.emit(RoomEvent.StateChanged, this.state);
   }
 
   handleParticipantDisconnected(sid, participant) {
@@ -19349,8 +19440,6 @@ class Room extends events.exports.EventEmitter {
       this.emit(RoomEvent.TrackMuted, pub, participant);
     }).on(ParticipantEvent.TrackUnmuted, pub => {
       this.emit(RoomEvent.TrackUnmuted, pub, participant);
-    }).on(ParticipantEvent.MetadataChanged, metadata => {
-      this.emit(RoomEvent.MetadataChanged, metadata, participant);
     }).on(ParticipantEvent.ParticipantMetadataChanged, metadata => {
       this.emit(RoomEvent.ParticipantMetadataChanged, metadata, participant);
     }).on(ParticipantEvent.ConnectionQualityChanged, quality => {
@@ -19412,6 +19501,15 @@ class Room extends events.exports.EventEmitter {
         }
       }
     }
+  }
+
+  setAndEmitConnectionState(state) {
+    if (state === this.state) {
+      return;
+    }
+
+    this.state = state;
+    this.emit(RoomEvent.ConnectionStateChanged, this.state);
   } // /** @internal */
 
 
@@ -19429,101 +19527,6 @@ class Room extends events.exports.EventEmitter {
 
 }
 
-/**
- * @deprecated Use room.connect() instead
- *
- * Connects to a LiveKit room, shorthand for `new Room()` and [[Room.connect]]
- *
- * ```typescript
- * connect('wss://myhost.livekit.io', token, {
- *   // publish audio and video tracks on joining
- *   audio: true,
- *   video: true,
- *   captureDefaults: {
- *    facingMode: 'user',
- *   },
- * })
- * ```
- * @param url URL to LiveKit server
- * @param token AccessToken, a JWT token that includes authentication and room details
- * @param options
- */
-
-async function connect(url, token, options) {
-  var _a, _b, _c, _d;
-
-  options !== null && options !== void 0 ? options : options = {};
-
-  if (options.adaptiveStream === undefined) {
-    options.adaptiveStream = options.autoManageVideo === true ? {} : undefined;
-  }
-
-  setLogLevel((_a = options.logLevel) !== null && _a !== void 0 ? _a : LogLevel.warn);
-  const config = (_b = options.rtcConfig) !== null && _b !== void 0 ? _b : {};
-
-  if (options.iceServers) {
-    config.iceServers = options.iceServers;
-  }
-
-  const room = new Room(options); // connect to room
-
-  await room.connect(url, token, options);
-  const publishAudio = (_c = options.audio) !== null && _c !== void 0 ? _c : false;
-  const publishVideo = (_d = options.video) !== null && _d !== void 0 ? _d : false;
-
-  if (publishAudio || publishVideo) {
-    setTimeout(async () => {
-      // if publishing both
-      let err;
-
-      if (publishAudio && publishVideo) {
-        try {
-          await room.localParticipant.enableCameraAndMicrophone();
-        } catch (e) {
-          const errKind = MediaDeviceFailure.getFailure(e);
-          livekitLogger.warn('received error while creating media', {
-            error: errKind
-          });
-
-          if (e instanceof Error) {
-            livekitLogger.warn(e.message);
-          } // when it's a device issue, try to publish the other kind
-
-
-          if (errKind === MediaDeviceFailure.NotFound || errKind === MediaDeviceFailure.DeviceInUse) {
-            try {
-              await room.localParticipant.setMicrophoneEnabled(true);
-            } catch (audioErr) {
-              err = audioErr;
-            }
-          } else {
-            err = e;
-          }
-        }
-      } else if (publishAudio) {
-        try {
-          await room.localParticipant.setMicrophoneEnabled(true);
-        } catch (e) {
-          err = e;
-        }
-      } else if (publishVideo) {
-        try {
-          await room.localParticipant.setCameraEnabled(true);
-        } catch (e) {
-          err = e;
-        }
-      }
-
-      if (err) {
-        room.emit(RoomEvent.MediaDevicesError, err);
-        livekitLogger.error('could not create media', err);
-      }
-    });
-  }
-
-  return room;
-}
-
 /**
  * Creates a local video and audio track at the same time. When acquiring both
  * audio and video tracks together, it'll display a single permission prompt to
@@ -19597,7 +19600,7 @@ async function createLocalScreenTracks(options) {
   }
 
   if (options.resolution === undefined) {
-    options.resolution = VideoPresets.fhd.resolution;
+    options.resolution = VideoPresets.h1080.resolution;
   }
 
   let videoConstraints = true;
@@ -19634,5 +19637,5 @@ async function createLocalScreenTracks(options) {
   return localTracks;
 }
 
-export { AudioPresets, ConnectionError, ConnectionQuality, DataPacket_Kind, EngineEvent, LivekitError, LocalAudioTrack, LocalParticipant, LocalTrack, LocalTrackPublication, LocalVideoTrack, LogLevel, MediaDeviceFailure, Participant, ParticipantEvent, PublishDataError, RemoteAudioTrack, RemoteParticipant, RemoteTrack, RemoteTrackPublication, RemoteVideoTrack, Room, RoomEvent, RoomState, ScreenSharePresets, Track, TrackEvent, TrackInvalidError, TrackPublication, UnexpectedConnectionState, UnsupportedServer, VideoPreset, VideoPresets, VideoPresets43, VideoQuality, attachToElement, connect, createLocalAudioTrack, createLocalScreenTracks, createLocalTracks, createLocalVideoTrack, detachTrack, protocolVersion, setLogExtension, setLogLevel, version };
+export { AudioPresets, ConnectionError, ConnectionQuality, ConnectionState, DataPacket_Kind, EngineEvent, LivekitError, LocalAudioTrack, LocalParticipant, LocalTrack, LocalTrackPublication, LocalVideoTrack, LogLevel, MediaDeviceFailure, Participant, ParticipantEvent, PublishDataError, RemoteAudioTrack, RemoteParticipant, RemoteTrack, RemoteTrackPublication, RemoteVideoTrack, Room, RoomEvent, RoomState, ScreenSharePresets, Track, TrackEvent, TrackInvalidError, TrackPublication, UnexpectedConnectionState, UnsupportedServer, VideoPreset, VideoPresets, VideoPresets43, VideoQuality, attachToElement, createLocalAudioTrack, createLocalScreenTracks, createLocalTracks, createLocalVideoTrack, detachTrack, protocolVersion, setLogExtension, setLogLevel, version };
 //# sourceMappingURL=livekit-client.esm.mjs.map