@iloveagents/foundry-web-voice 0.1.0

package/dist/react/install.d.ts

@@ -0,0 +1,62 @@
+/**
+ * Installing the voice tier: one bridge, one adapter registration, one
+ * (optional) set of chat-chrome slots.
+ *
+ * Two ways in, one implementation:
+ *
+ *   - `createVoiceModule(config)` for `bootstrapShell` apps — the module's
+ *     `layoutExtras` mounts the session host.
+ *   - `<FoundryVoice {...config} />` for apps that compose the runtime
+ *     themselves and never use the shell.
+ *
+ * Registration happens when the voice tier is *installed*, not when its host
+ * mounts. `useLocalRuntime` re-applies its options on every render, so a
+ * later registration would also be picked up — but installing first means
+ * the adapter is already there when the runtime first mounts, and the order
+ * never has to be reasoned about.
+ */
+import type { ComponentType, ReactNode } from "react";
+import { VoiceBridge } from "../adapter/voice-bridge.ts";
+import type { VoiceConfig } from "../adapter/types.ts";
+export interface VoiceInstallOptions extends VoiceConfig {
+    /**
+     * Register the mic button and status strip into the chat composer.
+     * Turn off to place `VoiceMicButton` / `VoiceStatusStrip` yourself.
+     * @default true
+     */
+    chrome?: boolean;
+    /** Render the avatar panel when the session config asks for an avatar. @default true */
+    avatar?: boolean;
+    /**
+     * Replace the chat thread with the voice stage while a call is live.
+     * Turn off to keep the transcript visible and show the avatar floating.
+     * @default true
+     */
+    stage?: boolean;
+}
+export interface VoiceInstallation {
+    bridge: VoiceBridge;
+    /** Mount this inside the assistant runtime — it owns the session. */
+    Host: ComponentType;
+    /** Undo the registrations (adapter and, if claimed, the chat slots). */
+    dispose: () => void;
+}
+export declare function installVoice(options: VoiceInstallOptions): VoiceInstallation;
+/**
+ * Drop-in voice for an app that composes its own runtime.
+ *
+ * Render it anywhere inside `AGUIRuntimeProvider`. Installation happens in
+ * an effect, never during render: `installVoice` writes to zustand stores,
+ * and a store write during render is exactly what StrictMode's double-
+ * invoked initializers exist to catch — two bridges get built, the adapter
+ * from the *discarded* one stays registered, the mounted host owns the
+ * other, and the first connect waits on a bridge nobody attached to until
+ * the 10s timeout errors it out.
+ *
+ * Registering after mount is safe because both seams are reactive: the
+ * runtime provider re-reads the adapter store on every render, and the chat
+ * slots are subscriptions. The installation is created once per mount, so a
+ * caller passing inline config objects cannot churn the session; config
+ * changes need a remount (`key`), same as the module path.
+ */
+export declare function FoundryVoice(props: VoiceInstallOptions): ReactNode;

package/dist/react/install.js

