@limrun/ui 0.14.2 → 0.15.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limrun/ui",
-  "version": "0.14.2",
+  "version": "0.15.0",
   "publishConfig": {
     "access": "public",
     "tag": "next"

package/src/components/remote-control.tsx

@@ -176,8 +176,9 @@ interface RemoteControlProps {
    * mode. Use it to render a richer status indicator (e.g.
    * "Camera · 1920×1080 · 30 fps · FaceTime HD").
    *
-   * Only iOS instances ever fire this callback; Android instances
-   * have no camera-injector path and stay silent.
+   * iOS instances always fire this callback. Android instances fire it
+   * when the server supports camera injection (Android 15+); older
+   * Android instances have no camera-injector path and stay silent.
    */
   onCameraDemandChange?: (active: boolean, granted?: boolean, camera?: CameraCaptureInfo) => void;
 
@@ -235,25 +236,23 @@ interface RemoteControlProps {
   cameraAspect?: CameraAspect;
 
   /**
-   * iOS only: when true, capture the user's microphone via
+   * When true, capture the user's microphone via
    * `getUserMedia({ audio: true })` and stream it live into the
-   * simulator's mock microphone. Unlike the camera (which is
-   * demand-driven by apps inside the sim), the microphone is
-   * user-driven: flip this prop from a button in your UI. The
-   * component handles the browser permission prompt, the WebRTC
-   * track attach (no SDP renegotiation — the audio slot is
-   * pre-allocated) and the `microphoneStart`/`microphoneStop`
-   * signaling to the host. Progress and failures are reported via
-   * `onMicrophoneStateChange`. Ignored on Android instances.
+   * device's mock microphone. This is a manual override: apps
+   * that actively consume microphone input also trigger capture
+   * automatically, like camera demand. The component handles the
+   * browser permission prompt, WebRTC track attachment, and
+   * `microphoneStart`/`microphoneStop` signaling. Progress and failures
+   * are reported via `onMicrophoneStateChange`. Ignored on Android
+   * servers without camera/mic injection support (Android 14 and older).
    */
   microphoneEnabled?: boolean;
 
   /**
    * Fires whenever the live-microphone pipeline changes state:
-   * after an enable attempt resolves (granted or denied), when the
-   * host acknowledges or rejects the stream, when the browser
-   * revokes the track mid-stream, and on disable. Use it to render
-   * the mic button's on/off/error state.
+   * after a manual or guest-demanded attempt resolves, when the host
+   * acknowledges or rejects the stream, when the browser revokes the
+   * track mid-stream, and when capture stops.
    */
   onMicrophoneStateChange?: (state: MicrophoneState) => void;
 }
@@ -642,14 +641,11 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
       packetsSent?: number;
       packetsLost?: number;
     } | null>(null);
-    // User-driven outbound microphone state (iOS only). Unlike the
-    // camera, the mic is toggled by the `microphoneEnabled` prop; the
-    // track rides a pre-allocated sendonly audio transceiver so
-    // enabling/disabling is just a `replaceTrack`, plus a
-    // `microphoneStart`/`microphoneStop` WS signal so the host's
-    // audio state machine switches its source.
+    // Outbound microphone state (iOS only). The manual prop and guest-driven
+    // microphoneRequest signals share one pre-allocated audio transceiver.
     const microphoneEnabledRef = useRef(microphoneEnabled);
     microphoneEnabledRef.current = microphoneEnabled;
+    const microphoneDemandActiveRef = useRef(false);
     const onMicrophoneStateChangeRef = useRef(onMicrophoneStateChange);
     onMicrophoneStateChangeRef.current = onMicrophoneStateChange;
     const outboundMicSenderRef = useRef<RTCRtpSender | null>(null);
@@ -1921,6 +1917,14 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
       return next;
     };
 
