@cuekit-ai/react 1.4.0 → 1.6.0

package/dist/index.js

@@ -5363,7 +5363,7 @@ function supportsAV1() {
   if (!("getCapabilities" in RTCRtpSender)) {
     return false;
   }
-  if (isSafari()) {
+  if (isSafari() || isFireFox()) {
     return false;
   }
   const capabilities = RTCRtpSender.getCapabilities("video");
@@ -5460,9 +5460,9 @@ function isE2EESimulcastSupported() {
   if (browser) {
     if (browser.name !== "Safari" && browser.os !== "iOS") {
       return true;
-    } else if (browser.os === "iOS" && browser.osVersion && compareVersions(supportedSafariVersion, browser.osVersion) >= 0) {
+    } else if (browser.os === "iOS" && browser.osVersion && compareVersions(browser.osVersion, supportedSafariVersion) >= 0) {
       return true;
-    } else if (browser.name === "Safari" && compareVersions(supportedSafariVersion, browser.version) >= 0) {
+    } else if (browser.name === "Safari" && compareVersions(browser.version, supportedSafariVersion) >= 0) {
       return true;
     } else {
       return false;
@@ -5641,13 +5641,13 @@ function unwrapConstraint(constraint) {
   if (Array.isArray(constraint)) {
     return constraint[0];
   }
-  if (constraint.exact) {
+  if (constraint.exact !== void 0) {
     if (Array.isArray(constraint.exact)) {
       return constraint.exact[0];
     }
     return constraint.exact;
   }
-  if (constraint.ideal) {
+  if (constraint.ideal !== void 0) {
     if (Array.isArray(constraint.ideal)) {
       return constraint.ideal[0];
     }
@@ -5870,7 +5870,7 @@ function constraintsForOptions(options) {
 function detectSilence(track_1) {
   return __awaiter(this, arguments, void 0, function(track) {
     let timeOffset = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 200;
-    return function* () {
+    return (function* () {
       const ctx = getNewAudioContext();
       if (ctx) {
         const analyser = ctx.createAnalyser();
@@ -5886,7 +5886,7 @@ function detectSilence(track_1) {
         return !someNoise;
       }
       return false;
-    }();
+    })();
   });
 }
 function getNewAudioContext() {
@@ -7610,7 +7610,7 @@ function isIPPrivate(address) {
   }
   return false;
 }
-var e, h, o, _, FLOAT32_MAX, FLOAT32_MIN, UINT32_MAX, INT32_MAX, INT32_MIN, enumTypeSymbol, Message, TWO_PWR_32_DBL, decimalFrom1e7WithLeadingZeros, protoInt64, ScalarType, LongType, WireType, BinaryWriter, BinaryReader, encTable, decTable, protoBase64, jsonReadDefaults, jsonWriteDefaults, tokenNull, tokenIgnoredUnknownEnum, unknownFieldsSymbol, readDefaults, writeDefaults, InternalFieldList, fieldJsonName, reservedObjectProperties, reservedMessageProperties, fallback, safeMessageProperty, safeObjectProperty, InternalOneofInfo, proto3, Timestamp, MetricsBatch, TimeSeriesMetric, MetricSample, EventMetric, BackupCodecPolicy$1, TrackType, TrackSource, VideoQuality$1, ConnectionQuality$1, ClientConfigSetting, DisconnectReason, ReconnectReason, SubscriptionError, AudioTrackFeature, Room$1, Codec, ParticipantPermission, ParticipantInfo, ParticipantInfo_State, ParticipantInfo_Kind, ParticipantInfo_KindDetail, Encryption_Type, SimulcastCodecInfo, TrackInfo, VideoLayer, DataPacket, DataPacket_Kind, ActiveSpeakerUpdate, SpeakerInfo, UserPacket, SipDTMF, Transcription, TranscriptionSegment, ChatMessage, RpcRequest, RpcAck, RpcResponse, RpcError$1, ParticipantTracks, ServerInfo, ServerInfo_Edition, ClientInfo, ClientInfo_SDK, ClientConfiguration, VideoConfiguration, DisabledCodecs, TimedVersion, DataStream_OperationType, DataStream_TextHeader, DataStream_ByteHeader, DataStream_Header, DataStream_Chunk, DataStream_Trailer, SignalTarget, StreamState, CandidateProtocol, SignalRequest, SignalResponse, SimulcastCodec, AddTrackRequest, TrickleRequest, MuteTrackRequest, JoinResponse, ReconnectResponse, TrackPublishedResponse, TrackUnpublishedResponse, SessionDescription, ParticipantUpdate, UpdateSubscription, UpdateTrackSettings, UpdateLocalAudioTrack, UpdateLocalVideoTrack, LeaveRequest, LeaveRequest_Action, UpdateVideoLayers, UpdateParticipantMetadata, ICEServer, SpeakersChanged, RoomUpdate, ConnectionQualityInfo, ConnectionQualityUpdate, StreamStateInfo, StreamStateUpdate, SubscribedQuality, SubscribedCodec, SubscribedQualityUpdate, TrackPermission, SubscriptionPermission, SubscriptionPermissionUpdate, RoomMovedResponse, SyncState, DataChannelReceiveState, DataChannelInfo, SimulateScenario, Ping, Pong, RegionSettings, RegionInfo, SubscriptionResponse, RequestResponse, RequestResponse_Reason, TrackSubscribed, loglevel$1, loglevel, hasRequiredLoglevel, loglevelExports, LogLevel, LoggerNames, livekitLogger, livekitLoggers, workerLogger, maxRetryDelay, DEFAULT_RETRY_DELAYS_IN_MS, DefaultReconnectPolicy, events, hasRequiredEvents, eventsExports, logDisabled_, deprecationWarnings_, logging, chromeShim, firefoxShim, safariShim, sdp$1, hasRequiredSdp, sdpExports, SDPUtils, sdp, commonShim, DECRYPTION_FAILURE_TOLERANCE, E2EE_FLAG, SALT, KEY_PROVIDER_DEFAULTS, KeyProviderEvent, KeyHandlerEvent, EncryptionEvent, CryptorEvent, BaseKeyProvider, LivekitError, ConnectionErrorReason, ConnectionError, DeviceUnsupportedError, TrackInvalidError, UnsupportedServer, UnexpectedConnectionState, NegotiationError, PublishTrackError, SignalRequestError, MediaDeviceFailure, CryptorErrorReason, RoomEvent, ParticipantEvent, EngineEvent, TrackEvent, commonVersionIdentifier, browserDetails, browsersList, version$1, version, protocolVersion, CriticalTimers, BACKGROUND_REACTION_DELAY, recycledElements, VideoQuality, Track, VideoPreset, backupCodecs, videoCodecs, BackupCodecPolicy, AudioPresets, VideoPresets, VideoPresets43, ScreenSharePresets, separator, ddExtensionURI, resizeObserver, getResizeObserver, intersectionObserver, getIntersectionObserver, emptyAudioStreamTrack, Future, E2EEManager, defaultId, DeviceManager, QueueTaskStatus, AsyncQueue, passThroughQueueSignals, SignalConnectionState, SignalClient, DataPacketBuffer, TTLMap, lib, parser, grammar, hasRequiredGrammar, hasRequiredParser, writer, hasRequiredWriter, hasRequiredLib, libExports, startBitrateForSVC, debounceInterval, PCEvents, PCTransport, defaultVideoCodec, publishDefaults, audioDefaults, videoDefaults, roomOptionDefaults, roomConnectOptionDefaults, PCTransportState, PCTransportManager, RpcError, MAX_PAYLOAD_BYTES, monitorFrequency, isMediaRecorderAvailable, FallbackRecorder, RecorderBase, LocalTrackRecorder, DEFAULT_DIMENSIONS_TIMEOUT, PRE_CONNECT_BUFFER_TIMEOUT, LocalTrack, LocalAudioTrack, presets169, presets43, presetsScreenShare, defaultSimulcastPresets169, defaultSimulcastPresets43, computeDefaultScreenShareSimulcastPresets, videoRids, ScalabilityMode, refreshSubscribedCodecAfterNewCodec, LocalVideoTrack, lossyDataChannel, reliableDataChannel, minReconnectWait, leaveReconnect, reliabeReceiveStateTTL, PCState, RTCEngine, SignalReconnectError, RegionUrlProvider, BaseStreamReader, ByteStreamReader, TextStreamReader, BaseStreamWriter, TextStreamWriter, ByteStreamWriter, RemoteTrack, RemoteAudioTrack, REACTION_DELAY, RemoteVideoTrack, HTMLElementInfo, TrackPublication, LocalTrackPublication, ConnectionQuality, Participant, STREAM_CHUNK_SIZE, LocalParticipant, RemoteTrackPublication, RemoteParticipant, ConnectionState, connectionReconcileFrequency, Room, CheckStatus, Checker, CloudRegionCheck, TEST_DURATION, ConnectionProtocolCheck, PublishAudioCheck, PublishVideoCheck, ReconnectCheck, TURNCheck, WebRTCCheck, WebSocketCheck, ConnectionCheck;
+var e, h, o, _, FLOAT32_MAX, FLOAT32_MIN, UINT32_MAX, INT32_MAX, INT32_MIN, enumTypeSymbol, Message, TWO_PWR_32_DBL, decimalFrom1e7WithLeadingZeros, protoInt64, ScalarType, LongType, WireType, BinaryWriter, BinaryReader, encTable, decTable, protoBase64, jsonReadDefaults, jsonWriteDefaults, tokenNull, tokenIgnoredUnknownEnum, unknownFieldsSymbol, readDefaults, writeDefaults, InternalFieldList, fieldJsonName, reservedObjectProperties, reservedMessageProperties, fallback, safeMessageProperty, safeObjectProperty, InternalOneofInfo, proto3, Timestamp, MetricsBatch, TimeSeriesMetric, MetricSample, EventMetric, BackupCodecPolicy$1, TrackType, TrackSource, VideoQuality$1, ConnectionQuality$1, ClientConfigSetting, DisconnectReason, ReconnectReason, SubscriptionError, AudioTrackFeature, Room$1, Codec, ParticipantPermission, ParticipantInfo, ParticipantInfo_State, ParticipantInfo_Kind, ParticipantInfo_KindDetail, Encryption_Type, SimulcastCodecInfo, TrackInfo, VideoLayer, DataPacket, DataPacket_Kind, ActiveSpeakerUpdate, SpeakerInfo, UserPacket, SipDTMF, Transcription, TranscriptionSegment, ChatMessage, RpcRequest, RpcAck, RpcResponse, RpcError$1, ParticipantTracks, ServerInfo, ServerInfo_Edition, ClientInfo, ClientInfo_SDK, ClientConfiguration, VideoConfiguration, DisabledCodecs, TimedVersion, DataStream_OperationType, DataStream_TextHeader, DataStream_ByteHeader, DataStream_Header, DataStream_Chunk, DataStream_Trailer, SignalTarget, StreamState, CandidateProtocol, SignalRequest, SignalResponse, SimulcastCodec, AddTrackRequest, TrickleRequest, MuteTrackRequest, JoinResponse, ReconnectResponse, TrackPublishedResponse, TrackUnpublishedResponse, SessionDescription, ParticipantUpdate, UpdateSubscription, UpdateTrackSettings, UpdateLocalAudioTrack, UpdateLocalVideoTrack, LeaveRequest, LeaveRequest_Action, UpdateVideoLayers, UpdateParticipantMetadata, ICEServer, SpeakersChanged, RoomUpdate, ConnectionQualityInfo, ConnectionQualityUpdate, StreamStateInfo, StreamStateUpdate, SubscribedQuality, SubscribedCodec, SubscribedQualityUpdate, TrackPermission, SubscriptionPermission, SubscriptionPermissionUpdate, RoomMovedResponse, SyncState, DataChannelReceiveState, DataChannelInfo, SimulateScenario, Ping, Pong, RegionSettings, RegionInfo, SubscriptionResponse, RequestResponse, RequestResponse_Reason, TrackSubscribed, loglevel$1, loglevel, hasRequiredLoglevel, loglevelExports, LogLevel, LoggerNames, livekitLogger, livekitLoggers, workerLogger, maxRetryDelay, DEFAULT_RETRY_DELAYS_IN_MS, DefaultReconnectPolicy, events, hasRequiredEvents, eventsExports, logDisabled_, deprecationWarnings_, logging, chromeShim, firefoxShim, safariShim, sdp$1, hasRequiredSdp, sdpExports, SDPUtils, sdp, commonShim, DECRYPTION_FAILURE_TOLERANCE, E2EE_FLAG, SALT, KEY_PROVIDER_DEFAULTS, KeyProviderEvent, KeyHandlerEvent, EncryptionEvent, CryptorEvent, BaseKeyProvider, LivekitError, ConnectionErrorReason, ConnectionError, DeviceUnsupportedError, TrackInvalidError, UnsupportedServer, UnexpectedConnectionState, NegotiationError, PublishTrackError, SignalRequestError, DataStreamErrorReason, DataStreamError, MediaDeviceFailure, CryptorErrorReason, RoomEvent, ParticipantEvent, EngineEvent, TrackEvent, commonVersionIdentifier, browserDetails, browsersList, version$1, version, protocolVersion, CriticalTimers, BACKGROUND_REACTION_DELAY, recycledElements, VideoQuality, Track, VideoPreset, backupCodecs, videoCodecs, BackupCodecPolicy, AudioPresets, VideoPresets, VideoPresets43, ScreenSharePresets, separator, ddExtensionURI, resizeObserver, getResizeObserver, intersectionObserver, getIntersectionObserver, emptyAudioStreamTrack, Future, E2EEManager, defaultId, DeviceManager, QueueTaskStatus, AsyncQueue, passThroughQueueSignals, SignalConnectionState, SignalClient, DataPacketBuffer, TTLMap, lib, parser, grammar, hasRequiredGrammar, hasRequiredParser, writer, hasRequiredWriter, hasRequiredLib, libExports, startBitrateForSVC, debounceInterval, PCEvents, PCTransport, defaultVideoCodec, publishDefaults, audioDefaults, videoDefaults, roomOptionDefaults, roomConnectOptionDefaults, PCTransportState, PCTransportManager, RpcError, MAX_PAYLOAD_BYTES, monitorFrequency, isMediaRecorderAvailable, FallbackRecorder, RecorderBase, LocalTrackRecorder, DEFAULT_DIMENSIONS_TIMEOUT, PRE_CONNECT_BUFFER_TIMEOUT, LocalTrack, LocalAudioTrack, presets169, presets43, presetsScreenShare, defaultSimulcastPresets169, defaultSimulcastPresets43, computeDefaultScreenShareSimulcastPresets, videoRids, ScalabilityMode, refreshSubscribedCodecAfterNewCodec, LocalVideoTrack, lossyDataChannel, reliableDataChannel, minReconnectWait, leaveReconnect, reliabeReceiveStateTTL, PCState, RTCEngine, SignalReconnectError, RegionUrlProvider, BaseStreamReader, ByteStreamReader, TextStreamReader, IncomingDataStreamManager, BaseStreamWriter, TextStreamWriter, ByteStreamWriter, STREAM_CHUNK_SIZE, OutgoingDataStreamManager, RemoteTrack, RemoteAudioTrack, REACTION_DELAY, RemoteVideoTrack, HTMLElementInfo, TrackPublication, LocalTrackPublication, ConnectionQuality, Participant, LocalParticipant, RemoteTrackPublication, RemoteParticipant, ConnectionState, connectionReconcileFrequency, Room, CheckStatus, Checker, CloudRegionCheck, TEST_DURATION, ConnectionProtocolCheck, PublishAudioCheck, PublishVideoCheck, ReconnectCheck, TURNCheck, WebRTCCheck, WebSocketCheck, ConnectionCheck;
 var init_livekit_client_esm = __esm({
   "node_modules/livekit-client/dist/livekit-client.esm.mjs"() {
     "use strict";
@@ -11486,6 +11486,22 @@ var init_livekit_client_esm = __esm({
         this.reasonName = typeof reason === "string" ? reason : RequestResponse_Reason[reason];
       }
     };
+    (function(DataStreamErrorReason2) {
+      DataStreamErrorReason2[DataStreamErrorReason2["AlreadyOpened"] = 0] = "AlreadyOpened";
+      DataStreamErrorReason2[DataStreamErrorReason2["AbnormalEnd"] = 1] = "AbnormalEnd";
+      DataStreamErrorReason2[DataStreamErrorReason2["DecodeFailed"] = 2] = "DecodeFailed";
+      DataStreamErrorReason2[DataStreamErrorReason2["LengthExceeded"] = 3] = "LengthExceeded";
+      DataStreamErrorReason2[DataStreamErrorReason2["Incomplete"] = 4] = "Incomplete";
+      DataStreamErrorReason2[DataStreamErrorReason2["HandlerAlreadyRegistered"] = 7] = "HandlerAlreadyRegistered";
+    })(DataStreamErrorReason || (DataStreamErrorReason = {}));
+    DataStreamError = class extends LivekitError {
+      constructor(message, reason) {
+        super(16, message);
+        this.name = "DataStreamError";
+        this.reason = reason;
+        this.reasonName = DataStreamErrorReason[reason];
+      }
+    };
     (function(MediaDeviceFailure2) {
       MediaDeviceFailure2["PermissionDenied"] = "PermissionDenied";
       MediaDeviceFailure2["NotFound"] = "NotFound";
@@ -11697,7 +11713,7 @@ var init_livekit_client_esm = __esm({
         }
       }
     ];
-    version$1 = "2.15.4";
+    version$1 = "2.15.6";
     version = version$1;
     protocolVersion = 16;
     CriticalTimers = class {
@@ -11723,13 +11739,24 @@ var init_livekit_client_esm = __esm({
       VideoQuality2[VideoQuality2["HIGH"] = 2] = "HIGH";
     })(VideoQuality || (VideoQuality = {}));
     Track = class _Track extends eventsExports.EventEmitter {
+      /**
+       * indicates current state of stream, it'll indicate `paused` if the track
+       * has been paused by congestion controller
+       */
+      get streamState() {
+        return this._streamState;
+      }
+      /** @internal */
+      setStreamState(value) {
+        this._streamState = value;
+      }
       constructor(mediaTrack, kind) {
         let loggerOptions = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
         var _a;
         super();
         this.attachedElements = [];
         this.isMuted = false;
-        this.streamState = _Track.StreamState.Active;
+        this._streamState = _Track.StreamState.Active;
         this.isInBackground = false;
         this._currentBitrate = 0;
         this.log = livekitLogger;
@@ -12262,6 +12289,20 @@ var init_livekit_client_esm = __esm({
         room2.localParticipant.on(ParticipantEvent.LocalSenderCreated, (sender, track) => __awaiter(this, void 0, void 0, function* () {
           this.setupE2EESender(track, sender);
         }));
+        room2.localParticipant.on(ParticipantEvent.LocalTrackPublished, (publication) => {
+          if (!isVideoTrack(publication.track) || !isSafariBased()) {
+            return;
+          }
+          const msg = {
+            kind: "updateCodec",
+            data: {
+              trackId: publication.track.mediaStreamID,
+              codec: mimeTypeToVideoCodecString(publication.trackInfo.codecs[0].mimeType),
+              participantIdentity: this.room.localParticipant.identity
+            }
+          };
+          this.worker.postMessage(msg);
+        });
         keyProvider.on(KeyProviderEvent.SetKey, (keyInfo) => this.postKey(keyInfo)).on(KeyProviderEvent.RatchetRequest, (participantId, keyIndex) => this.postRatchetRequest(participantId, keyIndex));
       }
       postRatchetRequest(participantIdentity, keyIndex) {
@@ -12472,7 +12513,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(kind) {
           var _this = this;
           let requestPermissions = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
-          return function* () {
+          return (function* () {
             var _a;
             if (((_a = _DeviceManager.userMediaPromiseMap) === null || _a === void 0 ? void 0 : _a.size) > 0) {
               livekitLogger.debug("awaiting getUserMedia promise");
@@ -12515,7 +12556,7 @@ var init_livekit_client_esm = __esm({
               devices = devices.filter((device) => device.kind === kind);
             }
             return devices;
-          }();
+          })();
         });
       }
       normalizeDeviceId(kind, deviceId, groupId) {
@@ -12796,7 +12837,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function() {
           var _this = this;
           let updateState = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
-          return function* () {
+          return (function* () {
             const unlock = yield _this.closingLock.lock();
             try {
               _this.clearPingInterval();
@@ -12828,7 +12869,7 @@ var init_livekit_client_esm = __esm({
               }
               unlock();
             }
-          }();
+          })();
         });
       }
       // initial offer after joining
@@ -12882,7 +12923,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(metadata, name2) {
           var _this2 = this;
           let attributes = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
-          return function* () {
+          return (function* () {
             const requestId = _this2.getNextRequestId();
             yield _this2.sendRequest({
               case: "updateMetadata",
@@ -12894,7 +12935,7 @@ var init_livekit_client_esm = __esm({
               })
             });
             return requestId;
-          }();
+          })();
         });
       }
       sendUpdateTrackSettings(settings) {
@@ -12974,7 +13015,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(message) {
           var _this3 = this;
           let fromQueue = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
-          return function* () {
+          return (function* () {
             const canQueue = !fromQueue && !canPassThroughQueue(message);
             if (canQueue && _this3.state === SignalConnectionState.RECONNECTING) {
               _this3.queuedRequests.push(() => __awaiter(_this3, void 0, void 0, function* () {
@@ -13010,7 +13051,7 @@ var init_livekit_client_esm = __esm({
                 error: e3
               }));
             }
-          }();
+          })();
         });
       }
       handleSignalResponse(res) {
@@ -14076,7 +14117,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(pcTransport, abortController) {
           var _this = this;
           let timeout = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : this.peerConnectionTimeout;
-          return function* () {
+          return (function* () {
             const connectionState = pcTransport.getConnectionState();
             if (connectionState === "connected") {
               return;
@@ -14106,7 +14147,7 @@ var init_livekit_client_esm = __esm({
               abortController === null || abortController === void 0 ? void 0 : abortController.signal.removeEventListener("abort", abortHandler);
               resolve();
             }));
-          }();
+          })();
         });
       }
     };
@@ -14287,9 +14328,14 @@ var init_livekit_client_esm = __esm({
         this.providedByUser = userProvidedTrack;
         this.muteLock = new _();
         this.pauseUpstreamLock = new _();
-        this.processorLock = new _();
-        this.restartLock = new _();
-        this.setMediaStreamTrack(mediaTrack, true);
+        this.trackChangeLock = new _();
+        this.trackChangeLock.lock().then((unlock) => __awaiter(this, void 0, void 0, function* () {
+          try {
+            yield this.setMediaStreamTrack(mediaTrack, true);
+          } finally {
+            unlock();
+          }
+        }));
         this._constraints = mediaTrack.getConstraints();
         if (constraints) {
           this._constraints = constraints;
@@ -14358,25 +14404,20 @@ var init_livekit_client_esm = __esm({
           }
           let processedTrack;
           if (this.processor && newTrack) {
-            const unlock = yield this.processorLock.lock();
-            try {
-              this.log.debug("restarting processor", this.logContext);
-              if (this.kind === "unknown") {
-                throw TypeError("cannot set processor on track of unknown kind");
-              }
-              if (this.processorElement) {
-                attachToElement(newTrack, this.processorElement);
-                this.processorElement.muted = true;
-              }
-              yield this.processor.restart({
-                track: newTrack,
-                kind: this.kind,
-                element: this.processorElement
-              });
-              processedTrack = this.processor.processedTrack;
-            } finally {
-              unlock();
+            this.log.debug("restarting processor", this.logContext);
+            if (this.kind === "unknown") {
+              throw TypeError("cannot set processor on track of unknown kind");
             }
+            if (this.processorElement) {
+              attachToElement(newTrack, this.processorElement);
+              this.processorElement.muted = true;
+            }
+            yield this.processor.restart({
+              track: newTrack,
+              kind: this.kind,
+              element: this.processorElement
+            });
+            processedTrack = this.processor.processedTrack;
           }
           if (this.sender && ((_a = this.sender.transport) === null || _a === void 0 ? void 0 : _a.state) !== "closed") {
             yield this.sender.replaceTrack(processedTrack !== null && processedTrack !== void 0 ? processedTrack : newTrack);
@@ -14398,7 +14439,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function() {
           var _this = this;
           let timeout = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : DEFAULT_DIMENSIONS_TIMEOUT;
-          return function* () {
+          return (function* () {
             var _a;
             if (_this.kind === Track.Kind.Audio) {
               throw new Error("cannot get dimensions for audio tracks");
@@ -14415,7 +14456,7 @@ var init_livekit_client_esm = __esm({
               yield sleep(50);
             }
             throw new TrackInvalidError("unable to get track dimensions after timeout");
-          }();
+          })();
         });
       }
       setDeviceId(deviceId) {
@@ -14438,7 +14479,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function() {
           var _this2 = this;
           let normalize3 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
-          return function* () {
+          return (function* () {
             if (_this2.source === Track.Source.ScreenShare) {
               return;
             }
@@ -14448,7 +14489,7 @@ var init_livekit_client_esm = __esm({
             } = _this2._mediaStreamTrack.getSettings();
             const kind = _this2.kind === Track.Kind.Audio ? "audioinput" : "videoinput";
             return normalize3 ? DeviceManager.getInstance().normalizeDeviceId(kind, deviceId, groupId) : deviceId;
-          }();
+          })();
         });
       }
       mute() {
@@ -14465,30 +14506,35 @@ var init_livekit_client_esm = __esm({
       }
       replaceTrack(track, userProvidedOrOptions) {
         return __awaiter(this, void 0, void 0, function* () {
-          if (!this.sender) {
-            throw new TrackInvalidError("unable to replace an unpublished track");
-          }
-          let userProvidedTrack;
-          let stopProcessor;
-          if (typeof userProvidedOrOptions === "boolean") {
-            userProvidedTrack = userProvidedOrOptions;
-          } else if (userProvidedOrOptions !== void 0) {
-            userProvidedTrack = userProvidedOrOptions.userProvidedTrack;
-            stopProcessor = userProvidedOrOptions.stopProcessor;
-          }
-          this.providedByUser = userProvidedTrack !== null && userProvidedTrack !== void 0 ? userProvidedTrack : true;
-          this.log.debug("replace MediaStreamTrack", this.logContext);
-          yield this.setMediaStreamTrack(track);
-          if (stopProcessor && this.processor) {
-            yield this.stopProcessor();
+          const unlock = yield this.trackChangeLock.lock();
+          try {
+            if (!this.sender) {
+              throw new TrackInvalidError("unable to replace an unpublished track");
+            }
+            let userProvidedTrack;
+            let stopProcessor;
+            if (typeof userProvidedOrOptions === "boolean") {
+              userProvidedTrack = userProvidedOrOptions;
+            } else if (userProvidedOrOptions !== void 0) {
+              userProvidedTrack = userProvidedOrOptions.userProvidedTrack;
+              stopProcessor = userProvidedOrOptions.stopProcessor;
+            }
+            this.providedByUser = userProvidedTrack !== null && userProvidedTrack !== void 0 ? userProvidedTrack : true;
+            this.log.debug("replace MediaStreamTrack", this.logContext);
+            yield this.setMediaStreamTrack(track);
+            if (stopProcessor && this.processor) {
+              yield this.internalStopProcessor();
+            }
+            return this;
+          } finally {
+            unlock();
           }
-          return this;
         });
       }
       restart(constraints) {
         return __awaiter(this, void 0, void 0, function* () {
           this.manuallyStopped = false;
-          const unlock = yield this.restartLock.lock();
+          const unlock = yield this.trackChangeLock.lock();
           try {
             if (!constraints) {
               constraints = this._constraints;
@@ -14510,9 +14556,9 @@ var init_livekit_client_esm = __esm({
                 facingMode
               } : true;
             } else {
-              streamConstraints.audio = deviceId ? {
+              streamConstraints.audio = deviceId ? Object.assign({
                 deviceId
-              } : true;
+              }, otherConstraints) : true;
             }
             this.attachedElements.forEach((el) => {
               detachTrack(this.mediaStreamTrack, el);
@@ -14521,7 +14567,9 @@ var init_livekit_client_esm = __esm({
             this._mediaStreamTrack.stop();
             const mediaStream = yield navigator.mediaDevices.getUserMedia(streamConstraints);
             const newTrack = mediaStream.getTracks()[0];
-            yield newTrack.applyConstraints(otherConstraints);
+            if (this.kind === Track.Kind.Video) {
+              yield newTrack.applyConstraints(otherConstraints);
+            }
             newTrack.addEventListener("ended", this.handleEnded);
             this.log.debug("re-acquired MediaStreamTrack", this.logContext);
             yield this.setMediaStreamTrack(newTrack);
@@ -14660,9 +14708,9 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(processor) {
           var _this3 = this;
           let showProcessedStreamLocally = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
-          return function* () {
+          return (function* () {
             var _a;
-            const unlock = yield _this3.processorLock.lock();
+            const unlock = yield _this3.trackChangeLock.lock();
             try {
               _this3.log.debug("setting up processor", _this3.logContext);
               const processorElement = document.createElement(_this3.kind);
@@ -14675,7 +14723,7 @@ var init_livekit_client_esm = __esm({
               yield processor.init(processorOptions);
               _this3.log.debug("processor initialized", _this3.logContext);
               if (_this3.processor) {
-                yield _this3.stopProcessor();
+                yield _this3.internalStopProcessor();
               }
               if (_this3.kind === "unknown") {
                 throw TypeError("cannot set processor on track of unknown kind");
@@ -14715,7 +14763,7 @@ var init_livekit_client_esm = __esm({
             } finally {
               unlock();
             }
-          }();
+          })();
         });
       }
       getProcessor() {
@@ -14732,21 +14780,40 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function() {
           var _this4 = this;
           let keepElement = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
-          return function* () {
+          return (function* () {
+            const unlock = yield _this4.trackChangeLock.lock();
+            try {
+              yield _this4.internalStopProcessor(keepElement);
+            } finally {
+              unlock();
+            }
+          })();
+        });
+      }
+      /**
+       * @internal
+       * This method assumes the caller has acquired a trackChangeLock already.
+       * The public facing method for stopping the processor is `stopProcessor` and it wraps this method in the trackChangeLock.
+       */
+      internalStopProcessor() {
+        return __awaiter(this, arguments, void 0, function() {
+          var _this5 = this;
+          let keepElement = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
+          return (function* () {
             var _a, _b;
-            if (!_this4.processor) return;
-            _this4.log.debug("stopping processor", _this4.logContext);
-            (_a = _this4.processor.processedTrack) === null || _a === void 0 ? void 0 : _a.stop();
-            yield _this4.processor.destroy();
-            _this4.processor = void 0;
+            if (!_this5.processor) return;
+            _this5.log.debug("stopping processor", _this5.logContext);
+            (_a = _this5.processor.processedTrack) === null || _a === void 0 ? void 0 : _a.stop();
+            yield _this5.processor.destroy();
+            _this5.processor = void 0;
             if (!keepElement) {
-              (_b = _this4.processorElement) === null || _b === void 0 ? void 0 : _b.remove();
-              _this4.processorElement = void 0;
+              (_b = _this5.processorElement) === null || _b === void 0 ? void 0 : _b.remove();
+              _this5.processorElement = void 0;
             }
-            yield _this4._mediaStreamTrack.applyConstraints(_this4._constraints);
-            yield _this4.setMediaStreamTrack(_this4._mediaStreamTrack, true);
-            _this4.emit(TrackEvent.TrackProcessorUpdate);
-          }();
+            yield _this5._mediaStreamTrack.applyConstraints(_this5._constraints);
+            yield _this5.setMediaStreamTrack(_this5._mediaStreamTrack, true);
+            _this5.emit(TrackEvent.TrackProcessorUpdate);
+          })();
         });
       }
       /** @internal */
@@ -14934,13 +15001,13 @@ var init_livekit_client_esm = __esm({
       setProcessor(processor) {
         return __awaiter(this, void 0, void 0, function* () {
           var _a;
-          const unlock = yield this.processorLock.lock();
+          const unlock = yield this.trackChangeLock.lock();
           try {
             if (!isReactNative() && !this.audioContext) {
               throw Error("Audio context needs to be set on LocalAudioTrack in order to enable processors");
             }
             if (this.processor) {
-              yield this.stopProcessor();
+              yield this.internalStopProcessor();
             }
             const processorOptions = {
               kind: this.kind,
@@ -15355,7 +15422,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(processor) {
           var _this = this;
           let showProcessedStreamLocally = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
-          return function* () {
+          return (function* () {
             var _a, e_4, _b, _c;
             var _d, _e;
             yield _super.setProcessor.call(_this, processor, showProcessedStreamLocally);
@@ -15379,7 +15446,7 @@ var init_livekit_client_esm = __esm({
                 }
               }
             }
-          }();
+          })();
         });
       }
       setDegradationPreference(preference) {
@@ -15603,7 +15670,7 @@ var init_livekit_client_esm = __esm({
           let {
             channel
           } = _ref;
-          return function* () {
+          return (function* () {
             if (!channel) {
               return;
             }
@@ -15616,7 +15683,7 @@ var init_livekit_client_esm = __esm({
             }
             _this.log.debug("on data channel ".concat(channel.id, ", ").concat(channel.label), _this.logContext);
             channel.onmessage = _this.handleDataMessage;
-          }();
+          })();
         });
         this.handleDataMessage = (message) => __awaiter(this, void 0, void 0, function* () {
           var _a2, _b;
@@ -16499,7 +16566,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(kind) {
           var _this2 = this;
           let subscriber = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : this.subscriberPrimary;
-          return function* () {
+          return (function* () {
             var _a;
             if (!_this2.pcManager) {
               throw new UnexpectedConnectionState("PC manager is closed");
@@ -16532,7 +16599,7 @@ var init_livekit_client_esm = __esm({
               yield sleep(50);
             }
             throw new ConnectionError("could not establish ".concat(transportName, " connection, state: ").concat(transport.getICEConnectionState()), ConnectionErrorReason.InternalError);
-          }();
+          })();
         });
       }
       ensurePublisherConnected(kind) {
@@ -16775,30 +16842,72 @@ var init_livekit_client_esm = __esm({
       get info() {
         return this._info;
       }
-      constructor(info, stream, totalByteSize) {
+      /** @internal */
+      validateBytesReceived() {
+        let doneReceiving = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
+        if (typeof this.totalByteSize !== "number" || this.totalByteSize === 0) {
+          return;
+        }
+        if (doneReceiving && this.bytesReceived < this.totalByteSize) {
+          throw new DataStreamError("Not enough chunk(s) received - expected ".concat(this.totalByteSize, " bytes of data total, only received ").concat(this.bytesReceived, " bytes"), DataStreamErrorReason.Incomplete);
+        } else if (this.bytesReceived > this.totalByteSize) {
+          throw new DataStreamError("Extra chunk(s) received - expected ".concat(this.totalByteSize, " bytes of data total, received ").concat(this.bytesReceived, " bytes"), DataStreamErrorReason.LengthExceeded);
+        }
+      }
+      constructor(info, stream, totalByteSize, outOfBandFailureRejectingFuture) {
         this.reader = stream;
         this.totalByteSize = totalByteSize;
         this._info = info;
         this.bytesReceived = 0;
+        this.outOfBandFailureRejectingFuture = outOfBandFailureRejectingFuture;
       }
     };
     ByteStreamReader = class extends BaseStreamReader {
       handleChunkReceived(chunk) {
         var _a;
         this.bytesReceived += chunk.content.byteLength;
+        this.validateBytesReceived();
         const currentProgress = this.totalByteSize ? this.bytesReceived / this.totalByteSize : void 0;
         (_a = this.onProgress) === null || _a === void 0 ? void 0 : _a.call(this, currentProgress);
       }
       [Symbol.asyncIterator]() {
         const reader = this.reader.getReader();
+        let rejectingSignalFuture = new Future();
+        let activeSignal = null;
+        let onAbort = null;
+        if (this.signal) {
+          const signal = this.signal;
+          onAbort = () => {
+            var _a;
+            (_a = rejectingSignalFuture.reject) === null || _a === void 0 ? void 0 : _a.call(rejectingSignalFuture, signal.reason);
+          };
+          signal.addEventListener("abort", onAbort);
+          activeSignal = signal;
+        }
+        const cleanup = () => {
+          reader.releaseLock();
+          if (activeSignal && onAbort) {
+            activeSignal.removeEventListener("abort", onAbort);
+          }
+          this.signal = void 0;
+        };
         return {
           next: () => __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
             try {
               const {
                 done,
                 value
-              } = yield reader.read();
+              } = yield Promise.race([
+                reader.read(),
+                // Rejects if this.signal is aborted
+                rejectingSignalFuture.promise,
+                // Rejects if something external says it should, like a participant disconnecting, etc
+                (_b = (_a = this.outOfBandFailureRejectingFuture) === null || _a === void 0 ? void 0 : _a.promise) !== null && _b !== void 0 ? _b : new Promise(() => {
+                })
+              ]);
               if (done) {
+                this.validateBytesReceived(true);
                 return {
                   done: true,
                   value: void 0
@@ -16810,16 +16919,16 @@ var init_livekit_client_esm = __esm({
                   value: value.content
                 };
               }
-            } catch (error) {
-              return {
-                done: true,
-                value: void 0
-              };
+            } catch (err) {
+              cleanup();
+              throw err;
             }
           }),
+          // note: `return` runs only for premature exits, see:
+          // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#errors_during_iteration
           return() {
             return __awaiter(this, void 0, void 0, function* () {
-              reader.releaseLock();
+              cleanup();
               return {
                 done: true,
                 value: void 0
@@ -16828,29 +16937,45 @@ var init_livekit_client_esm = __esm({
           }
         };
       }
+      /**
+       * Injects an AbortSignal, which if aborted, will terminate the currently active
+       * stream iteration operation.
+       *
+       * Note that when using AbortSignal.timeout(...), the timeout applies across
+       * the whole iteration operation, not just one individual chunk read.
+       */
+      withAbortSignal(signal) {
+        this.signal = signal;
+        return this;
+      }
       readAll() {
-        return __awaiter(this, void 0, void 0, function* () {
-          var _a, e_1, _b, _c;
-          let chunks = /* @__PURE__ */ new Set();
-          try {
-            for (var _d = true, _e = __asyncValues(this), _f; _f = yield _e.next(), _a = _f.done, !_a; _d = true) {
-              _c = _f.value;
-              _d = false;
-              const chunk = _c;
-              chunks.add(chunk);
-            }
-          } catch (e_1_1) {
-            e_1 = {
-              error: e_1_1
-            };
-          } finally {
+        return __awaiter(this, arguments, void 0, function() {
+          var _this = this;
+          let opts = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
+          return (function* () {
+            var _a, e_1, _b, _c;
+            let chunks = /* @__PURE__ */ new Set();
+            const iterator = opts.signal ? _this.withAbortSignal(opts.signal) : _this;
             try {
-              if (!_d && !_a && (_b = _e.return)) yield _b.call(_e);
+              for (var _d = true, iterator_1 = __asyncValues(iterator), iterator_1_1; iterator_1_1 = yield iterator_1.next(), _a = iterator_1_1.done, !_a; _d = true) {
+                _c = iterator_1_1.value;
+                _d = false;
+                const chunk = _c;
+                chunks.add(chunk);
+              }
+            } catch (e_1_1) {
+              e_1 = {
+                error: e_1_1
+              };
             } finally {
-              if (e_1) throw e_1.error;
+              try {
+                if (!_d && !_a && (_b = iterator_1.return)) yield _b.call(iterator_1);
+              } finally {
+                if (e_1) throw e_1.error;
+              }
             }
-          }
-          return Array.from(chunks);
+            return Array.from(chunks);
+          })();
         });
       }
     };
@@ -16859,8 +16984,8 @@ var init_livekit_client_esm = __esm({
        * A TextStreamReader instance can be used as an AsyncIterator that returns the entire string
        * that has been received up to the current point in time.
        */
-      constructor(info, stream, totalChunkCount) {
-        super(info, stream, totalChunkCount);
+      constructor(info, stream, totalChunkCount, outOfBandFailureRejectingFuture) {
+        super(info, stream, totalChunkCount, outOfBandFailureRejectingFuture);
         this.receivedChunks = /* @__PURE__ */ new Map();
       }
       handleChunkReceived(chunk) {
@@ -16872,6 +16997,7 @@ var init_livekit_client_esm = __esm({
         }
         this.receivedChunks.set(index2, chunk);
         this.bytesReceived += chunk.content.byteLength;
+        this.validateBytesReceived();
         const currentProgress = this.totalByteSize ? this.bytesReceived / this.totalByteSize : void 0;
         (_a = this.onProgress) === null || _a === void 0 ? void 0 : _a.call(this, currentProgress);
       }
@@ -16882,36 +17008,72 @@ var init_livekit_client_esm = __esm({
        */
       [Symbol.asyncIterator]() {
         const reader = this.reader.getReader();
-        const decoder = new TextDecoder();
+        const decoder = new TextDecoder("utf-8", {
+          fatal: true
+        });
+        let rejectingSignalFuture = new Future();
+        let activeSignal = null;
+        let onAbort = null;
+        if (this.signal) {
+          const signal = this.signal;
+          onAbort = () => {
+            var _a;
+            (_a = rejectingSignalFuture.reject) === null || _a === void 0 ? void 0 : _a.call(rejectingSignalFuture, signal.reason);
+          };
+          signal.addEventListener("abort", onAbort);
+          activeSignal = signal;
+        }
+        const cleanup = () => {
+          reader.releaseLock();
+          if (activeSignal && onAbort) {
+            activeSignal.removeEventListener("abort", onAbort);
+          }
+          this.signal = void 0;
+        };
         return {
           next: () => __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
             try {
               const {
                 done,
                 value
-              } = yield reader.read();
+              } = yield Promise.race([
+                reader.read(),
+                // Rejects if this.signal is aborted
+                rejectingSignalFuture.promise,
+                // Rejects if something external says it should, like a participant disconnecting, etc
+                (_b = (_a = this.outOfBandFailureRejectingFuture) === null || _a === void 0 ? void 0 : _a.promise) !== null && _b !== void 0 ? _b : new Promise(() => {
+                })
+              ]);
               if (done) {
+                this.validateBytesReceived(true);
                 return {
                   done: true,
                   value: void 0
                 };
               } else {
                 this.handleChunkReceived(value);
+                let decodedResult;
+                try {
+                  decodedResult = decoder.decode(value.content);
+                } catch (err) {
+                  throw new DataStreamError("Cannot decode datastream chunk ".concat(value.chunkIndex, " as text: ").concat(err), DataStreamErrorReason.DecodeFailed);
+                }
                 return {
                   done: false,
-                  value: decoder.decode(value.content)
+                  value: decodedResult
                 };
               }
-            } catch (error) {
-              return {
-                done: true,
-                value: void 0
-              };
+            } catch (err) {
+              cleanup();
+              throw err;
             }
           }),
+          // note: `return` runs only for premature exits, see:
+          // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#errors_during_iteration
           return() {
             return __awaiter(this, void 0, void 0, function* () {
-              reader.releaseLock();
+              cleanup();
               return {
                 done: true,
                 value: void 0
@@ -16920,31 +17082,215 @@ var init_livekit_client_esm = __esm({
           }
         };
       }
+      /**
+       * Injects an AbortSignal, which if aborted, will terminate the currently active
+       * stream iteration operation.
+       *
+       * Note that when using AbortSignal.timeout(...), the timeout applies across
+       * the whole iteration operation, not just one individual chunk read.
+       */
+      withAbortSignal(signal) {
+        this.signal = signal;
+        return this;
+      }
       readAll() {
+        return __awaiter(this, arguments, void 0, function() {
+          var _this2 = this;
+          let opts = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
+          return (function* () {
+            var _a, e_2, _b, _c;
+            let finalString = "";
+            const iterator = opts.signal ? _this2.withAbortSignal(opts.signal) : _this2;
+            try {
+              for (var _d = true, iterator_2 = __asyncValues(iterator), iterator_2_1; iterator_2_1 = yield iterator_2.next(), _a = iterator_2_1.done, !_a; _d = true) {
+                _c = iterator_2_1.value;
+                _d = false;
+                const chunk = _c;
+                finalString += chunk;
+              }
+            } catch (e_2_1) {
+              e_2 = {
+                error: e_2_1
+              };
+            } finally {
+              try {
+                if (!_d && !_a && (_b = iterator_2.return)) yield _b.call(iterator_2);
+              } finally {
+                if (e_2) throw e_2.error;
+              }
+            }
+            return finalString;
+          })();
+        });
+      }
+    };
+    IncomingDataStreamManager = class {
+      constructor() {
+        this.log = livekitLogger;
+        this.byteStreamControllers = /* @__PURE__ */ new Map();
+        this.textStreamControllers = /* @__PURE__ */ new Map();
+        this.byteStreamHandlers = /* @__PURE__ */ new Map();
+        this.textStreamHandlers = /* @__PURE__ */ new Map();
+      }
+      registerTextStreamHandler(topic, callback) {
+        if (this.textStreamHandlers.has(topic)) {
+          throw new DataStreamError('A text stream handler for topic "'.concat(topic, '" has already been set.'), DataStreamErrorReason.HandlerAlreadyRegistered);
+        }
+        this.textStreamHandlers.set(topic, callback);
+      }
+      unregisterTextStreamHandler(topic) {
+        this.textStreamHandlers.delete(topic);
+      }
+      registerByteStreamHandler(topic, callback) {
+        if (this.byteStreamHandlers.has(topic)) {
+          throw new DataStreamError('A byte stream handler for topic "'.concat(topic, '" has already been set.'), DataStreamErrorReason.HandlerAlreadyRegistered);
+        }
+        this.byteStreamHandlers.set(topic, callback);
+      }
+      unregisterByteStreamHandler(topic) {
+        this.byteStreamHandlers.delete(topic);
+      }
+      clearHandlersAndControllers() {
+        this.byteStreamControllers.clear();
+        this.textStreamControllers.clear();
+        this.byteStreamHandlers.clear();
+        this.textStreamHandlers.clear();
+      }
+      validateParticipantHasNoActiveDataStreams(participantIdentity) {
+        var _a, _b, _c, _d;
+        const textStreamsBeingSentByDisconnectingParticipant = Array.from(this.textStreamControllers.entries()).filter((entry) => entry[1].sendingParticipantIdentity === participantIdentity);
+        const byteStreamsBeingSentByDisconnectingParticipant = Array.from(this.byteStreamControllers.entries()).filter((entry) => entry[1].sendingParticipantIdentity === participantIdentity);
+        if (textStreamsBeingSentByDisconnectingParticipant.length > 0 || byteStreamsBeingSentByDisconnectingParticipant.length > 0) {
+          const abnormalEndError = new DataStreamError("Participant ".concat(participantIdentity, " unexpectedly disconnected in the middle of sending data"), DataStreamErrorReason.AbnormalEnd);
+          for (const [id, controller] of byteStreamsBeingSentByDisconnectingParticipant) {
+            (_b = (_a = controller.outOfBandFailureRejectingFuture).reject) === null || _b === void 0 ? void 0 : _b.call(_a, abnormalEndError);
+            this.byteStreamControllers.delete(id);
+          }
+          for (const [id, controller] of textStreamsBeingSentByDisconnectingParticipant) {
+            (_d = (_c = controller.outOfBandFailureRejectingFuture).reject) === null || _d === void 0 ? void 0 : _d.call(_c, abnormalEndError);
+            this.textStreamControllers.delete(id);
+          }
+        }
+      }
+      handleDataStreamPacket(packet) {
         return __awaiter(this, void 0, void 0, function* () {
-          var _a, e_2, _b, _c;
-          let finalString = "";
-          try {
-            for (var _d = true, _e = __asyncValues(this), _f; _f = yield _e.next(), _a = _f.done, !_a; _d = true) {
-              _c = _f.value;
-              _d = false;
-              const chunk = _c;
-              finalString += chunk;
+          switch (packet.value.case) {
+            case "streamHeader":
+              return this.handleStreamHeader(packet.value.value, packet.participantIdentity);
+            case "streamChunk":
+              return this.handleStreamChunk(packet.value.value);
+            case "streamTrailer":
+              return this.handleStreamTrailer(packet.value.value);
+            default:
+              throw new Error('DataPacket of value "'.concat(packet.value.case, '" is not data stream related!'));
+          }
+        });
+      }
+      handleStreamHeader(streamHeader, participantIdentity) {
+        return __awaiter(this, void 0, void 0, function* () {
+          var _a;
+          if (streamHeader.contentHeader.case === "byteHeader") {
+            const streamHandlerCallback = this.byteStreamHandlers.get(streamHeader.topic);
+            if (!streamHandlerCallback) {
+              this.log.debug("ignoring incoming byte stream due to no handler for topic", streamHeader.topic);
+              return;
             }
-          } catch (e_2_1) {
-            e_2 = {
-              error: e_2_1
+            let streamController;
+            const outOfBandFailureRejectingFuture = new Future();
+            const info = {
+              id: streamHeader.streamId,
+              name: (_a = streamHeader.contentHeader.value.name) !== null && _a !== void 0 ? _a : "unknown",
+              mimeType: streamHeader.mimeType,
+              size: streamHeader.totalLength ? Number(streamHeader.totalLength) : void 0,
+              topic: streamHeader.topic,
+              timestamp: bigIntToNumber(streamHeader.timestamp),
+              attributes: streamHeader.attributes
             };
-          } finally {
-            try {
-              if (!_d && !_a && (_b = _e.return)) yield _b.call(_e);
-            } finally {
-              if (e_2) throw e_2.error;
+            const stream = new ReadableStream({
+              start: (controller) => {
+                streamController = controller;
+                if (this.textStreamControllers.has(streamHeader.streamId)) {
+                  throw new DataStreamError("A data stream read is already in progress for a stream with id ".concat(streamHeader.streamId, "."), DataStreamErrorReason.AlreadyOpened);
+                }
+                this.byteStreamControllers.set(streamHeader.streamId, {
+                  info,
+                  controller: streamController,
+                  startTime: Date.now(),
+                  sendingParticipantIdentity: participantIdentity,
+                  outOfBandFailureRejectingFuture
+                });
+              }
+            });
+            streamHandlerCallback(new ByteStreamReader(info, stream, bigIntToNumber(streamHeader.totalLength), outOfBandFailureRejectingFuture), {
+              identity: participantIdentity
+            });
+          } else if (streamHeader.contentHeader.case === "textHeader") {
+            const streamHandlerCallback = this.textStreamHandlers.get(streamHeader.topic);
+            if (!streamHandlerCallback) {
+              this.log.debug("ignoring incoming text stream due to no handler for topic", streamHeader.topic);
+              return;
             }
+            let streamController;
+            const outOfBandFailureRejectingFuture = new Future();
+            const info = {
+              id: streamHeader.streamId,
+              mimeType: streamHeader.mimeType,
+              size: streamHeader.totalLength ? Number(streamHeader.totalLength) : void 0,
+              topic: streamHeader.topic,
+              timestamp: Number(streamHeader.timestamp),
+              attributes: streamHeader.attributes
+            };
+            const stream = new ReadableStream({
+              start: (controller) => {
+                streamController = controller;
+                if (this.textStreamControllers.has(streamHeader.streamId)) {
+                  throw new DataStreamError("A data stream read is already in progress for a stream with id ".concat(streamHeader.streamId, "."), DataStreamErrorReason.AlreadyOpened);
+                }
+                this.textStreamControllers.set(streamHeader.streamId, {
+                  info,
+                  controller: streamController,
+                  startTime: Date.now(),
+                  sendingParticipantIdentity: participantIdentity,
+                  outOfBandFailureRejectingFuture
+                });
+              }
+            });
+            streamHandlerCallback(new TextStreamReader(info, stream, bigIntToNumber(streamHeader.totalLength), outOfBandFailureRejectingFuture), {
+              identity: participantIdentity
+            });
           }
-          return finalString;
         });
       }
+      handleStreamChunk(chunk) {
+        const fileBuffer = this.byteStreamControllers.get(chunk.streamId);
+        if (fileBuffer) {
+          if (chunk.content.length > 0) {
+            fileBuffer.controller.enqueue(chunk);
+          }
+        }
+        const textBuffer = this.textStreamControllers.get(chunk.streamId);
+        if (textBuffer) {
+          if (chunk.content.length > 0) {
+            textBuffer.controller.enqueue(chunk);
+          }
+        }
+      }
+      handleStreamTrailer(trailer) {
+        const textBuffer = this.textStreamControllers.get(trailer.streamId);
+        if (textBuffer) {
+          textBuffer.info.attributes = Object.assign(Object.assign({}, textBuffer.info.attributes), trailer.attributes);
+          textBuffer.controller.close();
+          this.textStreamControllers.delete(trailer.streamId);
+        }
+        const fileBuffer = this.byteStreamControllers.get(trailer.streamId);
+        if (fileBuffer) {
+          {
+            fileBuffer.info.attributes = Object.assign(Object.assign({}, fileBuffer.info.attributes), trailer.attributes);
+            fileBuffer.controller.close();
+            this.byteStreamControllers.delete(trailer.streamId);
+          }
+        }
+      }
     };
     BaseStreamWriter = class {
       constructor(writableStream, info, onClose) {
@@ -16969,6 +17315,277 @@ var init_livekit_client_esm = __esm({
     };
     ByteStreamWriter = class extends BaseStreamWriter {
     };
+    STREAM_CHUNK_SIZE = 15e3;
+    OutgoingDataStreamManager = class {
+      constructor(engine, log2) {
+        this.engine = engine;
+        this.log = log2;
+      }
+      setupEngine(engine) {
+        this.engine = engine;
+      }
+      /** {@inheritDoc LocalParticipant.sendText} */
+      sendText(text7, options) {
+        return __awaiter(this, void 0, void 0, function* () {
+          var _a;
+          const streamId = crypto.randomUUID();
+          const textInBytes = new TextEncoder().encode(text7);
+          const totalTextLength = textInBytes.byteLength;
+          const fileIds = (_a = options === null || options === void 0 ? void 0 : options.attachments) === null || _a === void 0 ? void 0 : _a.map(() => crypto.randomUUID());
+          const progresses = new Array(fileIds ? fileIds.length + 1 : 1).fill(0);
+          const handleProgress = (progress, idx) => {
+            var _a2;
+            progresses[idx] = progress;
+            const totalProgress = progresses.reduce((acc, val) => acc + val, 0);
+            (_a2 = options === null || options === void 0 ? void 0 : options.onProgress) === null || _a2 === void 0 ? void 0 : _a2.call(options, totalProgress);
+          };
+          const writer2 = yield this.streamText({
+            streamId,
+            totalSize: totalTextLength,
+            destinationIdentities: options === null || options === void 0 ? void 0 : options.destinationIdentities,
+            topic: options === null || options === void 0 ? void 0 : options.topic,
+            attachedStreamIds: fileIds,
+            attributes: options === null || options === void 0 ? void 0 : options.attributes
+          });
+          yield writer2.write(text7);
+          handleProgress(1, 0);
+          yield writer2.close();
+          if ((options === null || options === void 0 ? void 0 : options.attachments) && fileIds) {
+            yield Promise.all(options.attachments.map((file, idx) => __awaiter(this, void 0, void 0, function* () {
+              return this._sendFile(fileIds[idx], file, {
+                topic: options.topic,
+                mimeType: file.type,
+                onProgress: (progress) => {
+                  handleProgress(progress, idx + 1);
+                }
+              });
+            })));
+          }
+          return writer2.info;
+        });
+      }
+      /**
+       * @internal
+       * @experimental CAUTION, might get removed in a minor release
+       */
+      streamText(options) {
+        return __awaiter(this, void 0, void 0, function* () {
+          var _a, _b;
+          const streamId = (_a = options === null || options === void 0 ? void 0 : options.streamId) !== null && _a !== void 0 ? _a : crypto.randomUUID();
+          const info = {
+            id: streamId,
+            mimeType: "text/plain",
+            timestamp: Date.now(),
+            topic: (_b = options === null || options === void 0 ? void 0 : options.topic) !== null && _b !== void 0 ? _b : "",
+            size: options === null || options === void 0 ? void 0 : options.totalSize,
+            attributes: options === null || options === void 0 ? void 0 : options.attributes
+          };
+          const header = new DataStream_Header({
+            streamId,
+            mimeType: info.mimeType,
+            topic: info.topic,
+            timestamp: numberToBigInt(info.timestamp),
+            totalLength: numberToBigInt(options === null || options === void 0 ? void 0 : options.totalSize),
+            attributes: info.attributes,
+            contentHeader: {
+              case: "textHeader",
+              value: new DataStream_TextHeader({
+                version: options === null || options === void 0 ? void 0 : options.version,
+                attachedStreamIds: options === null || options === void 0 ? void 0 : options.attachedStreamIds,
+                replyToStreamId: options === null || options === void 0 ? void 0 : options.replyToStreamId,
+                operationType: (options === null || options === void 0 ? void 0 : options.type) === "update" ? DataStream_OperationType.UPDATE : DataStream_OperationType.CREATE
+              })
+            }
+          });
+          const destinationIdentities = options === null || options === void 0 ? void 0 : options.destinationIdentities;
+          const packet = new DataPacket({
+            destinationIdentities,
+            value: {
+              case: "streamHeader",
+              value: header
+            }
+          });
+          yield this.engine.sendDataPacket(packet, DataPacket_Kind.RELIABLE);
+          let chunkId = 0;
+          const engine = this.engine;
+          const writableStream = new WritableStream({
+            // Implement the sink
+            write(text7) {
+              return __awaiter(this, void 0, void 0, function* () {
+                for (const textByteChunk of splitUtf8(text7, STREAM_CHUNK_SIZE)) {
+                  yield engine.waitForBufferStatusLow(DataPacket_Kind.RELIABLE);
+                  const chunk = new DataStream_Chunk({
+                    content: textByteChunk,
+                    streamId,
+                    chunkIndex: numberToBigInt(chunkId)
+                  });
+                  const chunkPacket = new DataPacket({
+                    destinationIdentities,
+                    value: {
+                      case: "streamChunk",
+                      value: chunk
+                    }
+                  });
+                  yield engine.sendDataPacket(chunkPacket, DataPacket_Kind.RELIABLE);
+                  chunkId += 1;
+                }
+              });
+            },
+            close() {
+              return __awaiter(this, void 0, void 0, function* () {
+                const trailer = new DataStream_Trailer({
+                  streamId
+                });
+                const trailerPacket = new DataPacket({
+                  destinationIdentities,
+                  value: {
+                    case: "streamTrailer",
+                    value: trailer
+                  }
+                });
+                yield engine.sendDataPacket(trailerPacket, DataPacket_Kind.RELIABLE);
+              });
+            },
+            abort(err) {
+              console.log("Sink error:", err);
+            }
+          });
+          let onEngineClose = () => __awaiter(this, void 0, void 0, function* () {
+            yield writer2.close();
+          });
+          engine.once(EngineEvent.Closing, onEngineClose);
+          const writer2 = new TextStreamWriter(writableStream, info, () => this.engine.off(EngineEvent.Closing, onEngineClose));
+          return writer2;
+        });
+      }
+      sendFile(file, options) {
+        return __awaiter(this, void 0, void 0, function* () {
+          const streamId = crypto.randomUUID();
+          yield this._sendFile(streamId, file, options);
+          return {
+            id: streamId
+          };
+        });
+      }
+      _sendFile(streamId, file, options) {
+        return __awaiter(this, void 0, void 0, function* () {
+          var _a;
+          const writer2 = yield this.streamBytes({
+            streamId,
+            totalSize: file.size,
+            name: file.name,
+            mimeType: (_a = options === null || options === void 0 ? void 0 : options.mimeType) !== null && _a !== void 0 ? _a : file.type,
+            topic: options === null || options === void 0 ? void 0 : options.topic,
+            destinationIdentities: options === null || options === void 0 ? void 0 : options.destinationIdentities
+          });
+          const reader = file.stream().getReader();
+          while (true) {
+            const {
+              done,
+              value
+            } = yield reader.read();
+            if (done) {
+              break;
+            }
+            yield writer2.write(value);
+          }
+          yield writer2.close();
+          return writer2.info;
+        });
+      }
+      streamBytes(options) {
+        return __awaiter(this, void 0, void 0, function* () {
+          var _a, _b, _c, _d, _e;
+          const streamId = (_a = options === null || options === void 0 ? void 0 : options.streamId) !== null && _a !== void 0 ? _a : crypto.randomUUID();
+          const destinationIdentities = options === null || options === void 0 ? void 0 : options.destinationIdentities;
+          const info = {
+            id: streamId,
+            mimeType: (_b = options === null || options === void 0 ? void 0 : options.mimeType) !== null && _b !== void 0 ? _b : "application/octet-stream",
+            topic: (_c = options === null || options === void 0 ? void 0 : options.topic) !== null && _c !== void 0 ? _c : "",
+            timestamp: Date.now(),
+            attributes: options === null || options === void 0 ? void 0 : options.attributes,
+            size: options === null || options === void 0 ? void 0 : options.totalSize,
+            name: (_d = options === null || options === void 0 ? void 0 : options.name) !== null && _d !== void 0 ? _d : "unknown"
+          };
+          const header = new DataStream_Header({
+            totalLength: numberToBigInt((_e = info.size) !== null && _e !== void 0 ? _e : 0),
+            mimeType: info.mimeType,
+            streamId,
+            topic: info.topic,
+            timestamp: numberToBigInt(Date.now()),
+            attributes: info.attributes,
+            contentHeader: {
+              case: "byteHeader",
+              value: new DataStream_ByteHeader({
+                name: info.name
+              })
+            }
+          });
+          const packet = new DataPacket({
+            destinationIdentities,
+            value: {
+              case: "streamHeader",
+              value: header
+            }
+          });
+          yield this.engine.sendDataPacket(packet, DataPacket_Kind.RELIABLE);
+          let chunkId = 0;
+          const writeMutex = new _();
+          const engine = this.engine;
+          const logLocal = this.log;
+          const writableStream = new WritableStream({
+            write(chunk) {
+              return __awaiter(this, void 0, void 0, function* () {
+                const unlock = yield writeMutex.lock();
+                let byteOffset = 0;
+                try {
+                  while (byteOffset < chunk.byteLength) {
+                    const subChunk = chunk.slice(byteOffset, byteOffset + STREAM_CHUNK_SIZE);
+                    yield engine.waitForBufferStatusLow(DataPacket_Kind.RELIABLE);
+                    const chunkPacket = new DataPacket({
+                      destinationIdentities,
+                      value: {
+                        case: "streamChunk",
+                        value: new DataStream_Chunk({
+                          content: subChunk,
+                          streamId,
+                          chunkIndex: numberToBigInt(chunkId)
+                        })
+                      }
+                    });
+                    yield engine.sendDataPacket(chunkPacket, DataPacket_Kind.RELIABLE);
+                    chunkId += 1;
+                    byteOffset += subChunk.byteLength;
+                  }
+                } finally {
+                  unlock();
+                }
+              });
+            },
+            close() {
+              return __awaiter(this, void 0, void 0, function* () {
+                const trailer = new DataStream_Trailer({
+                  streamId
+                });
+                const trailerPacket = new DataPacket({
+                  destinationIdentities,
+                  value: {
+                    case: "streamTrailer",
+                    value: trailer
+                  }
+                });
+                yield engine.sendDataPacket(trailerPacket, DataPacket_Kind.RELIABLE);
+              });
+            },
+            abort(err) {
+              logLocal.error("Sink error:", err);
+            }
+          });
+          const byteWriter = new ByteStreamWriter(writableStream, info);
+          return byteWriter;
+        });
+      }
+    };
     RemoteTrack = class extends Track {
       constructor(mediaTrack, sid, kind, receiver, loggerOptions) {
         super(mediaTrack, kind, loggerOptions);
@@ -17304,6 +17921,13 @@ var init_livekit_client_esm = __esm({
       get isAdaptiveStream() {
         return this.adaptiveStreamSettings !== void 0;
       }
+      setStreamState(value) {
+        super.setStreamState(value);
+        console.log("setStreamState", value);
+        if (value === Track.StreamState.Active) {
+          this.updateVisibility();
+        }
+      }
       /**
        * Note: When using adaptiveStream, you need to use remoteVideoTrack.attach() to add the track to a HTMLVideoElement, otherwise your video tracks might never start
        */
@@ -17447,13 +18071,13 @@ var init_livekit_client_esm = __esm({
           this.updateVisibility();
         });
       }
-      updateVisibility() {
+      updateVisibility(forceEmit) {
         var _a, _b;
         const lastVisibilityChange = this.elementInfos.reduce((prev, info) => Math.max(prev, info.visibilityChangedAt || 0), 0);
         const backgroundPause = ((_b = (_a = this.adaptiveStreamSettings) === null || _a === void 0 ? void 0 : _a.pauseVideoInBackground) !== null && _b !== void 0 ? _b : true) ? this.isInBackground : false;
         const isPiPMode = this.elementInfos.some((info) => info.pictureInPicture);
         const isVisible = this.elementInfos.some((info) => info.visible) && !backgroundPause || isPiPMode;
-        if (this.lastVisible === isVisible) {
+        if (this.lastVisible === isVisible && !forceEmit) {
           return;
         }
         if (!isVisible && Date.now() - lastVisibilityChange < REACTION_DELAY) {
@@ -18021,10 +18645,9 @@ var init_livekit_client_esm = __esm({
         }
       }
     };
-    STREAM_CHUNK_SIZE = 15e3;
     LocalParticipant = class extends Participant {
       /** @internal */
-      constructor(sid, identity, engine, options, roomRpcHandlers) {
+      constructor(sid, identity, engine, options, roomRpcHandlers, roomOutgoingDataStreamManager) {
         super(sid, identity, void 0, void 0, void 0, {
           loggerName: options.loggerName,
           loggerContextCb: () => this.engine.logContext
@@ -18250,6 +18873,7 @@ var init_livekit_client_esm = __esm({
         this.activeDeviceMap = /* @__PURE__ */ new Map([["audioinput", "default"], ["videoinput", "default"], ["audiooutput", "default"]]);
         this.pendingSignalRequests = /* @__PURE__ */ new Map();
         this.rpcHandlers = roomRpcHandlers;
+        this.roomOutgoingDataStreamManager = roomOutgoingDataStreamManager;
       }
       get lastCameraError() {
         return this.cameraError;
@@ -18341,7 +18965,7 @@ var init_livekit_client_esm = __esm({
             name: name2,
             attributes
           } = _ref;
-          return function* () {
+          return (function* () {
             return new Promise((resolve, reject) => __awaiter(_this, void 0, void 0, function* () {
               var _a2, _b;
               try {
@@ -18376,7 +19000,7 @@ var init_livekit_client_esm = __esm({
                 if (e3 instanceof Error) reject(e3);
               }
             }));
-          }();
+          })();
         });
       }
       /**
@@ -18645,7 +19269,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(track, options) {
           var _this2 = this;
           let isRepublish = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : false;
-          return function* () {
+          return (function* () {
             var _a, _b, _c, _d;
             if (isLocalAudioTrack(track)) {
               track.setAudioContext(_this2.audioContext);
@@ -18770,7 +19394,7 @@ var init_livekit_client_esm = __esm({
             } finally {
               _this2.pendingPublishPromises.delete(track);
             }
-          }();
+          })();
         });
       }
       waitUntilEngineConnected() {
@@ -19252,7 +19876,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(options) {
           var _this3 = this;
           let restartTracks = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
-          return function* () {
+          return (function* () {
             if (_this3.republishPromise) {
               yield _this3.republishPromise;
             }
@@ -19286,7 +19910,7 @@ var init_livekit_client_esm = __esm({
               }
             }));
             yield _this3.republishPromise;
-          }();
+          })();
         });
       }
       /**
@@ -19300,7 +19924,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(data) {
           var _this4 = this;
           let options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
-          return function* () {
+          return (function* () {
             const kind = options.reliable ? DataPacket_Kind.RELIABLE : DataPacket_Kind.LOSSY;
             const destinationIdentities = options.destinationIdentities;
             const topic = options.topic;
@@ -19317,7 +19941,7 @@ var init_livekit_client_esm = __esm({
               }
             });
             yield _this4.engine.sendDataPacket(packet, kind);
-          }();
+          })();
         });
       }
       /**
@@ -19341,6 +19965,7 @@ var init_livekit_client_esm = __esm({
           yield this.engine.sendDataPacket(packet, DataPacket_Kind.RELIABLE);
         });
       }
+      /** @deprecated Consider migrating to {@link sendText} */
       sendChatMessage(text7, options) {
         return __awaiter(this, void 0, void 0, function* () {
           const msg = {
@@ -19362,6 +19987,7 @@ var init_livekit_client_esm = __esm({
           return msg;
         });
       }
+      /** @deprecated Consider migrating to {@link sendText} */
       editChatMessage(editText, originalMessage) {
         return __awaiter(this, void 0, void 0, function* () {
           const msg = Object.assign(Object.assign({}, originalMessage), {
@@ -19382,264 +20008,51 @@ var init_livekit_client_esm = __esm({
           return msg;
         });
       }
+      /**
+       * Sends the given string to participants in the room via the data channel.
+       * For longer messages, consider using {@link streamText} instead.
+       *
+       * @param text The text payload
+       * @param options.topic Topic identifier used to route the stream to appropriate handlers.
+       */
       sendText(text7, options) {
         return __awaiter(this, void 0, void 0, function* () {
-          var _a;
-          const streamId = crypto.randomUUID();
-          const textInBytes = new TextEncoder().encode(text7);
-          const totalTextLength = textInBytes.byteLength;
-          const fileIds = (_a = options === null || options === void 0 ? void 0 : options.attachments) === null || _a === void 0 ? void 0 : _a.map(() => crypto.randomUUID());
-          const progresses = new Array(fileIds ? fileIds.length + 1 : 1).fill(0);
-          const handleProgress = (progress, idx) => {
-            var _a2;
-            progresses[idx] = progress;
-            const totalProgress = progresses.reduce((acc, val) => acc + val, 0);
-            (_a2 = options === null || options === void 0 ? void 0 : options.onProgress) === null || _a2 === void 0 ? void 0 : _a2.call(options, totalProgress);
-          };
-          const writer2 = yield this.streamText({
-            streamId,
-            totalSize: totalTextLength,
-            destinationIdentities: options === null || options === void 0 ? void 0 : options.destinationIdentities,
-            topic: options === null || options === void 0 ? void 0 : options.topic,
-            attachedStreamIds: fileIds,
-            attributes: options === null || options === void 0 ? void 0 : options.attributes
-          });
-          yield writer2.write(text7);
-          handleProgress(1, 0);
-          yield writer2.close();
-          if ((options === null || options === void 0 ? void 0 : options.attachments) && fileIds) {
-            yield Promise.all(options.attachments.map((file, idx) => __awaiter(this, void 0, void 0, function* () {
-              return this._sendFile(fileIds[idx], file, {
-                topic: options.topic,
-                mimeType: file.type,
-                onProgress: (progress) => {
-                  handleProgress(progress, idx + 1);
-                }
-              });
-            })));
-          }
-          return writer2.info;
+          return this.roomOutgoingDataStreamManager.sendText(text7, options);
         });
       }
       /**
+       * Creates a new TextStreamWriter which can be used to stream text incrementally
+       * to participants in the room via the data channel.
+       *
+       * @param options.topic Topic identifier used to route the stream to appropriate handlers.
+       *
        * @internal
        * @experimental CAUTION, might get removed in a minor release
        */
       streamText(options) {
         return __awaiter(this, void 0, void 0, function* () {
-          var _a, _b;
-          const streamId = (_a = options === null || options === void 0 ? void 0 : options.streamId) !== null && _a !== void 0 ? _a : crypto.randomUUID();
-          const info = {
-            id: streamId,
-            mimeType: "text/plain",
-            timestamp: Date.now(),
-            topic: (_b = options === null || options === void 0 ? void 0 : options.topic) !== null && _b !== void 0 ? _b : "",
-            size: options === null || options === void 0 ? void 0 : options.totalSize,
-            attributes: options === null || options === void 0 ? void 0 : options.attributes
-          };
-          const header = new DataStream_Header({
-            streamId,
-            mimeType: info.mimeType,
-            topic: info.topic,
-            timestamp: numberToBigInt(info.timestamp),
-            totalLength: numberToBigInt(options === null || options === void 0 ? void 0 : options.totalSize),
-            attributes: info.attributes,
-            contentHeader: {
-              case: "textHeader",
-              value: new DataStream_TextHeader({
-                version: options === null || options === void 0 ? void 0 : options.version,
-                attachedStreamIds: options === null || options === void 0 ? void 0 : options.attachedStreamIds,
-                replyToStreamId: options === null || options === void 0 ? void 0 : options.replyToStreamId,
-                operationType: (options === null || options === void 0 ? void 0 : options.type) === "update" ? DataStream_OperationType.UPDATE : DataStream_OperationType.CREATE
-              })
-            }
-          });
-          const destinationIdentities = options === null || options === void 0 ? void 0 : options.destinationIdentities;
-          const packet = new DataPacket({
-            destinationIdentities,
-            value: {
-              case: "streamHeader",
-              value: header
-            }
-          });
-          yield this.engine.sendDataPacket(packet, DataPacket_Kind.RELIABLE);
-          let chunkId = 0;
-          const localP = this;
-          const writableStream = new WritableStream({
-            // Implement the sink
-            write(text7) {
-              return __awaiter(this, void 0, void 0, function* () {
-                for (const textByteChunk of splitUtf8(text7, STREAM_CHUNK_SIZE)) {
-                  yield localP.engine.waitForBufferStatusLow(DataPacket_Kind.RELIABLE);
-                  const chunk = new DataStream_Chunk({
-                    content: textByteChunk,
-                    streamId,
-                    chunkIndex: numberToBigInt(chunkId)
-                  });
-                  const chunkPacket = new DataPacket({
-                    destinationIdentities,
-                    value: {
-                      case: "streamChunk",
-                      value: chunk
-                    }
-                  });
-                  yield localP.engine.sendDataPacket(chunkPacket, DataPacket_Kind.RELIABLE);
-                  chunkId += 1;
-                }
-              });
-            },
-            close() {
-              return __awaiter(this, void 0, void 0, function* () {
-                const trailer = new DataStream_Trailer({
-                  streamId
-                });
-                const trailerPacket = new DataPacket({
-                  destinationIdentities,
-                  value: {
-                    case: "streamTrailer",
-                    value: trailer
-                  }
-                });
-                yield localP.engine.sendDataPacket(trailerPacket, DataPacket_Kind.RELIABLE);
-              });
-            },
-            abort(err) {
-              console.log("Sink error:", err);
-            }
-          });
-          let onEngineClose = () => __awaiter(this, void 0, void 0, function* () {
-            yield writer2.close();
-          });
-          localP.engine.once(EngineEvent.Closing, onEngineClose);
-          const writer2 = new TextStreamWriter(writableStream, info, () => this.engine.off(EngineEvent.Closing, onEngineClose));
-          return writer2;
+          return this.roomOutgoingDataStreamManager.streamText(options);
         });
       }
+      /** Send a File to all participants in the room via the data channel.
+       * @param file The File object payload
+       * @param options.topic Topic identifier used to route the stream to appropriate handlers.
+       * @param options.onProgress A callback function used to monitor the upload progress percentage.
+       */
       sendFile(file, options) {
         return __awaiter(this, void 0, void 0, function* () {
-          const streamId = crypto.randomUUID();
-          yield this._sendFile(streamId, file, options);
-          return {
-            id: streamId
-          };
-        });
-      }
-      _sendFile(streamId, file, options) {
-        return __awaiter(this, void 0, void 0, function* () {
-          var _a;
-          const writer2 = yield this.streamBytes({
-            streamId,
-            totalSize: file.size,
-            name: file.name,
-            mimeType: (_a = options === null || options === void 0 ? void 0 : options.mimeType) !== null && _a !== void 0 ? _a : file.type,
-            topic: options === null || options === void 0 ? void 0 : options.topic,
-            destinationIdentities: options === null || options === void 0 ? void 0 : options.destinationIdentities
-          });
-          const reader = file.stream().getReader();
-          while (true) {
-            const {
-              done,
-              value
-            } = yield reader.read();
-            if (done) {
-              break;
-            }
-            yield writer2.write(value);
-          }
-          yield writer2.close();
-          return writer2.info;
+          return this.roomOutgoingDataStreamManager.sendFile(file, options);
         });
       }
+      /**
+       * Stream bytes incrementally to participants in the room via the data channel.
+       * For sending files, consider using {@link sendFile} instead.
+       *
+       * @param options.topic Topic identifier used to route the stream to appropriate handlers.
+       */
       streamBytes(options) {
         return __awaiter(this, void 0, void 0, function* () {
-          var _a, _b, _c, _d, _e;
-          const streamId = (_a = options === null || options === void 0 ? void 0 : options.streamId) !== null && _a !== void 0 ? _a : crypto.randomUUID();
-          const destinationIdentities = options === null || options === void 0 ? void 0 : options.destinationIdentities;
-          const info = {
-            id: streamId,
-            mimeType: (_b = options === null || options === void 0 ? void 0 : options.mimeType) !== null && _b !== void 0 ? _b : "application/octet-stream",
-            topic: (_c = options === null || options === void 0 ? void 0 : options.topic) !== null && _c !== void 0 ? _c : "",
-            timestamp: Date.now(),
-            attributes: options === null || options === void 0 ? void 0 : options.attributes,
-            size: options === null || options === void 0 ? void 0 : options.totalSize,
-            name: (_d = options === null || options === void 0 ? void 0 : options.name) !== null && _d !== void 0 ? _d : "unknown"
-          };
-          const header = new DataStream_Header({
-            totalLength: numberToBigInt((_e = info.size) !== null && _e !== void 0 ? _e : 0),
-            mimeType: info.mimeType,
-            streamId,
-            topic: info.topic,
-            timestamp: numberToBigInt(Date.now()),
-            attributes: info.attributes,
-            contentHeader: {
-              case: "byteHeader",
-              value: new DataStream_ByteHeader({
-                name: info.name
-              })
-            }
-          });
-          const packet = new DataPacket({
-            destinationIdentities,
-            value: {
-              case: "streamHeader",
-              value: header
-            }
-          });
-          yield this.engine.sendDataPacket(packet, DataPacket_Kind.RELIABLE);
-          let chunkId = 0;
-          const writeMutex = new _();
-          const engine = this.engine;
-          const log2 = this.log;
-          const writableStream = new WritableStream({
-            write(chunk) {
-              return __awaiter(this, void 0, void 0, function* () {
-                const unlock = yield writeMutex.lock();
-                let byteOffset = 0;
-                try {
-                  while (byteOffset < chunk.byteLength) {
-                    const subChunk = chunk.slice(byteOffset, byteOffset + STREAM_CHUNK_SIZE);
-                    yield engine.waitForBufferStatusLow(DataPacket_Kind.RELIABLE);
-                    const chunkPacket = new DataPacket({
-                      destinationIdentities,
-                      value: {
-                        case: "streamChunk",
-                        value: new DataStream_Chunk({
-                          content: subChunk,
-                          streamId,
-                          chunkIndex: numberToBigInt(chunkId)
-                        })
-                      }
-                    });
-                    yield engine.sendDataPacket(chunkPacket, DataPacket_Kind.RELIABLE);
-                    chunkId += 1;
-                    byteOffset += subChunk.byteLength;
-                  }
-                } finally {
-                  unlock();
-                }
-              });
-            },
-            close() {
-              return __awaiter(this, void 0, void 0, function* () {
-                const trailer = new DataStream_Trailer({
-                  streamId
-                });
-                const trailerPacket = new DataPacket({
-                  destinationIdentities,
-                  value: {
-                    case: "streamTrailer",
-                    value: trailer
-                  }
-                });
-                yield engine.sendDataPacket(trailerPacket, DataPacket_Kind.RELIABLE);
-              });
-            },
-            abort(err) {
-              log2.error("Sink error:", err);
-            }
-          });
-          const byteWriter = new ByteStreamWriter(writableStream, info);
-          return byteWriter;
+          return this.roomOutgoingDataStreamManager.streamBytes(options);
         });
       }
       /**
@@ -19657,7 +20070,7 @@ var init_livekit_client_esm = __esm({
             payload,
             responseTimeout = 1e4
           } = _ref3;
-          return function* () {
+          return (function* () {
             const maxRoundTripLatency = 2e3;
             return new Promise((resolve, reject) => __awaiter(_this5, void 0, void 0, function* () {
               var _a2, _b, _c, _d;
@@ -19704,7 +20117,7 @@ var init_livekit_client_esm = __esm({
                 participantIdentity: destinationIdentity
               });
             }));
-          }();
+          })();
         });
       }
       /**
@@ -20396,12 +20809,12 @@ var init_livekit_client_esm = __esm({
         return super.emit(event, ...args);
       }
     };
-    (function(ConnectionState2) {
-      ConnectionState2["Disconnected"] = "disconnected";
-      ConnectionState2["Connecting"] = "connecting";
-      ConnectionState2["Connected"] = "connected";
-      ConnectionState2["Reconnecting"] = "reconnecting";
-      ConnectionState2["SignalReconnecting"] = "signalReconnecting";
+    (function(ConnectionState3) {
+      ConnectionState3["Disconnected"] = "disconnected";
+      ConnectionState3["Connecting"] = "connecting";
+      ConnectionState3["Connected"] = "connected";
+      ConnectionState3["Reconnecting"] = "reconnecting";
+      ConnectionState3["SignalReconnecting"] = "signalReconnecting";
     })(ConnectionState || (ConnectionState = {}));
     connectionReconcileFrequency = 4 * 1e3;
     Room = class _Room extends eventsExports.EventEmitter {
@@ -20422,10 +20835,6 @@ var init_livekit_client_esm = __esm({
         this.log = livekitLogger;
         this.bufferedEvents = [];
         this.isResuming = false;
-        this.byteStreamControllers = /* @__PURE__ */ new Map();
-        this.textStreamControllers = /* @__PURE__ */ new Map();
-        this.byteStreamHandlers = /* @__PURE__ */ new Map();
-        this.textStreamHandlers = /* @__PURE__ */ new Map();
         this.rpcHandlers = /* @__PURE__ */ new Map();
         this.connect = (url, token2, opts) => __awaiter(this, void 0, void 0, function* () {
           var _a2;
@@ -20640,7 +21049,7 @@ var init_livekit_client_esm = __esm({
           return __awaiter(_this, [...args_1], void 0, function() {
             var _this2 = this;
             let stopTracks = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
-            return function* () {
+            return (function* () {
               var _a2, _b2, _c2, _d;
               const unlock = yield _this2.disconnectLock.lock();
               try {
@@ -20666,7 +21075,7 @@ var init_livekit_client_esm = __esm({
               } finally {
                 unlock();
               }
-            }();
+            })();
           });
         };
         this.onPageLeave = () => __awaiter(this, void 0, void 0, function* () {
@@ -20874,8 +21283,8 @@ var init_livekit_client_esm = __esm({
               return;
             }
             const newStreamState = Track.streamStateFromProto(streamState.state);
+            pub.track.setStreamState(newStreamState);
             if (newStreamState !== pub.track.streamState) {
-              pub.track.streamState = newStreamState;
               participant.emit(ParticipantEvent.TrackStreamStateChanged, pub, pub.track.streamState);
               this.emitWhenConnected(RoomEvent.TrackStreamStateChanged, pub, pub.track.streamState, participant);
             }
@@ -20915,12 +21324,8 @@ var init_livekit_client_esm = __esm({
             this.handleChatMessage(participant, packet.value.value);
           } else if (packet.value.case === "metrics") {
             this.handleMetrics(packet.value.value, participant);
-          } else if (packet.value.case === "streamHeader") {
-            this.handleStreamHeader(packet.value.value, packet.participantIdentity);
-          } else if (packet.value.case === "streamChunk") {
-            this.handleStreamChunk(packet.value.value);
-          } else if (packet.value.case === "streamTrailer") {
-            this.handleStreamTrailer(packet.value.value);
+          } else if (packet.value.case === "streamHeader" || packet.value.case === "streamChunk" || packet.value.case === "streamTrailer") {
+            this.handleDataStream(packet);
           } else if (packet.value.case === "rpcRequest") {
             const rpc = packet.value.value;
             this.handleIncomingRpcRequest(packet.participantIdentity, rpc.id, rpc.method, rpc.payload, rpc.responseTimeoutMs, rpc.version);
@@ -20934,7 +21339,6 @@ var init_livekit_client_esm = __esm({
           this.emit(RoomEvent.SipDTMFReceived, dtmf, participant);
           participant === null || participant === void 0 ? void 0 : participant.emit(ParticipantEvent.SipDTMFReceived, dtmf);
         };
-        this.bufferedSegments = /* @__PURE__ */ new Map();
         this.handleTranscription = (_remoteParticipant, transcription) => {
           const participant = transcription.transcribedParticipantIdentity === this.localParticipant.identity ? this.localParticipant : this.getParticipantByIdentity(transcription.transcribedParticipantIdentity);
           const publication = participant === null || participant === void 0 ? void 0 : participant.trackPublications.get(transcription.trackId);
@@ -20950,6 +21354,10 @@ var init_livekit_client_esm = __esm({
         this.handleMetrics = (metrics, participant) => {
           this.emit(RoomEvent.MetricsReceived, metrics, participant);
         };
+        this.handleDataStream = (packet) => {
+          this.incomingDataStreamManager.handleDataStreamPacket(packet);
+        };
+        this.bufferedSegments = /* @__PURE__ */ new Map();
         this.handleAudioPlaybackStarted = () => {
           if (this.canPlaybackAudio) {
             return;
@@ -21083,8 +21491,10 @@ var init_livekit_client_esm = __esm({
         this.options.videoCaptureDefaults = Object.assign(Object.assign({}, videoDefaults), options === null || options === void 0 ? void 0 : options.videoCaptureDefaults);
         this.options.publishDefaults = Object.assign(Object.assign({}, publishDefaults), options === null || options === void 0 ? void 0 : options.publishDefaults);
         this.maybeCreateEngine();
+        this.incomingDataStreamManager = new IncomingDataStreamManager();
+        this.outgoingDataStreamManager = new OutgoingDataStreamManager(this.engine, this.log);
         this.disconnectLock = new _();
-        this.localParticipant = new LocalParticipant("", "", this.engine, this.options, this.rpcHandlers);
+        this.localParticipant = new LocalParticipant("", "", this.engine, this.options, this.rpcHandlers, this.outgoingDataStreamManager);
         if (this.options.videoCaptureDefaults.deviceId) {
           this.localParticipant.activeDeviceMap.set("videoinput", unwrapConstraint(this.options.videoCaptureDefaults.deviceId));
         }
@@ -21110,22 +21520,16 @@ var init_livekit_client_esm = __esm({
         }
       }
       registerTextStreamHandler(topic, callback) {
-        if (this.textStreamHandlers.has(topic)) {
-          throw new TypeError('A text stream handler for topic "'.concat(topic, '" has already been set.'));
-        }
-        this.textStreamHandlers.set(topic, callback);
+        return this.incomingDataStreamManager.registerTextStreamHandler(topic, callback);
       }
       unregisterTextStreamHandler(topic) {
-        this.textStreamHandlers.delete(topic);
+        return this.incomingDataStreamManager.unregisterTextStreamHandler(topic);
       }
       registerByteStreamHandler(topic, callback) {
-        if (this.byteStreamHandlers.has(topic)) {
-          throw new TypeError('A byte stream handler for topic "'.concat(topic, '" has already been set.'));
-        }
-        this.byteStreamHandlers.set(topic, callback);
+        return this.incomingDataStreamManager.registerByteStreamHandler(topic, callback);
       }
       unregisterByteStreamHandler(topic) {
-        this.byteStreamHandlers.delete(topic);
+        return this.incomingDataStreamManager.unregisterByteStreamHandler(topic);
       }
       /**
        * Establishes the participant as a receiver for calls of the specified RPC method.
@@ -21167,44 +21571,6 @@ var init_livekit_client_esm = __esm({
       unregisterRpcMethod(method) {
         this.rpcHandlers.delete(method);
       }
-      handleIncomingRpcRequest(callerIdentity, requestId, method, payload, responseTimeout, version2) {
-        return __awaiter(this, void 0, void 0, function* () {
-          yield this.engine.publishRpcAck(callerIdentity, requestId);
-          if (version2 !== 1) {
-            yield this.engine.publishRpcResponse(callerIdentity, requestId, null, RpcError.builtIn("UNSUPPORTED_VERSION"));
-            return;
-          }
-          const handler = this.rpcHandlers.get(method);
-          if (!handler) {
-            yield this.engine.publishRpcResponse(callerIdentity, requestId, null, RpcError.builtIn("UNSUPPORTED_METHOD"));
-            return;
-          }
-          let responseError = null;
-          let responsePayload = null;
-          try {
-            const response = yield handler({
-              requestId,
-              callerIdentity,
-              payload,
-              responseTimeout
-            });
-            if (byteLength(response) > MAX_PAYLOAD_BYTES) {
-              responseError = RpcError.builtIn("RESPONSE_PAYLOAD_TOO_LARGE");
-              console.warn("RPC Response payload too large for ".concat(method));
-            } else {
-              responsePayload = response;
-            }
-          } catch (error) {
-            if (error instanceof RpcError) {
-              responseError = error;
-            } else {
-              console.warn("Uncaught error returned by RPC handler for ".concat(method, ". Returning APPLICATION_ERROR instead."), error);
-              responseError = RpcError.builtIn("APPLICATION_ERROR");
-            }
-          }
-          yield this.engine.publishRpcResponse(callerIdentity, requestId, responsePayload, responseError);
-        });
-      }
       /**
        * @experimental
        */
@@ -21369,6 +21735,9 @@ var init_livekit_client_esm = __esm({
         if (this.e2eeManager) {
           this.e2eeManager.setupEngine(this.engine);
         }
+        if (this.outgoingDataStreamManager) {
+          this.outgoingDataStreamManager.setupEngine(this.engine);
+        }
       }
       /**
        * getLocalDevices abstracts navigator.mediaDevices.enumerateDevices.
@@ -21579,7 +21948,7 @@ var init_livekit_client_esm = __esm({
         return __awaiter(this, arguments, void 0, function(kind, deviceId) {
           var _this3 = this;
           let exact = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : true;
-          return function* () {
+          return (function* () {
             var _a, _b, _c, _d, _e, _f;
             var _g;
             let success = true;
@@ -21653,7 +22022,7 @@ var init_livekit_client_esm = __esm({
               _this3.emit(RoomEvent.ActiveDeviceChanged, kind, deviceId);
             }
             return success;
-          }();
+          })();
         });
       }
       setupLocalParticipantEvents() {
@@ -21715,7 +22084,10 @@ var init_livekit_client_esm = __esm({
             adaptiveStreamSettings = {};
           }
         }
-        participant.addSubscribedMediaTrack(mediaTrack, trackId, stream, receiver, adaptiveStreamSettings);
+        const publication = participant.addSubscribedMediaTrack(mediaTrack, trackId, stream, receiver, adaptiveStreamSettings);
+        if ((publication === null || publication === void 0 ? void 0 : publication.isEncrypted) && !this.e2eeManager) {
+          this.emit(RoomEvent.EncryptionError, new Error("Encrypted ".concat(publication.source, " track received from participant ").concat(participant.sid, ", but room does not have encryption enabled!")));
+        }
       }
       handleDisconnect() {
         let shouldStopTracks = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
@@ -21725,6 +22097,7 @@ var init_livekit_client_esm = __esm({
         this.isResuming = false;
         this.bufferedEvents = [];
         this.transcriptionReceivedTimes.clear();
+        this.incomingDataStreamManager.clearHandlersAndControllers();
         if (this.state === ConnectionState.Disconnected) {
           return;
         }
@@ -21775,6 +22148,7 @@ var init_livekit_client_esm = __esm({
         if (!participant) {
           return;
         }
+        this.incomingDataStreamManager.validateParticipantHasNoActiveDataStreams(identity);
         participant.trackPublications.forEach((publication) => {
           participant.unpublishTrack(publication.trackSid, true);
         });
@@ -21782,99 +22156,44 @@ var init_livekit_client_esm = __esm({
         participant.setDisconnected();
         (_a = this.localParticipant) === null || _a === void 0 ? void 0 : _a.handleParticipantDisconnected(participant.identity);
       }
-      handleStreamHeader(streamHeader, participantIdentity) {
+      handleIncomingRpcRequest(callerIdentity, requestId, method, payload, responseTimeout, version2) {
         return __awaiter(this, void 0, void 0, function* () {
-          var _a;
-          if (streamHeader.contentHeader.case === "byteHeader") {
-            const streamHandlerCallback = this.byteStreamHandlers.get(streamHeader.topic);
-            if (!streamHandlerCallback) {
-              this.log.debug("ignoring incoming byte stream due to no handler for topic", streamHeader.topic);
-              return;
-            }
-            let streamController;
-            const info = {
-              id: streamHeader.streamId,
-              name: (_a = streamHeader.contentHeader.value.name) !== null && _a !== void 0 ? _a : "unknown",
-              mimeType: streamHeader.mimeType,
-              size: streamHeader.totalLength ? Number(streamHeader.totalLength) : void 0,
-              topic: streamHeader.topic,
-              timestamp: bigIntToNumber(streamHeader.timestamp),
-              attributes: streamHeader.attributes
-            };
-            const stream = new ReadableStream({
-              start: (controller) => {
-                streamController = controller;
-                this.byteStreamControllers.set(streamHeader.streamId, {
-                  info,
-                  controller: streamController,
-                  startTime: Date.now()
-                });
-              }
-            });
-            streamHandlerCallback(new ByteStreamReader(info, stream, bigIntToNumber(streamHeader.totalLength)), {
-              identity: participantIdentity
+          yield this.engine.publishRpcAck(callerIdentity, requestId);
+          if (version2 !== 1) {
+            yield this.engine.publishRpcResponse(callerIdentity, requestId, null, RpcError.builtIn("UNSUPPORTED_VERSION"));
+            return;
+          }
+          const handler = this.rpcHandlers.get(method);
+          if (!handler) {
+            yield this.engine.publishRpcResponse(callerIdentity, requestId, null, RpcError.builtIn("UNSUPPORTED_METHOD"));
+            return;
+          }
+          let responseError = null;
+          let responsePayload = null;
+          try {
+            const response = yield handler({
+              requestId,
+              callerIdentity,
+              payload,
+              responseTimeout
             });
-          } else if (streamHeader.contentHeader.case === "textHeader") {
-            const streamHandlerCallback = this.textStreamHandlers.get(streamHeader.topic);
-            if (!streamHandlerCallback) {
-              this.log.debug("ignoring incoming text stream due to no handler for topic", streamHeader.topic);
-              return;
+            if (byteLength(response) > MAX_PAYLOAD_BYTES) {
+              responseError = RpcError.builtIn("RESPONSE_PAYLOAD_TOO_LARGE");
+              console.warn("RPC Response payload too large for ".concat(method));
+            } else {
+              responsePayload = response;
+            }
+          } catch (error) {
+            if (error instanceof RpcError) {
+              responseError = error;
+            } else {
+              console.warn("Uncaught error returned by RPC handler for ".concat(method, ". Returning APPLICATION_ERROR instead."), error);
+              responseError = RpcError.builtIn("APPLICATION_ERROR");
             }
-            let streamController;
-            const info = {
-              id: streamHeader.streamId,
-              mimeType: streamHeader.mimeType,
-              size: streamHeader.totalLength ? Number(streamHeader.totalLength) : void 0,
-              topic: streamHeader.topic,
-              timestamp: Number(streamHeader.timestamp),
-              attributes: streamHeader.attributes
-            };
-            const stream = new ReadableStream({
-              start: (controller) => {
-                streamController = controller;
-                this.textStreamControllers.set(streamHeader.streamId, {
-                  info,
-                  controller: streamController,
-                  startTime: Date.now()
-                });
-              }
-            });
-            streamHandlerCallback(new TextStreamReader(info, stream, bigIntToNumber(streamHeader.totalLength)), {
-              identity: participantIdentity
-            });
           }
+          yield this.engine.publishRpcResponse(callerIdentity, requestId, responsePayload, responseError);
         });
       }
-      handleStreamChunk(chunk) {
-        const fileBuffer = this.byteStreamControllers.get(chunk.streamId);
-        if (fileBuffer) {
-          if (chunk.content.length > 0) {
-            fileBuffer.controller.enqueue(chunk);
-          }
-        }
-        const textBuffer = this.textStreamControllers.get(chunk.streamId);
-        if (textBuffer) {
-          if (chunk.content.length > 0) {
-            textBuffer.controller.enqueue(chunk);
-          }
-        }
-      }
-      handleStreamTrailer(trailer) {
-        const textBuffer = this.textStreamControllers.get(trailer.streamId);
-        if (textBuffer) {
-          textBuffer.info.attributes = Object.assign(Object.assign({}, textBuffer.info.attributes), trailer.attributes);
-          textBuffer.controller.close();
-          this.textStreamControllers.delete(trailer.streamId);
-        }
-        const fileBuffer = this.byteStreamControllers.get(trailer.streamId);
-        if (fileBuffer) {
-          {
-            fileBuffer.info.attributes = Object.assign(Object.assign({}, fileBuffer.info.attributes), trailer.attributes);
-            fileBuffer.controller.close();
-            this.byteStreamControllers.delete(trailer.streamId);
-          }
-        }
-      }
       /**
        * attempt to select the default devices if the previously selected devices are no longer available after a device change event
        */
@@ -23311,11 +23630,12 @@ function setWebRTCCallbacks(newCallbacks) {
 function getCurrentCallbacks() {
   return callbacks;
 }
-async function authenticate(userIdentity, apiKey, appId) {
+async function authenticate(userIdentity, apiKey, appId, language) {
   try {
     const authPayload = {
       user_identity: userIdentity,
-      app_id: appId || _appId
+      app_id: appId || _appId,
+      ...language && { language: language.code }
     };
     const response = await fetch(`${serverUrl}/auth/login`, {
       method: "POST",
@@ -23601,17 +23921,17 @@ var require_inline_style_parser = __commonJS({
       function position3() {
         var start2 = { line: lineno, column };
         return function(node2) {
-          node2.position = new Position(start2);
+          node2.position = new Position2(start2);
           whitespace2();
           return node2;
         };
       }
-      function Position(start2) {
+      function Position2(start2) {
         this.start = start2;
         this.end = { line: lineno, column };
         this.source = options.source;
       }
-      Position.prototype.content = style;
+      Position2.prototype.content = style;
       var errorsList = [];
       function error(msg) {
         var err = new Error(
@@ -23916,7 +24236,7 @@ var require_core = __commonJS({
         root4.CryptoJS = factory();
       }
     })(exports, function() {
-      var CryptoJS = CryptoJS || function(Math2, undefined2) {
+      var CryptoJS = CryptoJS || (function(Math2, undefined2) {
         var crypto2;
         if (typeof window !== "undefined" && window.crypto) {
           crypto2 = window.crypto;
@@ -23956,7 +24276,7 @@ var require_core = __commonJS({
           }
           throw new Error("Native crypto module could not be used to get secure random number.");
         };
-        var create2 = Object.create || /* @__PURE__ */ function() {
+        var create2 = Object.create || /* @__PURE__ */ (function() {
           function F2() {
           }
           return function(obj) {
@@ -23966,10 +24286,10 @@ var require_core = __commonJS({
             F2.prototype = null;
             return subtype;
           };
-        }();
+        })();
         var C = {};
         var C_lib = C.lib = {};
-        var Base = C_lib.Base = /* @__PURE__ */ function() {
+        var Base = C_lib.Base = /* @__PURE__ */ (function() {
           return {
             /**
              * Creates a new object that inherits from this object.
@@ -24068,7 +24388,7 @@ var require_core = __commonJS({
               return this.init.prototype.extend(this);
             }
           };
-        }();
+        })();
         var WordArray = C_lib.WordArray = Base.extend({
           /**
            * Initializes a newly created word array.
@@ -24506,7 +24826,7 @@ var require_core = __commonJS({
         });
         var C_algo = C.algo = {};
         return C;
-      }(Math);
+      })(Math);
       return CryptoJS;
     });
   }
@@ -24695,11 +25015,15 @@ var require_md5 = __commonJS({
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  AnsyrProvider: () => AnsyrProvider,
   BorderGlow: () => border_glow_default,
   ChatPopup: () => ChatPopup,
-  CuekitProvider: () => CuekitProvider,
+  DraggableResizableContainer: () => DraggableResizableContainer,
   InitCuekit: () => InitCuekit,
+  LanguageSelector: () => LanguageSelector,
   MicButton: () => MicButton,
+  ResizeHandle: () => ResizeHandle,
+  ResizeHandles: () => ResizeHandles,
   VoiceIntensityVisualizer: () => VoiceIntensityVisualizer,
   captureAllInteractiveElements: () => captureAllInteractiveElements,
   clearElementCache: () => clearElementCache,
@@ -24711,14 +25035,15 @@ __export(index_exports, {
   initWebRTC: () => initWebRTC,
   initWebRTCWithDeployedBackend: () => initWebRTCWithDeployedBackend,
   resolveRoutePath: () => resolveRoutePath,
+  useAnsyrContext: () => useAnsyrContext,
   useCuekit: () => useCuekit,
-  useQubeContext: () => useQubeContext,
+  useDraggableResizableContainer: () => useDraggableResizableContainer,
   useWebRTC: () => useWebRTC,
   validateDynamicElements: () => validateDynamicElements
 });
 module.exports = __toCommonJS(index_exports);
 
-// src/providers/cuekit-provider.tsx
+// src/providers/ansyr-provider.tsx
 var import_react = __toESM(require("react"));
 
 // src/core/init.ts
@@ -24737,7 +25062,7 @@ function InitCuekit(config) {
   setWebRTCConfig(webRTCConfig);
 }
 
-// src/providers/cuekit-provider.tsx
+// src/providers/ansyr-provider.tsx
 init_navigation();
 init_intent_store();
 
@@ -24782,9 +25107,9 @@ var initWebRTC = (apiKey) => {
   return initWebRTCWithDeployedBackend(apiKey);
 };
 
-// src/providers/cuekit-provider.tsx
-if (typeof window !== "undefined" && !globalThis.CuekitStore) {
-  globalThis.CuekitStore = {
+// src/providers/ansyr-provider.tsx
+if (typeof window !== "undefined" && !globalThis.AnsyrStore) {
+  globalThis.AnsyrStore = {
     intent: null,
     lastText: "",
     lastClickedLabel: "",
@@ -24792,38 +25117,46 @@ if (typeof window !== "undefined" && !globalThis.CuekitStore) {
     appId: void 0,
     deviceId: void 0,
     update(data) {
-      Object.assign(globalThis.CuekitStore, data);
+      Object.assign(globalThis.AnsyrStore, data);
     }
   };
 }
-var QubeContext = (0, import_react.createContext)({
+var AnsyrContext = (0, import_react.createContext)({
   apiKey: "",
-  appId: ""
+  appId: "",
+  title: "ansyr.ai",
+  showLogo: true,
+  showAIIcon: true,
+  showUserIcon: true
 });
-var useQubeContext = () => (0, import_react.useContext)(QubeContext);
+var useAnsyrContext = () => (0, import_react.useContext)(AnsyrContext);
 var getUniqueId = () => {
   if (typeof window === "undefined") {
     return "server-" + Date.now().toString(36);
   }
   try {
-    let id = localStorage.getItem("cuekit_device_id");
+    let id = localStorage.getItem("ansyr_device_id");
     if (!id) {
       id = Date.now().toString(36) + Math.random().toString(36).substring(2);
-      localStorage.setItem("cuekit_device_id", id);
+      localStorage.setItem("ansyr_device_id", id);
     }
     return id;
   } catch {
     return "anon-" + Date.now().toString(36);
   }
 };
-var CuekitProvider = ({
+var AnsyrProvider = ({
   apiKey,
   deviceId = "",
   appId,
   children,
   navigationHandler: navigationHandler2,
   onConnectionStateChange,
-  onParticipantUpdate
+  onParticipantUpdate,
+  title = "ansyr.ai",
+  showLogo = true,
+  showAIIcon = true,
+  showUserIcon = true
 }) => {
   const [internalDeviceId, setInternalDeviceId] = (0, import_react.useState)(deviceId);
   (0, import_react.useEffect)(() => {
@@ -24871,8 +25204,8 @@ var CuekitProvider = ({
   }, [onConnectionStateChange, onParticipantUpdate, navigationHandler2]);
   (0, import_react.useEffect)(() => {
     const updateGlobalStore = (id) => {
-      if (typeof window !== "undefined" && globalThis.CuekitStore) {
-        globalThis.CuekitStore.update({
+      if (typeof window !== "undefined" && globalThis.AnsyrStore) {
+        globalThis.AnsyrStore.update({
           apiKey,
           appId,
           deviceId: id
@@ -24922,11 +25255,15 @@ var CuekitProvider = ({
     };
   }, [apiKey, appId, internalDeviceId]);
   return /* @__PURE__ */ import_react.default.createElement(
-    QubeContext.Provider,
+    AnsyrContext.Provider,
     {
       value: {
         apiKey,
-        appId
+        appId,
+        title,
+        showLogo,
+        showAIIcon,
+        showUserIcon
       }
     },
     children
@@ -24934,10 +25271,11 @@ var CuekitProvider = ({
 };
 
 // src/components/mic-button.tsx
-var import_react15 = __toESM(require("react"));
+var import_react20 = __toESM(require("react"));
 
 // src/hooks/use-cuekit.ts
 var import_react3 = require("react");
+init_livekit_client_esm();
 
 // src/hooks/use-webrtc.ts
 var import_react2 = require("react");
@@ -24983,22 +25321,25 @@ var useWebRTC = (options) => {
     options?.onAISpeechStart,
     options?.onAISpeechEnd
   ]);
-  const connect = (0, import_react2.useCallback)(async (identity, apiKey, appId) => {
-    try {
-      setError(null);
-      setIsConnecting(true);
-      const authData = await authenticate(identity, apiKey || _apiKey, appId || _appId);
-      await connectToRoom(authData.livekit_url, authData.livekit_token);
-      setRoom(getRoom());
-      setIsConnected(true);
-      return authData;
-    } catch (err) {
-      setError(err.message || "Failed to connect");
-      setIsConnected(false);
-    } finally {
-      setIsConnecting(false);
-    }
-  }, []);
+  const connect = (0, import_react2.useCallback)(
+    async (identity, apiKey, appId, language) => {
+      try {
+        setError(null);
+        setIsConnecting(true);
+        const authData = await authenticate(identity, apiKey || _apiKey, appId || _appId, language);
+        await connectToRoom(authData.livekit_url, authData.livekit_token);
+        setRoom(getRoom());
+        setIsConnected(true);
+        return authData;
+      } catch (err) {
+        setError(err.message || "Failed to connect");
+        setIsConnected(false);
+      } finally {
+        setIsConnecting(false);
+      }
+    },
+    []
+  );
   const disconnect = (0, import_react2.useCallback)(async () => {
     await disconnectFromRoom();
     setIsConnected(false);
@@ -25078,6 +25419,7 @@ var useCuekit = (options) => {
   }, []);
   const [micState, setMicState] = (0, import_react3.useState)("idle");
   const [status, setStatus] = (0, import_react3.useState)("");
+  const [muteState, setMuteState] = (0, import_react3.useState)({ isMuted: false, canMute: false });
   const handleNavigationCommand = (event) => {
     console.log(`\u2B07\uFE0F Received event from backend: ${event.type}`, event);
     switch (event.type) {
@@ -25142,6 +25484,22 @@ var useCuekit = (options) => {
         }
         break;
       }
+      case "chat": {
+        const chatData = event.data;
+        console.log("\u{1F4AC} Chat message received:", chatData);
+        if (chatData.message && chatData.sender === "ai") {
+          const newMessage = {
+            id: `ai-${Date.now()}`,
+            role: "ai",
+            text: chatData.message,
+            isFinal: true,
+            timestamp: new Date(chatData.timestamp || Date.now()).toISOString()
+          };
+          setMessages((prev) => [...prev, newMessage]);
+          setMicState("listening");
+        }
+        break;
+      }
       case "request_runtime_data": {
         console.log("\u{1F9E0} Requesting runtime data");
         sendRuntimeData();
@@ -25174,17 +25532,21 @@ var useCuekit = (options) => {
     switch (state) {
       case "connecting":
         setStatus("Connecting...");
+        setMuteState((prev) => ({ ...prev, canMute: false }));
         break;
       case "connected":
         setStatus("");
         setMicState("listening");
+        setMuteState((prev) => ({ ...prev, canMute: true }));
         break;
       case "disconnected":
         setStatus("Disconnected");
         setMicState("idle");
+        setMuteState({ isMuted: false, canMute: false });
         break;
       case "reconnecting":
         setStatus("Reconnecting...");
+        setMuteState((prev) => ({ ...prev, canMute: false }));
         break;
       default:
         break;
@@ -25197,8 +25559,8 @@ var useCuekit = (options) => {
     onNavigationCommand: handleNavigationCommand
   });
   const connect = (0, import_react3.useCallback)(
-    async (identity, apiKey, appId) => {
-      await webrtc.connect(identity, apiKey, appId);
+    async (identity, apiKey, appId, language) => {
+      await webrtc.connect(identity, apiKey, appId, language);
     },
     [webrtc]
   );
@@ -25206,7 +25568,88 @@ var useCuekit = (options) => {
     await webrtc.disconnect();
     clearMessages();
     setMicState("idle");
+    setMuteState({ isMuted: false, canMute: false });
   }, [webrtc, clearMessages]);
+  const toggleMute = (0, import_react3.useCallback)(async () => {
+    if (!webrtc.isConnected) return;
+    try {
+      const room2 = webrtc.room;
+      if (!room2) return;
+      const localParticipant = room2.localParticipant;
+      const audioTrack = localParticipant.getTrackPublication(Track.Source.Microphone)?.track;
+      if (audioTrack) {
+        if (muteState.isMuted) {
+          await audioTrack.unmute();
+          setMuteState((prev) => ({ ...prev, isMuted: false }));
+        } else {
+          await audioTrack.mute();
+          setMuteState((prev) => ({ ...prev, isMuted: true }));
+        }
+      }
+    } catch (error) {
+      console.error("Failed to toggle mute:", error);
+    }
+  }, [webrtc, muteState.isMuted]);
+  const setMute = (0, import_react3.useCallback)(
+    async (muted) => {
+      if (!webrtc.isConnected) return;
+      try {
+        const room2 = webrtc.room;
+        if (!room2) return;
+        const localParticipant = room2.localParticipant;
+        const audioTrack = localParticipant.getTrackPublication(Track.Source.Microphone)?.track;
+        if (audioTrack) {
+          if (muted && !muteState.isMuted) {
+            await audioTrack.mute();
+            setMuteState((prev) => ({ ...prev, isMuted: true }));
+          } else if (!muted && muteState.isMuted) {
+            await audioTrack.unmute();
+            setMuteState((prev) => ({ ...prev, isMuted: false }));
+          }
+        }
+      } catch (error) {
+        console.error("Failed to set mute:", error);
+      }
+    },
+    [webrtc, muteState.isMuted]
+  );
+  const sendChatMessage = (0, import_react3.useCallback)(
+    async (message) => {
+      if (!webrtc.isConnected) {
+        console.warn("Cannot send chat message: not connected to LiveKit");
+        return;
+      }
+      try {
+        const room2 = webrtc.room;
+        if (!room2) return;
+        const payload = {
+          type: "chat",
+          message,
+          timestamp: Date.now(),
+          sender: "user"
+        };
+        console.log("\u{1F4E4} Sending chat message via LiveKit:", payload);
+        const encoder = new TextEncoder();
+        const encodedData = encoder.encode(JSON.stringify(payload));
+        await room2.localParticipant.publishData(encodedData, {
+          reliable: true
+        });
+        const newMessage = {
+          id: `user-${Date.now()}`,
+          role: "user",
+          text: message,
+          isFinal: true,
+          timestamp: (/* @__PURE__ */ new Date()).toISOString()
+        };
+        setMessages((prev) => [...prev, newMessage]);
+        setMicState("thinking");
+      } catch (error) {
+        console.error("Failed to send chat message:", error);
+        throw error;
+      }
+    },
+    [webrtc]
+  );
   return {
     ...webrtc,
     messages,
@@ -25215,12 +25658,16 @@ var useCuekit = (options) => {
     status,
     setStatus,
     connect,
-    disconnect
+    disconnect,
+    muteState,
+    toggleMute,
+    setMute,
+    sendChatMessage
   };
 };
 
 // src/components/chat-popup.tsx
-var import_react9 = __toESM(require("react"));
+var import_react14 = __toESM(require("react"));
 
 // node_modules/devlop/lib/default.js
 function ok() {
@@ -32817,7 +33264,7 @@ var convert = (
    * @param {Test} [test]
    * @returns {Check}
    */
-  function(test) {
+  (function(test) {
     if (test === null || test === void 0) {
       return ok2;
     }
@@ -32831,7 +33278,7 @@ var convert = (
       return typeFactory(test);
     }
     throw new Error("Expected function, string, or object as test");
-  }
+  })
 );
 function anyFactory(tests) {
   const checks2 = [];
@@ -34011,7 +34458,7 @@ var CallableInstance = (
    * @param {string | symbol} property
    * @returns {(...parameters: Array<unknown>) => unknown}
    */
-  function(property) {
+  (function(property) {
     const self2 = this;
     const constr = self2.constructor;
     const proto = (
@@ -34026,7 +34473,7 @@ var CallableInstance = (
     };
     Object.setPrototypeOf(apply, proto);
     return apply;
-  }
+  })
 );
 
 // node_modules/unified/lib/index.js
@@ -37964,6 +38411,659 @@ var PhoneOffIcon = ({ width = 24, height = 24, className, ...props }) => {
 };
 var phone_off_default = PhoneOffIcon;
 
+// src/components/svgs/mic-off.tsx
+var import_react9 = __toESM(require("react"));
+var MicOffIcon = ({ style, className }) => {
+  return /* @__PURE__ */ import_react9.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className: `lucide lucide-mic-off-icon lucide-mic-off ${className || ""}`,
+      style
+    },
+    /* @__PURE__ */ import_react9.default.createElement("path", { d: "M12 19v3" }),
+    /* @__PURE__ */ import_react9.default.createElement("path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33" }),
+    /* @__PURE__ */ import_react9.default.createElement("path", { d: "M16.95 16.95A7 7 0 0 1 5 12v-2" }),
+    /* @__PURE__ */ import_react9.default.createElement("path", { d: "M18.89 13.23A7 7 0 0 0 19 12v-2" }),
+    /* @__PURE__ */ import_react9.default.createElement("path", { d: "m2 2 20 20" }),
+    /* @__PURE__ */ import_react9.default.createElement("path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12" })
+  );
+};
+var mic_off_default = MicOffIcon;
+
+// src/components/svgs/mic.tsx
+var import_react10 = __toESM(require("react"));
+var MicIcon = ({ width = 24, height = 24, className, ...props }) => {
+  return /* @__PURE__ */ import_react10.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width,
+      height,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      ...props
+    },
+    /* @__PURE__ */ import_react10.default.createElement("path", { d: "M12 19v3" }),
+    /* @__PURE__ */ import_react10.default.createElement("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
+    /* @__PURE__ */ import_react10.default.createElement("rect", { x: "9", y: "2", width: "6", height: "13", rx: "3" })
+  );
+};
+var mic_default = MicIcon;
+
+// src/components/draggable-resizable-container.tsx
+var import_react13 = __toESM(require("react"));
+
+// src/utils/draggable-resizable.ts
+var import_react11 = require("react");
+var absoluteToRelative = (position3, size, viewportWidth, viewportHeight) => {
+  return {
+    position: {
+      xPercent: position3.x / viewportWidth * 100,
+      yPercent: position3.y / viewportHeight * 100
+    },
+    size: {
+      widthPercent: size.width / viewportWidth * 100,
+      heightPercent: size.height / viewportHeight * 100
+    }
+  };
+};
+var relativeToAbsolute = (relativePosition, relativeSize, viewportWidth, viewportHeight) => {
+  return {
+    position: {
+      x: relativePosition.xPercent / 100 * viewportWidth,
+      y: relativePosition.yPercent / 100 * viewportHeight
+    },
+    size: {
+      width: relativeSize.widthPercent / 100 * viewportWidth,
+      height: relativeSize.heightPercent / 100 * viewportHeight
+    }
+  };
+};
+var DEFAULT_BOUNDS = {
+  minWidth: 300,
+  minHeight: 200,
+  maxWidth: typeof window !== "undefined" ? Math.min(window.innerWidth * 0.92, 800) : 800,
+  maxHeight: typeof window !== "undefined" ? Math.min(window.innerHeight * 0.9, 600) : 600
+};
+var DEFAULT_POSITION = { x: 0, y: 0 };
+var DEFAULT_SIZE = {
+  width: 420,
+  height: typeof window !== "undefined" ? Math.min(window.innerHeight * 0.55, 500) : 400
+};
+function useDraggableResizable(options = {}) {
+  const {
+    bounds = DEFAULT_BOUNDS,
+    initialPosition = DEFAULT_POSITION,
+    initialSize = DEFAULT_SIZE,
+    onPositionChange,
+    onSizeChange,
+    disabled = false,
+    dragHandle
+  } = options;
+  const [position3, setPositionState] = (0, import_react11.useState)(initialPosition);
+  const [size, setSizeState] = (0, import_react11.useState)(initialSize);
+  const [dragState, setDragState] = (0, import_react11.useState)({
+    isDragging: false,
+    startPosition: { x: 0, y: 0 },
+    startMousePosition: { x: 0, y: 0 }
+  });
+  const [resizeState, setResizeState] = (0, import_react11.useState)({
+    isResizing: false,
+    direction: "se",
+    startSize: { width: 0, height: 0 },
+    startPosition: { x: 0, y: 0 },
+    startMousePosition: { x: 0, y: 0 }
+  });
+  const containerRef = (0, import_react11.useRef)(null);
+  const constrainPosition = (0, import_react11.useCallback)((pos, size2) => {
+    const maxX = window.innerWidth - size2.width;
+    const maxY = window.innerHeight - size2.height;
+    return {
+      x: Math.max(0, Math.min(pos.x, maxX)),
+      y: Math.max(0, Math.min(pos.y, maxY))
+    };
+  }, []);
+  const constrainSize = (0, import_react11.useCallback)(
+    (newSize) => {
+      return {
+        width: Math.max(bounds.minWidth, Math.min(newSize.width, bounds.maxWidth || Infinity)),
+        height: Math.max(bounds.minHeight, Math.min(newSize.height, bounds.maxHeight || Infinity))
+      };
+    },
+    [bounds]
+  );
+  const setPosition = (0, import_react11.useCallback)(
+    (newPosition) => {
+      const constrainedPosition = constrainPosition(newPosition, size);
+      setPositionState(constrainedPosition);
+      onPositionChange?.(constrainedPosition);
+    },
+    [size, constrainPosition, onPositionChange]
+  );
+  const setSize = (0, import_react11.useCallback)(
+    (newSize) => {
+      const constrainedSize = constrainSize(newSize);
+      setSizeState(constrainedSize);
+      onSizeChange?.(constrainedSize);
+      const constrainedPosition = constrainPosition(position3, constrainedSize);
+      if (constrainedPosition.x !== position3.x || constrainedPosition.y !== position3.y) {
+        setPositionState(constrainedPosition);
+        onPositionChange?.(constrainedPosition);
+      }
+    },
+    [position3, constrainSize, constrainPosition, onSizeChange, onPositionChange]
+  );
+  const resetToInitial = (0, import_react11.useCallback)(() => {
+    setPositionState(initialPosition);
+    setSizeState(initialSize);
+    onPositionChange?.(initialPosition);
+    onSizeChange?.(initialSize);
+  }, [initialPosition, initialSize, onPositionChange, onSizeChange]);
+  const handleDragStart = (0, import_react11.useCallback)(
+    (e3) => {
+      if (disabled) return;
+      if (dragHandle) {
+        const target = e3.target;
+        if (!target.closest(dragHandle)) return;
+      }
+      e3.preventDefault();
+      e3.stopPropagation();
+      setDragState({
+        isDragging: true,
+        startPosition: { ...position3 },
+        startMousePosition: { x: e3.clientX, y: e3.clientY }
+      });
+    },
+    [disabled, dragHandle, position3]
+  );
+  const handleResizeStart = (0, import_react11.useCallback)(
+    (direction) => (e3) => {
+      if (disabled) return;
+      e3.preventDefault();
+      e3.stopPropagation();
+      setResizeState({
+        isResizing: true,
+        direction,
+        startSize: { ...size },
+        startPosition: { ...position3 },
+        startMousePosition: { x: e3.clientX, y: e3.clientY }
+      });
+    },
+    [disabled, size, position3]
+  );
+  (0, import_react11.useEffect)(() => {
+    const handleMouseMove = (e3) => {
+      if (dragState.isDragging) {
+        const deltaX = e3.clientX - dragState.startMousePosition.x;
+        const deltaY = e3.clientY - dragState.startMousePosition.y;
+        const newPosition = {
+          x: dragState.startPosition.x + deltaX,
+          y: dragState.startPosition.y + deltaY
+        };
+        setPosition(newPosition);
+      } else if (resizeState.isResizing) {
+        const deltaX = e3.clientX - resizeState.startMousePosition.x;
+        const deltaY = e3.clientY - resizeState.startMousePosition.y;
+        let newSize = { ...resizeState.startSize };
+        let newPosition = { ...resizeState.startPosition };
+        const { direction } = resizeState;
+        if (direction.includes("e")) {
+          newSize.width = resizeState.startSize.width + deltaX;
+        }
+        if (direction.includes("w")) {
+          newSize.width = resizeState.startSize.width - deltaX;
+          newPosition.x = resizeState.startPosition.x + deltaX;
+        }
+        if (direction.includes("s")) {
+          newSize.height = resizeState.startSize.height + deltaY;
+        }
+        if (direction.includes("n")) {
+          newSize.height = resizeState.startSize.height - deltaY;
+          newPosition.y = resizeState.startPosition.y + deltaY;
+        }
+        setSize(newSize);
+        if (newPosition.x !== resizeState.startPosition.x || newPosition.y !== resizeState.startPosition.y) {
+          setPosition(newPosition);
+        }
+      }
+    };
+    const handleMouseUp = () => {
+      setDragState((prev) => ({ ...prev, isDragging: false }));
+      setResizeState((prev) => ({ ...prev, isResizing: false }));
+    };
+    if (dragState.isDragging || resizeState.isResizing) {
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+    }
+    return () => {
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+    };
+  }, [dragState, resizeState, setPosition, setSize]);
+  const resizeHandlers = {
+    n: { onMouseDown: handleResizeStart("n") },
+    s: { onMouseDown: handleResizeStart("s") },
+    e: { onMouseDown: handleResizeStart("e") },
+    w: { onMouseDown: handleResizeStart("w") },
+    ne: { onMouseDown: handleResizeStart("ne") },
+    nw: { onMouseDown: handleResizeStart("nw") },
+    se: { onMouseDown: handleResizeStart("se") },
+    sw: { onMouseDown: handleResizeStart("sw") }
+  };
+  return {
+    position: position3,
+    size,
+    isDragging: dragState.isDragging,
+    isResizing: resizeState.isResizing,
+    dragHandlers: {
+      onMouseDown: handleDragStart
+    },
+    resizeHandlers,
+    setPosition,
+    setSize,
+    resetToInitial
+  };
+}
+function getResizeCursor(direction) {
+  const cursorMap = {
+    n: "n-resize",
+    s: "s-resize",
+    e: "e-resize",
+    w: "w-resize",
+    ne: "ne-resize",
+    nw: "nw-resize",
+    se: "se-resize",
+    sw: "sw-resize"
+  };
+  return cursorMap[direction];
+}
+
+// src/components/resize-handle.tsx
+var import_react12 = __toESM(require("react"));
+var ResizeHandle = ({
+  direction,
+  onMouseDown,
+  disabled = false,
+  className = "",
+  style = {},
+  size = 8
+}) => {
+  const getHandleStyle = () => {
+    const baseStyle = {
+      position: "absolute",
+      backgroundColor: "transparent",
+      cursor: disabled ? "default" : getResizeCursor(direction),
+      zIndex: 1e3,
+      userSelect: "none",
+      ...style
+    };
+    switch (direction) {
+      case "n":
+        return {
+          ...baseStyle,
+          top: -size / 2,
+          left: 0,
+          right: 0,
+          height: size
+        };
+      case "s":
+        return {
+          ...baseStyle,
+          bottom: -size / 2,
+          left: 0,
+          right: 0,
+          height: size
+        };
+      case "e":
+        return {
+          ...baseStyle,
+          top: 0,
+          bottom: 0,
+          right: -size / 2,
+          width: size
+        };
+      case "w":
+        return {
+          ...baseStyle,
+          top: 0,
+          bottom: 0,
+          left: -size / 2,
+          width: size
+        };
+      case "ne":
+        return {
+          ...baseStyle,
+          top: -size / 2,
+          right: -size / 2,
+          width: size,
+          height: size
+        };
+      case "nw":
+        return {
+          ...baseStyle,
+          top: -size / 2,
+          left: -size / 2,
+          width: size,
+          height: size
+        };
+      case "se":
+        return {
+          ...baseStyle,
+          bottom: -size / 2,
+          right: -size / 2,
+          width: size,
+          height: size
+        };
+      case "sw":
+        return {
+          ...baseStyle,
+          bottom: -size / 2,
+          left: -size / 2,
+          width: size,
+          height: size
+        };
+      default:
+        return baseStyle;
+    }
+  };
+  const handleMouseDown = (e3) => {
+    if (!disabled) {
+      onMouseDown(e3);
+    }
+  };
+  return /* @__PURE__ */ import_react12.default.createElement(
+    "div",
+    {
+      className: `resize-handle resize-handle-${direction} ${className}`,
+      style: getHandleStyle(),
+      onMouseDown: handleMouseDown,
+      "data-direction": direction,
+      "aria-label": `Resize ${direction}`
+    }
+  );
+};
+var ResizeHandles = ({
+  onResizeStart,
+  disabled = false,
+  className = "",
+  style = {},
+  size = 8,
+  showHandles = ["n", "s", "e", "w", "ne", "nw", "se", "sw"]
+}) => {
+  return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, showHandles.map((direction) => /* @__PURE__ */ import_react12.default.createElement(
+    ResizeHandle,
+    {
+      key: direction,
+      direction,
+      onMouseDown: onResizeStart(direction),
+      disabled,
+      className,
+      style,
+      size
+    }
+  )));
+};
+
+// src/components/draggable-resizable-container.tsx
+var DraggableResizableContainer = ({
+  children,
+  className = "",
+  style = {},
+  dragHandle,
+  showResizeHandles = true,
+  resizeHandleSize = 8,
+  onPositionChange,
+  onSizeChange,
+  onDragStart,
+  onDragEnd,
+  onResizeStart,
+  onResizeEnd,
+  storageKey,
+  persistPosition = false,
+  persistSize = false,
+  ...options
+}) => {
+  const containerRef = (0, import_react13.useRef)(null);
+  const loadPersistedData = () => {
+    if (!storageKey || typeof window === "undefined") return {};
+    try {
+      const data = localStorage.getItem(`cuekit-${storageKey}`);
+      if (data) {
+        const parsed = JSON.parse(data);
+        if (parsed.relativePosition && parsed.relativeSize) {
+          const viewportWidth = window.innerWidth;
+          const viewportHeight = window.innerHeight;
+          const { position: position4, size: size2 } = relativeToAbsolute(
+            parsed.relativePosition,
+            parsed.relativeSize,
+            viewportWidth,
+            viewportHeight
+          );
+          return { position: position4, size: size2 };
+        }
+        return {
+          position: parsed.position,
+          size: parsed.size
+        };
+      }
+    } catch (error) {
+      console.warn("Failed to load persisted position/size:", error);
+    }
+    return {};
+  };
+  const savePersistedData = (position4, size2) => {
+    if (!storageKey || typeof window === "undefined") return;
+    try {
+      const viewportWidth = window.innerWidth;
+      const viewportHeight = window.innerHeight;
+      const { position: relativePosition, size: relativeSize } = absoluteToRelative(
+        position4,
+        size2,
+        viewportWidth,
+        viewportHeight
+      );
+      const data = {};
+      if (persistPosition) {
+        data.position = position4;
+        data.relativePosition = relativePosition;
+      }
+      if (persistSize) {
+        data.size = size2;
+        data.relativeSize = relativeSize;
+      }
+      localStorage.setItem(`cuekit-${storageKey}`, JSON.stringify(data));
+    } catch (error) {
+      console.warn("Failed to save persisted position/size:", error);
+    }
+  };
+  const persistedData = loadPersistedData();
+  const initialPosition = persistedData.position || options.initialPosition;
+  const initialSize = persistedData.size || options.initialSize;
+  (0, import_react13.useEffect)(() => {
+    const handleResize = () => {
+      if (!storageKey || typeof window === "undefined") return;
+      try {
+        const data = localStorage.getItem(`cuekit-${storageKey}`);
+        if (data) {
+          const parsed = JSON.parse(data);
+          if (parsed.relativePosition && parsed.relativeSize) {
+            const viewportWidth = window.innerWidth;
+            const viewportHeight = window.innerHeight;
+            const { position: position4, size: size2 } = relativeToAbsolute(
+              parsed.relativePosition,
+              parsed.relativeSize,
+              viewportWidth,
+              viewportHeight
+            );
+            if (containerRef.current) {
+              containerRef.current.style.left = `${position4.x}px`;
+              containerRef.current.style.top = `${position4.y}px`;
+              containerRef.current.style.width = `${size2.width}px`;
+              containerRef.current.style.height = `${size2.height}px`;
+            }
+          }
+        }
+      } catch (error) {
+        console.warn("Failed to update position on resize:", error);
+      }
+    };
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [storageKey]);
+  const {
+    position: position3,
+    size,
+    isDragging,
+    isResizing,
+    dragHandlers,
+    resizeHandlers,
+    setPosition,
+    setSize
+  } = useDraggableResizable({
+    ...options,
+    initialPosition,
+    initialSize,
+    onPositionChange: (pos) => {
+      onPositionChange?.(pos);
+      if (persistPosition || persistSize) {
+        savePersistedData(pos, size);
+      }
+    },
+    onSizeChange: (newSize) => {
+      onSizeChange?.(newSize);
+      if (persistPosition || persistSize) {
+        savePersistedData(position3, newSize);
+      }
+    }
+  });
+  const handleDragStart = (e3) => {
+    dragHandlers.onMouseDown(e3);
+    onDragStart?.();
+  };
+  const handleResizeStart = (direction) => (e3) => {
+    resizeHandlers[direction].onMouseDown(e3);
+    onResizeStart?.();
+  };
+  (0, import_react13.useEffect)(() => {
+    if (!isDragging) {
+      onDragEnd?.();
+    }
+  }, [isDragging, onDragEnd]);
+  (0, import_react13.useEffect)(() => {
+    if (!isResizing) {
+      onResizeEnd?.();
+    }
+  }, [isResizing, onResizeEnd]);
+  const containerStyle = {
+    position: "fixed",
+    left: position3.x,
+    top: position3.y,
+    width: size.width,
+    height: size.height,
+    transform: "none",
+    // We use left/top instead of transform for better performance
+    zIndex: 1e3,
+    ...style
+  };
+  const containerClassName = [
+    "draggable-resizable-container",
+    isDragging ? "is-dragging" : "",
+    isResizing ? "is-resizing" : "",
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ import_react13.default.createElement(
+    "div",
+    {
+      ref: containerRef,
+      className: containerClassName,
+      style: containerStyle,
+      "data-cuekit-ignore": true
+    },
+    /* @__PURE__ */ import_react13.default.createElement(
+      "div",
+      {
+        className: "drag-handle",
+        style: {
+          position: "absolute",
+          top: 0,
+          left: 0,
+          right: 0,
+          height: "20px",
+          // Height of the header area
+          cursor: "move",
+          zIndex: 10
+        },
+        onMouseDown: handleDragStart,
+        "data-drag-handle": "true"
+      }
+    ),
+    /* @__PURE__ */ import_react13.default.createElement(
+      "div",
+      {
+        className: "draggable-content",
+        style: {
+          width: "100%",
+          height: "100%",
+          overflow: "hidden",
+          display: "flex",
+          flexDirection: "column"
+        }
+      },
+      children
+    ),
+    showResizeHandles && /* @__PURE__ */ import_react13.default.createElement(
+      ResizeHandles,
+      {
+        onResizeStart: handleResizeStart,
+        disabled: options.disabled,
+        size: resizeHandleSize
+      }
+    )
+  );
+};
+var useDraggableResizableContainer = (storageKey) => {
+  const loadData = () => {
+    if (!storageKey || typeof window === "undefined") return null;
+    try {
+      const data = localStorage.getItem(`cuekit-${storageKey}`);
+      return data ? JSON.parse(data) : null;
+    } catch {
+      return null;
+    }
+  };
+  const saveData = (data) => {
+    if (!storageKey || typeof window === "undefined") return;
+    try {
+      localStorage.setItem(`cuekit-${storageKey}`, JSON.stringify(data));
+    } catch (error) {
+      console.warn("Failed to save data:", error);
+    }
+  };
+  const clearData = () => {
+    if (!storageKey || typeof window === "undefined") return;
+    try {
+      localStorage.removeItem(`cuekit-${storageKey}`);
+    } catch (error) {
+      console.warn("Failed to clear data:", error);
+    }
+  };
+  return { loadData, saveData, clearData };
+};
+
 // src/components/chat-popup.tsx
 var ChatPopup = ({
   isOpen,
@@ -37980,15 +39080,28 @@ var ChatPopup = ({
   currentTheme = "dark",
   onThemeToggle,
   status,
-  anchor
+  anchor,
+  muteState,
+  onToggleMute,
+  // Draggable/Resizable props
+  draggable = true,
+  resizable = true,
+  initialPosition,
+  initialSize,
+  onPositionChange,
+  onSizeChange,
+  persistPosition = true,
+  persistSize = true,
+  storageKey = "chat-popup"
 }) => {
-  const [inputText, setInputText] = (0, import_react9.useState)("");
-  const [isSending, setIsSending] = (0, import_react9.useState)(false);
-  const messagesEndRef = (0, import_react9.useRef)(null);
+  const { title, showLogo, showAIIcon, showUserIcon } = useAnsyrContext();
+  const [inputText, setInputText] = (0, import_react14.useState)("");
+  const [isSending, setIsSending] = (0, import_react14.useState)(false);
+  const messagesEndRef = (0, import_react14.useRef)(null);
   const scrollToBottom = () => {
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
   };
-  (0, import_react9.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     console.log("\u{1F4EC} ChatPopup received messages:", JSON.stringify(messages, null, 2));
     scrollToBottom();
   }, [messages]);
@@ -38010,7 +39123,6 @@ var ChatPopup = ({
       handleSend();
     }
   };
-  if (!isOpen || isMinimized) return null;
   const getStatusText = () => {
     if (status) return status;
     if (micState === "listening") return "Listening...";
@@ -38018,48 +39130,57 @@ var ChatPopup = ({
     if (micState === "replying") return "Responding...";
     return "Listening...";
   };
-  const getPositionStyle = () => {
+  const getInitialPosition = () => {
+    if (initialPosition) return initialPosition;
     if (!anchor) {
       return {
-        bottom: "100px",
-        right: "20px"
+        x: window.innerWidth - 420 - 20,
+        y: window.innerHeight - window.innerHeight * 0.55 - 20
       };
     }
     const bottomOffset = anchor.bottom + anchor.size + 16;
-    const baseStyle = {
-      bottom: `${bottomOffset}px`
-    };
+    const popupHeight = window.innerHeight * 0.55;
+    const y = window.innerHeight - bottomOffset - popupHeight;
     switch (anchor.position) {
       case "bottom-center":
-        return {
-          ...baseStyle,
-          left: "50%",
-          transform: "translateX(-50%)"
-        };
+        return { x: (window.innerWidth - 420) / 2, y };
       case "bottom-left":
-        return {
-          ...baseStyle,
-          left: "20px"
-        };
+        return { x: 20, y };
       case "bottom-right":
       default:
-        return {
-          ...baseStyle,
-          right: "20px"
-        };
+        return { x: window.innerWidth - 420 - 20, y };
     }
   };
-  const positionStyle = getPositionStyle();
-  return /* @__PURE__ */ import_react9.default.createElement(
-    "div",
+  const getInitialSize = () => {
+    if (initialSize) return initialSize;
+    return {
+      width: 420,
+      height: window.innerHeight * 0.55
+    };
+  };
+  if (!isOpen || isMinimized) return null;
+  return /* @__PURE__ */ import_react14.default.createElement(
+    DraggableResizableContainer,
     {
-      "data-cuekit-ignore": true,
+      initialPosition: getInitialPosition(),
+      initialSize: getInitialSize(),
+      onPositionChange,
+      onSizeChange,
+      persistPosition,
+      persistSize,
+      storageKey,
+      disabled: !draggable && !resizable,
+      showResizeHandles: resizable,
+      bounds: {
+        minWidth: 300,
+        minHeight: 200,
+        maxWidth: Math.min(window.innerWidth * 0.92, 800),
+        // Cap at 800px max width
+        maxHeight: Math.min(window.innerHeight * 0.9, 600)
+        // Cap at 600px max height
+      },
       className: `cuekit-voice-popup ${currentTheme === "dark" ? "cuekit-dark" : ""}`,
       style: {
-        position: "fixed",
-        width: "420px",
-        maxWidth: "92vw",
-        height: "55vh",
         borderRadius: "10px",
         background: "hsl(var(--voice-bg))",
         boxShadow: "var(--shadow-card)",
@@ -38067,13 +39188,11 @@ var ChatPopup = ({
         display: "flex",
         animation: "scaleIn 0.3s ease-out",
         flexDirection: "column",
-        zIndex: 1e3,
         fontFamily: "Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif",
-        overflow: "hidden",
-        ...positionStyle
+        overflow: "hidden"
       }
     },
-    /* @__PURE__ */ import_react9.default.createElement(
+    /* @__PURE__ */ import_react14.default.createElement(
       "div",
       {
         style: {
@@ -38084,14 +39203,14 @@ var ChatPopup = ({
           justifyContent: "space-between"
         }
       },
-      /* @__PURE__ */ import_react9.default.createElement("div", { style: { display: "flex", alignItems: "center", gap: 0 } }, /* @__PURE__ */ import_react9.default.createElement(
+      /* @__PURE__ */ import_react14.default.createElement("div", { style: { display: "flex", alignItems: "center", gap: 0 } }, showLogo && /* @__PURE__ */ import_react14.default.createElement(
         "img",
         {
           src: "https://dashboard.cuekit.ai/_next/image?url=%2Fimages%2Fcuekit-logo-2.png&w=256&q=100",
           alt: "Cuekit AI",
           style: { width: 58, objectFit: "cover" }
         }
-      ), /* @__PURE__ */ import_react9.default.createElement(
+      ), /* @__PURE__ */ import_react14.default.createElement(
         "div",
         {
           style: {
@@ -38102,10 +39221,11 @@ var ChatPopup = ({
             justifyContent: "center"
           }
         },
-        /* @__PURE__ */ import_react9.default.createElement(
+        /* @__PURE__ */ import_react14.default.createElement(
           "span",
           {
             style: {
+              paddingLeft: showLogo ? 0 : 12,
               fontSize: 18,
               fontWeight: 700,
               lineHeight: "1.2",
@@ -38117,9 +39237,9 @@ var ChatPopup = ({
               WebkitTextFillColor: "transparent"
             }
           },
-          "Cuekit.ai"
+          title
         ),
-        /* @__PURE__ */ import_react9.default.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 4 } }, /* @__PURE__ */ import_react9.default.createElement(
+        /* @__PURE__ */ import_react14.default.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 4 } }, /* @__PURE__ */ import_react14.default.createElement(
           "div",
           {
             style: {
@@ -38135,7 +39255,7 @@ var ChatPopup = ({
               fontWeight: "500"
             }
           },
-          /* @__PURE__ */ import_react9.default.createElement(
+          /* @__PURE__ */ import_react14.default.createElement(
             "span",
             {
               style: {
@@ -38146,8 +39266,8 @@ var ChatPopup = ({
           )
         ))
       )),
-      /* @__PURE__ */ import_react9.default.createElement("div", { style: { minWidth: 100, textAlign: "center" } }),
-      /* @__PURE__ */ import_react9.default.createElement(
+      /* @__PURE__ */ import_react14.default.createElement("div", { style: { minWidth: 100, textAlign: "center" } }),
+      /* @__PURE__ */ import_react14.default.createElement(
         "div",
         {
           style: {
@@ -38159,7 +39279,7 @@ var ChatPopup = ({
             top: 16
           }
         },
-        onThemeToggle && /* @__PURE__ */ import_react9.default.createElement(
+        onThemeToggle && /* @__PURE__ */ import_react14.default.createElement(
           "button",
           {
             onClick: () => {
@@ -38189,7 +39309,7 @@ var ChatPopup = ({
             "aria-label": "Toggle theme",
             title: `Switch to ${currentTheme === "dark" ? "light" : "dark"} mode`
           },
-          currentTheme === "dark" ? /* @__PURE__ */ import_react9.default.createElement(
+          currentTheme === "dark" ? /* @__PURE__ */ import_react14.default.createElement(
             sun_default,
             {
               style: {
@@ -38199,7 +39319,7 @@ var ChatPopup = ({
                 animation: "themeToggleEnter 0.3s ease-in-out"
               }
             }
-          ) : /* @__PURE__ */ import_react9.default.createElement(
+          ) : /* @__PURE__ */ import_react14.default.createElement(
             moon_default,
             {
               style: {
@@ -38211,7 +39331,7 @@ var ChatPopup = ({
             }
           )
         ),
-        /* @__PURE__ */ import_react9.default.createElement(
+        /* @__PURE__ */ import_react14.default.createElement(
           "button",
           {
             onClick: onMinimize,
@@ -38238,11 +39358,11 @@ var ChatPopup = ({
             "aria-label": "Minimize",
             title: "Minimize chat"
           },
-          /* @__PURE__ */ import_react9.default.createElement(close_default, { style: { width: 16, height: 16, color: "hsl(var(--voice-text-muted))" } })
+          /* @__PURE__ */ import_react14.default.createElement(close_default, { style: { width: 16, height: 16, color: "hsl(var(--voice-text-muted))" } })
         )
       )
     ),
-    /* @__PURE__ */ import_react9.default.createElement(
+    /* @__PURE__ */ import_react14.default.createElement(
       "div",
       {
         style: {
@@ -38255,7 +39375,7 @@ var ChatPopup = ({
           color: "hsl(var(--voice-text))"
         }
       },
-      messages.length === 0 ? /* @__PURE__ */ import_react9.default.createElement(
+      messages.length === 0 ? /* @__PURE__ */ import_react14.default.createElement(
         "div",
         {
           style: {
@@ -38265,7 +39385,7 @@ var ChatPopup = ({
           }
         },
         "Start a conversation with CueKit AI"
-      ) : messages.map((message, index2) => /* @__PURE__ */ import_react9.default.createElement(
+      ) : messages.map((message, index2) => /* @__PURE__ */ import_react14.default.createElement(
         "div",
         {
           key: index2,
@@ -38279,7 +39399,7 @@ var ChatPopup = ({
             justifyContent: message.sender === "user" ? "flex-end" : "flex-start"
           }
         },
-        message.sender === "assistant" && /* @__PURE__ */ import_react9.default.createElement(
+        message.sender === "assistant" && showAIIcon && /* @__PURE__ */ import_react14.default.createElement(
           "div",
           {
             style: {
@@ -38294,7 +39414,7 @@ var ChatPopup = ({
               overflow: "hidden"
             }
           },
-          /* @__PURE__ */ import_react9.default.createElement(
+          /* @__PURE__ */ import_react14.default.createElement(
             "img",
             {
               src: "https://dashboard.cuekit.ai/_next/image?url=%2Fimages%2Fcuekit-logo-2.png&w=256&q=100",
@@ -38308,7 +39428,7 @@ var ChatPopup = ({
             }
           )
         ),
-        /* @__PURE__ */ import_react9.default.createElement(
+        /* @__PURE__ */ import_react14.default.createElement(
           "div",
           {
             style: {
@@ -38319,7 +39439,7 @@ var ChatPopup = ({
               flex: 1
             }
           },
-          /* @__PURE__ */ import_react9.default.createElement(
+          /* @__PURE__ */ import_react14.default.createElement(
             "div",
             {
               style: {
@@ -38337,12 +39457,12 @@ var ChatPopup = ({
                 marginLeft: message.sender === "user" ? "auto" : 0
               }
             },
-            /* @__PURE__ */ import_react9.default.createElement("div", null, /* @__PURE__ */ import_react9.default.createElement(
+            /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement(
               Markdown,
               {
                 remarkPlugins: [remarkGfm],
                 components: {
-                  p: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  p: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "p",
                     {
                       style: {
@@ -38353,7 +39473,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  h1: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  h1: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "h1",
                     {
                       style: {
@@ -38365,7 +39485,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  h2: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  h2: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "h2",
                     {
                       style: {
@@ -38377,7 +39497,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  h3: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  h3: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "h3",
                     {
                       style: {
@@ -38389,7 +39509,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  ul: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  ul: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "ul",
                     {
                       style: {
@@ -38401,7 +39521,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  ol: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  ol: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "ol",
                     {
                       style: {
@@ -38413,7 +39533,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  li: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  li: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "li",
                     {
                       style: {
@@ -38424,7 +39544,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  strong: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  strong: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "strong",
                     {
                       style: {
@@ -38435,7 +39555,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  em: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  em: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "em",
                     {
                       style: {
@@ -38446,7 +39566,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  code: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  code: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "code",
                     {
                       style: {
@@ -38459,7 +39579,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  pre: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  pre: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "pre",
                     {
                       style: {
@@ -38474,7 +39594,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  blockquote: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
+                  blockquote: ({ children }) => /* @__PURE__ */ import_react14.default.createElement(
                     "blockquote",
                     {
                       style: {
@@ -38493,7 +39613,7 @@ var ChatPopup = ({
               message.text
             ))
           ),
-          message.sender === "user" && /* @__PURE__ */ import_react9.default.createElement(
+          message.sender === "user" && showUserIcon && /* @__PURE__ */ import_react14.default.createElement(
             "div",
             {
               style: {
@@ -38514,9 +39634,9 @@ var ChatPopup = ({
           )
         )
       )),
-      /* @__PURE__ */ import_react9.default.createElement("div", { ref: messagesEndRef })
+      /* @__PURE__ */ import_react14.default.createElement("div", { ref: messagesEndRef })
     ),
-    /* @__PURE__ */ import_react9.default.createElement(
+    /* @__PURE__ */ import_react14.default.createElement(
       "div",
       {
         style: {
@@ -38525,7 +39645,7 @@ var ChatPopup = ({
           background: "hsl(var(--voice-bg))"
         }
       },
-      /* @__PURE__ */ import_react9.default.createElement(
+      /* @__PURE__ */ import_react14.default.createElement(
         "form",
         {
           onSubmit: (e3) => {
@@ -38534,7 +39654,7 @@ var ChatPopup = ({
           },
           style: { display: "flex", alignItems: "center", gap: 8, margin: 0 }
         },
-        /* @__PURE__ */ import_react9.default.createElement(
+        /* @__PURE__ */ import_react14.default.createElement(
           "input",
           {
             type: "text",
@@ -38561,7 +39681,47 @@ var ChatPopup = ({
             }
           }
         ),
-        isConnected2 && onEndCall && /* @__PURE__ */ import_react9.default.createElement(
+        muteState?.canMute && onToggleMute && /* @__PURE__ */ import_react14.default.createElement(
+          "button",
+          {
+            onClick: onToggleMute,
+            style: {
+              padding: "10px 12px",
+              borderRadius: 8,
+              border: "1px solid hsl(var(--voice-accent))",
+              background: "hsl(var(--voice-accent))",
+              fontSize: 12,
+              fontWeight: 700,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              cursor: "pointer",
+              transition: "all 0.3s ease"
+            },
+            "aria-label": muteState.isMuted ? "Unmute microphone" : "Mute microphone",
+            title: muteState.isMuted ? "Unmute microphone" : "Mute microphone"
+          },
+          muteState.isMuted ? /* @__PURE__ */ import_react14.default.createElement(
+            mic_off_default,
+            {
+              style: {
+                width: 16,
+                height: 16,
+                color: "hsl(var(--voice-user-text))"
+              }
+            }
+          ) : /* @__PURE__ */ import_react14.default.createElement(
+            mic_default,
+            {
+              style: {
+                width: 16,
+                height: 16,
+                color: "hsl(var(--voice-user-text))"
+              }
+            }
+          )
+        ),
+        isConnected2 && onEndCall && /* @__PURE__ */ import_react14.default.createElement(
           "button",
           {
             type: "submit",
@@ -38580,7 +39740,7 @@ var ChatPopup = ({
               cursor: "pointer"
             }
           },
-          /* @__PURE__ */ import_react9.default.createElement(phone_off_default, { style: { width: 16, height: 16 } })
+          /* @__PURE__ */ import_react14.default.createElement(phone_off_default, { style: { width: 16, height: 16 } })
         )
       )
     )
@@ -38588,7 +39748,7 @@ var ChatPopup = ({
 };
 
 // src/components/border-glow.tsx
-var import_react10 = __toESM(require("react"));
+var import_react15 = __toESM(require("react"));
 var BorderGlow = ({ isActive }) => {
   if (!isActive) return null;
   const styles = {
@@ -38715,7 +39875,7 @@ var BorderGlow = ({ isActive }) => {
       opacity: 0.6
     }
   };
-  return /* @__PURE__ */ import_react10.default.createElement(import_react10.default.Fragment, null, /* @__PURE__ */ import_react10.default.createElement("style", null, `
+  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement("style", null, `
           @keyframes borderPulse {
             0%, 100% {
               opacity: 1;
@@ -38724,12 +39884,12 @@ var BorderGlow = ({ isActive }) => {
               opacity: 0.5;
             }
           }
-        `), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.container }, /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.rightBorder1 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.rightBorder2 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.rightBorder3 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.leftBorder1 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.leftBorder2 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.leftBorder3 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.cornerTopLeft }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.cornerTopRight }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.cornerBottomRight }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.cornerBottomLeft })));
+        `), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.container }, /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.rightBorder1 }), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.rightBorder2 }), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.rightBorder3 }), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.leftBorder1 }), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.leftBorder2 }), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.leftBorder3 }), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.cornerTopLeft }), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.cornerTopRight }), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.cornerBottomRight }), /* @__PURE__ */ import_react15.default.createElement("div", { style: styles.cornerBottomLeft })));
 };
 var border_glow_default = BorderGlow;
 
 // src/components/voice-intensity-visualizer.tsx
-var import_react12 = __toESM(require("react"));
+var import_react17 = __toESM(require("react"));
 
 // node_modules/@livekit/components-react/dist/hooks-C2Bp5v2q.mjs
 var r2 = __toESM(require("react"), 1);
@@ -38745,7 +39905,7 @@ var Me = { exports: {} };
 var Or = Me.exports;
 var kt;
 function kr() {
-  return kt || (kt = 1, function(e3) {
+  return kt || (kt = 1, (function(e3) {
     (function(t, n) {
       e3.exports ? e3.exports = n() : t.log = n();
     })(Or, function() {
@@ -38889,7 +40049,7 @@ function kr() {
         return o2;
       }, s.default = s, s;
     });
-  }(Me)), Me.exports;
+  })(Me)), Me.exports;
 }
 var _r = kr();
 var Lr = /* @__PURE__ */ Ar(_r);
@@ -39112,7 +40272,7 @@ function Ue(e3, t) {
     0 <= n && e3.splice(n, 1);
   }
 }
-var Oe = function() {
+var Oe = (function() {
   function e3(t) {
     this.initialTeardown = t, this.closed = false, this._parentage = null, this._finalizers = null;
   }
@@ -39196,11 +40356,11 @@ var Oe = function() {
   }, e3.prototype.remove = function(t) {
     var n = this._finalizers;
     n && Ue(n, t), t instanceof e3 && t._removeParent(this);
-  }, e3.EMPTY = function() {
+  }, e3.EMPTY = (function() {
     var t = new e3();
     return t.closed = true, t;
-  }(), e3;
-}();
+  })(), e3;
+})();
 var an = Oe.EMPTY;
 function cn(e3) {
   return e3 instanceof Oe || e3 && "closed" in e3 && P(e3.remove) && P(e3.add) && P(e3.unsubscribe);
@@ -39232,7 +40392,7 @@ function je() {
 function Re(e3) {
   e3();
 }
-var gt = function(e3) {
+var gt = (function(e3) {
   te(t, e3);
   function t(n) {
     var r3 = e3.call(this) || this;
@@ -39263,8 +40423,8 @@ var gt = function(e3) {
       this.unsubscribe();
     }
   }, t;
-}(Oe);
-var Nr = function() {
+})(Oe);
+var Nr = (function() {
   function e3(t) {
     this.partialObserver = t;
   }
@@ -39295,8 +40455,8 @@ var Nr = function() {
         Le(n);
       }
   }, e3;
-}();
-var Ce = function(e3) {
+})();
+var Ce = (function(e3) {
   te(t, e3);
   function t(n, r3, i2) {
     var o2 = e3.call(this) || this, s;
@@ -39307,7 +40467,7 @@ var Ce = function(e3) {
     } : s = n, o2.destination = new Nr(s), o2;
   }
   return t;
-}(gt);
+})(gt);
 function Le(e3) {
   un(e3);
 }
@@ -39320,9 +40480,9 @@ var Ur = {
   error: Fr,
   complete: je
 };
-var bt = function() {
+var bt = (function() {
   return typeof Symbol == "function" && Symbol.observable || "@@observable";
-}();
+})();
 function Ge(e3) {
   return e3;
 }
@@ -39333,7 +40493,7 @@ function jr(e3) {
     }, n);
   };
 }
-var k = function() {
+var k = (function() {
   function e3(t) {
     t && (this._subscribe = t);
   }
@@ -39392,7 +40552,7 @@ var k = function() {
   }, e3.create = function(t) {
     return new e3(t);
   }, e3;
-}();
+})();
 function Lt(e3) {
   var t;
   return (t = e3 ?? Dr.Promise) !== null && t !== void 0 ? t : Promise;
@@ -39422,7 +40582,7 @@ function j(e3) {
 function F(e3, t, n, r3, i2) {
   return new Hr(e3, t, n, r3, i2);
 }
-var Hr = function(e3) {
+var Hr = (function(e3) {
   te(t, e3);
   function t(n, r3, i2, o2, s, a) {
     var c = e3.call(this, n) || this;
@@ -39457,13 +40617,13 @@ var Hr = function(e3) {
       e3.prototype.unsubscribe.call(this), !r3 && ((n = this.onFinalize) === null || n === void 0 || n.call(this));
     }
   }, t;
-}(gt);
+})(gt);
 var zr = mt(function(e3) {
   return function() {
     e3(this), this.name = "ObjectUnsubscribedError", this.message = "object unsubscribed";
   };
 });
-var ee = function(e3) {
+var ee = (function(e3) {
   te(t, e3);
   function t() {
     var n = e3.call(this) || this;
@@ -39542,8 +40702,8 @@ var ee = function(e3) {
   }, t.create = function(n, r3) {
     return new It(n, r3);
   }, t;
-}(k);
-var It = function(e3) {
+})(k);
+var It = (function(e3) {
   te(t, e3);
   function t(n, r3) {
     var i2 = e3.call(this) || this;
@@ -39562,8 +40722,8 @@ var It = function(e3) {
     var r3, i2;
     return (i2 = (r3 = this.source) === null || r3 === void 0 ? void 0 : r3.subscribe(n)) !== null && i2 !== void 0 ? i2 : an;
   }, t;
-}(ee);
-var ln = function(e3) {
+})(ee);
+var ln = (function(e3) {
   te(t, e3);
   function t(n) {
     var r3 = e3.call(this) || this;
@@ -39586,13 +40746,13 @@ var ln = function(e3) {
   }, t.prototype.next = function(n) {
     e3.prototype.next.call(this, this._value = n);
   }, t;
-}(ee);
+})(ee);
 var Yr = {
   now: function() {
     return Date.now();
   }
 };
-var qr = function(e3) {
+var qr = (function(e3) {
   te(t, e3);
   function t(n, r3) {
     return e3.call(this) || this;
@@ -39600,7 +40760,7 @@ var qr = function(e3) {
   return t.prototype.schedule = function(n, r3) {
     return this;
   }, t;
-}(Oe);
+})(Oe);
 var Mt = {
   setInterval: function(e3, t) {
     for (var n = [], r3 = 2; r3 < arguments.length; r3++)
@@ -39612,7 +40772,7 @@ var Mt = {
   },
   delegate: void 0
 };
-var Kr = function(e3) {
+var Kr = (function(e3) {
   te(t, e3);
   function t(n, r3) {
     var i2 = e3.call(this, n, r3) || this;
@@ -39654,16 +40814,16 @@ var Kr = function(e3) {
       this.work = this.state = this.scheduler = null, this.pending = false, Ue(o2, this), r3 != null && (this.id = this.recycleAsyncId(i2, r3, null)), this.delay = null, e3.prototype.unsubscribe.call(this);
     }
   }, t;
-}(qr);
-var Rt = function() {
+})(qr);
+var Rt = (function() {
   function e3(t, n) {
     n === void 0 && (n = e3.now), this.schedulerActionCtor = t, this.now = n;
   }
   return e3.prototype.schedule = function(t, n, r3) {
     return n === void 0 && (n = 0), new this.schedulerActionCtor(this, t).schedule(r3, n);
   }, e3.now = Yr.now, e3;
-}();
-var Gr = function(e3) {
+})();
+var Gr = (function(e3) {
   te(t, e3);
   function t(n, r3) {
     r3 === void 0 && (r3 = Rt.now);
@@ -39688,7 +40848,7 @@ var Gr = function(e3) {
       throw i2;
     }
   }, t;
-}(Rt);
+})(Rt);
 var Qr = new Gr(Kr);
 function Jr(e3) {
   return e3 && P(e3.schedule);
@@ -40375,7 +41535,7 @@ function Yt(e3, t = {}) {
 
 // node_modules/@livekit/components-react/dist/components-Bz2b1Fa9.mjs
 var e2 = __toESM(require("react"), 1);
-var import_react11 = require("react");
+var import_react16 = require("react");
 init_livekit_client_esm();
 var Y;
 var ue;
@@ -40470,8 +41630,8 @@ var Dt = (t) => {
 };
 var fe2 = (t) => [[Math.floor(t / 2)], [-1]];
 var Ut2 = (t, n, a) => {
-  const [r3, c] = (0, import_react11.useState)(0), [s, o2] = (0, import_react11.useState)([[]]);
-  (0, import_react11.useEffect)(() => {
+  const [r3, c] = (0, import_react16.useState)(0), [s, o2] = (0, import_react16.useState)([[]]);
+  (0, import_react16.useEffect)(() => {
     if (t === "thinking")
       o2(fe2(n));
     else if (t === "connecting" || t === "initializing") {
@@ -40480,8 +41640,8 @@ var Ut2 = (t, n, a) => {
     } else o2(t === "listening" ? fe2(n) : t === void 0 || t === "speaking" ? [new Array(n).fill(0).map((i2, u) => u)] : [[]]);
     c(0);
   }, [t, n]);
-  const l = (0, import_react11.useRef)(null);
-  return (0, import_react11.useEffect)(() => {
+  const l = (0, import_react16.useRef)(null);
+  return (0, import_react16.useEffect)(() => {
     let i2 = performance.now();
     const u = (d) => {
       d - i2 >= a && (c((f) => f + 1), i2 = d), l.current = requestAnimationFrame(u);
@@ -40551,8 +41711,8 @@ var Xt = /* @__PURE__ */ e2.forwardRef(
 init_livekit_client_esm();
 init_webrtc_service();
 var VoiceIntensityWithRoom = (props) => {
-  const [room2, setRoom] = (0, import_react12.useState)(null);
-  (0, import_react12.useEffect)(() => {
+  const [room2, setRoom] = (0, import_react17.useState)(null);
+  (0, import_react17.useEffect)(() => {
     if (props.isActive) {
       const currentRoom = getRoom();
       if (currentRoom) {
@@ -40565,7 +41725,7 @@ var VoiceIntensityWithRoom = (props) => {
   if (!room2) {
     return null;
   }
-  return /* @__PURE__ */ import_react12.default.createElement(Wn.Provider, { value: room2 }, /* @__PURE__ */ import_react12.default.createElement(VoiceIntensityBars, { ...props }));
+  return /* @__PURE__ */ import_react17.default.createElement(Wn.Provider, { value: room2 }, /* @__PURE__ */ import_react17.default.createElement(VoiceIntensityBars, { ...props }));
 };
 var VoiceIntensityBars = ({
   isActive,
@@ -40608,7 +41768,7 @@ var VoiceIntensityBars = ({
   if (!trackRef) {
     return null;
   }
-  return /* @__PURE__ */ import_react12.default.createElement(
+  return /* @__PURE__ */ import_react17.default.createElement(
     "div",
     {
       className: `voice-intensity-visualizer ${className}`,
@@ -40625,7 +41785,7 @@ var VoiceIntensityBars = ({
         pointerEvents: "none"
       }
     },
-    /* @__PURE__ */ import_react12.default.createElement(
+    /* @__PURE__ */ import_react17.default.createElement(
       Xt,
       {
         barCount,
@@ -40639,7 +41799,7 @@ var VoiceIntensityBars = ({
           gap: "0.25rem"
         }
       },
-      /* @__PURE__ */ import_react12.default.createElement("span", { className: "cuekit-voice-intensity-bar" })
+      /* @__PURE__ */ import_react17.default.createElement("span", { className: "cuekit-voice-intensity-bar" })
     )
   );
 };
@@ -40648,10 +41808,18 @@ var VoiceIntensityVisualizer = VoiceIntensityWithRoom;
 // src/components/mic-button.tsx
 init_webrtc_service();
 
-// src/components/svgs/mic.tsx
-var import_react13 = __toESM(require("react"));
-var MicIcon = ({ width = 24, height = 24, className, ...props }) => {
-  return /* @__PURE__ */ import_react13.default.createElement(
+// src/components/language-selector.tsx
+var import_react19 = __toESM(require("react"));
+
+// src/components/svgs/chevron-down.tsx
+var import_react18 = __toESM(require("react"));
+function ChevronDownIcon({
+  width = 24,
+  height = 24,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ import_react18.default.createElement(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -40660,41 +41828,117 @@ var MicIcon = ({ width = 24, height = 24, className, ...props }) => {
       viewBox: "0 0 24 24",
       fill: "none",
       stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
       className,
       ...props
     },
-    /* @__PURE__ */ import_react13.default.createElement("path", { d: "M12 19v3" }),
-    /* @__PURE__ */ import_react13.default.createElement("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
-    /* @__PURE__ */ import_react13.default.createElement("rect", { x: "9", y: "2", width: "6", height: "13", rx: "3" })
+    /* @__PURE__ */ import_react18.default.createElement("path", { d: "m6 9 6 6 6-6" })
   );
-};
-var mic_default = MicIcon;
+}
 
-// src/components/svgs/loader.tsx
-var import_react14 = __toESM(require("react"));
-var LoaderIcon = ({ width = 24, height = 24, className, ...props }) => {
-  return /* @__PURE__ */ import_react14.default.createElement(
-    "svg",
+// src/components/language-selector.tsx
+var FLAG_EMOJIS = {
+  "en-US": "\u{1F1FA}\u{1F1F8}",
+  "ar-SA": "\u{1F1F8}\u{1F1E6}",
+  "es-ES": "\u{1F1EA}\u{1F1F8}",
+  "fr-FR": "\u{1F1EB}\u{1F1F7}",
+  "de-DE": "\u{1F1E9}\u{1F1EA}",
+  "it-IT": "\u{1F1EE}\u{1F1F9}",
+  "pt-BR": "\u{1F1E7}\u{1F1F7}",
+  "ja-JP": "\u{1F1EF}\u{1F1F5}",
+  "ko-KR": "\u{1F1F0}\u{1F1F7}",
+  "zh-CN": "\u{1F1E8}\u{1F1F3}",
+  "hi-IN": "\u{1F1EE}\u{1F1F3}"
+};
+var LanguageSelector = ({
+  selectedLanguage,
+  onLanguageChange,
+  availableLanguages,
+  disabled = false,
+  className = "",
+  tooltip,
+  screenPosition = "bottom-center"
+}) => {
+  const [isOpen, setIsOpen] = (0, import_react19.useState)(false);
+  const [showTooltip, setShowTooltip] = (0, import_react19.useState)(false);
+  const [dropdownUp, setDropdownUp] = (0, import_react19.useState)(false);
+  const dropdownRef = (0, import_react19.useRef)(null);
+  (0, import_react19.useEffect)(() => {
+    const handleClickOutside = (event) => {
+      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, []);
+  const handleLanguageSelect = (language) => {
+    if (disabled) return;
+    onLanguageChange(language);
+    setIsOpen(false);
+  };
+  const handleButtonClick = () => {
+    if (disabled) return;
+    const isBottomPosition = screenPosition.startsWith("bottom");
+    setDropdownUp(isBottomPosition);
+    setIsOpen(!isOpen);
+  };
+  const getFlagEmoji = (code4) => {
+    return FLAG_EMOJIS[code4] || "\u{1F310}";
+  };
+  return /* @__PURE__ */ import_react19.default.createElement(
+    "div",
     {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "24",
-      height: "24",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className,
-      ...props
+      className: `language-selector-container ${className}`,
+      ref: dropdownRef,
+      onMouseEnter: () => {
+        if (disabled) {
+          setShowTooltip(true);
+        }
+      },
+      onMouseLeave: () => {
+        setShowTooltip(false);
+      }
     },
-    /* @__PURE__ */ import_react14.default.createElement("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
+    /* @__PURE__ */ import_react19.default.createElement(
+      "button",
+      {
+        className: `language-selector-button ${isOpen ? "open" : ""} ${disabled ? "disabled" : ""}`,
+        onClick: handleButtonClick,
+        disabled,
+        "aria-label": disabled ? tooltip || "Language cannot be changed during conversation" : "Select language",
+        "aria-expanded": isOpen,
+        "aria-haspopup": "listbox"
+      },
+      /* @__PURE__ */ import_react19.default.createElement("div", { className: "language-selector-content" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "language-flag" }, getFlagEmoji(selectedLanguage.code)), /* @__PURE__ */ import_react19.default.createElement("span", { className: "language-code" }, selectedLanguage.code), /* @__PURE__ */ import_react19.default.createElement(
+        ChevronDownIcon,
+        {
+          className: `language-chevron ${isOpen ? dropdownUp ? "rotated-up" : "rotated" : ""}`,
+          width: 14,
+          height: 14
+        }
+      ))
+    ),
+    disabled && /* @__PURE__ */ import_react19.default.createElement("div", { className: `language-tooltip ${showTooltip ? "show" : ""}` }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "language-tooltip-content" }, tooltip || "Close the conversation to change the language"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "language-tooltip-arrow" })),
+    isOpen && /* @__PURE__ */ import_react19.default.createElement("div", { className: `language-dropdown ${dropdownUp ? "dropdown-up" : ""}` }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "language-dropdown-content" }, availableLanguages.map((language) => /* @__PURE__ */ import_react19.default.createElement(
+      "button",
+      {
+        key: language.code,
+        className: `language-option ${selectedLanguage.code === language.code ? "selected" : ""}`,
+        onClick: () => handleLanguageSelect(language),
+        role: "option",
+        "aria-selected": selectedLanguage.code === language.code
+      },
+      /* @__PURE__ */ import_react19.default.createElement("span", { className: "language-flag" }, getFlagEmoji(language.code)),
+      /* @__PURE__ */ import_react19.default.createElement("div", { className: "language-info" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "language-name" }, language.name)),
+      selectedLanguage.code === language.code && /* @__PURE__ */ import_react19.default.createElement("div", { className: "language-check" }, "\u2713")
+    ))))
   );
 };
-var loader_default = LoaderIcon;
 
 // src/components/mic-button.tsx
 var chatState = {
@@ -40702,7 +41946,7 @@ var chatState = {
   isMinimized: false
 };
 var VoiceIntensityWrapper = ({ active, buttonSize }) => {
-  return /* @__PURE__ */ import_react15.default.createElement(
+  return /* @__PURE__ */ import_react20.default.createElement(
     VoiceIntensityVisualizer,
     {
       isActive: active,
@@ -40712,6 +41956,10 @@ var VoiceIntensityWrapper = ({ active, buttonSize }) => {
     }
   );
 };
+var DEFAULT_LANGUAGES = [
+  { code: "en-US", name: "English (US)", flag: "\u{1F1FA}\u{1F1F8}" },
+  { code: "ar-SA", name: "\u0627\u0644\u0639\u0631\u0628\u064A\u0629", flag: "\u{1F1F8}\u{1F1E6}" }
+];
 var MicButton = ({
   buttonSize = 52,
   screenPosition = "bottom-center",
@@ -40723,22 +41971,29 @@ var MicButton = ({
   buttonStyle,
   bottomSpace = 20,
   defaultTheme = "system",
-  showBorderGlow = false
+  showBorderGlow = false,
+  language,
+  defaultLanguage,
+  onLanguageChange
 }) => {
-  const { apiKey, appId } = useQubeContext();
-  const [showBodyGlow, setShowBodyGlow] = (0, import_react15.useState)(false);
-  const [currentTheme, setCurrentTheme] = (0, import_react15.useState)("dark");
-  const [isChatOpen, setIsChatOpen] = (0, import_react15.useState)(chatState.isOpen);
-  const [isChatMinimized, setIsChatMinimized] = (0, import_react15.useState)(chatState.isMinimized);
-  (0, import_react15.useEffect)(() => {
+  const { apiKey, appId } = useAnsyrContext();
+  const [showBodyGlow, setShowBodyGlow] = (0, import_react20.useState)(false);
+  const [currentTheme, setCurrentTheme] = (0, import_react20.useState)("dark");
+  const [showLanguageSelector, setShowLanguageSelector] = (0, import_react20.useState)(false);
+  const [selectedLanguage, setSelectedLanguage] = (0, import_react20.useState)(
+    language || defaultLanguage || DEFAULT_LANGUAGES[0]
+  );
+  const [isChatOpen, setIsChatOpen] = (0, import_react20.useState)(chatState.isOpen);
+  const [isChatMinimized, setIsChatMinimized] = (0, import_react20.useState)(chatState.isMinimized);
+  (0, import_react20.useEffect)(() => {
     chatState.isOpen = isChatOpen;
     chatState.isMinimized = isChatMinimized;
   }, [isChatOpen, isChatMinimized]);
-  const audioContainerRef2 = (0, import_react15.useRef)(null);
-  const silenceTimerRef = (0, import_react15.useRef)(null);
-  const aiSpeakingRef = (0, import_react15.useRef)(false);
-  const aiSpeechTimeoutRef = (0, import_react15.useRef)(null);
-  const activeAITracksRef = (0, import_react15.useRef)(/* @__PURE__ */ new Set());
+  const audioContainerRef2 = (0, import_react20.useRef)(null);
+  const silenceTimerRef = (0, import_react20.useRef)(null);
+  const aiSpeakingRef = (0, import_react20.useRef)(false);
+  const aiSpeechTimeoutRef = (0, import_react20.useRef)(null);
+  const activeAITracksRef = (0, import_react20.useRef)(/* @__PURE__ */ new Set());
   const {
     isConnected: isConnected2,
     isConnecting,
@@ -40746,12 +42001,16 @@ var MicButton = ({
     connect: voiceConnect,
     disconnect: voiceDisconnect,
     sendUserCommand: sendUserCommand2,
+    sendChatMessage,
     messages: messageManagerMessages,
     micState,
     setMicState,
     status,
     setStatus,
-    participants
+    participants,
+    muteState,
+    toggleMute,
+    setMute
   } = useCuekit({
     // Don't override navigation command - let the provider handle it
     onConnectionStateChange: (state) => {
@@ -40764,7 +42023,7 @@ var MicButton = ({
     onAISpeechEnd: (trackId) => handleAISpeech(false, trackId),
     appId
   });
-  (0, import_react15.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     const checkTheme = () => {
       if (typeof document !== "undefined") {
         let newTheme;
@@ -40787,31 +42046,31 @@ var MicButton = ({
       return () => observer.disconnect();
     }
   }, [defaultTheme]);
-  const openChat = (0, import_react15.useCallback)(() => {
+  const openChat = (0, import_react20.useCallback)(() => {
     setIsChatOpen(true);
     setIsChatMinimized(false);
   }, []);
-  const minimizeChat = (0, import_react15.useCallback)(() => {
+  const minimizeChat = (0, import_react20.useCallback)(() => {
     setIsChatMinimized(true);
     if (showBorderGlow) {
       setShowBodyGlow(false);
     }
   }, [showBorderGlow]);
-  const restoreChat = (0, import_react15.useCallback)(() => {
+  const restoreChat = (0, import_react20.useCallback)(() => {
     setIsChatMinimized(false);
     setIsChatOpen(true);
     if (showBorderGlow && (micState === "listening" || micState === "thinking" || micState === "replying")) {
       setShowBodyGlow(true);
     }
   }, [showBorderGlow, micState]);
-  const closeChat = (0, import_react15.useCallback)(() => {
+  const closeChat = (0, import_react20.useCallback)(() => {
     setIsChatOpen(false);
     setIsChatMinimized(false);
     if (showBorderGlow) {
       setShowBodyGlow(false);
     }
   }, [showBorderGlow]);
-  const handleAISpeech = (0, import_react15.useCallback)(
+  const handleAISpeech = (0, import_react20.useCallback)(
     (isSpeaking, trackId) => {
       if (isSpeaking && trackId) {
         activeAITracksRef.current.add(trackId);
@@ -40832,7 +42091,7 @@ var MicButton = ({
     },
     [status, micState, isConnected2]
   );
-  (0, import_react15.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (audioContainerRef2.current) {
       setAudioContainer(audioContainerRef2);
     }
@@ -40859,29 +42118,51 @@ var MicButton = ({
     }
     return isConnected3 ? "Ready" : "Connecting...";
   };
-  (0, import_react15.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (isConnected2) {
     } else {
     }
   }, [isConnected2]);
-  (0, import_react15.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (isConnected2 && !isChatOpen) {
       openChat();
     }
   }, [isConnected2, isChatOpen, openChat]);
-  (0, import_react15.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (messageManagerMessages.length > 0 && !isChatOpen) {
       openChat();
     }
   }, [messageManagerMessages.length, isChatOpen, openChat]);
-  const handleMicClick = (0, import_react15.useCallback)(() => {
+  const handleLanguageChange = (0, import_react20.useCallback)(
+    (newLanguage) => {
+      setSelectedLanguage(newLanguage);
+      onLanguageChange?.(newLanguage);
+    },
+    [onLanguageChange]
+  );
+  const handleLanguageConfirm = (0, import_react20.useCallback)(() => {
+    setShowLanguageSelector(false);
+    voiceConnect(`user_${Date.now()}`, apiKey, appId, selectedLanguage).then(() => {
+      if (showBorderGlow) setShowBodyGlow(true);
+      openChat();
+      setTimeout(() => {
+        openChat();
+      }, 500);
+    }).catch((error) => {
+    });
+  }, [voiceConnect, apiKey, appId, selectedLanguage, showBorderGlow, openChat]);
+  const handleMicClick = (0, import_react20.useCallback)(() => {
     const shouldStop = micState === "listening" && isConnected2;
     if (shouldStop) {
       voiceDisconnect().then(() => {
       }).catch((error) => {
       });
     } else {
-      voiceConnect(`user_${Date.now()}`, apiKey, appId).then(() => {
+      if (!language && !defaultLanguage && !selectedLanguage) {
+        setShowLanguageSelector(true);
+        return;
+      }
+      voiceConnect(`user_${Date.now()}`, apiKey, appId, selectedLanguage).then(() => {
         if (showBorderGlow) setShowBodyGlow(true);
         openChat();
         setTimeout(() => {
@@ -40897,8 +42178,12 @@ var MicButton = ({
     voiceConnect,
     apiKey,
     appId,
+    language,
+    selectedLanguage,
     openChat,
-    showBorderGlow
+    showBorderGlow,
+    sendChatMessage,
+    isChatOpen
   ]);
   const handleSendText = async (textToSend) => {
     setMicState("thinking");
@@ -40908,13 +42193,14 @@ var MicButton = ({
     }
     if (isConnected2) {
       try {
-        await sendUserCommand2(textToSend);
+        await sendChatMessage(textToSend);
         setMicState("replying");
         setTimeout(() => {
           setMicState("listening");
           if (showBorderGlow) setShowBodyGlow(true);
         }, 1e3);
       } catch (error) {
+        console.error("Failed to send chat message:", error);
       } finally {
         setMicState("listening");
         if (showBorderGlow) setShowBodyGlow(true);
@@ -40941,8 +42227,11 @@ var MicButton = ({
         filter: "drop-shadow(0 10px 8px rgba(0, 0, 0, 0.04)) drop-shadow(0 4px 3px rgba(0, 0, 0, 0.1))",
         ...imageStyle
       };
-      const animatedImageStyle = micState === "thinking" ? { ...baseImageStyle, animation: "spin 1s linear infinite" } : micState === "replying" ? { ...baseImageStyle, animation: "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite" } : baseImageStyle;
-      return /* @__PURE__ */ import_react15.default.createElement("img", { src: imageSource, alt: "Voice Assistant", style: animatedImageStyle });
+      if (micState === "idle") {
+        return /* @__PURE__ */ import_react20.default.createElement("img", { src: imageSource, alt: "Voice Assistant", style: baseImageStyle });
+      } else {
+        return /* @__PURE__ */ import_react20.default.createElement(VoiceIntensityWrapper, { active: true, buttonSize });
+      }
     }
     const iconStyle = {
       width: `100%`,
@@ -40950,15 +42239,10 @@ var MicButton = ({
       color: "white",
       filter: "drop-shadow(0 10px 8px rgba(0, 0, 0, 0.04)) drop-shadow(0 4px 3px rgba(0, 0, 0, 0.1))"
     };
-    switch (micState) {
-      case "thinking":
-        return /* @__PURE__ */ import_react15.default.createElement(loader_default, { style: { ...iconStyle, animation: "spin 1s linear infinite" } });
-      case "replying":
-        return /* @__PURE__ */ import_react15.default.createElement(VoiceIntensityWrapper, { active: true, buttonSize });
-      case "listening":
-        return /* @__PURE__ */ import_react15.default.createElement(VoiceIntensityWrapper, { active: true, buttonSize });
-      default:
-        return /* @__PURE__ */ import_react15.default.createElement(mic_default, { style: iconStyle });
+    if (micState === "idle") {
+      return /* @__PURE__ */ import_react20.default.createElement(mic_default, { style: iconStyle });
+    } else {
+      return /* @__PURE__ */ import_react20.default.createElement(VoiceIntensityWrapper, { active: true, buttonSize });
     }
   };
   const getPositionStyle = () => {
@@ -41020,16 +42304,15 @@ var MicButton = ({
     const baseStyle = { ...buttonStyles.button };
     switch (micState) {
       case "listening":
-        baseStyle.transform = "scale(1.1)";
+        baseStyle.transform = "scale(1.05)";
         baseStyle.boxShadow = "0 25px 50px -12px rgba(59, 130, 246, 0.6)";
         break;
       case "thinking":
-        baseStyle.transform = "scale(1.05)";
+        baseStyle.transform = "scale(1.02)";
         baseStyle.boxShadow = "0 20px 25px -5px rgba(196, 132, 252, 0.4)";
-        baseStyle.animation = "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite";
         break;
       case "replying":
-        baseStyle.transform = "scale(1.05)";
+        baseStyle.transform = "scale(1.02)";
         baseStyle.boxShadow = "0 20px 25px -5px rgba(34, 211, 238, 0.4)";
         break;
       default:
@@ -41038,7 +42321,34 @@ var MicButton = ({
     }
     return baseStyle;
   };
-  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement("div", { "data-cuekit-ignore": true, style: { ...buttonStyles.container, ...getPositionStyle() } }, /* @__PURE__ */ import_react15.default.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: "8px" } }, /* @__PURE__ */ import_react15.default.createElement(
+  return /* @__PURE__ */ import_react20.default.createElement(import_react20.default.Fragment, null, /* @__PURE__ */ import_react20.default.createElement("div", { "data-cuekit-ignore": true, style: { ...buttonStyles.container, ...getPositionStyle() } }, showLanguageSelector ? /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-selection" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-header" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-icon" }, /* @__PURE__ */ import_react20.default.createElement(mic_default, { width: 20, height: 20 })), /* @__PURE__ */ import_react20.default.createElement("span", { className: "voice-chat-language-title" }, "Select Language")), /* @__PURE__ */ import_react20.default.createElement(
+    LanguageSelector,
+    {
+      selectedLanguage,
+      onLanguageChange: handleLanguageChange,
+      availableLanguages: DEFAULT_LANGUAGES,
+      className: "voice-chat-language-selector",
+      screenPosition
+    }
+  ), /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-language-actions" }, /* @__PURE__ */ import_react20.default.createElement(
+    "button",
+    {
+      className: "voice-chat-cancel-button",
+      onClick: () => setShowLanguageSelector(false)
+    },
+    "Cancel"
+  ), /* @__PURE__ */ import_react20.default.createElement("button", { className: "voice-chat-confirm-button", onClick: handleLanguageConfirm }, "Start Voice Chat"))) : /* @__PURE__ */ import_react20.default.createElement("div", { className: "voice-chat-main-button" }, /* @__PURE__ */ import_react20.default.createElement(
+    LanguageSelector,
+    {
+      selectedLanguage,
+      onLanguageChange: handleLanguageChange,
+      availableLanguages: DEFAULT_LANGUAGES,
+      className: "voice-chat-language-preview",
+      disabled: isConnected2 || micState !== "idle",
+      tooltip: "Close the conversation to change the language",
+      screenPosition
+    }
+  ), /* @__PURE__ */ import_react20.default.createElement(
     "button",
     {
       "data-testid": "ignore",
@@ -41059,8 +42369,8 @@ var MicButton = ({
       },
       "aria-label": micState === "thinking" ? "Processing..." : micState === "replying" ? "AI is responding..." : isListening ? "Stop listening" : "Start listening"
     },
-    /* @__PURE__ */ import_react15.default.createElement("div", { style: buttonStyles.iconContainer }, getIcon())
-  ), hasText && text7 && /* @__PURE__ */ import_react15.default.createElement(
+    /* @__PURE__ */ import_react20.default.createElement("div", { style: buttonStyles.iconContainer }, getIcon())
+  )), !showLanguageSelector && hasText && text7 && /* @__PURE__ */ import_react20.default.createElement(
     "div",
     {
       style: {
@@ -41078,11 +42388,12 @@ var MicButton = ({
         alignItems: "center",
         justifyContent: "center",
         gap: "4px",
+        marginTop: "8px",
         ...textStyle
       }
     },
-    /* @__PURE__ */ import_react15.default.createElement("span", null, text7)
-  ))), /* @__PURE__ */ import_react15.default.createElement(
+    /* @__PURE__ */ import_react20.default.createElement("span", null, text7)
+  )), /* @__PURE__ */ import_react20.default.createElement(
     ChatPopup,
     {
       isOpen: isChatOpen,
@@ -41103,9 +42414,16 @@ var MicButton = ({
       currentTheme,
       onThemeToggle: setCurrentTheme,
       status: getUserFriendlyStatus(micState, isConnected2 ?? false),
-      anchor: { position: screenPosition, bottom: bottomSpace, size: buttonSize }
-    }
-  ), isChatOpen && isChatMinimized && /* @__PURE__ */ import_react15.default.createElement(
+      anchor: { position: screenPosition, bottom: bottomSpace, size: buttonSize },
+      muteState,
+      onToggleMute: toggleMute,
+      draggable: true,
+      resizable: true,
+      persistPosition: true,
+      persistSize: true,
+      storageKey: "cuekit-chat-popup"
+    }
+  ), isChatOpen && isChatMinimized && /* @__PURE__ */ import_react20.default.createElement(
     "button",
     {
       onClick: restoreChat,
@@ -41126,8 +42444,8 @@ var MicButton = ({
       className: `cuekit-voice-popup ${currentTheme === "dark" ? "cuekit-dark" : ""}`,
       "aria-label": "Open chat"
     },
-    /* @__PURE__ */ import_react15.default.createElement("span", { style: { fontSize: 12, fontWeight: 600, color: "hsl(var(--voice-text))" } }, "Open chat")
-  ), /* @__PURE__ */ import_react15.default.createElement("div", { ref: audioContainerRef2, style: { display: "none" } }), showBorderGlow && showBodyGlow && /* @__PURE__ */ import_react15.default.createElement(border_glow_default, { isActive: true }));
+    /* @__PURE__ */ import_react20.default.createElement("span", { style: { fontSize: 12, fontWeight: 600, color: "hsl(var(--voice-text))" } }, "Open chat")
+  ), /* @__PURE__ */ import_react20.default.createElement("div", { ref: audioContainerRef2, style: { display: "none" } }), showBorderGlow && showBodyGlow && /* @__PURE__ */ import_react20.default.createElement(border_glow_default, { isActive: true }));
 };
 
 // src/index.ts