@@ -0,0 +1,100 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { registerChatSlots, registerVoiceAdapter, useChatSlotsStore, useVoiceAdapterStore, } from "@iloveagents/foundry-web-ui";
+import { VoiceBridge } from "../adapter/voice-bridge.js";
+import { VoiceMicButton } from "./voice-mic-button.js";
+import { VoiceStatusStrip } from "./voice-status-strip.js";
+import { VoiceLauncherBadge } from "./voice-launcher-badge.js";
+import { VoiceStage } from "./voice-stage.js";
+import { VoiceSurface } from "./voice-surface.js";
+/**
+ * Which installation last claimed the chat slots.
+ *
+ * Module-level because the question is about installations, not components:
+ * every installation registers the same `VoiceMicButton`, so identity alone
+ * cannot answer "is this still mine?".
+ */
+let slotOwner = null;
+export function installVoice(options) {
+    const { chrome = true, avatar = true, stage = true, ...config } = options;
+    const bridge = new VoiceBridge(config);
+    // Kept so disposal can tell "still mine" from "someone replaced me".
+    const adapter = bridge.createAdapter();
+    registerVoiceAdapter(adapter);
+    // The slots need a token rather than component identity: two installations
+    // register the SAME `VoiceMicButton`, so comparing the component cannot tell
+    // them apart and the older one would clear the newer one's controls.
+    const token = Symbol("foundry-voice-install");
+    if (chrome)
+        slotOwner = token;
+    if (chrome) {
+        registerChatSlots({
+            composerActions: VoiceMicButton,
+            composerBanner: VoiceStatusStrip,
+            // A call outlives the panel that started it, so the collapsed launcher
+            // has to show one is running and offer a way out. Renders nothing while
+            // idle, so a chat with no call looks exactly as it did.
+            launcherBadge: VoiceLauncherBadge,
+            // Nothing typed means Send has nothing to do; the corner is
+            // better spent on the other way of asking.
+            composerActionsReplaceSend: true,
+        });
+    }
+    const Host = () => (_jsx(VoiceSurface, { bridge: bridge, config: config, avatar: avatar, stage: stage }));
+    Host.displayName = "FoundryVoiceHost";
+    return {
+        bridge,
+        Host,
+        dispose: () => {
+            // Both registries are last-registration-wins, so a later installation
+            // legitimately owns these slots. Clearing unconditionally would strip
+            // the live one when an OLDER host unmounts — swapping a conditional
+            // <FoundryVoice/> would leave the replacement with no adapter and a
+            // composer with no controls.
+            if (useVoiceAdapterStore.getState().voice === adapter)
+                registerVoiceAdapter(null);
+            if (chrome && slotOwner === token) {
+                slotOwner = null;
+                const slots = useChatSlotsStore.getState();
+                registerChatSlots({
+                    // Still identity-checked as well, so a host that put its OWN control
+                    // in the slot keeps it.
+                    composerActions: slots.composerActions === VoiceMicButton ? null : undefined,
+                    composerBanner: slots.composerBanner === VoiceStatusStrip ? null : undefined,
+                    launcherBadge: slots.launcherBadge === VoiceLauncherBadge ? null : undefined,
+                    composerActionsReplaceSend: slots.composerActions === VoiceMicButton ? false : undefined,
+                    threadSurface: slots.threadSurface === VoiceStage ? null : undefined,
+                });
+            }
+        },
+    };
+}
+/**
+ * Drop-in voice for an app that composes its own runtime.
+ *
+ * Render it anywhere inside `AGUIRuntimeProvider`. Installation happens in
+ * an effect, never during render: `installVoice` writes to zustand stores,
+ * and a store write during render is exactly what StrictMode's double-
+ * invoked initializers exist to catch — two bridges get built, the adapter
+ * from the *discarded* one stays registered, the mounted host owns the
+ * other, and the first connect waits on a bridge nobody attached to until
+ * the 10s timeout errors it out.
+ *
+ * Registering after mount is safe because both seams are reactive: the
+ * runtime provider re-reads the adapter store on every render, and the chat
+ * slots are subscriptions. The installation is created once per mount, so a
+ * caller passing inline config objects cannot churn the session; config
+ * changes need a remount (`key`), same as the module path.
+ */
+export function FoundryVoice(props) {
+    const [installation, setInstallation] = useState(null);
+    // Captured at install time, deliberately — see the docstring.
+    const [initialProps] = useState(props);
+    useEffect(() => {
+        const inst = installVoice(initialProps);
+        setInstallation(inst);
+        return () => inst.dispose();
+    }, [initialProps]);
+    const Host = installation?.Host;
+    return Host ? _jsx(Host, {}) : null;
+}

package/dist/react/relay-answer-watcher.d.ts

@@ -0,0 +1,16 @@
+/**
+ * `RelayAnswerWatcher` — speaks the agent's answer, in `relay` mode.
+ *
+ * Render-less, mounted inside the assistant runtime (the same shape as
+ * foundry-web-ui's `ComposerSubmitBridge`). It watches the last assistant
+ * message as it streams and hands the prose to the bridge, which cuts it
+ * into sentences and speaks them one at a time.
+ *
+ * Only **text** parts are spoken. Reasoning parts are the model thinking out
+ * loud on the way to an answer, and tool calls are machinery — reading
+ * either aloud would be worse than saying nothing.
+ */
+import type { VoiceBridge } from "../adapter/voice-bridge.ts";
+export declare function RelayAnswerWatcher({ bridge }: {
+    bridge: VoiceBridge;
+}): null;

