@reactor-team/js-sdk 2.4.0 → 2.5.1

package/dist/index.mjs

@@ -51,11 +51,25 @@ var __async = (__this, __arguments, generator) => {
 };
 
 // src/types.ts
+function video(name, _options) {
+  return { name, kind: "video" };
+}
+function audio(name, _options) {
+  return { name, kind: "audio" };
+}
 var ConflictError = class extends Error {
   constructor(message) {
     super(message);
   }
 };
+var AbortError = class extends Error {
+  constructor(message) {
+    super(message);
+  }
+};
+function isAbortError(error) {
+  return error instanceof AbortError || error instanceof Error && error.name === "AbortError";
+}
 
 // src/core/types.ts
 import { z } from "zod";
@@ -124,18 +138,105 @@ function createPeerConnection(config) {
 function createDataChannel(pc, label) {
   return pc.createDataChannel(label != null ? label : DEFAULT_DATA_CHANNEL_LABEL);
 }
-function createOffer(pc) {
+function rewriteMids(sdp, trackNames) {
+  const lines = sdp.split("\r\n");
+  let mediaIdx = 0;
+  const replacements = /* @__PURE__ */ new Map();
+  let inApplication = false;
+  for (let i = 0; i < lines.length; i++) {
+    if (lines[i].startsWith("m=")) {
+      inApplication = lines[i].startsWith("m=application");
+    }
+    if (!inApplication && lines[i].startsWith("a=mid:")) {
+      const oldMid = lines[i].substring("a=mid:".length);
+      if (mediaIdx < trackNames.length) {
+        const newMid = trackNames[mediaIdx];
+        replacements.set(oldMid, newMid);
+        lines[i] = `a=mid:${newMid}`;
+        mediaIdx++;
+      }
+    }
+  }
+  for (let i = 0; i < lines.length; i++) {
+    if (lines[i].startsWith("a=group:BUNDLE ")) {
+      const parts = lines[i].split(" ");
+      for (let j = 1; j < parts.length; j++) {
+        const replacement = replacements.get(parts[j]);
+        if (replacement !== void 0) {
+          parts[j] = replacement;
+        }
+      }
+      lines[i] = parts.join(" ");
+      break;
+    }
+  }
+  return lines.join("\r\n");
+}
+function createOffer(pc, trackNames) {
   return __async(this, null, function* () {
     const offer = yield pc.createOffer();
-    yield pc.setLocalDescription(offer);
+    let needsAnswerRestore = false;
+    if (trackNames && trackNames.length > 0 && offer.sdp) {
+      const munged = rewriteMids(offer.sdp, trackNames);
+      try {
+        yield pc.setLocalDescription(
+          new RTCSessionDescription({ type: "offer", sdp: munged })
+        );
+      } catch (e) {
+        yield pc.setLocalDescription(offer);
+        needsAnswerRestore = true;
+      }
+    } else {
+      yield pc.setLocalDescription(offer);
+    }
     yield waitForIceGathering(pc);
     const localDescription = pc.localDescription;
     if (!localDescription) {
       throw new Error("Failed to create local description");
     }
-    return localDescription.sdp;
+    let sdp = localDescription.sdp;
+    if (needsAnswerRestore && trackNames && trackNames.length > 0) {
+      sdp = rewriteMids(sdp, trackNames);
+    }
+    return { sdp, needsAnswerRestore };
   });
 }
+function buildMidMapping(transceivers) {
+  var _a;
+  const localToRemote = /* @__PURE__ */ new Map();
+  const remoteToLocal = /* @__PURE__ */ new Map();
+  for (const entry of transceivers) {
+    const mid = (_a = entry.transceiver) == null ? void 0 : _a.mid;
+    if (mid) {
+      localToRemote.set(mid, entry.name);
+      remoteToLocal.set(entry.name, mid);
+    }
+  }
+  return { localToRemote, remoteToLocal };
+}
+function restoreAnswerMids(sdp, remoteToLocal) {
+  const lines = sdp.split("\r\n");
+  for (let i = 0; i < lines.length; i++) {
+    if (lines[i].startsWith("a=mid:")) {
+      const remoteMid = lines[i].substring("a=mid:".length);
+      const localMid = remoteToLocal.get(remoteMid);
+      if (localMid !== void 0) {
+        lines[i] = `a=mid:${localMid}`;
+      }
+    }
+    if (lines[i].startsWith("a=group:BUNDLE ")) {
+      const parts = lines[i].split(" ");
+      for (let j = 1; j < parts.length; j++) {
+        const localMid = remoteToLocal.get(parts[j]);
+        if (localMid !== void 0) {
+          parts[j] = localMid;
+        }
+      }
+      lines[i] = parts.join(" ");
+    }
+  }
+  return lines.join("\r\n");
+}
 function setRemoteDescription(pc, sdp) {
   return __async(this, null, function* () {
     const sessionDescription = new RTCSessionDescription({
@@ -263,6 +364,22 @@ var CoordinatorClient = class {
     this.baseUrl = options.baseUrl;
     this.jwtToken = options.jwtToken;
     this.model = options.model;
+    this.abortController = new AbortController();
+  }
+  /**
+   * Aborts any in-flight HTTP requests and polling loops.
+   * A fresh AbortController is created so the client remains reusable.
+   */
+  abort() {
+    this.abortController.abort();
+    this.abortController = new AbortController();
+  }
+  /**
+   * The current abort signal, passed to every fetch() and sleep() call.
+   * Protected so subclasses can forward it to their own fetch calls.
+   */
+  get signal() {
+    return this.abortController.signal;
   }
   /**
    * Returns the authorization header with JWT Bearer token
@@ -283,7 +400,8 @@ var CoordinatorClient = class {
         `${this.baseUrl}/ice_servers?model=${this.model}`,
         {
           method: "GET",
-          headers: this.getAuthHeaders()
+          headers: this.getAuthHeaders(),
+          signal: this.signal
         }
       );
       if (!response.ok) {
@@ -317,7 +435,8 @@ var CoordinatorClient = class {
         headers: __spreadProps(__spreadValues({}, this.getAuthHeaders()), {
           "Content-Type": "application/json"
         }),
-        body: JSON.stringify(requestBody)
+        body: JSON.stringify(requestBody),
+        signal: this.signal
       });
       if (!response.ok) {
         const errorText = yield response.text();
@@ -351,7 +470,8 @@ var CoordinatorClient = class {
         `${this.baseUrl}/sessions/${this.currentSessionId}`,
         {
           method: "GET",
-          headers: this.getAuthHeaders()
+          headers: this.getAuthHeaders(),
+          signal: this.signal
         }
       );
       if (!response.ok) {
@@ -364,12 +484,13 @@ var CoordinatorClient = class {
   }
   /**
    * Terminates the current session by sending a DELETE request to the coordinator.
-   * @throws Error if no active session exists or if the request fails (except for 404)
+   * No-op if no session has been created yet.
+   * @throws Error if the request fails (except for 404, which clears local state)
    */
   terminateSession() {
     return __async(this, null, function* () {
       if (!this.currentSessionId) {
-        throw new Error("No active session. Call createSession() first.");
+        return;
       }
       console.debug(
         "[CoordinatorClient] Terminating session:",
@@ -379,7 +500,8 @@ var CoordinatorClient = class {
         `${this.baseUrl}/sessions/${this.currentSessionId}`,
         {
           method: "DELETE",
-          headers: this.getAuthHeaders()
+          headers: this.getAuthHeaders(),
+          signal: this.signal
         }
       );
       if (response.ok) {
@@ -429,7 +551,8 @@ var CoordinatorClient = class {
           headers: __spreadProps(__spreadValues({}, this.getAuthHeaders()), {
             "Content-Type": "application/json"
           }),
-          body: JSON.stringify(requestBody)
+          body: JSON.stringify(requestBody),
+          signal: this.signal
         }
       );
       if (response.status === 200) {
@@ -465,6 +588,9 @@ var CoordinatorClient = class {
       let backoffMs = INITIAL_BACKOFF_MS;
       let attempt = 0;
       while (true) {
+        if (this.signal.aborted) {
+          throw new AbortError("SDP polling aborted");
+        }
         if (attempt >= maxAttempts) {
           throw new Error(
             `SDP polling exceeded maximum attempts (${maxAttempts}) for session ${sessionId}`
@@ -480,7 +606,8 @@ var CoordinatorClient = class {
             method: "GET",
             headers: __spreadProps(__spreadValues({}, this.getAuthHeaders()), {
               "Content-Type": "application/json"
-            })
+            }),
+            signal: this.signal
           }
         );
         if (response.status === 200) {
@@ -525,10 +652,26 @@ var CoordinatorClient = class {
     });
   }
   /**
-   * Utility function to sleep for a given number of milliseconds
+   * Abort-aware sleep. Resolves after `ms` milliseconds unless the
+   * abort signal fires first, in which case it rejects with AbortError.
    */
   sleep(ms) {
-    return new Promise((resolve) => setTimeout(resolve, ms));
+    return new Promise((resolve, reject) => {
+      const { signal } = this;
+      if (signal.aborted) {
+        reject(new AbortError("Sleep aborted"));
+        return;
+      }
+      const timer = setTimeout(() => {
+        signal.removeEventListener("abort", onAbort);
+        resolve();
+      }, ms);
+      const onAbort = () => {
+        clearTimeout(timer);
+        reject(new AbortError("Sleep aborted"));
+      };
+      signal.addEventListener("abort", onAbort, { once: true });
+    });
   }
 };
 
@@ -550,7 +693,8 @@ var LocalCoordinatorClient = class extends CoordinatorClient {
     return __async(this, null, function* () {
       console.debug("[LocalCoordinatorClient] Fetching ICE servers...");
       const response = yield fetch(`${this.localBaseUrl}/ice_servers`, {
-        method: "GET"
+        method: "GET",
+        signal: this.signal
       });
       if (!response.ok) {
         throw new Error("Failed to get ICE servers from local coordinator.");
@@ -574,7 +718,8 @@ var LocalCoordinatorClient = class extends CoordinatorClient {
       console.debug("[LocalCoordinatorClient] Creating local session...");
       this.sdpOffer = sdpOffer;
       const response = yield fetch(`${this.localBaseUrl}/start_session`, {
-        method: "POST"
+        method: "POST",
+        signal: this.signal
       });
       if (!response.ok) {
         throw new Error("Failed to send local start session command.");
@@ -602,7 +747,8 @@ var LocalCoordinatorClient = class extends CoordinatorClient {
         headers: {
           "Content-Type": "application/json"
         },
-        body: JSON.stringify(sdpBody)
+        body: JSON.stringify(sdpBody),
+        signal: this.signal
       });
       if (!response.ok) {
         if (response.status === 409) {
@@ -619,7 +765,8 @@ var LocalCoordinatorClient = class extends CoordinatorClient {
     return __async(this, null, function* () {
       console.debug("[LocalCoordinatorClient] Stopping local session...");
       yield fetch(`${this.localBaseUrl}/stop_session`, {
-        method: "POST"
+        method: "POST",
+        signal: this.signal
       });
     });
   }
@@ -632,6 +779,10 @@ var GPUMachineClient = class {
   constructor(config) {
     this.eventListeners = /* @__PURE__ */ new Map();
     this.status = "disconnected";
+    this.transceiverMap = /* @__PURE__ */ new Map();
+    this.publishedTracks = /* @__PURE__ */ new Map();
+    this.peerConnected = false;
+    this.dataChannelOpen = false;
     this.config = config;
   }
   // ─────────────────────────────────────────────────────────────────────────────
@@ -655,10 +806,18 @@ var GPUMachineClient = class {
   // SDP & Connection
   // ─────────────────────────────────────────────────────────────────────────────
   /**
-   * Creates an SDP offer for initiating a connection.
+   * Creates an SDP offer based on the declared tracks.
+   *
+   * **RECEIVE** = client receives from the model (model → client) → `recvonly`
+   * **SEND**    = client sends to the model (client → model)     → `sendonly`
+   *
+   * Track names must be unique across both arrays. A name that appears in
+   * both `receive` and `send` will throw — use distinct names instead.
+   *
+   * The data channel is always created first (before transceivers).
    * Must be called before connect().
    */
-  createOffer() {
+  createOffer(tracks) {
     return __async(this, null, function* () {
       if (!this.peerConnection) {
         this.peerConnection = createPeerConnection(this.config);
@@ -669,14 +828,63 @@ var GPUMachineClient = class {
         this.config.dataChannelLabel
       );
       this.setupDataChannelHandlers();
-      this.videoTransceiver = this.peerConnection.addTransceiver("video", {
-        direction: "sendrecv"
-      });
-      const offer = yield createOffer(this.peerConnection);
-      console.debug("[GPUMachineClient] Created SDP offer");
-      return offer;
+      this.transceiverMap.clear();
+      const entries = this.buildTransceiverEntries(tracks);
+      for (const entry of entries) {
+        const transceiver = this.peerConnection.addTransceiver(entry.kind, {
+          direction: entry.direction
+        });
+        entry.transceiver = transceiver;
+        this.transceiverMap.set(entry.name, entry);
+        console.debug(
+          `[GPUMachineClient] Transceiver added: "${entry.name}" (${entry.kind}, ${entry.direction})`
+        );
+      }
+      const trackNames = entries.map((e) => e.name);
+      const { sdp, needsAnswerRestore } = yield createOffer(
+        this.peerConnection,
+        trackNames
+      );
+      if (needsAnswerRestore) {
+        this.midMapping = buildMidMapping(entries);
+      } else {
+        this.midMapping = void 0;
+      }
+      console.debug(
+        "[GPUMachineClient] Created SDP offer with MIDs:",
+        trackNames,
+        needsAnswerRestore ? "(needs answer restore)" : "(native munging)"
+      );
+      return sdp;
     });
   }
+  /**
+   * Builds an ordered list of transceiver entries from the receive/send arrays.
+   *
+   * Each track produces exactly one transceiver — `recvonly` for receive,
+   * `sendonly` for send.  Bidirectional (`sendrecv`) transceivers are not
+   * supported; the same track name in both arrays is an error.
+   */
+  buildTransceiverEntries(tracks) {
+    const map = /* @__PURE__ */ new Map();
+    for (const t of tracks.receive) {
+      if (map.has(t.name)) {
+        throw new Error(
+          `Duplicate receive track name "${t.name}". Track names must be unique.`
+        );
+      }
+      map.set(t.name, { name: t.name, kind: t.kind, direction: "recvonly" });
+    }
+    for (const t of tracks.send) {
+      if (map.has(t.name)) {
+        throw new Error(
+          `Track name "${t.name}" appears in both receive and send. Bidirectional tracks are not supported \u2014 use distinct names for the inbound and outbound directions (e.g. "${t.name}_in" and "${t.name}_out").`
+        );
+      }
+      map.set(t.name, { name: t.name, kind: t.kind, direction: "sendonly" });
+    }
+    return Array.from(map.values());
+  }
   /**
    * Connects to the GPU machine using the provided SDP answer.
    * createOffer() must be called first.
@@ -696,7 +904,14 @@ var GPUMachineClient = class {
       }
       this.setStatus("connecting");
       try {
-        yield setRemoteDescription(this.peerConnection, sdpAnswer);
+        let answer = sdpAnswer;
+        if (this.midMapping) {
+          answer = restoreAnswerMids(
+            answer,
+            this.midMapping.remoteToLocal
+          );
+        }
+        yield setRemoteDescription(this.peerConnection, answer);
         console.debug("[GPUMachineClient] Remote description set");
       } catch (error) {
         console.error("[GPUMachineClient] Failed to connect:", error);
@@ -712,8 +927,8 @@ var GPUMachineClient = class {
     return __async(this, null, function* () {
       this.stopPing();
       this.stopStatsPolling();
-      if (this.publishedTrack) {
-        yield this.unpublishTrack();
+      for (const name of Array.from(this.publishedTracks.keys())) {
+        yield this.unpublishTrack(name);
       }
       if (this.dataChannel) {
         this.dataChannel.close();
@@ -723,7 +938,10 @@ var GPUMachineClient = class {
         closePeerConnection(this.peerConnection);
         this.peerConnection = void 0;
       }
-      this.videoTransceiver = void 0;
+      this.transceiverMap.clear();
+      this.midMapping = void 0;
+      this.peerConnected = false;
+      this.dataChannelOpen = false;
       this.setStatus("disconnected");
       console.debug("[GPUMachineClient] Disconnected");
     });
@@ -751,7 +969,7 @@ var GPUMachineClient = class {
   /**
    * Sends a command to the GPU machine via the data channel.
    * @param command The command to send
-   * @param data The data to send with the command. These are the parameters for the command, matching the scheme in the capabilities dictionary.
+   * @param data The data to send with the command. These are the parameters for the command, matching the schema in the capabilities dictionary.
    * @param scope The message scope – "application" (default) for model commands, "runtime" for platform-level messages.
    */
   sendCommand(command, data, scope = "application") {
@@ -768,63 +986,77 @@ var GPUMachineClient = class {
   // Track Publishing
   // ─────────────────────────────────────────────────────────────────────────────
   /**
-   * Publishes a track to the GPU machine.
-   * Only one track can be published at a time.
-   * Uses the existing transceiver's sender to replace the track.
-   * @param track The MediaStreamTrack to publish
+   * Publishes a MediaStreamTrack to the named send track.
+   *
+   * @param name The declared track name (must exist in transceiverMap with a sendable direction).
+   * @param track The MediaStreamTrack to publish.
    */
-  publishTrack(track) {
+  publishTrack(name, track) {
     return __async(this, null, function* () {
       if (!this.peerConnection) {
         throw new Error(
-          "[GPUMachineClient] Cannot publish track - not initialized"
+          `[GPUMachineClient] Cannot publish track "${name}" - not initialized`
         );
       }
       if (this.status !== "connected") {
         throw new Error(
-          "[GPUMachineClient] Cannot publish track - not connected"
+          `[GPUMachineClient] Cannot publish track "${name}" - not connected`
+        );
+      }
+      const entry = this.transceiverMap.get(name);
+      if (!entry || !entry.transceiver) {
+        throw new Error(
+          `[GPUMachineClient] Cannot publish track "${name}" - no transceiver (was it declared in tracks.send?)`
         );
       }
-      if (!this.videoTransceiver) {
+      if (entry.direction === "recvonly") {
         throw new Error(
-          "[GPUMachineClient] Cannot publish track - no video transceiver"
+          `[GPUMachineClient] Cannot publish track "${name}" - transceiver is recvonly`
         );
       }
       try {
-        yield this.videoTransceiver.sender.replaceTrack(track);
-        this.publishedTrack = track;
+        yield entry.transceiver.sender.replaceTrack(track);
+        this.publishedTracks.set(name, track);
         console.debug(
-          "[GPUMachineClient] Track published successfully:",
-          track.kind
+          `[GPUMachineClient] Track "${name}" published successfully`
         );
       } catch (error) {
-        console.error("[GPUMachineClient] Failed to publish track:", error);
+        console.error(
+          `[GPUMachineClient] Failed to publish track "${name}":`,
+          error
+        );
         throw error;
       }
     });
   }
   /**
-   * Unpublishes the currently published track.
+   * Unpublishes the track with the given name.
    */
-  unpublishTrack() {
+  unpublishTrack(name) {
     return __async(this, null, function* () {
-      if (!this.videoTransceiver || !this.publishedTrack) return;
+      const entry = this.transceiverMap.get(name);
+      if (!(entry == null ? void 0 : entry.transceiver) || !this.publishedTracks.has(name)) return;
       try {
-        yield this.videoTransceiver.sender.replaceTrack(null);
-        console.debug("[GPUMachineClient] Track unpublished successfully");
+        yield entry.transceiver.sender.replaceTrack(null);
+        console.debug(
+          `[GPUMachineClient] Track "${name}" unpublished successfully`
+        );
       } catch (error) {
-        console.error("[GPUMachineClient] Failed to unpublish track:", error);
+        console.error(
+          `[GPUMachineClient] Failed to unpublish track "${name}":`,
+          error
+        );
         throw error;
       } finally {
-        this.publishedTrack = void 0;
+        this.publishedTracks.delete(name);
       }
     });
   }
   /**
-   * Returns the currently published track.
+   * Returns the currently published track for the given name.
    */
-  getPublishedTrack() {
-    return this.publishedTrack;
+  getPublishedTrack(name) {
+    return this.publishedTracks.get(name);
   }
   // ─────────────────────────────────────────────────────────────────────────────
   // Getters
@@ -895,6 +1127,12 @@ var GPUMachineClient = class {
   // ─────────────────────────────────────────────────────────────────────────────
   // Private Helpers
   // ─────────────────────────────────────────────────────────────────────────────
+  checkFullyConnected() {
+    if (this.peerConnected && this.dataChannelOpen) {
+      this.setStatus("connected");
+      this.startStatsPolling();
+    }
+  }
   setStatus(newStatus) {
     if (this.status !== newStatus) {
       this.status = newStatus;
@@ -910,24 +1148,36 @@ var GPUMachineClient = class {
       if (state) {
         switch (state) {
           case "connected":
-            this.setStatus("connected");
-            this.startStatsPolling();
+            this.peerConnected = true;
+            this.checkFullyConnected();
             break;
           case "disconnected":
           case "closed":
+            this.peerConnected = false;
             this.setStatus("disconnected");
             break;
           case "failed":
+            this.peerConnected = false;
             this.setStatus("error");
             break;
         }
       }
     };
     this.peerConnection.ontrack = (event) => {
-      var _a;
-      console.debug("[GPUMachineClient] Track received:", event.track.kind);
-      const stream = (_a = event.streams[0]) != null ? _a : new MediaStream([event.track]);
-      this.emit("trackReceived", event.track, stream);
+      var _a, _b;
+      let trackName;
+      for (const [name, entry] of this.transceiverMap) {
+        if (entry.transceiver === event.transceiver) {
+          trackName = name;
+          break;
+        }
+      }
+      trackName != null ? trackName : trackName = (_a = event.transceiver.mid) != null ? _a : `unknown-${event.track.id}`;
+      console.debug(
+        `[GPUMachineClient] Track received: "${trackName}" (${event.track.kind}, mid=${event.transceiver.mid})`
+      );
+      const stream = (_b = event.streams[0]) != null ? _b : new MediaStream([event.track]);
+      this.emit("trackReceived", trackName, event.track, stream);
     };
     this.peerConnection.onicecandidate = (event) => {
       if (event.candidate) {
@@ -947,10 +1197,13 @@ var GPUMachineClient = class {
     if (!this.dataChannel) return;
     this.dataChannel.onopen = () => {
       console.debug("[GPUMachineClient] Data channel open");
+      this.dataChannelOpen = true;
       this.startPing();
+      this.checkFullyConnected();
     };
     this.dataChannel.onclose = () => {
       console.debug("[GPUMachineClient] Data channel closed");
+      this.dataChannelOpen = false;
       this.stopPing();
     };
     this.dataChannel.onerror = (error) => {
@@ -984,10 +1237,29 @@ var GPUMachineClient = class {
 import { z as z2 } from "zod";
 var LOCAL_COORDINATOR_URL = "http://localhost:8080";
 var PROD_COORDINATOR_URL = "https://api.reactor.inc";
+var TrackConfigSchema = z2.object({
+  name: z2.string(),
+  kind: z2.enum(["audio", "video"])
+});
 var OptionsSchema = z2.object({
   coordinatorUrl: z2.string().default(PROD_COORDINATOR_URL),
   modelName: z2.string(),
-  local: z2.boolean().default(false)
+  local: z2.boolean().default(false),
+  /**
+   * Tracks the client **RECEIVES** from the model (model → client).
+   * Each entry produces a `recvonly` transceiver.
+   * Names must be unique across both `receive` and `send`.
+   *
+   * When omitted, defaults to a single video track named `"main_video"`.
+   * Pass an explicit empty array to opt out of the default.
+   */
+  receive: z2.array(TrackConfigSchema).default([{ name: "main_video", kind: "video" }]),
+  /**
+   * Tracks the client **SENDS** to the model (client → model).
+   * Each entry produces a `sendonly` transceiver.
+   * Names must be unique across both `receive` and `send`.
+   */
+  send: z2.array(TrackConfigSchema).default([])
 });
 var Reactor = class {
   constructor(options) {
@@ -998,7 +1270,9 @@ var Reactor = class {
     this.coordinatorUrl = validatedOptions.coordinatorUrl;
     this.model = validatedOptions.modelName;
     this.local = validatedOptions.local;
-    if (this.local) {
+    this.receive = validatedOptions.receive;
+    this.send = validatedOptions.send;
+    if (this.local && options.coordinatorUrl === void 0) {
       this.coordinatorUrl = LOCAL_COORDINATOR_URL;
     }
   }
@@ -1018,13 +1292,11 @@ var Reactor = class {
     (_a = this.eventListeners.get(event)) == null ? void 0 : _a.forEach((handler) => handler(...args));
   }
   /**
-   * Public method to send a message to the machine.
-   * Wraps the message in the specified channel envelope (defaults to "application").
-   * @param command The command name to send.
+   * Sends a command to the model via the data channel.
+   *
+   * @param command The command name.
    * @param data The command payload.
-   * @param scope The envelope scope – "application" (default) for model commands,
-   *              "runtime" for platform-level messages (e.g. requestCapabilities).
-   * @throws Error if not in ready state
+   * @param scope "application" (default) for model commands, "runtime" for platform messages.
    */
   sendCommand(command, data, scope = "application") {
     return __async(this, null, function* () {
@@ -1048,24 +1320,27 @@ var Reactor = class {
     });
   }
   /**
-   * Public method to publish a track to the machine.
-   * @param track The track to send to the machine.
+   * Publishes a MediaStreamTrack to a named send track.
+   *
+   * @param name The declared send track name (e.g. "webcam").
+   * @param track The MediaStreamTrack to publish.
    */
-  publishTrack(track) {
+  publishTrack(name, track) {
     return __async(this, null, function* () {
       var _a;
       if (process.env.NODE_ENV !== "development" && this.status !== "ready") {
-        const errorMessage = `Cannot publish track, status is ${this.status}`;
-        console.warn("[Reactor]", errorMessage);
+        console.warn(
+          `[Reactor] Cannot publish track "${name}", status is ${this.status}`
+        );
         return;
       }
       try {
-        yield (_a = this.machineClient) == null ? void 0 : _a.publishTrack(track);
+        yield (_a = this.machineClient) == null ? void 0 : _a.publishTrack(name, track);
       } catch (error) {
-        console.error("[Reactor] Failed to publish track:", error);
+        console.error(`[Reactor] Failed to publish track "${name}":`, error);
         this.createError(
           "TRACK_PUBLISH_FAILED",
-          `Failed to publish track: ${error}`,
+          `Failed to publish track "${name}": ${error}`,
           "gpu",
           true
         );
@@ -1073,18 +1348,20 @@ var Reactor = class {
     });
   }
   /**
-   * Public method to unpublish the currently published track.
+   * Unpublishes the track with the given name.
+   *
+   * @param name The declared send track name to unpublish.
    */
-  unpublishTrack() {
+  unpublishTrack(name) {
     return __async(this, null, function* () {
       var _a;
       try {
-        yield (_a = this.machineClient) == null ? void 0 : _a.unpublishTrack();
+        yield (_a = this.machineClient) == null ? void 0 : _a.unpublishTrack(name);
       } catch (error) {
-        console.error("[Reactor] Failed to unpublish track:", error);
+        console.error(`[Reactor] Failed to unpublish track "${name}":`, error);
         this.createError(
           "TRACK_UNPUBLISH_FAILED",
-          `Failed to unpublish track: ${error}`,
+          `Failed to unpublish track "${name}": ${error}`,
           "gpu",
           true
         );
@@ -1111,7 +1388,10 @@ var Reactor = class {
         this.machineClient = new GPUMachineClient({ iceServers });
         this.setupMachineClientHandlers();
       }
-      const sdpOffer = yield this.machineClient.createOffer();
+      const sdpOffer = yield this.machineClient.createOffer({
+        send: this.send,
+        receive: this.receive
+      });
       try {
         const sdpAnswer = yield this.coordinatorClient.connect(
           this.sessionId,
@@ -1119,8 +1399,8 @@ var Reactor = class {
           options == null ? void 0 : options.maxAttempts
         );
         yield this.machineClient.connect(sdpAnswer);
-        this.setStatus("ready");
       } catch (error) {
+        if (isAbortError(error)) return;
         let recoverable = false;
         if (error instanceof ConflictError) {
           recoverable = true;
@@ -1166,7 +1446,10 @@ var Reactor = class {
         const iceServers = yield this.coordinatorClient.getIceServers();
         this.machineClient = new GPUMachineClient({ iceServers });
         this.setupMachineClientHandlers();
-        const sdpOffer = yield this.machineClient.createOffer();
+        const sdpOffer = yield this.machineClient.createOffer({
+          send: this.send,
+          receive: this.receive
+        });
         const sessionId = yield this.coordinatorClient.createSession(sdpOffer);
         this.setSessionId(sessionId);
         const sdpAnswer = yield this.coordinatorClient.connect(
@@ -1176,6 +1459,7 @@ var Reactor = class {
         );
         yield this.machineClient.connect(sdpAnswer);
       } catch (error) {
+        if (isAbortError(error)) return;
         console.error("[Reactor] Connection failed:", error);
         this.createError(
           "CONNECTION_FAILED",
@@ -1197,17 +1481,25 @@ var Reactor = class {
   }
   /**
    * Sets up event handlers for the machine client.
+   *
+   * Each handler captures the client reference at registration time and
+   * ignores events if this.machineClient has since changed (e.g. after
+   * disconnect + reconnect), preventing stale WebRTC teardown events from
+   * interfering with a new connection.
    */
   setupMachineClientHandlers() {
     if (!this.machineClient) return;
-    this.machineClient.on("message", (message, scope) => {
+    const client = this.machineClient;
+    client.on("message", (message, scope) => {
+      if (this.machineClient !== client) return;
       if (scope === "application") {
         this.emit("message", message);
       } else if (scope === "runtime") {
         this.emit("runtimeMessage", message);
       }
     });
-    this.machineClient.on("statusChanged", (status) => {
+    client.on("statusChanged", (status) => {
+      if (this.machineClient !== client) return;
       switch (status) {
         case "connected":
           this.setStatus("ready");
@@ -1226,13 +1518,15 @@ var Reactor = class {
           break;
       }
     });
-    this.machineClient.on(
+    client.on(
       "trackReceived",
-      (track, stream) => {
-        this.emit("streamChanged", track, stream);
+      (name, track, stream) => {
+        if (this.machineClient !== client) return;
+        this.emit("trackReceived", name, track, stream);
       }
     );
-    this.machineClient.on("statsUpdate", (stats) => {
+    client.on("statsUpdate", (stats) => {
+      if (this.machineClient !== client) return;
       this.emit("statsUpdate", stats);
     });
   }
@@ -1242,12 +1536,18 @@ var Reactor = class {
    */
   disconnect(recoverable = false) {
     return __async(this, null, function* () {
+      var _a;
       if (this.status === "disconnected" && !this.sessionId) {
         console.warn("[Reactor] Already disconnected");
         return;
       }
+      (_a = this.coordinatorClient) == null ? void 0 : _a.abort();
       if (this.coordinatorClient && !recoverable) {
-        yield this.coordinatorClient.terminateSession();
+        try {
+          yield this.coordinatorClient.terminateSession();
+        } catch (error) {
+          console.error("[Reactor] Error terminating session:", error);
+        }
         this.coordinatorClient = void 0;
       }
       if (this.machineClient) {
@@ -1352,10 +1652,9 @@ var ReactorContext = createContext(
 );
 var defaultInitState = {
   status: "disconnected",
-  videoTrack: null,
+  tracks: {},
   lastError: void 0,
   sessionExpiration: void 0,
-  insecureApiKey: void 0,
   jwtToken: void 0,
   sessionId: void 0
 };
@@ -1376,7 +1675,11 @@ var createReactorStore = (initProps, publicState = defaultInitState) => {
         oldStatus: get().status,
         newStatus
       });
-      set({ status: newStatus });
+      if (newStatus === "disconnected") {
+        set({ status: newStatus, tracks: {} });
+      } else {
+        set({ status: newStatus });
+      }
     });
     reactor.on(
       "sessionExpirationChanged",
@@ -1388,13 +1691,13 @@ var createReactorStore = (initProps, publicState = defaultInitState) => {
         set({ sessionExpiration: newSessionExpiration });
       }
     );
-    reactor.on("streamChanged", (videoTrack) => {
-      console.debug("[ReactorStore] Stream changed", {
-        hasVideoTrack: !!videoTrack,
-        videoTrackKind: videoTrack == null ? void 0 : videoTrack.kind,
-        videoTrackId: videoTrack == null ? void 0 : videoTrack.id
+    reactor.on("trackReceived", (name, track) => {
+      console.debug("[ReactorStore] Track received", {
+        name,
+        kind: track.kind,
+        id: track.id
       });
-      set({ videoTrack });
+      set({ tracks: __spreadProps(__spreadValues({}, get().tracks), { [name]: track }) });
     });
     reactor.on("error", (error) => {
       console.debug("[ReactorStore] Error occurred", error);
@@ -1458,27 +1761,31 @@ var createReactorStore = (initProps, publicState = defaultInitState) => {
           throw error;
         }
       }),
-      publishVideoStream: (stream) => __async(null, null, function* () {
-        console.debug("[ReactorStore] Publishing video stream");
+      publish: (name, track) => __async(null, null, function* () {
+        console.debug(`[ReactorStore] Publishing track "${name}"`);
         try {
-          yield get().internal.reactor.publishTrack(stream.getVideoTracks()[0]);
-          console.debug("[ReactorStore] Video stream published successfully");
+          yield get().internal.reactor.publishTrack(name, track);
+          console.debug(
+            `[ReactorStore] Track "${name}" published successfully`
+          );
         } catch (error) {
           console.error(
-            "[ReactorStore] Failed to publish video stream:",
+            `[ReactorStore] Failed to publish track "${name}":`,
             error
           );
           throw error;
         }
       }),
-      unpublishVideoStream: () => __async(null, null, function* () {
-        console.debug("[ReactorStore] Unpublishing video stream");
+      unpublish: (name) => __async(null, null, function* () {
+        console.debug(`[ReactorStore] Unpublishing track "${name}"`);
         try {
-          yield get().internal.reactor.unpublishTrack();
-          console.debug("[ReactorStore] Video stream unpublished successfully");
+          yield get().internal.reactor.unpublishTrack(name);
+          console.debug(
+            `[ReactorStore] Track "${name}" unpublished successfully`
+          );
         } catch (error) {
           console.error(
-            "[ReactorStore] Failed to unpublish video stream:",
+            `[ReactorStore] Failed to unpublish track "${name}":`,
             error
           );
           throw error;
@@ -1524,7 +1831,7 @@ function ReactorProvider(_a) {
     console.debug("[ReactorProvider] Reactor store created successfully");
   }
   const _a2 = connectOptions != null ? connectOptions : {}, { autoConnect = false } = _a2, pollingOptions = __objRest(_a2, ["autoConnect"]);
-  const { coordinatorUrl, modelName, local } = props;
+  const { coordinatorUrl, modelName, local, receive, send } = props;
   const maxAttempts = pollingOptions.maxAttempts;
   useEffect(() => {
     const handleBeforeUnload = () => {
@@ -1580,6 +1887,8 @@ function ReactorProvider(_a) {
         coordinatorUrl,
         modelName,
         local,
+        receive,
+        send,
         jwtToken
       })
     );
@@ -1606,7 +1915,16 @@ function ReactorProvider(_a) {
         console.error("[ReactorProvider] Failed to disconnect:", error);
       });
     };
-  }, [coordinatorUrl, modelName, autoConnect, local, jwtToken, maxAttempts]);
+  }, [
+    coordinatorUrl,
+    modelName,
+    autoConnect,
+    local,
+    receive,
+    send,
+    jwtToken,
+    maxAttempts
+  ]);
   return /* @__PURE__ */ jsx(ReactorContext.Provider, { value: storeRef.current, children });
 }
 function useReactorStore(selector) {
@@ -1672,50 +1990,63 @@ function useStats() {
 }
 
 // src/react/ReactorView.tsx
-import { useEffect as useEffect3, useRef as useRef3 } from "react";
+import { useEffect as useEffect3, useMemo, useRef as useRef3 } from "react";
 import { jsx as jsx2, jsxs } from "react/jsx-runtime";
 function ReactorView({
+  track = "main_video",
+  audioTrack,
   width,
   height,
   className,
   style,
-  videoObjectFit = "contain"
+  videoObjectFit = "contain",
+  muted = true
 }) {
-  const { videoTrack, status } = useReactor((state) => ({
-    videoTrack: state.videoTrack,
-    status: state.status
-  }));
+  const { videoMediaTrack, audioMediaTrack, status } = useReactor((state) => {
+    var _a, _b;
+    return {
+      videoMediaTrack: (_a = state.tracks[track]) != null ? _a : null,
+      audioMediaTrack: audioTrack ? (_b = state.tracks[audioTrack]) != null ? _b : null : null,
+      status: state.status
+    };
+  });
   const videoRef = useRef3(null);
+  const mediaStream = useMemo(() => {
+    const tracks = [];
+    if (videoMediaTrack) tracks.push(videoMediaTrack);
+    if (audioMediaTrack) tracks.push(audioMediaTrack);
+    if (tracks.length === 0) return null;
+    return new MediaStream(tracks);
+  }, [videoMediaTrack, audioMediaTrack]);
   useEffect3(() => {
-    console.debug("[ReactorView] Video track effect triggered", {
+    console.debug("[ReactorView] Media track effect triggered", {
+      track,
       hasVideoElement: !!videoRef.current,
-      hasVideoTrack: !!videoTrack,
-      videoTrackKind: videoTrack == null ? void 0 : videoTrack.kind
+      hasVideoTrack: !!videoMediaTrack,
+      hasAudioTrack: !!audioMediaTrack
     });
-    if (videoRef.current && videoTrack) {
-      console.debug("[ReactorView] Attaching video track to element");
+    if (videoRef.current && mediaStream) {
+      console.debug("[ReactorView] Attaching media stream to element");
       try {
-        const stream = new MediaStream([videoTrack]);
-        videoRef.current.srcObject = stream;
+        videoRef.current.srcObject = mediaStream;
         videoRef.current.play().catch((e) => {
           console.warn("[ReactorView] Auto-play failed:", e);
         });
-        console.debug("[ReactorView] Video track attached successfully");
+        console.debug("[ReactorView] Media stream attached successfully");
       } catch (error) {
-        console.error("[ReactorView] Failed to attach video track:", error);
+        console.error("[ReactorView] Failed to attach media stream:", error);
       }
       return () => {
-        console.debug("[ReactorView] Detaching video track from element");
+        console.debug("[ReactorView] Detaching media stream from element");
         if (videoRef.current) {
           videoRef.current.srcObject = null;
-          console.debug("[ReactorView] Video track detached successfully");
         }
       };
     } else {
-      console.debug("[ReactorView] No video track or element to attach");
+      console.debug("[ReactorView] No tracks or element to attach");
     }
-  }, [videoTrack]);
-  const showPlaceholder = !videoTrack;
+  }, [mediaStream]);
+  const showPlaceholder = !videoMediaTrack;
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -1735,7 +2066,7 @@ function ReactorView({
               objectFit: videoObjectFit,
               display: showPlaceholder ? "none" : "block"
             },
-            muted: true,
+            muted,
             playsInline: true
           }
         ),
@@ -2223,6 +2554,7 @@ function ReactorController({
 import { useEffect as useEffect4, useRef as useRef4, useState as useState4 } from "react";
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function WebcamStream({
+  track,
   className,
   style,
   videoConstraints = {
@@ -2235,10 +2567,10 @@ function WebcamStream({
   const [stream, setStream] = useState4(null);
   const [isPublishing, setIsPublishing] = useState4(false);
   const [permissionDenied, setPermissionDenied] = useState4(false);
-  const { status, publishVideoStream, unpublishVideoStream, reactor } = useReactor((state) => ({
+  const { status, publish, unpublish, reactor } = useReactor((state) => ({
     status: state.status,
-    publishVideoStream: state.publishVideoStream,
-    unpublishVideoStream: state.unpublishVideoStream,
+    publish: state.publish,
+    unpublish: state.unpublish,
     reactor: state.internal.reactor
   }));
   const videoRef = useRef4(null);
@@ -2263,15 +2595,15 @@ function WebcamStream({
   const stopWebcam = () => __async(null, null, function* () {
     console.debug("[WebcamPublisher] Stopping webcam");
     try {
-      yield unpublishVideoStream();
+      yield unpublish(track);
       console.debug("[WebcamPublisher] Unpublished before stopping");
     } catch (err) {
       console.error("[WebcamPublisher] Error unpublishing before stop:", err);
     }
     setIsPublishing(false);
-    stream == null ? void 0 : stream.getTracks().forEach((track) => {
-      track.stop();
-      console.debug("[WebcamPublisher] Stopped track:", track.kind);
+    stream == null ? void 0 : stream.getTracks().forEach((t) => {
+      t.stop();
+      console.debug("[WebcamPublisher] Stopped track:", t.kind);
     });
     setStream(null);
     console.debug("[WebcamPublisher] Webcam stopped");
@@ -2301,28 +2633,31 @@ function WebcamStream({
       console.debug(
         "[WebcamPublisher] Reactor ready, auto-publishing webcam stream"
       );
-      publishVideoStream(stream).then(() => {
-        console.debug("[WebcamPublisher] Auto-publish successful");
-        setIsPublishing(true);
-      }).catch((err) => {
-        console.error("[WebcamPublisher] Auto-publish failed:", err);
-      });
+      const videoTrack = stream.getVideoTracks()[0];
+      if (videoTrack) {
+        publish(track, videoTrack).then(() => {
+          console.debug("[WebcamPublisher] Auto-publish successful");
+          setIsPublishing(true);
+        }).catch((err) => {
+          console.error("[WebcamPublisher] Auto-publish failed:", err);
+        });
+      }
     } else if (status !== "ready" && isPublishing) {
       console.debug("[WebcamPublisher] Reactor not ready, auto-unpublishing");
-      unpublishVideoStream().then(() => {
+      unpublish(track).then(() => {
         console.debug("[WebcamPublisher] Auto-unpublish successful");
         setIsPublishing(false);
       }).catch((err) => {
         console.error("[WebcamPublisher] Auto-unpublish failed:", err);
       });
     }
-  }, [status, stream, isPublishing, publishVideoStream, unpublishVideoStream]);
+  }, [status, stream, isPublishing, publish, unpublish, track]);
   useEffect4(() => {
     const handleError = (error) => {
       console.debug("[WebcamPublisher] Received error event:", error);
-      if (error.code === "VIDEO_PUBLISH_FAILED") {
+      if (error.code === "TRACK_PUBLISH_FAILED") {
         console.debug(
-          "[WebcamPublisher] Video publish failed, resetting isPublishing state"
+          "[WebcamPublisher] Track publish failed, resetting isPublishing state"
         );
         setIsPublishing(false);
       }
@@ -2430,6 +2765,7 @@ function fetchInsecureJwtToken(_0) {
   });
 }
 export {
+  AbortError,
   ConflictError,
   PROD_COORDINATOR_URL,
   Reactor,
@@ -2437,11 +2773,14 @@ export {
   ReactorProvider,
   ReactorView,
   WebcamStream,
+  audio,
   fetchInsecureJwtToken,
+  isAbortError,
   useReactor,
   useReactorInternalMessage,
   useReactorMessage,
   useReactorStore,
-  useStats
+  useStats,
+  video
 };
 //# sourceMappingURL=index.mjs.map