@alexkroman1/aai-ui 0.9.2 → 0.10.0

package/dist/_components/transcript.d.ts

@@ -1,6 +1,24 @@
 import type * as preact from "preact";
 import type { Reactive } from "../types.ts";
-/** @public */
+/**
+ * Live speech-to-text transcript shown while the user is speaking.
+ * Returns `null` when there is no active utterance.
+ *
+ * Displays a {@link ThinkingIndicator} while waiting for the first
+ * transcription text (i.e., `userUtterance` is `""`).
+ *
+ * @example
+ * ```tsx
+ * const { session } = useSession();
+ * <Transcript userUtterance={session.userUtterance} />
+ * ```
+ *
+ * @param userUtterance - Reactive string (`null` when idle, `""` when
+ *   listening but no text yet, or the transcript text).
+ * @param className - Additional CSS class names.
+ *
+ * @public
+ */
 export declare function Transcript({ userUtterance, className, }: {
     userUtterance: Reactive<string | null>;
     className?: string;

package/dist/_components/transcript.js

@@ -2,7 +2,25 @@ import { ThinkingIndicator } from "./thinking-indicator.js";
 import clsx from "clsx";
 import { jsx } from "preact/jsx-runtime";
 //#region _components/transcript.tsx
-/** @public */
+/**
+* Live speech-to-text transcript shown while the user is speaking.
+* Returns `null` when there is no active utterance.
+*
+* Displays a {@link ThinkingIndicator} while waiting for the first
+* transcription text (i.e., `userUtterance` is `""`).
+*
+* @example
+* ```tsx
+* const { session } = useSession();
+* <Transcript userUtterance={session.userUtterance} />
+* ```
+*
+* @param userUtterance - Reactive string (`null` when idle, `""` when
+*   listening but no text yet, or the transcript text).
+* @param className - Additional CSS class names.
+*
+* @public
+*/
 function Transcript({ userUtterance, className }) {
 	if (userUtterance.value === null) return null;
 	return /* @__PURE__ */ jsx("div", {

package/dist/_sqlite-stub.d.ts

@@ -0,0 +1,3 @@
+export declare class DatabaseSync {
+    constructor();
+}

package/dist/audio.js

@@ -29,7 +29,9 @@ async function createVoiceIO(opts) {
 		await Promise.all([ctx.audioWorklet.addModule(captureWorkletSrc), ctx.audioWorklet.addModule(playbackWorkletSrc)]);
 	} catch (err) {
 		for (const t of stream.getTracks()) t.stop();
-		await ctx.close().catch(() => {});
+		await ctx.close().catch((err) => {
+			console.warn("AudioContext close failed:", err);
+		});
 		throw err;
 	}
 	const mic = ctx.createMediaStreamSource(stream);
@@ -43,7 +45,9 @@ async function createVoiceIO(opts) {
 	});
 	mic.connect(capNode);
 	const chunkSizeBytes = Math.floor(sttSampleRate * MIC_BUFFER_SECONDS) * 2;
-	const capBuf = new Uint8Array(chunkSizeBytes * 2);
+	const capBufA = new Uint8Array(chunkSizeBytes * 2);
+	const capBufB = new Uint8Array(chunkSizeBytes * 2);
+	let capBuf = capBufA;
 	let capOffset = 0;
 	capNode.port.postMessage({ event: "start" });
 	capNode.port.onmessage = (e) => {
@@ -52,8 +56,11 @@ async function createVoiceIO(opts) {
 		capBuf.set(chunk, capOffset);
 		capOffset += chunk.byteLength;
 		if (capOffset >= chunkSizeBytes) {
-			onMicData(capBuf.slice(0, capOffset).buffer);
+			const sendBuf = capBuf;
+			const filled = capOffset;
+			capBuf = capBuf === capBufA ? capBufB : capBufA;
 			capOffset = 0;
+			onMicData(sendBuf.buffer.slice(0, filled));
 		}
 	};
 	let playNode = null;
@@ -98,6 +105,9 @@ async function createVoiceIO(opts) {
 			if (lifecycle.signal.aborted) return;
 			lifecycle.abort();
 			capNode.port.postMessage({ event: "stop" });
+			mic.disconnect();
+			capNode.disconnect();
+			if (playNode) playNode.disconnect();
 			for (const t of stream.getTracks()) t.stop();
 			await ctx.close().catch(() => {});
 		},

package/dist/client-handler.d.ts

@@ -0,0 +1,43 @@
+import type { ReadyConfig } from "@alexkroman1/aai/protocol";
+import type { VoiceIO } from "./audio.ts";
+import type { AgentState, ChatMessage, Reactive, SessionError, ToolCallInfo } from "./types.ts";
+type BatchFn = (fn: () => void) => void;
+/**
+ * Handles server→client messages and updates reactive Preact signals
+ * accordingly (state transitions, transcripts, messages, audio playback).
+ *
+ * @internal Exported for testing only.
+ */
+export declare class ClientHandler {
+    #private;
+    constructor(opts: {
+        state: Reactive<AgentState>;
+        messages: Reactive<ChatMessage[]>;
+        toolCalls: Reactive<ToolCallInfo[]>;
+        userUtterance: Reactive<string | null>;
+        agentUtterance: Reactive<string | null>;
+        error: Reactive<SessionError | null>;
+        voiceIO: () => VoiceIO | null;
+        batch: BatchFn;
+    });
+    /** Single entry point for all server→client session events. */
+    event(e: import("@alexkroman1/aai/protocol").ClientEvent): void;
+    /** Enqueue a PCM16 audio chunk for playback. Transitions state to `"speaking"` on the first chunk. */
+    playAudioChunk(chunk: Uint8Array): void;
+    /**
+     * Signal that the server has finished sending audio for this turn.
+     * Waits for the audio queue to drain, then transitions state to `"listening"`.
+     * Uses the `#generation` counter to discard stale completions from interrupted turns.
+     */
+    playAudioDone(): void;
+    /**
+     * Dispatch an incoming WebSocket message (text or binary).
+     *
+     * Returns the parsed config if the message is a `config` message,
+     * otherwise `null`.
+     */
+    handleMessage(data: string | ArrayBuffer): (ReadyConfig & {
+        sessionId?: string;
+    }) | null;
+}
+export {};

package/dist/index.d.ts

@@ -2,10 +2,8 @@
  * Browser client library for AAI voice agents.
  *
  * Provides WebSocket session management, audio capture/playback,
- * and Preact UI components. For narrower imports, use the sub-path exports:
- *
- * - `@aai/ui/session` — WebSocket session only (no Preact dependency)
- * - `@aai/ui/components` — Preact components, mount helpers, and signals
+ * and Preact UI components. For a narrower import without the Preact
+ * dependency, use `@aai/ui/session`.
  *
  * @example
  * ```tsx
@@ -14,7 +12,26 @@
  * mount(App, { target: "#app" });
  * ```
  */
-export * from "./components.ts";
+export { App } from "./_components/app.tsx";
+export type { ButtonSize, ButtonVariant } from "./_components/button.tsx";
+export { Button } from "./_components/button.tsx";
+export { ChatView } from "./_components/chat-view.tsx";
+export { Controls } from "./_components/controls.tsx";
+export { ErrorBanner } from "./_components/error-banner.tsx";
+export { MessageBubble } from "./_components/message-bubble.tsx";
+export { MessageList } from "./_components/message-list.tsx";
+export { SidebarLayout } from "./_components/sidebar-layout.tsx";
+export { StartScreen } from "./_components/start-screen.tsx";
+export { StateIndicator } from "./_components/state-indicator.tsx";
+export { ThinkingIndicator } from "./_components/thinking-indicator.tsx";
+export { ToolCallBlock } from "./_components/tool-call-block.tsx";
+export { Transcript } from "./_components/transcript.tsx";
+export type { MountHandle, MountOptions } from "./mount.tsx";
+export { mount } from "./mount.tsx";
+export type { MountConfig, MountTheme } from "./mount-context.ts";
+export { useMountConfig } from "./mount-context.ts";
 export type { VoiceSession } from "./session.ts";
 export { createVoiceSession } from "./session.ts";
-export type { AgentState, Message, Reactive, SessionError, SessionErrorCode, SessionOptions, ToolCallInfo, } from "./types.ts";
+export type { SessionSignals } from "./signals.ts";
+export { createSessionControls, SessionProvider, useAutoScroll, useSession, useToolCallStart, useToolCallUpdate, useToolResult, } from "./signals.ts";
+export type { AgentState, ChatMessage, Reactive, SessionError, SessionErrorCode, ToolCallInfo, VoiceSessionOptions, } from "./types.ts";

package/dist/index.js

@@ -1,5 +1,5 @@
 import { useMountConfig } from "./mount-context.js";
-import { SessionProvider, createSessionControls, useAutoScroll, useSession, useToolResult } from "./signals.js";
+import { SessionProvider, createSessionControls, useAutoScroll, useSession, useToolCallStart, useToolCallUpdate, useToolResult } from "./signals.js";
 import { Button } from "./_components/button.js";
 import { Controls } from "./_components/controls.js";
 import { ErrorBanner } from "./_components/error-banner.js";
@@ -13,7 +13,6 @@ import { ChatView } from "./_components/chat-view.js";
 import { StartScreen } from "./_components/start-screen.js";
 import { App } from "./_components/app.js";
 import { SidebarLayout } from "./_components/sidebar-layout.js";
-import { createVoiceSession } from "./session.js";
+import { t as createVoiceSession } from "./session-D0RdWlWH.js";
 import { mount } from "./mount.js";
-import "./components.js";
-export { App, Button, ChatView, Controls, ErrorBanner, MessageBubble, MessageList, SessionProvider, SidebarLayout, StartScreen, StateIndicator, ThinkingIndicator, ToolCallBlock, Transcript, createSessionControls, createVoiceSession, mount, useAutoScroll, useMountConfig, useSession, useToolResult };
+export { App, Button, ChatView, Controls, ErrorBanner, MessageBubble, MessageList, SessionProvider, SidebarLayout, StartScreen, StateIndicator, ThinkingIndicator, ToolCallBlock, Transcript, createSessionControls, createVoiceSession, mount, useAutoScroll, useMountConfig, useSession, useToolCallStart, useToolCallUpdate, useToolResult };

package/dist/mount.d.ts

@@ -16,6 +16,10 @@ export type MountOptions = {
     title?: string;
     /** Theme color overrides. */
     theme?: MountTheme;
+    /** Called when the server sends a session ID. Store it for reconnection. */
+    onSessionId?: ((sessionId: string) => void) | undefined;
+    /** Session ID from a previous connection for resuming persisted state. */
+    resumeSessionId?: string | undefined;
 };
 /**
  * Handle returned by {@link mount} for cleanup.

package/dist/mount.js

@@ -1,12 +1,13 @@
 import { MountConfigProvider } from "./mount-context.js";
 import { SessionProvider, createSessionControls } from "./signals.js";
-import { createVoiceSession } from "./session.js";
+import { t as createVoiceSession } from "./session-D0RdWlWH.js";
 import { render } from "preact";
 import { batch, signal } from "@preact/signals";
 import { jsx } from "preact/jsx-runtime";
 //#region mount.tsx
 function resolveContainer(target = "#app") {
-	const el = typeof target === "string" ? document.querySelector(target) : target;
+	if (typeof target !== "string") return target;
+	const el = document.querySelector(target);
 	if (!el) throw new Error(`Element not found: ${target}`);
 	return el;
 }
@@ -28,8 +29,10 @@ function mount(Component, options) {
 	const container = resolveContainer(options?.target);
 	const session = createVoiceSession({
 		platformUrl: options?.platformUrl ?? globalThis.location.origin + globalThis.location.pathname,
-		signal,
-		batch
+		reactiveFactory: signal,
+		batch,
+		onSessionId: options?.onSessionId,
+		resumeSessionId: options?.resumeSessionId
 	});
 	const signals = createSessionControls(session);
 	const mountConfig = {