package/dist/react/relay-answer-watcher.js

@@ -0,0 +1,45 @@
+/**
+ * `RelayAnswerWatcher` — speaks the agent's answer, in `relay` mode.
+ *
+ * Render-less, mounted inside the assistant runtime (the same shape as
+ * foundry-web-ui's `ComposerSubmitBridge`). It watches the last assistant
+ * message as it streams and hands the prose to the bridge, which cuts it
+ * into sentences and speaks them one at a time.
+ *
+ * Only **text** parts are spoken. Reasoning parts are the model thinking out
+ * loud on the way to an answer, and tool calls are machinery — reading
+ * either aloud would be worse than saying nothing.
+ */
+import { useEffect, useRef } from "react";
+import { useAuiState, useVoiceState } from "@assistant-ui/react";
+export function RelayAnswerWatcher({ bridge }) {
+    // The array identity changes on every streamed token, which is exactly
+    // the update this component exists to observe. It renders nothing, so the
+    // re-render costs a comparison and a `useEffect`.
+    const messages = useAuiState((s) => s.thread.messages);
+    const status = useVoiceState()?.status.type;
+    // Whatever is on screen when the session goes live was answered before the
+    // user asked for voice. Reading it back at them is not a greeting, it is a
+    // non-sequitur.
+    const latest = useRef(messages);
+    latest.current = messages;
+    useEffect(() => {
+        if (status !== "running")
+            return;
+        const lastAssistant = [...latest.current].reverse().find((m) => m.role === "assistant");
+        bridge.primeAnswer(lastAssistant?.id ?? null);
+    }, [bridge, status]);
+    useEffect(() => {
+        const last = messages[messages.length - 1];
+        if (!last || last.role !== "assistant")
+            return;
+        const text = last.content
+            .filter((part) => part.type === "text")
+            .map((part) => part.text)
+            .join("\n");
+        if (!text)
+            return;
+        bridge.trackAnswer(last.id, text, last.status?.type !== "running");
+    }, [bridge, messages]);
+    return null;
+}

package/dist/react/use-direct-audio-output.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Play the assistant straight through Web Audio, instead of via a MediaStream
+ * and an `<audio>` element.
+ *
+ * The SDK's WebSocket path decodes PCM in an AudioWorklet and routes it
+ * `gain → MediaStreamDestination`, exposing the result as `audioStream` for a
+ * consumer to attach. Attaching it works, but it hands the audio to the
+ * element's *playout* path: a jitter buffer that rate-adapts to keep itself
+ * from draining. At the start of a stream that buffer is empty and still
+ * converging, which is audible on the first reply of a session as a crackle
+ * or a slight pitch bend — and then never again, because the element keeps
+ * running and stays converged.
+ *
+ * The analyser is already in the signal path (`gain → analyser`), and an
+ * `AnalyserNode` passes audio through untouched, so connecting it to the
+ * context's destination gives the same signal with one resampling stage and
+ * one buffer fewer between the worklet and the speakers.
+ *
+ * Only for locally-decoded PCM. A WebRTC session's audio is a remote track
+ * that the browser must play through an element; connecting the analyser
+ * there would play it a second time.
+ */
+export declare function useDirectAudioOutput(enabled: boolean, context: AudioContext | null, analyser: AnalyserNode | null): void;

package/dist/react/use-direct-audio-output.js