+    const isMicrophoneWanted = () => microphoneEnabledRef.current || microphoneDemandActiveRef.current;
+
+    const sendMicrophoneStart = (ws: WebSocket) => {
+      const id = `ui-mic-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
+      micStartPendingIdRef.current = id;
+      ws.send(JSON.stringify({ type: 'microphoneStart', id }));
+    };
+
     // Capture the user's microphone and stream it to the simulator's
     // mock microphone. Safe to call redundantly: bails when already
     // attached, when the connection isn't up yet (the ICE-connected
@@ -1929,13 +1933,14 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
     // handler firing on both `connected` and `completed`) must not
     // cancel an attach already in flight; only detach/teardown cancel.
     const attachMicrophone = (): Promise<void> => {
-      if (platform !== 'ios') return Promise.resolve();
+      // No platform gate: attachMicrophoneOp bails when the session never
+      // allocated a sendonly mic transceiver (non-capable servers).
       return runMicOp(() => attachMicrophoneOp());
     };
 
     const attachMicrophoneOp = async () => {
       const generation = micGenerationRef.current;
-      const isCurrent = () => generation === micGenerationRef.current && microphoneEnabledRef.current;
+      const isCurrent = () => generation === micGenerationRef.current && isMicrophoneWanted();
       const reportMicError = (error: string) => {
         safeInvoke('onMicrophoneStateChange', onMicrophoneStateChangeRef.current, {
           active: false,
@@ -2007,9 +2012,7 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
         if (outboundMicStreamRef.current !== stream) return;
         void detachMicrophone('microphone capture ended by the browser');
       };
-      const id = `ui-mic-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
-      micStartPendingIdRef.current = id;
-      ws.send(JSON.stringify({ type: 'microphoneStart', id }));
+      sendMicrophoneStart(ws);
       safeInvoke('onMicrophoneStateChange', onMicrophoneStateChangeRef.current, {
         active: true,
         label: audioTrack.label || undefined,
@@ -2203,10 +2206,10 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
       stopCameraStatsPoller();
       stopOutboundLocalStream();
       outboundCameraSenderRef.current = null;
-      // Same for the live microphone. No `microphoneStop` signal here —
-      // the WS is going away with the connection; if `microphoneEnabled`
-      // is still on, the post-reconnect hook re-attaches.
+      // Same for the live microphone. Manual enablement survives reconnect;
+      // guest demand is replayed by the host after it assigns the new session.
       ++micGenerationRef.current;
+      microphoneDemandActiveRef.current = false;
       micStartPendingIdRef.current = null;
       if (outboundMicStreamRef.current) {
         stopMediaStream(outboundMicStreamRef.current);
@@ -2479,8 +2482,13 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
           updateStatus('WebSocket closed');
         };
 
-        // Request RTCConfiguration
-        const rtcConfigPromise = new Promise<RTCConfiguration>((resolve, reject) => {
+        // Request RTCConfiguration. The reply doubles as the capability
+        // handshake: camera-capable Android servers advertise
+        // `cameraSupported: true` alongside the configuration.
+        const rtcConfigPromise = new Promise<{
+          rtcConfiguration: RTCConfiguration;
+          cameraSupported: boolean;
+        }>((resolve, reject) => {
           const timeoutId = window.setTimeout(() => reject(new Error('RTCConfiguration timeout')), 30000);
 
           const messageHandler = (event: MessageEvent) => {
@@ -2489,7 +2497,10 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
               if (message.type === 'rtcConfiguration') {
                 window.clearTimeout(timeoutId);
                 ws.removeEventListener('message', messageHandler);
-                resolve(message.rtcConfiguration);
+                resolve({
+                  rtcConfiguration: message.rtcConfiguration,
+                  cameraSupported: message.cameraSupported === true,
+                });
               }
             } catch (e) {
               window.clearTimeout(timeoutId);
@@ -2508,7 +2519,8 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
           );
         });
 
-        const rtcConfig = await rtcConfigPromise;
+        const { rtcConfiguration: rtcConfig, cameraSupported: serverCameraSupported } =
+          await rtcConfigPromise;
         if (!isCurrentAttempt() || wsRef.current !== ws) {
           return;
         }
@@ -2518,17 +2530,20 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
         peerConnection.addTransceiver('audio', { direction: 'recvonly' });
         const videoTransceiver = peerConnection.addTransceiver('video', { direction: 'recvonly' });
 
+        // iOS always supports camera/mic injection; Android servers
+        // advertise it through `cameraSupported` (Android 15 and newer).
+        // Never offer the extra sendonly m-lines to non-capable Android
+        // servers — older servers cannot negotiate them safely.
+        const canSendMedia = platform === 'ios' || serverCameraSupported;
+
         // Pre-allocate a sendonly slot for the user's camera so the
-        // sim can pull frames later without renegotiating SDP.
+        // device can pull frames later without renegotiating SDP.
         // Allocating up-front means we don't have to renegotiate the
-        // SDP when the simulator app actually opens its
-        // `AVCaptureSession` — the codec/SSRC negotiation happens
-        // once, here, and turning the camera on/off later is just a
-        // `replaceTrack`.
-        // iOS only: Android has no camera consumer, and the extra
-        // m=video line crashes Android 14's scrcpy/libwebrtc.
+        // SDP when the device app actually opens its camera session —
+        // the codec/SSRC negotiation happens once, here, and turning
+        // the camera on/off later is just a `replaceTrack`.
         const outboundCameraTransceiver =
-          platform === 'ios' ?
+          canSendMedia ?
             peerConnection.addTransceiver('video', {
               direction: 'sendonly',
             })
@@ -2537,10 +2552,9 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
 
         // Same pre-allocation for the live microphone: a sendonly audio
         // slot negotiated once at connection setup, so toggling the mic
-        // later is just `replaceTrack` — no SDP renegotiation. iOS only,
-        // like the camera.
+        // later is just `replaceTrack` — no SDP renegotiation.
         const outboundMicTransceiver =
-          platform === 'ios' ?
+          canSendMedia ?
             peerConnection.addTransceiver('audio', {
               direction: 'sendonly',
             })
@@ -2770,7 +2784,7 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
             clearIceDisconnectedGrace();
             // Re-attach the live microphone across reconnects (or apply a
             // prop that was flipped on before the connection was up).
-            if (microphoneEnabledRef.current && !outboundMicStreamRef.current) {
+            if (isMicrophoneWanted() && !outboundMicStreamRef.current) {
               void attachMicrophone();
             }
             return;
@@ -2934,12 +2948,11 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
               pendingScreenshotRejectersRef.current.delete(message.id);
               break;
             case 'cameraRequest': {
-              // Only iOS sessions allocate the sendonly outbound-camera
-              // transceiver; without it there is nothing to feed the sim, so
-              // ignore camera requests entirely — no getUserMedia prompt and
-              // no onCameraDemandChange callbacks. Android intentionally stays
-              // silent, as the API docs promise.
-              if (platform !== 'ios' || !outboundCameraSenderRef.current) {
+              // Only camera-capable sessions allocate the sendonly
+              // outbound-camera transceiver; without it there is nothing to
+              // feed the device, so ignore camera requests entirely — no
+              // getUserMedia prompt and no onCameraDemandChange callbacks.
+              if (!outboundCameraSenderRef.current) {
                 break;
               }
               const active = message.active === true;
@@ -3170,6 +3183,29 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
               startCameraStatsPoller();
               break;
             }
+            case 'microphoneRequest': {
+              if (!outboundMicSenderRef.current) {
+                break;
+              }
+              const active = message.active === true;
+              microphoneDemandActiveRef.current = active;
+              // eslint-disable-next-line no-console
+              console.info('[RemoteControl] microphoneRequest received, active=', active);
+              if (!active) {
+                if (!microphoneEnabledRef.current) {
+                  await detachMicrophone();
+                }
+                break;
+              }
+              if (outboundMicStreamRef.current) {
+                // A manual stream may already be attached. Re-select it on the
+                // host because file playback can have replaced its source.
+                sendMicrophoneStart(ws);
+                break;
+              }
+              await attachMicrophone();
+              break;
+            }
             case 'microphoneStartResult': {
               if (micStartPendingIdRef.current === null || message.id !== micStartPendingIdRef.current) {
                 break;
@@ -3312,11 +3348,9 @@ export const RemoteControl = forwardRef<RemoteControlHandle, RemoteControlProps>
       }
     }, [cameraAspect]);
 
-    // Drive the live microphone from the `microphoneEnabled` prop.
-    // When flipped on before the connection is up, attachMicrophone
-    // bails and the ICE-connected handler picks it up instead.
+    // Drive the manual override without interrupting guest-driven demand.
     useEffect(() => {
-      if (microphoneEnabled) {
+      if (isMicrophoneWanted()) {
         void attachMicrophone();
       } else {
         void detachMicrophone();