@jgengine/react 0.7.0 → 0.8.0

package/dist/voice.js

@@ -0,0 +1,130 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { createPushToTalk, } from "@jgengine/core/multiplayer/voiceContract";
+/**
+ * Mic capture + push-to-talk + channel roster over the VoiceTransport
+ * signaling seam. Transmission gates the captured tracks' `enabled` flag; the
+ * media plane that actually moves audio bytes (WebRTC/SFU) stays behind the
+ * transport, host-supplied. Call once per voice channel and hand the returned
+ * state to the voice components.
+ */
+export function useVoice(options) {
+    const transport = options?.transport;
+    const channelId = options?.channelId ?? "voice";
+    const resolveRoutes = options?.resolveRoutes;
+    const requestedMode = options?.mode ?? "hold";
+    const [transmitting, setTransmitting] = useState(false);
+    const [version, setVersion] = useState(0);
+    const bump = useCallback(() => setVersion((current) => current + 1), []);
+    void version;
+    const pttRef = useRef(null);
+    if (pttRef.current === null) {
+        pttRef.current = createPushToTalk({ mode: requestedMode, onChange: setTransmitting });
+    }
+    const ptt = pttRef.current;
+    const [micStream, setMicStream] = useState(null);
+    const [micError, setMicError] = useState(null);
+    const micRef = useRef(null);
+    const getUserMedia = options?.getUserMedia ??
+        (typeof navigator !== "undefined" && navigator.mediaDevices !== undefined
+            ? (constraints) => navigator.mediaDevices.getUserMedia(constraints)
+            : undefined);
+    const supported = getUserMedia !== undefined;
+    const requestMic = useCallback(async () => {
+        if (getUserMedia === undefined) {
+            setMicError("microphone capture not supported");
+            return false;
+        }
+        try {
+            const stream = await getUserMedia({ audio: true });
+            micRef.current = stream;
+            setMicStream(stream);
+            setMicError(null);
+            void transport?.publish(channelId, stream.id);
+            return true;
+        }
+        catch (error) {
+            setMicError(error instanceof Error ? error.message : "microphone permission denied");
+            return false;
+        }
+    }, [getUserMedia, transport, channelId]);
+    useEffect(() => {
+        const stream = micRef.current;
+        if (stream === null)
+            return;
+        for (const track of stream.getAudioTracks())
+            track.enabled = transmitting;
+    }, [transmitting, micStream]);
+    useEffect(() => {
+        return () => {
+            const stream = micRef.current;
+            if (stream !== null)
+                for (const track of stream.getTracks())
+                    track.stop();
+        };
+    }, []);
+    const [participants, setParticipants] = useState([]);
+    useEffect(() => {
+        if (transport === undefined)
+            return undefined;
+        void transport.join(channelId, micRef.current?.id);
+        const unsubscribe = transport.subscribers(channelId, setParticipants);
+        return () => {
+            unsubscribe();
+            void transport.leave(channelId);
+        };
+    }, [transport, channelId]);
+    const routes = resolveRoutes?.() ?? [];
+    return useMemo(() => ({
+        supported,
+        micStream,
+        micError,
+        requestMic,
+        transmitting,
+        status: ptt.status(),
+        mode: ptt.mode(),
+        setMode(mode) {
+            ptt.setMode(mode);
+            bump();
+        },
+        muted: ptt.muted(),
+        setMuted(muted) {
+            ptt.setMuted(muted);
+            bump();
+        },
+        keyDown() {
+            ptt.keyDown();
+            bump();
+        },
+        keyUp() {
+            ptt.keyUp();
+            bump();
+        },
+        participants,
+        routes,
+        gainFor(userId) {
+            let gain = 0;
+            for (const route of routes) {
+                if (route.fromUserId === userId && route.gain > gain)
+                    gain = route.gain;
+            }
+            return gain;
+        },
+    }), [supported, micStream, micError, requestMic, transmitting, participants, routes, ptt, bump]);
+}
+export function PushToTalkButton({ voice, className, children, }) {
+    return (_jsx("button", { type: "button", className: className, "data-push-to-talk": true, "data-transmitting": voice.transmitting, "data-status": voice.status, onPointerDown: () => voice.keyDown(), onPointerUp: () => voice.keyUp(), onPointerLeave: () => voice.keyUp(), children: children ?? (voice.transmitting ? "Transmitting" : "Push to talk") }));
+}
+export function MicToggle({ voice, className, mutedLabel, unmutedLabel, }) {
+    return (_jsx("button", { type: "button", className: className, "data-mic-toggle": true, "data-muted": voice.muted, "aria-pressed": voice.muted, onClick: () => voice.setMuted(!voice.muted), children: voice.muted ? (mutedLabel ?? "Unmute") : (unmutedLabel ?? "Mute") }));
+}
+export function SpeakingIndicator({ voice, userId, className, threshold = 0.01, children, }) {
+    const gain = voice.gainFor(userId);
+    return (_jsx("span", { className: className, "data-speaking": gain > threshold, "data-gain": gain.toFixed(3), "data-user": userId, children: children }));
+}
+export function VoiceRoster({ voice, className, participantClassName, renderParticipant, }) {
+    return (_jsx("div", { className: className, "data-voice-roster": true, children: voice.participants.map((participant) => {
+            const gain = voice.gainFor(participant.userId);
+            return (_jsx("div", { className: participantClassName, "data-voice-participant": participant.userId, "data-published": participant.streamId !== undefined, "data-speaking": gain > 0.01, children: renderParticipant !== undefined ? renderParticipant(participant, gain) : participant.userId }, participant.userId));
+        }) }));
+}