@@ -0,0 +1,44 @@
+/**
+ * Play the assistant straight through Web Audio, instead of via a MediaStream
+ * and an `<audio>` element.
+ *
+ * The SDK's WebSocket path decodes PCM in an AudioWorklet and routes it
+ * `gain → MediaStreamDestination`, exposing the result as `audioStream` for a
+ * consumer to attach. Attaching it works, but it hands the audio to the
+ * element's *playout* path: a jitter buffer that rate-adapts to keep itself
+ * from draining. At the start of a stream that buffer is empty and still
+ * converging, which is audible on the first reply of a session as a crackle
+ * or a slight pitch bend — and then never again, because the element keeps
+ * running and stays converged.
+ *
+ * The analyser is already in the signal path (`gain → analyser`), and an
+ * `AnalyserNode` passes audio through untouched, so connecting it to the
+ * context's destination gives the same signal with one resampling stage and
+ * one buffer fewer between the worklet and the speakers.
+ *
+ * Only for locally-decoded PCM. A WebRTC session's audio is a remote track
+ * that the browser must play through an element; connecting the analyser
+ * there would play it a second time.
+ */
+import { useEffect } from "react";
+export function useDirectAudioOutput(enabled, context, analyser) {
+    useEffect(() => {
+        if (!enabled || !context || !analyser)
+            return;
+        try {
+            analyser.connect(context.destination);
+        }
+        catch {
+            // A closed context throws; there is nothing to play through anyway.
+            return;
+        }
+        return () => {
+            try {
+                analyser.disconnect(context.destination);
+            }
+            catch {
+                // Already torn down with the context.
+            }
+        };
+    }, [enabled, context, analyser]);
+}

package/dist/react/voice-audio-sink.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Plays the assistant's audio when no avatar is doing it.
+ *
+ * The SDK routes playback into a ``MediaStreamAudioDestinationNode`` exposed
+ * as ``audioStream`` rather than to the speakers directly, so *something*
+ * must attach it to an element. ``VoiceLiveAvatar`` does that itself; in
+ * voice-only mode nothing does, and the session is silent — connected,
+ * transcribing, and inaudible.
+ *
+ * It also stands down the instant an avatar panel exists, without waiting to
+ * be unmounted. `needsAudioOnlySink` keeps the two apart in every state it can
+ * see, but it cannot see the commit in which a panel mounts: the panel
+ * registers itself in an effect, and this element is already playing by then.
+ * That is one frame of the same stream through two elements — the same audio
+ * at double amplitude, which is a click rather than an echo. Subscribing to
+ * the count pauses this element in the same effect flush that registers the
+ * panel, so the handoff is silent in both directions.
+ */
+export declare function VoiceAudioSink({ stream }: {
+    stream: MediaStream | null;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/react/voice-audio-sink.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Plays the assistant's audio when no avatar is doing it.
+ *
+ * The SDK routes playback into a ``MediaStreamAudioDestinationNode`` exposed
+ * as ``audioStream`` rather than to the speakers directly, so *something*
+ * must attach it to an element. ``VoiceLiveAvatar`` does that itself; in
+ * voice-only mode nothing does, and the session is silent — connected,
+ * transcribing, and inaudible.
+ *
+ * It also stands down the instant an avatar panel exists, without waiting to
+ * be unmounted. `needsAudioOnlySink` keeps the two apart in every state it can
+ * see, but it cannot see the commit in which a panel mounts: the panel
+ * registers itself in an effect, and this element is already playing by then.
+ * That is one frame of the same stream through two elements — the same audio
+ * at double amplitude, which is a click rather than an echo. Subscribing to
+ * the count pauses this element in the same effect flush that registers the
+ * panel, so the handoff is silent in both directions.
+ */
+import { useEffect, useRef } from "react";
+import { useVoiceUiStore } from "./voice-ui-store.js";
+export function VoiceAudioSink({ stream }) {
+    const ref = useRef(null);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        el.srcObject = stream;
+        if (!stream)
+            return;
+        // Autoplay is allowed here: a voice session only ever starts from a
+        // click on the mic, which is the user gesture the policy wants.
+        void el.play().catch(() => {
+            /* a blocked play surfaces as silence, not an unhandled rejection */
+        });
+    }, [stream]);
+    useEffect(() => {
+        const apply = (panels) => {
+            const el = ref.current;
+            if (!el)
+                return;
+            if (panels > 0) {
+                el.pause();
+            }
+            else if (el.srcObject) {
+                void el.play().catch(() => { });
+            }
+        };
+        apply(useVoiceUiStore.getState().avatarPanels);
+        // Imperative, not a re-render: a re-render lands a frame later, which is
+        // exactly the frame being closed here.
+        return useVoiceUiStore.subscribe((s) => apply(s.avatarPanels));
+    }, []);
+    return _jsx("audio", { ref: ref, autoPlay: true, hidden: true, "aria-hidden": "true" });
+}

package/dist/react/voice-avatar.d.ts

@@ -0,0 +1,61 @@
+/**
+ * The avatar surface.
+ *
+ * `VoiceLiveAvatar` does the real work — WebRTC video, chroma-key removal of
+ * the green screen, and the hidden `<audio>` element that makes the session
+ * audible. This wrapper only decides where it sits, and renders nothing
+ * until a video track actually arrives, so a session configured without an
+ * avatar (or one still negotiating) leaves the page untouched.
+ *
+ * Centred, not tucked into a corner: while an avatar is on screen it is the
+ * party being spoken to, and a thumbnail in the periphery reads as a webcam
+ * preview instead. The thread behind stays scrollable and selectable — the
+ * positioning layer takes no pointer events, only the card does.
+ */
+import type { ChromaKeyConfig } from "@iloveagents/foundry-voice-live-react";
+export interface VoiceAvatarPanelProps {
+    videoStream: MediaStream | null;
+    audioStream: MediaStream | null;
+    /** Replaces the default centred placement entirely. */
+    className?: string;
+    /**
+     * Classes for the video canvas itself.
+     *
+     * The SDK sets `height:auto; object-fit:contain` as an inline style, which
+     * a plain class cannot beat — pass Tailwind's important modifier
+     * (`object-cover!`) to override it.
+     */
+    canvasClassName?: string;
+    /** Chroma-key tuning; defaults to a tighter edge than the SDK's (see `AVATAR_CHROMA_KEY`). */
+    chromaKeyConfig?: ChromaKeyConfig;
+}
+/**
+ * Keying tuned against the SDK's actual shader rather than by eye.
+ *
+ * That shader is `alpha = smoothstep(similarity, similarity + smoothness, d)`,
+ * where `d` is the distance from the key colour in UV (chrominance) space. The
+ * decisive numbers: a green screen sits at `d = 0`, edge pixels smeared by
+ * 4:2:0 chroma subsampling land around `0.17`–`0.47`, and the SUBJECT is only
+ * as far out as `d ≈ 0.53` — white and light grey are the closest, skin around
+ * `0.58`. Subject and fringe are much nearer each other than they look.
+ *
+ * So `similarity + smoothness` is a hard ceiling: put it above ~0.52 and the
+ * upper end of the smoothstep starts inside the subject, which does not read
+ * as a soft edge — it turns the whole figure semi-transparent. An earlier
+ * attempt to soften the fringe with `0.42 / 0.25` did exactly that: a grey
+ * t-shirt came out 46% opaque, white 43%, skin ~70%, and the avatar rendered
+ * as a washed-out ghost with a halo.
+ *
+ * The fringe wants the opposite move. Widening `smoothness` never removed
+ * green — fringe pixels sit below `similarity` and were already fully cut —
+ * it only ate the subject. Raising `similarity` while keeping the band narrow
+ * is what tightens the edge: at `0.44 / 0.08` an 80%-subject edge pixel drops
+ * to alpha 0.24 (the SDK default leaves it at 0.73, still visibly green) while
+ * every subject colour stays fully opaque.
+ *
+ * Hosts with different lighting override via `chromaKeyConfig` (plumbed from
+ * `VoiceConfig.chromaKey`). `chroma-key.test.ts` re-derives all of the above
+ * from the shader, so a future tweak cannot quietly reintroduce the ghost.
+ */
+export declare const AVATAR_CHROMA_KEY: ChromaKeyConfig;
+export declare function VoiceAvatarPanel({ videoStream, audioStream, className, canvasClassName, chromaKeyConfig, }: VoiceAvatarPanelProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/react/voice-avatar.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * The avatar surface.
+ *
+ * `VoiceLiveAvatar` does the real work — WebRTC video, chroma-key removal of
+ * the green screen, and the hidden `<audio>` element that makes the session
+ * audible. This wrapper only decides where it sits, and renders nothing
+ * until a video track actually arrives, so a session configured without an
+ * avatar (or one still negotiating) leaves the page untouched.
+ *
+ * Centred, not tucked into a corner: while an avatar is on screen it is the
+ * party being spoken to, and a thumbnail in the periphery reads as a webcam
+ * preview instead. The thread behind stays scrollable and selectable — the
+ * positioning layer takes no pointer events, only the card does.
+ */
+import { useEffect } from "react";
+import { VoiceLiveAvatar } from "@iloveagents/foundry-voice-live-react";
+import { trackAvatarPanel } from "./voice-ui-store.js";
+const LAYER = "pointer-events-none fixed inset-x-0 top-1/2 z-40 flex -translate-y-1/2 justify-center px-4";
+/**
+ * No background, no border. The avatar arrives chroma-keyed to a cut-out, so
+ * anything drawn behind it is the rectangle the keying just removed.
+ */
+const CARD = "pointer-events-auto w-[26rem] max-w-[80vw]";
+/**
+ * Keying tuned against the SDK's actual shader rather than by eye.
+ *
+ * That shader is `alpha = smoothstep(similarity, similarity + smoothness, d)`,
+ * where `d` is the distance from the key colour in UV (chrominance) space. The
+ * decisive numbers: a green screen sits at `d = 0`, edge pixels smeared by
+ * 4:2:0 chroma subsampling land around `0.17`–`0.47`, and the SUBJECT is only
+ * as far out as `d ≈ 0.53` — white and light grey are the closest, skin around
+ * `0.58`. Subject and fringe are much nearer each other than they look.
+ *
+ * So `similarity + smoothness` is a hard ceiling: put it above ~0.52 and the
+ * upper end of the smoothstep starts inside the subject, which does not read
+ * as a soft edge — it turns the whole figure semi-transparent. An earlier
+ * attempt to soften the fringe with `0.42 / 0.25` did exactly that: a grey
+ * t-shirt came out 46% opaque, white 43%, skin ~70%, and the avatar rendered
+ * as a washed-out ghost with a halo.
+ *
+ * The fringe wants the opposite move. Widening `smoothness` never removed
+ * green — fringe pixels sit below `similarity` and were already fully cut —
+ * it only ate the subject. Raising `similarity` while keeping the band narrow
+ * is what tightens the edge: at `0.44 / 0.08` an 80%-subject edge pixel drops
+ * to alpha 0.24 (the SDK default leaves it at 0.73, still visibly green) while
+ * every subject colour stays fully opaque.
+ *
+ * Hosts with different lighting override via `chromaKeyConfig` (plumbed from
+ * `VoiceConfig.chromaKey`). `chroma-key.test.ts` re-derives all of the above
+ * from the shader, so a future tweak cannot quietly reintroduce the ghost.
+ */
+export const AVATAR_CHROMA_KEY = {
+    keyColor: [0, 1, 0],
+    similarity: 0.44,
+    smoothness: 0.08,
+};
+export function VoiceAvatarPanel({ videoStream, audioStream, className, canvasClassName, chromaKeyConfig = AVATAR_CHROMA_KEY, }) {
+    // Announce that an avatar element exists, so the surface knows it does not
+    // also need a bare audio sink. Configuration cannot answer that question:
+    // this panel may be rendered by the stage, and the chat surface decides
+    // whether the stage is on screen at all.
+    const rendering = !!videoStream;
+    useEffect(() => {
+        if (!rendering)
+            return;
+        trackAvatarPanel(1);
+        return () => trackAvatarPanel(-1);
+    }, [rendering]);
+    if (!videoStream)
+        return null;
+    const avatar = (_jsx(VoiceLiveAvatar, { videoStream: videoStream, audioStream: audioStream, canvasClassName: canvasClassName, chromaKeyConfig: chromaKeyConfig }));
+    if (className)
+        return _jsx("div", { className: className, children: avatar });
+    return (_jsx("div", { className: LAYER, children: _jsx("div", { className: CARD, children: avatar }) }));
+}

package/dist/react/voice-launcher-badge.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Shown over the collapsed chat launcher while a call is live.
+ *
+ * Closing the floating panel does not end the call: `VoiceSurface` is mounted
+ * as a layout extra, so the session — and the microphone — outlive the panel
+ * that started it, while every control goes away with it. A launcher that
+ * looked idle while the microphone was still capturing is the problem this
+ * solves. The dot says a call is running; the button ends it without making
+ * the user guess that reopening chat is the way out.
+ *
+ * Reads assistant-ui state only, like the composer button, so it stays true
+ * for any registered `RealtimeVoiceAdapter`.
+ */
+export declare function VoiceLauncherBadge(): import("react/jsx-runtime").JSX.Element | null;

package/dist/react/voice-launcher-badge.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Shown over the collapsed chat launcher while a call is live.
+ *
+ * Closing the floating panel does not end the call: `VoiceSurface` is mounted
+ * as a layout extra, so the session — and the microphone — outlive the panel
+ * that started it, while every control goes away with it. A launcher that
+ * looked idle while the microphone was still capturing is the problem this
+ * solves. The dot says a call is running; the button ends it without making
+ * the user guess that reopening chat is the way out.
+ *
+ * Reads assistant-ui state only, like the composer button, so it stays true
+ * for any registered `RealtimeVoiceAdapter`.
+ */
+import { useVoiceControls, useVoiceState } from "@assistant-ui/react";
+import { PhoneOff } from "lucide-react";
+export function VoiceLauncherBadge() {
+    const voice = useVoiceState();
+    const controls = useVoiceControls();
+    if (!voice || voice.status.type === "ended")
+        return null;
+    const connecting = voice.status.type === "starting";
+    return (_jsxs("span", { 
+        // The launcher wrapper is a positioned `group`, which is the anchor
+        // contract this slot is documented against.
+        className: "pointer-events-none absolute -right-1 -top-1 z-10 flex items-center", children: [_jsx("span", { "aria-hidden": "true", className: `size-3 rounded-full bg-primary ring-2 ring-background ${connecting ? "animate-pulse" : "animate-[pulse_1.6s_ease-in-out_infinite]"}` }), _jsxs("button", { type: "button", onClick: (e) => {
+                    // The launcher underneath opens the chat; ending the call must not
+                    // also reopen the panel the user deliberately closed.
+                    e.stopPropagation();
+                    controls.disconnect();
+                }, "aria-label": "End voice conversation", className: "pointer-events-none ml-1 flex items-center gap-1 rounded-full bg-background/95 " +
+                    "px-2 py-1 text-xs text-foreground opacity-0 shadow ring-1 ring-border " +
+                    "transition-opacity group-hover:pointer-events-auto group-hover:opacity-100 " +
+                    "group-focus-within:pointer-events-auto group-focus-within:opacity-100 " +
+                    "focus-visible:pointer-events-auto focus-visible:opacity-100", children: [_jsx(PhoneOff, { className: "size-3.5" }), "End call"] }), _jsx("span", { className: "sr-only", children: "Voice conversation in progress" })] }));
+}

package/dist/react/voice-mic-button.d.ts

@@ -0,0 +1,19 @@
+/**
+ * The composer's voice control.
+ *
+ * Every piece of state it reads is assistant-ui's own — `useVoiceState`,
+ * `useVoiceControls`, `useVoiceVolume`, and the runtime's `voice` capability
+ * flag. Nothing here talks to Voice Live, which is why the same button works
+ * for any registered `RealtimeVoiceAdapter`.
+ *
+ * It renders nothing at all when no adapter is registered, so the composer
+ * of an app without voice is unchanged.
+ *
+ * Shape follows the convention every voice-capable composer has converged
+ * on: a filled circular button carrying a waveform, sitting beside Send —
+ * and standing down while the user is typing, because at that moment Send is
+ * the action and a second filled circle is just noise. Once a session is
+ * live it stays put regardless, since ending the call must always be one
+ * click away.
+ */
+export declare function VoiceMicButton(): import("react/jsx-runtime").JSX.Element | null;

package/dist/react/voice-mic-button.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The composer's voice control.
+ *
+ * Every piece of state it reads is assistant-ui's own — `useVoiceState`,
+ * `useVoiceControls`, `useVoiceVolume`, and the runtime's `voice` capability
+ * flag. Nothing here talks to Voice Live, which is why the same button works
+ * for any registered `RealtimeVoiceAdapter`.
+ *
+ * It renders nothing at all when no adapter is registered, so the composer
+ * of an app without voice is unchanged.
+ *
+ * Shape follows the convention every voice-capable composer has converged
+ * on: a filled circular button carrying a waveform, sitting beside Send —
+ * and standing down while the user is typing, because at that moment Send is
+ * the action and a second filled circle is just noise. Once a session is
+ * live it stays put regardless, since ending the call must always be one
+ * click away.
+ */
+import { useAuiState, useVoiceControls, useVoiceState, useVoiceVolume } from "@assistant-ui/react";
+import { TooltipIconButton } from "@iloveagents/foundry-web-ui";
+import { AudioLines, Loader2, Mic, MicOff, X } from "lucide-react";
+import { useVoiceUiStore } from "./voice-ui-store.js";
+/** Volume below which the ring is not drawn — room noise shouldn't make it shimmer. */
+const RING_FLOOR = 0.05;
+/**
+ * Exactly Send's footprint, because it stands in that position: the composer
+ * is a query container, and Send is `size-8` in the bubble and `size-10`
+ * expanded.
+ */
+const CIRCLE = "size-8 @md:size-10 rounded-full shrink-0";
+export function VoiceMicButton() {
+    const canVoice = useAuiState((s) => s.optional.thread?.capabilities.voice ?? false);
+    const composerEmpty = useAuiState((s) => s.optional.composer?.isEmpty ?? true);
+    const voice = useVoiceState();
+    const controls = useVoiceControls();
+    const volume = useVoiceVolume();
+    const connectionState = useVoiceUiStore((s) => s.connectionState);
+    if (!canVoice)
+        return null;
+    const idle = !voice || voice.status.type === "ended";
+    if (idle) {
+        // Typing is a commitment to the keyboard; let Send have the corner.
+        if (!composerEmpty)
+            return null;
+        return (_jsx(TooltipIconButton, { tooltip: "Start voice conversation", variant: "default", className: CIRCLE, onClick: () => controls.connect(), children: _jsx(AudioLines, { className: "size-5" }) }));
+    }
+    if (voice.status.type === "starting") {
+        return (_jsx(TooltipIconButton, { tooltip: "Connecting\u2026", variant: "default", className: CIRCLE, onClick: () => controls.disconnect(), children: _jsx(Loader2, { className: "size-5 animate-spin" }) }));
+    }
+    const reconnecting = connectionState === "reconnecting";
+    return (_jsxs("span", { className: "flex items-center gap-1", children: [_jsx(TooltipIconButton, { tooltip: voice.isMuted ? "Unmute microphone" : "Mute microphone", variant: "ghost", className: "size-8 @md:size-9 shrink-0 rounded-full", onClick: () => (voice.isMuted ? controls.unmute() : controls.mute()), children: voice.isMuted ? (_jsx(MicOff, { className: "size-5 text-muted-foreground" })) : (_jsx(Mic, { className: "size-5" })) }), _jsxs("span", { className: "relative flex items-center justify-center", children: [_jsx("span", { "aria-hidden": "true", className: "pointer-events-none absolute size-8 @md:size-10 rounded-full bg-primary/25 transition-transform duration-75", style: { transform: `scale(${volume > RING_FLOOR ? 1 + volume * 0.4 : 0})` } }), _jsx(TooltipIconButton, { tooltip: reconnecting ? "Reconnecting — end voice conversation" : "End voice conversation", variant: "default", className: `${CIRCLE} relative ${reconnecting ? "animate-pulse" : ""}`, onClick: () => controls.disconnect(), children: _jsx(X, { className: "size-5" }) })] })] }));
+}