@allmodels/dsh-speech 0.1.0

package/lib/client.js

@@ -0,0 +1,1803 @@
+window.__ModuleLoader__.load({ id: "@allmodels/dsh-speech", factory: (require) => {
+var module = { exports: {} }; var exports = module.exports;
+//#region rolldown:runtime
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+
+//#endregion
+let react = require("react");
+react = __toESM(react);
+let react_dom = require("react-dom");
+react_dom = __toESM(react_dom);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = __toESM(react_jsx_runtime);
+
+//#region src/client/audio.ts
+const WORKLET_SOURCE = String.raw`
+class DshSpeechPcmProcessor extends AudioWorkletProcessor {
+  constructor() {
+    super()
+    this.ratio = 16000 / sampleRate
+    this.credit = 0
+    this.samples = new Int16Array(1600)
+    this.offset = 0
+    this.energy = 0
+    this.energySamples = 0
+  }
+
+  process(inputs) {
+    const channel = inputs[0] && inputs[0][0]
+    if (!channel) return true
+    for (let index = 0; index < channel.length; index += 1) {
+      const raw = channel[index]
+      this.energy += raw * raw
+      this.energySamples += 1
+      this.credit += this.ratio
+      if (this.credit < 1) continue
+      this.credit -= 1
+      const sample = Math.max(-1, Math.min(1, raw))
+      this.samples[this.offset++] = sample < 0 ? sample * 0x8000 : sample * 0x7fff
+      if (this.offset === this.samples.length) {
+        const pcm = this.samples.buffer
+        this.port.postMessage({ type: 'pcm', pcm }, [pcm])
+        this.samples = new Int16Array(1600)
+        this.offset = 0
+      }
+    }
+    if (this.energySamples >= 2048) {
+      this.port.postMessage({ type: 'amplitude', value: Math.sqrt(this.energy / this.energySamples) })
+      this.energy = 0
+      this.energySamples = 0
+    }
+    return true
+  }
+}
+registerProcessor('dsh-speech-pcm', DshSpeechPcmProcessor)
+`;
+function microphoneConstraints(deviceId) {
+	return {
+		channelCount: 1,
+		echoCancellation: true,
+		noiseSuppression: true,
+		autoGainControl: true,
+		...deviceId === void 0 || deviceId === "" ? {} : { deviceId: { exact: deviceId } }
+	};
+}
+var AudioCapture = class {
+	context;
+	stream;
+	source;
+	worklet;
+	sink;
+	moduleUrl;
+	deviceSwitchVersion = 0;
+	selectedDeviceId = "";
+	async start(onFrame, onAmplitude, preferredDeviceId = "") {
+		if (!navigator.mediaDevices?.getUserMedia || typeof AudioWorkletNode === "undefined") throw new Error("This browser does not support live microphone transcription");
+		try {
+			this.stream = await navigator.mediaDevices.getUserMedia({ audio: microphoneConstraints(preferredDeviceId) });
+			this.selectedDeviceId = preferredDeviceId;
+		} catch (error) {
+			const name = error !== null && typeof error === "object" && "name" in error ? String(error.name) : "";
+			if (preferredDeviceId === "" || name !== "NotFoundError" && name !== "OverconstrainedError") throw error;
+			this.stream = await navigator.mediaDevices.getUserMedia({ audio: microphoneConstraints() });
+			this.selectedDeviceId = "";
+		}
+		const context = new AudioContext({ latencyHint: "interactive" });
+		this.context = context;
+		this.moduleUrl = URL.createObjectURL(new Blob([WORKLET_SOURCE], { type: "text/javascript" }));
+		await context.audioWorklet.addModule(this.moduleUrl);
+		this.source = context.createMediaStreamSource(this.stream);
+		this.worklet = new AudioWorkletNode(context, "dsh-speech-pcm", {
+			numberOfInputs: 1,
+			numberOfOutputs: 1,
+			outputChannelCount: [1]
+		});
+		this.sink = context.createGain();
+		this.sink.gain.value = 0;
+		this.worklet.port.onmessage = (event) => {
+			if (event.data === null || typeof event.data !== "object") return;
+			const message = event.data;
+			if (message.type === "pcm" && message.pcm instanceof ArrayBuffer) onFrame(message.pcm);
+			if (message.type === "amplitude" && typeof message.value === "number") onAmplitude(message.value);
+		};
+		this.source.connect(this.worklet);
+		this.worklet.connect(this.sink);
+		this.sink.connect(context.destination);
+		await context.resume();
+	}
+	async microphones() {
+		const activeTrack = this.stream?.getAudioTracks()[0];
+		const activeDeviceId = activeTrack?.getSettings().deviceId;
+		const inputs = typeof navigator.mediaDevices?.enumerateDevices === "function" ? (await navigator.mediaDevices.enumerateDevices()).filter((device) => device.kind === "audioinput") : [];
+		const seen = /* @__PURE__ */ new Set();
+		const devices = [{
+			deviceId: "",
+			label: "System default",
+			systemDefault: true
+		}];
+		for (const [index, device] of inputs.entries()) {
+			if (device.deviceId === "" || device.deviceId === "default" || seen.has(device.deviceId)) continue;
+			seen.add(device.deviceId);
+			devices.push({
+				deviceId: device.deviceId,
+				label: device.label.trim() || `Microphone ${String(index + 1)}`
+			});
+		}
+		if (this.selectedDeviceId !== "" && activeDeviceId !== void 0 && activeDeviceId !== "" && !seen.has(this.selectedDeviceId)) devices.push({
+			deviceId: this.selectedDeviceId,
+			label: activeTrack?.label.trim() || "Current microphone"
+		});
+		return {
+			devices,
+			activeDeviceId: this.selectedDeviceId
+		};
+	}
+	async switchMicrophone(deviceId) {
+		const context = this.context;
+		const worklet = this.worklet;
+		if (context === void 0 || worklet === void 0 || this.stream === void 0) throw new Error("The microphone is not currently recording");
+		const version = ++this.deviceSwitchVersion;
+		const nextStream = await navigator.mediaDevices.getUserMedia({ audio: microphoneConstraints(deviceId) });
+		if (version !== this.deviceSwitchVersion || this.context !== context || this.worklet !== worklet) {
+			for (const track of nextStream.getTracks()) track.stop();
+			throw new Error("The microphone changed before the previous selection finished");
+		}
+		const nextSource = context.createMediaStreamSource(nextStream);
+		nextSource.connect(worklet);
+		const previousSource = this.source;
+		const previousStream = this.stream;
+		this.source = nextSource;
+		this.stream = nextStream;
+		this.selectedDeviceId = deviceId;
+		previousSource?.disconnect();
+		for (const track of previousStream.getTracks()) track.stop();
+		return this.microphones();
+	}
+	async stop() {
+		this.deviceSwitchVersion += 1;
+		this.worklet?.disconnect();
+		this.source?.disconnect();
+		this.sink?.disconnect();
+		for (const track of this.stream?.getTracks() ?? []) track.stop();
+		if (this.context !== void 0 && this.context.state !== "closed") await this.context.close().catch(() => {});
+		if (this.moduleUrl !== void 0) URL.revokeObjectURL(this.moduleUrl);
+		this.context = void 0;
+		this.stream = void 0;
+		this.source = void 0;
+		this.worklet = void 0;
+		this.sink = void 0;
+		this.moduleUrl = void 0;
+		this.selectedDeviceId = "";
+	}
+};
+
+//#endregion
+//#region src/client/api.ts
+var SpeechApiError = class extends Error {
+	code;
+	constructor(code, message) {
+		super(message);
+		this.name = "SpeechApiError";
+		this.code = code;
+	}
+};
+async function request(path, init) {
+	const response = await fetch(path, {
+		...init,
+		headers: {
+			accept: "application/json",
+			...init?.body === void 0 ? {} : { "content-type": "application/json" },
+			...init?.headers
+		}
+	});
+	const body = await response.json().catch(() => void 0);
+	if (!response.ok) {
+		const error = body !== null && typeof body === "object" ? body.error : void 0;
+		throw new SpeechApiError(typeof error?.code === "string" ? error.code : `HTTP_${String(response.status)}`, typeof error?.message === "string" ? error.message : "Speech request failed");
+	}
+	return body;
+}
+const speechApi = {
+	status: () => request("/api/dsh-speech/status"),
+	catalog: (refresh = false) => request(`/api/dsh-speech/catalog${refresh ? "?refresh=1" : ""}`),
+	startAuth: (email) => request("/api/dsh-speech/auth/start", {
+		method: "POST",
+		body: JSON.stringify({ email })
+	}),
+	verifyAuth: (email, code) => request("/api/dsh-speech/auth/verify", {
+		method: "POST",
+		body: JSON.stringify({
+			email,
+			code
+		})
+	}),
+	setKey: (apiKey) => request("/api/dsh-speech/auth/key", {
+		method: "POST",
+		body: JSON.stringify({ apiKey })
+	}),
+	logout: () => request("/api/dsh-speech/auth/logout", {
+		method: "POST",
+		body: "{}"
+	}),
+	topUp: (amountUsd) => request("/api/dsh-speech/top-up", {
+		method: "POST",
+		body: JSON.stringify({ amountUsd })
+	})
+};
+
+//#endregion
+//#region src/client/microphonePreference.ts
+const PREFERRED_MICROPHONE_KEY = "dsh-speech.preferred-microphone";
+function readPreferredMicrophone() {
+	try {
+		return window.localStorage.getItem(PREFERRED_MICROPHONE_KEY) ?? "";
+	} catch {
+		return "";
+	}
+}
+function writePreferredMicrophone(deviceId) {
+	try {
+		if (deviceId === "") window.localStorage.removeItem(PREFERRED_MICROPHONE_KEY);
+		else window.localStorage.setItem(PREFERRED_MICROPHONE_KEY, deviceId);
+	} catch {}
+}
+
+//#endregion
+//#region src/shared.ts
+const CATALOG_TTL_MS = 300 * 1e3;
+const AUDIO_FORMAT = "pcm_16000";
+function selectBinding(bindings, locale, preferred) {
+	if (preferred?.model !== void 0) {
+		const preferredModel = preferred.model;
+		const matchesModel = (binding) => binding.model === preferredModel || binding.canonical === preferredModel || !preferredModel.includes("/") && binding.model.endsWith(`/${preferredModel}`);
+		const exact = bindings.find((binding) => matchesModel(binding) && (preferred.provider === void 0 || binding.provider === preferred.provider));
+		if (exact !== void 0) return exact;
+		const sameModel = bindings.find(matchesModel);
+		if (sameModel !== void 0) return sameModel;
+	}
+	const preferredProvider = locale.toLowerCase().startsWith("zh") ? "soniox" : "assemblyai";
+	return bindings.find((binding) => binding.provider === preferredProvider && binding.isProviderDefault) ?? bindings.find((binding) => binding.provider === preferredProvider) ?? bindings[0];
+}
+const CJK = /^(zh|ja|ko)(-|$)/i;
+function transcriptSeparator(left, right, language) {
+	if (left.length === 0 || right.length === 0) return "";
+	if (language !== void 0 && CJK.test(language)) return "";
+	if (/\s$/u.test(left) || /^\s/u.test(right)) return "";
+	if (/^[,.;:!?\u3000-\u303f\uff00-\uff65]/u.test(right)) return "";
+	return " ";
+}
+function appendTranscript(left, right, language) {
+	return `${left}${transcriptSeparator(left, right, language)}${right}`;
+}
+function createTranscript(base) {
+	return {
+		base,
+		finals: "",
+		partial: "",
+		lastSequence: -1
+	};
+}
+function transcriptText(state) {
+	return appendTranscript(appendTranscript(state.base, state.finals, state.language), state.partial, state.language);
+}
+function applyTranscriptEvent(state, event) {
+	if (event.sequence <= state.lastSequence) return state;
+	const language = event.languageCode ?? state.language;
+	if (event.kind === "partial") return {
+		...state,
+		partial: event.text,
+		...language === void 0 ? {} : { language },
+		lastSequence: event.sequence
+	};
+	return {
+		...state,
+		finals: appendTranscript(state.finals, event.text, language),
+		partial: "",
+		...language === void 0 ? {} : { language },
+		lastSequence: event.sequence
+	};
+}
+
+//#endregion
+//#region src/client/controller.ts
+function socketUrl() {
+	const url = new URL("/api/dsh-speech/stt", window.location.href);
+	url.protocol = url.protocol === "https:" ? "wss:" : "ws:";
+	return url.toString();
+}
+var SpeechController = class {
+	snapshot = {
+		phase: "idle",
+		amplitude: 0,
+		metadataLoading: false,
+		microphones: [],
+		switchingMicrophone: false
+	};
+	listeners = /* @__PURE__ */ new Set();
+	blocks;
+	active;
+	metadataPromise;
+	preferredMicrophoneId = readPreferredMicrophone();
+	getSnapshot = () => this.snapshot;
+	subscribe = (listener) => {
+		this.listeners.add(listener);
+		return () => {
+			this.listeners.delete(listener);
+		};
+	};
+	attachBlocks(blocks) {
+		this.blocks = blocks;
+	}
+	detachBlocks(blocks) {
+		if (this.blocks !== blocks) return;
+		const active = this.active;
+		if (active !== void 0) this.finish(active);
+		this.blocks = void 0;
+	}
+	reportError(message) {
+		this.publish({
+			phase: "error",
+			error: message
+		});
+	}
+	async ensureMetadata(refresh = false) {
+		if (!refresh && this.metadataPromise !== void 0) return this.metadataPromise;
+		this.publish({
+			metadataLoading: true,
+			...refresh ? { error: void 0 } : {}
+		});
+		const operation = Promise.allSettled([speechApi.status(), speechApi.catalog(refresh)]).then(([status, catalog]) => {
+			const errors = [status, catalog].filter((result) => result.status === "rejected").map((result) => result.reason instanceof Error ? result.reason.message : "Unable to load speech settings");
+			this.publish({
+				...status.status === "fulfilled" ? { status: status.value } : {},
+				...catalog.status === "fulfilled" ? { catalog: catalog.value } : {},
+				metadataLoading: false,
+				...errors.length === 0 ? { error: void 0 } : { error: errors.join(" · ") }
+			});
+		}).finally(() => {
+			if (this.metadataPromise === operation) this.metadataPromise = void 0;
+		});
+		this.metadataPromise = operation;
+		return operation;
+	}
+	async toggle(options) {
+		if (this.active?.sessionId === options.sessionId) {
+			await this.stop();
+			return;
+		}
+		if (this.active !== void 0) throw new Error("A microphone is already active in another session");
+		await this.start(options);
+	}
+	release(sessionId) {
+		const active = this.active;
+		if (active?.sessionId === sessionId) this.finish(active);
+	}
+	async stop() {
+		const active = this.active;
+		if (active === void 0 || active.finished) return;
+		this.publish({
+			phase: "finalizing",
+			amplitude: 0
+		});
+		const stoppingCapture = active.stoppingCapture ??= active.capture.stop();
+		if (active.socket.readyState === WebSocket.OPEN) {
+			active.socket.send(JSON.stringify({ type: "commit" }));
+			active.socket.send(JSON.stringify({ type: "close" }));
+		}
+		active.finalTimer = setTimeout(() => {
+			this.finish(active);
+		}, 5e3);
+		await stoppingCapture;
+	}
+	async switchMicrophone(deviceId) {
+		const active = this.active;
+		if (active === void 0 || active.finished || this.snapshot.phase !== "recording") return;
+		const previousDeviceId = this.snapshot.activeMicrophoneId;
+		this.publish({
+			activeMicrophoneId: deviceId,
+			switchingMicrophone: true,
+			microphoneError: void 0
+		});
+		try {
+			const microphones = await active.capture.switchMicrophone(deviceId);
+			if (this.active !== active || active.finished) return;
+			this.publish({
+				microphones: microphones.devices,
+				activeMicrophoneId: microphones.activeDeviceId,
+				switchingMicrophone: false
+			});
+			this.preferredMicrophoneId = microphones.activeDeviceId ?? "";
+			writePreferredMicrophone(this.preferredMicrophoneId);
+		} catch (error) {
+			if (this.active !== active || active.finished) return;
+			this.publish({
+				activeMicrophoneId: previousDeviceId,
+				switchingMicrophone: false,
+				microphoneError: error instanceof Error ? error.message : "Unable to switch microphone"
+			});
+		}
+	}
+	dispose() {
+		const active = this.active;
+		if (active !== void 0) this.finish(active);
+		this.listeners.clear();
+	}
+	async start(options) {
+		await this.ensureMetadata();
+		const status = this.snapshot.status;
+		if (status?.credential.configured !== true) throw new Error("Connect AllModels in Settings → Speech");
+		if (status.balance?.exhausted === true) throw new Error("Your AllModels balance is empty");
+		const socket = new WebSocket(socketUrl());
+		const capture = new AudioCapture();
+		const active = {
+			...options,
+			socket,
+			capture,
+			transcript: createTranscript(options.draft),
+			finished: false
+		};
+		this.active = active;
+		this.blocks?.set(options.sessionId, { reason: options.listeningReason });
+		this.publish({
+			phase: "starting",
+			activeSessionId: options.sessionId,
+			amplitude: 0,
+			error: void 0,
+			activeModel: void 0,
+			activeProvider: void 0,
+			microphones: [],
+			activeMicrophoneId: void 0,
+			switchingMicrophone: false,
+			microphoneError: void 0
+		});
+		try {
+			await new Promise((resolve, reject) => {
+				const timeout = setTimeout(() => {
+					reject(/* @__PURE__ */ new Error("Speech connection timed out"));
+				}, 1e4);
+				let settled = false;
+				const succeed = () => {
+					if (settled) return;
+					settled = true;
+					clearTimeout(timeout);
+					resolve();
+				};
+				const fail = (message) => {
+					if (settled) return;
+					settled = true;
+					clearTimeout(timeout);
+					reject(new Error(message));
+				};
+				socket.addEventListener("open", () => {
+					socket.send(JSON.stringify({
+						type: "start",
+						locale: options.locale,
+						audioFormat: AUDIO_FORMAT
+					}));
+				}, { once: true });
+				socket.addEventListener("message", (event) => {
+					if (typeof event.data !== "string") return;
+					try {
+						const message = JSON.parse(event.data);
+						if (message.type === "ready") {
+							this.publish({
+								activeModel: typeof message.model === "string" ? message.model : void 0,
+								activeProvider: typeof message.provider === "string" ? message.provider : void 0
+							});
+							succeed();
+						}
+						if (message.type === "error") fail(typeof message.message === "string" ? message.message : "Unable to start speech recognition");
+					} catch {}
+				});
+				socket.addEventListener("error", () => {
+					fail("Unable to connect to speech recognition");
+				}, { once: true });
+				socket.addEventListener("close", () => {
+					fail("The speech connection closed before it was ready");
+				}, { once: true });
+			});
+			this.bindSocket(active);
+			await capture.start((frame) => {
+				if (socket.readyState === WebSocket.OPEN && this.active === active) socket.send(frame);
+			}, (amplitude) => {
+				if (this.active === active) this.publish({ amplitude: Math.min(1, amplitude * 4) });
+			}, this.preferredMicrophoneId);
+			if (this.active !== active) return;
+			this.publish({ phase: "recording" });
+			this.refreshMicrophones(active);
+			if (typeof navigator.mediaDevices?.addEventListener === "function") {
+				active.deviceChangeHandler = () => {
+					this.refreshMicrophones(active);
+				};
+				navigator.mediaDevices.addEventListener("devicechange", active.deviceChangeHandler);
+			}
+		} catch (error) {
+			await capture.stop();
+			this.fail(active, error instanceof Error ? error.message : "Unable to start microphone");
+			throw error;
+		}
+	}
+	bindSocket(active) {
+		active.socket.addEventListener("message", (event) => {
+			if (this.active !== active || typeof event.data !== "string") return;
+			try {
+				const message = JSON.parse(event.data);
+				if ((message.type === "partial" || message.type === "final") && typeof message.text === "string" && typeof message.sequence === "number") {
+					active.transcript = applyTranscriptEvent(active.transcript, {
+						kind: message.type,
+						sequence: message.sequence,
+						text: message.text,
+						...typeof message.languageCode === "string" ? { languageCode: message.languageCode } : {}
+					});
+					active.inputActions.setDraft(transcriptText(active.transcript));
+					if (message.type === "final" && this.snapshot.phase === "finalizing") {
+						if (active.finalTimer !== void 0) clearTimeout(active.finalTimer);
+						active.finalTimer = setTimeout(() => {
+							this.finish(active);
+						}, 120);
+					}
+				}
+				if (message.type === "error") this.fail(active, typeof message.message === "string" ? message.message : "Speech recognition failed");
+				if (message.type === "ended") this.finish(active);
+			} catch {
+				this.fail(active, "The speech service returned an invalid event");
+			}
+		});
+		active.socket.addEventListener("close", () => {
+			if (this.active === active && this.snapshot.phase !== "starting") this.finish(active);
+		});
+	}
+	fail(active, message) {
+		if (active.finished) return;
+		active.inputActions.setDraft(transcriptText(active.transcript));
+		this.finish(active, message);
+	}
+	finish(active, error) {
+		if (active.finished) return;
+		active.finished = true;
+		if (active.finalTimer !== void 0) clearTimeout(active.finalTimer);
+		if (active.deviceChangeHandler !== void 0 && typeof navigator.mediaDevices?.removeEventListener === "function") navigator.mediaDevices.removeEventListener("devicechange", active.deviceChangeHandler);
+		active.stoppingCapture ??= active.capture.stop();
+		if (active.socket.readyState === WebSocket.OPEN) active.socket.send(JSON.stringify({ type: "close" }));
+		if (active.socket.readyState < WebSocket.CLOSING) active.socket.close(1e3, "recording complete");
+		this.blocks?.set(active.sessionId, void 0);
+		if (this.active === active) this.active = void 0;
+		this.publish({
+			phase: error === void 0 ? "idle" : "error",
+			activeSessionId: void 0,
+			amplitude: 0,
+			microphones: [],
+			activeMicrophoneId: void 0,
+			switchingMicrophone: false,
+			microphoneError: void 0,
+			...error === void 0 ? { error: void 0 } : { error }
+		});
+		this.ensureMetadata(true);
+	}
+	publish(patch) {
+		this.snapshot = {
+			...this.snapshot,
+			...patch
+		};
+		for (const listener of this.listeners) listener();
+	}
+	async refreshMicrophones(active) {
+		try {
+			const microphones = await active.capture.microphones();
+			if (this.active !== active || active.finished) return;
+			this.publish({
+				microphones: microphones.devices,
+				activeMicrophoneId: microphones.activeDeviceId
+			});
+			const activeDeviceId = microphones.activeDeviceId ?? "";
+			if (activeDeviceId !== this.preferredMicrophoneId) {
+				this.preferredMicrophoneId = activeDeviceId;
+				writePreferredMicrophone(activeDeviceId);
+			}
+		} catch {}
+	}
+};
+
+//#endregion
+//#region src/client/styles.ts
+const styles = {
+	settings: "dsh-speech-settings",
+	header: "dsh-speech-header",
+	cardTitle: "dsh-speech-card-title",
+	accountWelcome: "dsh-speech-account-welcome",
+	accountIntro: "dsh-speech-account-intro",
+	freeCredit: "dsh-speech-free-credit",
+	accountHint: "dsh-speech-account-hint",
+	apiKeyDetails: "dsh-speech-api-key-details",
+	apiKeySummary: "dsh-speech-api-key-summary",
+	apiKeyBody: "dsh-speech-api-key-body",
+	topUp: "dsh-speech-top-up",
+	card: "dsh-speech-card",
+	columns: "dsh-speech-columns",
+	grid: "dsh-speech-grid",
+	modelFull: "dsh-speech-model-full",
+	contextDetails: "dsh-speech-context-details",
+	contextSummary: "dsh-speech-context-summary",
+	contextBody: "dsh-speech-context-body",
+	balanceGrid: "dsh-speech-balance-grid",
+	balanceValue: "dsh-speech-balance-value",
+	stack: "dsh-speech-stack",
+	field: "dsh-speech-field",
+	label: "dsh-speech-label",
+	hint: "dsh-speech-hint",
+	muted: "dsh-speech-muted",
+	input: "dsh-speech-input",
+	textarea: "dsh-speech-textarea",
+	primary: "dsh-speech-primary",
+	secondary: "dsh-speech-secondary",
+	checkout: "dsh-speech-checkout",
+	good: "dsh-speech-good",
+	warning: "dsh-speech-warning",
+	danger: "dsh-speech-danger",
+	micWrap: "dsh-speech-mic-wrap",
+	mic: "dsh-speech-mic",
+	micActive: "dsh-speech-mic-active",
+	micTooltip: "dsh-speech-mic-tooltip",
+	recordingTakeover: "dsh-speech-recording-takeover",
+	recordingTrack: "dsh-speech-recording-track",
+	recordingCanvas: "dsh-speech-recording-canvas",
+	recordingStop: "dsh-speech-recording-stop",
+	recordingProgress: "dsh-speech-recording-progress",
+	deviceDock: "dsh-speech-device-dock",
+	deviceMarker: "dsh-speech-device-marker",
+	deviceFallback: "dsh-speech-device-fallback",
+	deviceSeparator: "dsh-speech-device-separator",
+	deviceIcon: "dsh-speech-device-icon",
+	deviceTrigger: "dsh-speech-device-trigger",
+	deviceLabel: "dsh-speech-device-label",
+	deviceChevron: "dsh-speech-device-chevron",
+	deviceMenu: "dsh-speech-device-menu",
+	deviceMenuItem: "dsh-speech-device-menu-item",
+	deviceCheck: "dsh-speech-device-check",
+	srOnly: "dsh-speech-sr-only",
+	dock: "dsh-speech-dock",
+	dockError: "dsh-speech-dock-error",
+	dockDetail: "dsh-speech-dock-detail"
+};
+const STYLE_TEXT = String.raw`
+.dsh-speech-settings{display:grid;gap:16px;max-width:760px;padding:4px 2px 24px;color:var(--color-text,#e8e8e8)}
+.dsh-speech-header,.dsh-speech-card-title,.dsh-speech-top-up{display:flex;align-items:center;justify-content:space-between;gap:12px}
+.dsh-speech-header h2,.dsh-speech-card h3{margin:0}.dsh-speech-header p{margin:5px 0 0;color:var(--color-text-secondary,#a0a0a0);line-height:1.45}
+.dsh-speech-card{display:grid;gap:14px;padding:16px;border:1px solid var(--color-border,#343434);border-radius:12px;background:var(--color-background-secondary,rgba(255,255,255,.025))}
+.dsh-speech-account-welcome{padding:20px}.dsh-speech-account-intro{display:grid;gap:6px}.dsh-speech-account-intro p{margin:0;color:var(--color-text-secondary,#a0a0a0);line-height:1.45}.dsh-speech-free-credit{white-space:nowrap;border:1px solid color-mix(in srgb,#65c88a 45%,transparent);border-radius:999px;padding:4px 9px;background:color-mix(in srgb,#65c88a 12%,transparent);color:#65c88a;font-size:12px;font-weight:650}.dsh-speech-account-hint{margin:0;color:var(--color-text-secondary,#999);font-size:12px;line-height:1.45}.dsh-speech-api-key-details{border-top:1px solid var(--color-border,#343434);padding-top:12px}.dsh-speech-api-key-summary{width:max-content;color:var(--color-text-secondary,#aaa);cursor:pointer;font-size:12px;list-style-position:outside}.dsh-speech-api-key-summary:hover{color:var(--color-text,#eee)}.dsh-speech-api-key-body{display:grid;gap:10px;max-width:440px;padding-top:12px}
+.dsh-speech-columns,.dsh-speech-grid,.dsh-speech-balance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.dsh-speech-balance-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
+.dsh-speech-balance-grid span{display:grid;gap:5px;color:var(--color-text-secondary,#aaa)}.dsh-speech-balance-grid strong{color:var(--color-text,#eee);font-size:17px}
+.dsh-speech-model-full{grid-column:1/-1}.dsh-speech-context-details{border-top:1px solid var(--color-border,#343434);padding-top:12px}.dsh-speech-context-summary{width:max-content;color:var(--color-text-secondary,#aaa);cursor:pointer;font-size:13px;font-weight:600}.dsh-speech-context-summary:hover{color:var(--color-text,#eee)}.dsh-speech-context-summary span{margin-left:5px;color:var(--color-text-secondary,#888);font-size:11px;font-weight:400}.dsh-speech-context-body{display:grid;gap:8px;padding-top:12px}.dsh-speech-balance-value{font-size:24px;line-height:1.2;color:var(--color-text,#eee)}
+.dsh-speech-stack,.dsh-speech-field{display:grid;gap:7px;align-content:start}.dsh-speech-label{color:var(--color-text-secondary,#b2b2b2);font-size:13px;font-weight:600}.dsh-speech-hint,.dsh-speech-muted{margin:0;color:var(--color-text-secondary,#999);font-size:12px;line-height:1.45}
+.dsh-speech-input,.dsh-speech-textarea{width:100%;box-sizing:border-box;border:1px solid var(--color-border,#444);border-radius:8px;padding:9px 10px;background:var(--color-background,#191919);color:inherit;font:inherit}.dsh-speech-textarea{min-height:84px;resize:vertical}.dsh-speech-input:focus,.dsh-speech-textarea:focus{outline:2px solid color-mix(in srgb,#68a8ff 65%,transparent);outline-offset:1px}.dsh-speech-input:disabled,.dsh-speech-textarea:disabled{opacity:.55}
+.dsh-speech-primary,.dsh-speech-secondary,.dsh-speech-checkout{border:1px solid transparent;border-radius:8px;padding:8px 12px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;text-align:center}.dsh-speech-primary{background:#e8e8e8;color:#151515}.dsh-speech-secondary,.dsh-speech-checkout{border-color:var(--color-border,#4a4a4a);background:transparent;color:inherit}.dsh-speech-primary:disabled,.dsh-speech-secondary:disabled{cursor:default;opacity:.45}.dsh-speech-good{color:#65c88a}.dsh-speech-warning{margin:0;color:#efb85c}.dsh-speech-danger,.dsh-speech-dock-error{margin:0;color:#f07878}
+.dsh-speech-top-up{justify-content:flex-start;align-items:end;flex-wrap:wrap}.dsh-speech-top-up .dsh-speech-field{max-width:180px}
+.dsh-speech-mic-wrap{position:relative;display:inline-flex;align-items:center;gap:5px;order:1}[data-slot="conversation.input.right"]:has(>.dsh-speech-mic-wrap)~button:last-child{order:2}.dsh-speech-mic{width:30px;height:30px;display:inline-grid;place-items:center;padding:0;border:0;border-radius:7px;background:transparent;color:var(--color-text-secondary,#a8a8a8);cursor:pointer}.dsh-speech-mic:hover:not(:disabled),.dsh-speech-mic:focus-visible{background:var(--color-background-hover,rgba(255,255,255,.08));color:var(--color-text,#eee)}.dsh-speech-mic[aria-disabled="true"]{opacity:.48}.dsh-speech-mic:disabled{cursor:default}.dsh-speech-mic svg{width:18px;height:18px;fill:currentColor}.dsh-speech-mic-active{color:#ef6666;background:rgba(239,102,102,.12)}.dsh-speech-mic-tooltip{position:absolute;right:0;bottom:calc(100% + 8px);z-index:40;width:max-content;max-width:260px;padding:6px 9px;border:1px solid var(--color-border,#343434);border-radius:7px;background:var(--color-background-elevated,#202020);color:var(--color-text,#eee);font-size:12px;line-height:1.35;box-shadow:0 6px 18px rgba(0,0,0,.24);opacity:0;visibility:hidden;transform:translateY(2px);pointer-events:none;transition:opacity .12s ease,transform .12s ease,visibility .12s}.dsh-speech-mic-wrap:hover .dsh-speech-mic-tooltip,.dsh-speech-mic-wrap:focus-within .dsh-speech-mic-tooltip,.dsh-speech-mic-wrap[data-explanation-open="true"] .dsh-speech-mic-tooltip{opacity:1;visibility:visible;transform:translateY(0)}
+:where(div):has(>:where(div)>[data-slot="conversation.input.right"]>.dsh-speech-recording-takeover){position:relative}:where(div):has(>:where(div)>[data-slot="conversation.input.right"]>.dsh-speech-recording-takeover)>*{visibility:hidden}.dsh-speech-recording-takeover{position:absolute;inset:0;z-index:8;visibility:visible;display:flex;align-items:center;gap:10px;padding:4px 8px;box-sizing:border-box;color:var(--color-text-secondary,#a8a8a8)}.dsh-speech-recording-track{height:30px;min-width:0;flex:1;display:flex;align-items:center}.dsh-speech-recording-canvas{display:block;width:100%;height:30px;color:var(--color-text-secondary,#a8a8a8)}.dsh-speech-recording-stop{flex:none;border-radius:999px;color:#ef6666;background:rgba(239,102,102,.12)}.dsh-speech-recording-stop:hover:not(:disabled),.dsh-speech-recording-stop:focus-visible{color:#ff7777;background:rgba(239,102,102,.2)}.dsh-speech-recording-progress{display:flex;align-items:center;justify-content:flex-end;gap:8px;width:100%;color:var(--color-text-secondary,#a8a8a8);font-size:12px}.dsh-speech-recording-takeover[data-phase="starting"] .dsh-speech-recording-progress{justify-content:center}.dsh-speech-recording-progress i{width:13px;height:13px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:dsh-speech-spin .8s linear infinite}.dsh-speech-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes dsh-speech-spin{to{transform:rotate(360deg)}}
+.dsh-speech-device-marker{display:none}[data-slot="conversation.composer.dock"]>:has(>.dsh-speech-device-dock){overflow:visible}.dsh-speech-device-fallback{min-height:22px;display:flex;align-items:center;justify-content:flex-start;padding:0 8px;overflow:visible}.dsh-speech-device-fallback .dsh-speech-device-dock{margin-left:0}.dsh-speech-device-separator{margin-left:4px;color:var(--dsw-alias-label-tertiary,var(--color-text-secondary,#888))}.dsh-speech-device-dock{position:relative;display:inline-flex;vertical-align:middle;margin-left:5px;color:var(--dsw-alias-label-secondary,var(--color-text-secondary,#a8a8a8));font:inherit}.dsh-speech-device-trigger{max-width:126px;height:20px;display:inline-flex;align-items:center;gap:4px;padding:0 5px;border:0;border-radius:6px;background:transparent;color:inherit;font:inherit;font-size:11px;line-height:20px;cursor:pointer}.dsh-speech-device-trigger:hover,.dsh-speech-device-trigger:focus-visible,.dsh-speech-device-trigger[aria-expanded="true"]{outline:0;background:var(--dsw-alias-interactive-bg-hover,rgba(255,255,255,.08));color:var(--dsw-alias-label-primary,var(--color-text,#eee))}.dsh-speech-device-trigger:disabled{cursor:wait;opacity:.6}.dsh-speech-device-dock[data-error="true"] .dsh-speech-device-trigger{color:var(--dsw-alias-state-error-primary,#f07878)}.dsh-speech-device-icon,.dsh-speech-device-chevron{display:inline-flex;flex:none}.dsh-speech-device-icon svg{width:12px;height:12px}.dsh-speech-device-chevron svg{width:10px;height:10px}.dsh-speech-device-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dsh-speech-device-menu{position:absolute;right:0;bottom:calc(100% + 6px);z-index:80;min-width:240px;max-width:min(320px,calc(100vw - 32px));display:grid;box-sizing:border-box;padding:4px;border:1px solid var(--dsw-alias-border-l2-darkmode-thin,rgba(255,255,255,.06));border-radius:12px;background:var(--dsw-alias-bg-layer-3,#353638);color:var(--dsw-alias-label-primary,#f9fafb);box-shadow:0 0 1px rgba(0,0,0,.2),0 0 4px rgba(0,0,0,.02),0 12px 32px rgba(0,0,0,.08);font:13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.dsh-speech-device-menu-item{width:100%;min-width:0;height:38px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 10px;border:0;border-radius:10px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}.dsh-speech-device-menu-item:hover,.dsh-speech-device-menu-item:focus-visible{outline:0;background:var(--dsw-alias-interactive-bg-hover,rgba(255,255,255,.08))}.dsh-speech-device-menu-item>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dsh-speech-device-check{width:14px;height:14px;display:inline-flex;flex:none;color:var(--dsw-alias-brand-primary,var(--dsw-alias-label-primary,#f9fafb))}.dsh-speech-device-check svg{width:14px;height:14px}.dsh-speech-device-dock[data-variant="hero"]{margin-left:0;color:var(--dsw-alias-label-primary,var(--color-text,#f9fafb));font:500 13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif}.dsh-speech-device-dock[data-variant="hero"] .dsh-speech-device-trigger{max-width:220px;height:28px;padding:0 8px;gap:4px;border-radius:16px;font:inherit;line-height:20px}.dsh-speech-device-dock[data-variant="hero"] .dsh-speech-device-icon svg{width:16px;height:16px}.dsh-speech-device-dock[data-variant="hero"] .dsh-speech-device-chevron svg{width:14px;height:14px}.dsh-speech-device-dock[data-variant="hero"] .dsh-speech-device-menu{left:0;right:auto;top:calc(100% + 6px);bottom:auto;min-width:218px}
+[data-dsh-speech-nav]>svg{display:none}[data-dsh-speech-nav]::before{content:"";width:16px;height:16px;flex:none;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Crect x='7' y='2' width='6' height='11' rx='3' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M4.5 9.5a5.5 5.5 0 0 0 11 0M10 15v3M7 18h6' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
+.dsh-speech-dock,.dsh-speech-dock-error{min-height:22px;display:flex;align-items:center;gap:9px;padding:4px 8px 0;font-size:12px}.dsh-speech-dock-detail{color:var(--color-text-secondary,#8d8d8d)}
+@media(max-width:680px){.dsh-speech-columns,.dsh-speech-grid,.dsh-speech-balance-grid{grid-template-columns:1fr}.dsh-speech-header{align-items:flex-start}.dsh-speech-device-separator,.dsh-speech-device-dock{display:none}}
+@media(prefers-reduced-motion:reduce){.dsh-speech-mic-tooltip{transition:none}.dsh-speech-recording-progress i{animation:none;border-right-color:currentColor}}
+`;
+
+//#endregion
+//#region src/client/SpeechComposer.tsx
+function MicIcon({ stopped }) {
+	return stopped ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+		viewBox: "0 0 20 20",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+			x: "5",
+			y: "5",
+			width: "10",
+			height: "10",
+			rx: "2"
+		})
+	}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		viewBox: "0 0 20 20",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+			x: "7",
+			y: "2",
+			width: "6",
+			height: "11",
+			rx: "3",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "1.7"
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M4.5 9.5a5.5 5.5 0 0 0 11 0M10 15v3M7 18h6",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "1.7",
+			strokeLinecap: "round"
+		})]
+	});
+}
+function ChevronIcon() {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+		viewBox: "0 0 14 14",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "m3.5 5.25 3.5 3.5 3.5-3.5",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "1.2",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function CheckIcon() {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+		viewBox: "0 0 14 14",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "m2.75 7.2 2.6 2.6 5.9-5.9",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "1.4",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+const WAVEFORM_PITCH = 4;
+const WAVEFORM_BASELINE = .025;
+function RecordingWaveform({ amplitude }) {
+	const canvasRef = (0, react.useRef)(null);
+	const samplesRef = (0, react.useRef)([]);
+	const reducedMotionRef = (0, react.useRef)(false);
+	const draw = (0, react.useCallback)(() => {
+		const canvas = canvasRef.current;
+		if (canvas === null) return;
+		const context = canvas.getContext("2d");
+		if (context === null || canvas.clientWidth === 0 || canvas.clientHeight === 0) return;
+		const ratio = window.devicePixelRatio || 1;
+		const width = Math.floor(canvas.clientWidth * ratio);
+		const height = Math.floor(canvas.clientHeight * ratio);
+		if (canvas.width !== width || canvas.height !== height) {
+			canvas.width = width;
+			canvas.height = height;
+		}
+		const barCount = Math.max(1, Math.floor(canvas.clientWidth / WAVEFORM_PITCH));
+		if (samplesRef.current.length !== barCount) {
+			const existing = samplesRef.current.slice(-barCount);
+			samplesRef.current = [...Array.from({ length: Math.max(0, barCount - existing.length) }, () => WAVEFORM_BASELINE), ...existing];
+		}
+		context.setTransform(1, 0, 0, 1, 0, 0);
+		context.clearRect(0, 0, width, height);
+		context.fillStyle = getComputedStyle(canvas).color || "#a8a8a8";
+		const pitch = width / barCount;
+		const barWidth = Math.max(1, pitch / 2);
+		const center = height / 2;
+		for (let index = 0; index < barCount; index += 1) {
+			const sample = samplesRef.current[index] ?? WAVEFORM_BASELINE;
+			const barHeight = Math.max(1.5 * ratio, sample * height * .88);
+			context.globalAlpha = sample <= WAVEFORM_BASELINE ? .24 : .92;
+			context.fillRect(index * pitch, center - barHeight / 2, barWidth, barHeight);
+		}
+		context.globalAlpha = 1;
+	}, []);
+	(0, react.useEffect)(() => {
+		reducedMotionRef.current = window.matchMedia?.("(prefers-reduced-motion: reduce)").matches === true;
+		const canvas = canvasRef.current;
+		if (canvas === null) return;
+		draw();
+		if (typeof ResizeObserver === "undefined") return;
+		const observer = new ResizeObserver(draw);
+		observer.observe(canvas);
+		return () => {
+			observer.disconnect();
+		};
+	}, [draw]);
+	(0, react.useEffect)(() => {
+		const normalized = Math.max(WAVEFORM_BASELINE, Math.min(1, Math.pow(amplitude, .72)));
+		const samples = samplesRef.current;
+		if (samples.length === 0) {
+			draw();
+			return;
+		}
+		if (reducedMotionRef.current) samples.fill(normalized);
+		else {
+			samples.push(normalized);
+			samples.shift();
+		}
+		draw();
+	}, [amplitude, draw]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("canvas", {
+		ref: canvasRef,
+		className: styles.recordingCanvas,
+		"aria-hidden": "true"
+	});
+}
+function RecordingTakeover({ amplitude, disabled, phase, label, onStop, stopLabel }) {
+	const recording = phase === "recording";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: styles.recordingTakeover,
+		"data-phase": phase,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: styles.recordingTrack,
+				children: recording ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RecordingWaveform, { amplitude }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: styles.recordingProgress,
+					role: "status",
+					"aria-live": "polite",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("i", { "aria-hidden": "true" }), label]
+				})
+			}),
+			recording ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: `${styles.mic} ${styles.recordingStop}`,
+				disabled,
+				"aria-label": stopLabel,
+				title: stopLabel,
+				onClick: onStop,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MicIcon, { stopped: true })
+			}) : null,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: styles.srOnly,
+				role: "status",
+				"aria-live": "polite",
+				children: label
+			})
+		]
+	});
+}
+function SpeechMic({ controller, getLocale, sessionId, input, inputActions, t }) {
+	const state = (0, react.useSyncExternalStore)(controller.subscribe, controller.getSnapshot);
+	const tooltipId = (0, react.useId)();
+	const [explanationOpen, setExplanationOpen] = (0, react.useState)(false);
+	const explanationTimer = (0, react.useRef)(void 0);
+	const activeHere = state.activeSessionId === sessionId;
+	const activeElsewhere = state.activeSessionId !== void 0 && !activeHere;
+	const disconnected = state.status?.credential.configured !== true;
+	const exhausted = state.status?.balance?.exhausted === true;
+	const unavailable = !activeHere && (disconnected || exhausted || activeElsewhere);
+	const disabled = !activeHere && input.phase !== "plain" || state.phase === "starting" || state.phase === "finalizing";
+	const title = activeHere ? t("micStop") : disconnected ? t("disconnectedMic") : exhausted ? t("emptyMic") : activeElsewhere ? t("anotherMic") : t("micStart");
+	(0, react.useEffect)(() => {
+		controller.ensureMetadata();
+		return () => {
+			if (explanationTimer.current !== void 0) clearTimeout(explanationTimer.current);
+			controller.release(sessionId);
+		};
+	}, [controller, sessionId]);
+	const toggle = () => {
+		if (unavailable) {
+			controller.reportError(title);
+			setExplanationOpen(true);
+			if (explanationTimer.current !== void 0) clearTimeout(explanationTimer.current);
+			explanationTimer.current = setTimeout(() => {
+				setExplanationOpen(false);
+			}, 4e3);
+			return;
+		}
+		controller.toggle({
+			sessionId,
+			draft: input.draft,
+			inputActions,
+			locale: getLocale(),
+			listeningReason: t("listening")
+		}).catch((error) => {
+			controller.reportError(error instanceof Error ? error.message : "Unable to start microphone");
+		});
+	};
+	if (activeHere) {
+		const takeoverPhase = state.phase === "starting" || state.phase === "finalizing" ? state.phase : "recording";
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RecordingTakeover, {
+			amplitude: state.amplitude,
+			disabled,
+			phase: takeoverPhase,
+			label: state.phase === "starting" ? t("starting") : state.phase === "finalizing" ? t("finalizing") : t("listening"),
+			onStop: toggle,
+			stopLabel: title
+		});
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: styles.micWrap,
+		"data-explanation-open": explanationOpen || void 0,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: `${styles.mic} ${activeHere ? styles.micActive : ""}`,
+			disabled,
+			"aria-disabled": disabled || unavailable,
+			"aria-describedby": tooltipId,
+			"aria-label": title,
+			"aria-pressed": activeHere,
+			onClick: toggle,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MicIcon, { stopped: activeHere })
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			id: tooltipId,
+			className: styles.micTooltip,
+			role: "tooltip",
+			children: title
+		})]
+	});
+}
+function MicrophoneSelector({ controller, state, t, variant = "metrics" }) {
+	const menuId = (0, react.useId)();
+	const rootRef = (0, react.useRef)(null);
+	const triggerRef = (0, react.useRef)(null);
+	const [open, setOpen] = (0, react.useState)(false);
+	const deviceLabel = (device) => device.systemDefault === true ? t("systemDefaultMicrophone") : device.label;
+	const current = state.microphones.find((device) => device.deviceId === state.activeMicrophoneId);
+	const label = current === void 0 ? state.microphones.length === 0 ? t("loadingMicrophones") : t("microphone") : deviceLabel(current);
+	const deviceError = state.microphoneError === void 0 ? void 0 : t("microphoneError", { message: state.microphoneError });
+	(0, react.useEffect)(() => {
+		if (!open) return;
+		const closeOutside = (event) => {
+			if (event.target instanceof Node && rootRef.current?.contains(event.target) !== true) setOpen(false);
+		};
+		const closeEscape = (event) => {
+			if (event.key !== "Escape") return;
+			setOpen(false);
+			triggerRef.current?.focus();
+		};
+		document.addEventListener("pointerdown", closeOutside);
+		document.addEventListener("keydown", closeEscape);
+		return () => {
+			document.removeEventListener("pointerdown", closeOutside);
+			document.removeEventListener("keydown", closeEscape);
+		};
+	}, [open]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		ref: rootRef,
+		className: styles.deviceDock,
+		"data-variant": variant,
+		"data-error": deviceError === void 0 ? void 0 : true,
+		"aria-busy": state.switchingMicrophone,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				ref: triggerRef,
+				type: "button",
+				className: styles.deviceTrigger,
+				"aria-label": `${t("microphone")}: ${label}`,
+				"aria-haspopup": "menu",
+				"aria-controls": menuId,
+				"aria-expanded": open,
+				disabled: state.switchingMicrophone || state.microphones.length === 0,
+				title: deviceError ?? (state.switchingMicrophone ? t("switchingMicrophone") : label),
+				onClick: () => {
+					setOpen((value) => !value);
+				},
+				onKeyDown: (event) => {
+					if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+						event.preventDefault();
+						setOpen(true);
+					}
+				},
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.deviceIcon,
+						"aria-hidden": "true",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MicIcon, { stopped: false })
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.deviceLabel,
+						children: label
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.deviceChevron,
+						"aria-hidden": "true",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronIcon, {})
+					})
+				]
+			}),
+			open ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				id: menuId,
+				className: styles.deviceMenu,
+				role: "menu",
+				"aria-label": t("microphone"),
+				children: state.microphones.map((device) => {
+					const selected = device.deviceId === state.activeMicrophoneId;
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+						type: "button",
+						className: styles.deviceMenuItem,
+						role: "menuitemradio",
+						"aria-checked": selected,
+						onClick: () => {
+							setOpen(false);
+							if (!selected) controller.switchMicrophone(device.deviceId);
+						},
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: deviceLabel(device) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: styles.deviceCheck,
+							"aria-hidden": "true",
+							children: selected ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CheckIcon, {}) : null
+						})]
+					}, device.deviceId);
+				})
+			}) : null,
+			deviceError === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: styles.srOnly,
+				role: "alert",
+				children: deviceError
+			})
+		]
+	});
+}
+function MicrophoneDockPortal({ controller, state, t }) {
+	const markerRef = (0, react.useRef)(null);
+	const [target, setTarget] = (0, react.useState)(null);
+	(0, react.useLayoutEffect)(() => {
+		const marker = markerRef.current;
+		const slot = marker?.closest("[data-slot=\"conversation.composer.dock\"]");
+		if (!(slot instanceof HTMLElement)) return;
+		const findTarget = () => {
+			const metrics = Array.from(slot.children).find((child) => child !== marker && child.textContent?.includes("TTFT"));
+			setTarget(metrics instanceof HTMLElement ? metrics : null);
+		};
+		findTarget();
+		const observer = new MutationObserver(findTarget);
+		observer.observe(slot, { childList: true });
+		return () => {
+			observer.disconnect();
+		};
+	}, []);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		ref: markerRef,
+		className: styles.deviceMarker,
+		"aria-hidden": "true"
+	}), target === null ? null : (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: styles.deviceSeparator,
+		"aria-hidden": "true",
+		children: "|"
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MicrophoneSelector, {
+		controller,
+		state,
+		t
+	})] }), target)] });
+}
+function MicrophoneInputDock({ controller, state, t }) {
+	const markerRef = (0, react.useRef)(null);
+	const [heroTarget, setHeroTarget] = (0, react.useState)(null);
+	(0, react.useLayoutEffect)(() => {
+		const composer = markerRef.current?.closest("[data-slot=\"conversation.composer\"]");
+		if (!(composer instanceof HTMLElement)) return;
+		const update = () => {
+			if (composer.querySelector("[data-slot=\"conversation.composer.dock\"]") !== null) {
+				setHeroTarget(null);
+				return;
+			}
+			const presetSlot = composer.querySelector("[data-slot=\"conversation.hero.agentPreset\"]");
+			setHeroTarget(presetSlot?.parentElement instanceof HTMLElement ? presetSlot.parentElement : null);
+		};
+		update();
+		const observer = new MutationObserver(update);
+		observer.observe(composer, {
+			childList: true,
+			subtree: true
+		});
+		return () => {
+			observer.disconnect();
+		};
+	}, []);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		ref: markerRef,
+		className: styles.deviceMarker,
+		"aria-hidden": "true"
+	}), heroTarget === null ? null : (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MicrophoneSelector, {
+		controller,
+		state,
+		t,
+		variant: "hero"
+	}), heroTarget)] });
+}
+function SpeechDock({ controller, sessionId, t }) {
+	const state = (0, react.useSyncExternalStore)(controller.subscribe, controller.getSnapshot);
+	if (state.activeSessionId === sessionId && state.phase === "recording") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MicrophoneDockPortal, {
+		controller,
+		state,
+		t
+	});
+	if (state.activeSessionId === sessionId || state.error === void 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: styles.dockError,
+		role: "alert",
+		children: state.error
+	});
+}
+function SpeechInputDock({ controller, sessionId, t }) {
+	const state = (0, react.useSyncExternalStore)(controller.subscribe, controller.getSnapshot);
+	if (state.activeSessionId !== sessionId || state.phase !== "recording") return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MicrophoneInputDock, {
+		controller,
+		state,
+		t
+	});
+}
+
+//#endregion
+//#region src/client/SpeechSettings.tsx
+const LANGUAGES = [
+	["auto", "Auto"],
+	["en", "English"],
+	["zh", "中文"],
+	["ja", "日本語"],
+	["ko", "한국어"],
+	["es", "Español"],
+	["fr", "Français"],
+	["de", "Deutsch"],
+	["pt", "Português"],
+	["it", "Italiano"],
+	["ru", "Русский"],
+	["ar", "العربية"],
+	["hi", "हिन्दी"],
+	["id", "Bahasa Indonesia"],
+	["vi", "Tiếng Việt"]
+];
+function money(value) {
+	return new Intl.NumberFormat(void 0, {
+		style: "currency",
+		currency: "USD",
+		minimumFractionDigits: 2
+	}).format(value);
+}
+function Field({ label, children, hint }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+		className: styles.field,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: styles.label,
+				children: label
+			}),
+			children,
+			hint === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: styles.hint,
+				children: hint
+			})
+		]
+	});
+}
+function SpeechSettings({ controller, scope, getLocale, t }) {
+	const client = (0, react.useSyncExternalStore)(controller.subscribe, controller.getSnapshot);
+	const settings = (0, react.useSyncExternalStore)((listener) => scope.subscribe(listener), () => scope.getSnapshot());
+	const value = settings.value;
+	const [email, setEmail] = (0, react.useState)("");
+	const [code, setCode] = (0, react.useState)("");
+	const [apiKey, setApiKey] = (0, react.useState)("");
+	const [codeExpiry, setCodeExpiry] = (0, react.useState)(0);
+	const [now, setNow] = (0, react.useState)(Date.now());
+	const [busy, setBusy] = (0, react.useState)(null);
+	const [message, setMessage] = (0, react.useState)(null);
+	const [error, setError] = (0, react.useState)(null);
+	const [topUpAmount, setTopUpAmount] = (0, react.useState)(10);
+	const [topUpUrl, setTopUpUrl] = (0, react.useState)(null);
+	const [languageDraft, setLanguageDraft] = (0, react.useState)("auto");
+	const [contextDraft, setContextDraft] = (0, react.useState)("");
+	(0, react.useEffect)(() => {
+		controller.ensureMetadata();
+	}, [controller]);
+	(0, react.useEffect)(() => {
+		if (client.status?.settings.defaultTopUpUsd !== void 0) setTopUpAmount(client.status.settings.defaultTopUpUsd);
+	}, [client.status?.settings.defaultTopUpUsd]);
+	(0, react.useEffect)(() => {
+		setLanguageDraft(value?.language ?? "auto");
+	}, [value?.language]);
+	(0, react.useEffect)(() => {
+		setContextDraft(value?.context ?? "");
+	}, [value?.context]);
+	(0, react.useEffect)(() => {
+		if (codeExpiry <= Date.now()) return;
+		const timer = setInterval(() => {
+			setNow(Date.now());
+		}, 1e3);
+		return () => {
+			clearInterval(timer);
+		};
+	}, [codeExpiry]);
+	const catalog = client.catalog?.bindings ?? [];
+	const selectedModel = selectBinding(catalog, getLocale(), {
+		...value?.model === void 0 ? {} : { model: value.model },
+		...value?.provider === void 0 ? {} : { provider: value.provider }
+	})?.model ?? value?.model ?? "";
+	const providers = catalog.filter((binding) => binding.model === selectedModel);
+	const selectedProvider = providers.some((binding) => binding.provider === value?.provider) ? value?.provider ?? "" : providers.find((binding) => binding.isProviderDefault)?.provider ?? providers[0]?.provider ?? "";
+	const selectedBinding = providers.find((binding) => binding.provider === selectedProvider);
+	const models = (0, react.useMemo)(() => [...new Set(catalog.map((binding) => binding.model))].sort(), [catalog]);
+	const remaining = Math.max(0, Math.ceil((codeExpiry - now) / 1e3));
+	const connected = client.status?.credential.configured === true;
+	const writable = settings.writable;
+	const run = async (key, action) => {
+		setBusy(key);
+		setError(null);
+		setMessage(null);
+		try {
+			await action();
+		} catch (cause) {
+			setError(cause instanceof Error ? cause.message : "Request failed");
+		} finally {
+			setBusy(null);
+		}
+	};
+	const write = (field, next) => {
+		run(`setting:${field}`, async () => {
+			await scope.set(field, next);
+			await controller.ensureMetadata(true);
+			setMessage(t("saved"));
+		});
+	};
+	const commitLanguage = () => {
+		const next = languageDraft.trim() || "auto";
+		if (next !== "auto" && !/^[A-Za-z]{2,8}(?:-[A-Za-z0-9]{1,8})*$/u.test(next)) {
+			setError(t("invalidLanguage"));
+			return;
+		}
+		if (next !== (value?.language ?? "auto")) write("language", next);
+	};
+	const commitContext = () => {
+		if (contextDraft !== (value?.context ?? "")) write("context", contextDraft);
+	};
+	const sendCode = () => {
+		run("send-code", async () => {
+			const response = await speechApi.startAuth(email);
+			setCodeExpiry(Date.now() + response.expiresInSeconds * 1e3);
+			setNow(Date.now());
+			setMessage(t("codeSent"));
+		});
+	};
+	const verify = () => {
+		run("verify", async () => {
+			await speechApi.verifyAuth(email, code);
+			setCode("");
+			setCodeExpiry(0);
+			await controller.ensureMetadata(true);
+		});
+	};
+	const setKey = () => {
+		run("api-key", async () => {
+			await speechApi.setKey(apiKey);
+			setApiKey("");
+			await controller.ensureMetadata(true);
+		});
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: styles.settings,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+				className: styles.header,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", { children: t("title") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: t("subtitle") })] }), connected ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					className: styles.secondary,
+					type: "button",
+					disabled: client.metadataLoading,
+					onClick: () => {
+						controller.ensureMetadata(true);
+					},
+					children: client.metadataLoading ? t("loading") : t("refresh")
+				}) : null]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("section", {
+				className: `${styles.card} ${connected ? "" : styles.accountWelcome}`,
+				children: connected ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: styles.cardTitle,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", { children: t("account") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: styles.good,
+							children: t("connected")
+						})]
+					}),
+					client.status?.credential.source === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: styles.hint,
+						children: t("managedBy", { source: client.status.credential.source })
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						className: styles.secondary,
+						type: "button",
+						disabled: busy !== null || client.status?.credential.writable !== true,
+						onClick: () => {
+							run("logout", async () => {
+								await speechApi.logout();
+								await controller.ensureMetadata(true);
+							});
+						},
+						children: t("disconnect")
+					})
+				] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: styles.cardTitle,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: styles.accountIntro,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", { children: t("signupTitle") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: t("signupLead") })]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: styles.freeCredit,
+							children: t("freeCredit")
+						})]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: styles.stack,
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
+								label: t("email"),
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									className: styles.input,
+									type: "email",
+									autoComplete: "email",
+									value: email,
+									onChange: (event) => {
+										setEmail(event.target.value);
+									}
+								})
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								className: styles.primary,
+								type: "button",
+								disabled: busy !== null || email.length === 0,
+								onClick: sendCode,
+								children: remaining > 0 ? t("resend") : t("sendCode")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+								className: styles.accountHint,
+								children: t("emailFlowHint")
+							}),
+							codeExpiry === 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
+								label: t("code"),
+								hint: t("expires", { seconds: remaining }),
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									className: styles.input,
+									inputMode: "numeric",
+									autoComplete: "one-time-code",
+									maxLength: 6,
+									value: code,
+									onChange: (event) => {
+										setCode(event.target.value.replace(/\D/gu, "").slice(0, 6));
+									}
+								})
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								className: styles.primary,
+								type: "button",
+								disabled: busy !== null || code.length !== 6 || remaining === 0,
+								onClick: verify,
+								children: t("verify")
+							})] })
+						]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("details", {
+						className: styles.apiKeyDetails,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("summary", {
+							className: styles.apiKeySummary,
+							children: t("apiKeySignIn")
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: styles.apiKeyBody,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
+								label: t("apiKey"),
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									className: styles.input,
+									type: "password",
+									autoComplete: "off",
+									value: apiKey,
+									onChange: (event) => {
+										setApiKey(event.target.value);
+									}
+								})
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								className: styles.secondary,
+								type: "button",
+								disabled: busy !== null || apiKey.length < 8,
+								onClick: setKey,
+								children: t("connect")
+							})]
+						})]
+					})
+				] })
+			}),
+			connected ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+				className: styles.card,
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", { children: t("settings") }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: styles.grid,
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: styles.modelFull,
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
+									label: t("model"),
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
+										className: styles.input,
+										value: selectedModel,
+										disabled: !writable || models.length === 0,
+										onChange: (event) => {
+											const model = event.target.value;
+											const choices = catalog.filter((binding) => binding.model === model);
+											const provider = choices.find((binding) => binding.isProviderDefault)?.provider ?? choices[0]?.provider;
+											run("setting:model", async () => {
+												await scope.set("model", model);
+												if (provider !== void 0) await scope.set("provider", provider);
+												await controller.ensureMetadata(true);
+											});
+										},
+										children: models.map((model) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+											value: model,
+											children: model
+										}, model))
+									})
+								})
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
+								label: t("provider"),
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
+									className: styles.input,
+									value: selectedProvider,
+									disabled: !writable || providers.length === 0,
+									onChange: (event) => {
+										write("provider", event.target.value);
+									},
+									children: providers.map((binding) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+										value: binding.provider,
+										children: binding.provider
+									}, binding.provider))
+								})
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Field, {
+								label: t("language"),
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									className: styles.input,
+									list: "dsh-speech-languages",
+									value: languageDraft,
+									disabled: !writable,
+									onChange: (event) => {
+										setLanguageDraft(event.target.value);
+									},
+									onBlur: commitLanguage,
+									onKeyDown: (event) => {
+										if (event.key === "Enter") event.currentTarget.blur();
+									}
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("datalist", {
+									id: "dsh-speech-languages",
+									children: LANGUAGES.map(([id, label]) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+										value: id,
+										children: id === "auto" ? t("auto") : label
+									}, id))
+								})]
+							})
+						]
+					}),
+					selectedBinding?.contextSupported === true ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("details", {
+						className: styles.contextDetails,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("summary", {
+							className: styles.contextSummary,
+							children: [
+								t("context"),
+								" ",
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("optional") })
+							]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: styles.contextBody,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+								className: styles.hint,
+								children: t("contextHint")
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+								className: styles.textarea,
+								"aria-label": t("context"),
+								maxLength: 4e3,
+								value: contextDraft,
+								disabled: !writable,
+								onChange: (event) => {
+									setContextDraft(event.target.value);
+								},
+								onBlur: commitContext
+							})]
+						})]
+					}) : null
+				]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+				className: styles.card,
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", { children: t("balance") }),
+					client.status?.balance === void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: styles.muted,
+						children: client.status?.balanceError === void 0 ? t("loading") : t("balanceUnavailable")
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", {
+						className: styles.balanceValue,
+						children: money(client.status.balance.paidUsd)
+					}), client.status.balance.exhausted ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: styles.danger,
+						children: t("emptyBalance")
+					}) : client.status.balance.low ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: styles.warning,
+						children: t("lowBalance")
+					}) : null] }),
+					connected ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: styles.topUp,
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
+								label: t("amount"),
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									className: styles.input,
+									type: "number",
+									min: 5,
+									max: 1e3,
+									step: 1,
+									value: topUpAmount,
+									onChange: (event) => {
+										setTopUpAmount(Number(event.target.value));
+									}
+								})
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								className: styles.primary,
+								type: "button",
+								disabled: busy !== null || topUpAmount < 5 || topUpAmount > 1e3,
+								onClick: () => {
+									run("top-up", async () => {
+										setTopUpUrl((await speechApi.topUp(topUpAmount)).url);
+									});
+								},
+								children: t("createLink")
+							}),
+							topUpUrl === null ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+								className: styles.checkout,
+								href: topUpUrl,
+								target: "_blank",
+								rel: "noreferrer",
+								children: t("openCheckout")
+							})
+						]
+					}) : null
+				]
+			})] }) : null,
+			message === null ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: styles.good,
+				role: "status",
+				children: message
+			}),
+			error === null && client.error === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: styles.danger,
+				role: "alert",
+				children: error ?? client.error
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/client/locales.ts
+const en = {
+	nav: "Speech",
+	title: "Speech",
+	subtitle: "Live transcription through AllModels.io. Audio is relayed only while the microphone is active.",
+	account: "AllModels account",
+	signupTitle: "Sign in or sign up free",
+	signupLead: "Enter your email to sign in or create a free AllModels account.",
+	freeCredit: "$1 free credit",
+	emailFlowHint: "No password needed. New accounts receive $1 in free credit.",
+	connected: "Connected",
+	notConnected: "Not connected",
+	managedBy: "Credential source: {source}",
+	email: "Email address",
+	sendCode: "Send sign-in code",
+	code: "Six-digit code",
+	verify: "Verify and connect",
+	resend: "Resend code",
+	expires: "Code expires in {seconds}s",
+	apiKeySignIn: "Connect with an API key instead",
+	apiKey: "AllModels API key",
+	connect: "Connect",
+	disconnect: "Disconnect",
+	settings: "Recognition",
+	model: "STT model",
+	provider: "Provider",
+	language: "Language",
+	invalidLanguage: "Enter Auto or a valid language tag such as en, zh-CN, or ja.",
+	auto: "Auto-detect",
+	context: "Recognition context",
+	optional: "Optional",
+	contextHint: "Names, jargon, or a short description that helps recognition.",
+	contextUnsupported: "This provider does not accept context. The saved value is preserved but will not be sent.",
+	balance: "Balance",
+	paid: "Paid",
+	promotion: "Promotion",
+	usable: "Usable",
+	lowBalance: "Balance is below $0.50. Top up soon to avoid interruption.",
+	emptyBalance: "Balance is empty. Add funds before recording.",
+	balanceUnavailable: "Balance is temporarily unavailable; recording remains available.",
+	amount: "Top-up amount (USD)",
+	createLink: "Create top-up link",
+	openCheckout: "Open secure checkout",
+	refresh: "Refresh",
+	loading: "Loading…",
+	codeSent: "A sign-in code was sent. It remains valid for five minutes.",
+	saved: "Saved",
+	micStart: "Start voice input",
+	micStop: "Stop voice input",
+	starting: "Preparing microphone…",
+	listening: "Listening…",
+	finalizing: "Finishing transcription…",
+	microphone: "Microphone",
+	systemDefaultMicrophone: "System default",
+	loadingMicrophones: "Loading microphones…",
+	switchingMicrophone: "Switching microphone…",
+	microphoneError: "Could not switch microphone: {message}",
+	disconnectedMic: "Connect AllModels in Settings → Speech",
+	emptyMic: "Top up your AllModels balance in Settings → Speech",
+	anotherMic: "The microphone is active in another session",
+	liveModel: "{provider} · {model}"
+};
+const zh = {
+	nav: "语音",
+	title: "语音",
+	subtitle: "通过 AllModels.io 实时转写。仅在麦克风开启时转发音频，不保存录音。",
+	account: "AllModels 账户",
+	signupTitle: "登录或免费注册",
+	signupLead: "输入邮箱即可登录或创建免费的 AllModels 账户。",
+	freeCredit: "赠送 1 美元额度",
+	emailFlowHint: "无需密码。新账户将获得 1 美元免费额度。",
+	connected: "已连接",
+	notConnected: "未连接",
+	managedBy: "凭据来源：{source}",
+	email: "电子邮箱",
+	sendCode: "发送登录验证码",
+	code: "六位验证码",
+	verify: "验证并连接",
+	resend: "重新发送验证码",
+	expires: "验证码将在 {seconds} 秒后过期",
+	apiKeySignIn: "改用 API 密钥连接",
+	apiKey: "AllModels API 密钥",
+	connect: "连接",
+	disconnect: "断开连接",
+	settings: "语音识别",
+	model: "STT 模型",
+	provider: "服务商",
+	language: "语言",
+	invalidLanguage: "请输入“自动”或有效的语言标签，例如 en、zh-CN 或 ja。",
+	auto: "自动检测",
+	context: "识别上下文",
+	optional: "可选",
+	contextHint: "填写名称、术语或简短说明，以帮助提高识别准确率。",
+	contextUnsupported: "当前服务商不支持上下文。已保存的内容会保留，但不会发送。",
+	balance: "余额",
+	paid: "付费余额",
+	promotion: "赠送余额",
+	usable: "可用余额",
+	lowBalance: "余额低于 0.50 美元，请及时充值以免中断。",
+	emptyBalance: "余额不足，请充值后再录音。",
+	balanceUnavailable: "暂时无法查询余额；仍可尝试录音。",
+	amount: "充值金额（美元）",
+	createLink: "创建充值链接",
+	openCheckout: "打开安全支付页面",
+	refresh: "刷新",
+	loading: "加载中…",
+	codeSent: "登录验证码已发送，五分钟内有效。",
+	saved: "已保存",
+	micStart: "开始语音输入",
+	micStop: "停止语音输入",
+	starting: "正在准备麦克风…",
+	listening: "正在聆听…",
+	finalizing: "正在完成转写…",
+	microphone: "麦克风",
+	systemDefaultMicrophone: "系统默认",
+	loadingMicrophones: "正在加载麦克风…",
+	switchingMicrophone: "正在切换麦克风…",
+	microphoneError: "无法切换麦克风：{message}",
+	disconnectedMic: "请前往“设置 → 语音”连接 AllModels",
+	emptyMic: "请前往“设置 → 语音”为 AllModels 充值",
+	anotherMic: "麦克风正在另一个会话中使用",
+	liveModel: "{provider} · {model}"
+};
+
+//#endregion
+//#region src/client/index.tsx
+const inject = [
+	"slots",
+	"locale",
+	"settingsScope"
+];
+function apply(ctx) {
+	const controller = new SpeechController();
+	const scope = ctx.settingsScope.bind({ namespace: "dsh-speech" });
+	const getLocale = () => ctx.locale.getLocale().active;
+	ctx.effect(() => ctx.locale.register("speech", {
+		en,
+		zh
+	}), "dsh-speech: locale dictionaries");
+	ctx.effect(() => {
+		if (typeof document === "undefined") return () => {};
+		const style = document.createElement("style");
+		style.dataset.plugin = "dsh-speech";
+		style.dataset.pluginCss = "dsh-speech";
+		style.textContent = STYLE_TEXT;
+		document.head.append(style);
+		return () => {
+			style.remove();
+		};
+	}, "dsh-speech: client styles");
+	ctx.effect(() => {
+		if (typeof document === "undefined" || typeof MutationObserver === "undefined") return () => {};
+		const labels = new Set([en.nav, zh.nav]);
+		const markSpeechNavigation = () => {
+			for (const button of document.querySelectorAll("[role=\"dialog\"] nav button")) if (labels.has(button.textContent?.trim() ?? "")) button.dataset.dshSpeechNav = "";
+			else delete button.dataset.dshSpeechNav;
+		};
+		const observer = new MutationObserver(markSpeechNavigation);
+		observer.observe(document.body, {
+			childList: true,
+			subtree: true,
+			characterData: true
+		});
+		markSpeechNavigation();
+		return () => {
+			observer.disconnect();
+			for (const button of document.querySelectorAll("[data-dsh-speech-nav]")) delete button.dataset.dshSpeechNav;
+		};
+	}, "dsh-speech: settings navigation icon");
+	ctx.effect(() => () => {
+		controller.dispose();
+	}, "dsh-speech: browser controller");
+	ctx.slots.inject("settings.section", () => ctx.slots.register({
+		name: "settings.section",
+		id: "speech",
+		order: 30,
+		label: () => ctx.locale.bind("speech")("nav"),
+		locale: "speech",
+		inject: () => ({
+			controller,
+			scope,
+			getLocale
+		})
+	}, SpeechSettings));
+	ctx.inject(["conversation"], (scoped) => {
+		const blocks = scoped.conversation.blocks;
+		controller.attachBlocks(blocks);
+		const mic = scoped.slots.register({
+			name: "conversation.input.right",
+			id: "speech-microphone",
+			order: 100,
+			locale: "speech",
+			inject: () => ({
+				controller,
+				getLocale
+			})
+		}, SpeechMic);
+		const dock = scoped.slots.register({
+			name: "conversation.composer.dock",
+			id: "speech-amplitude",
+			order: 100,
+			locale: "speech",
+			inject: () => ({
+				controller,
+				getLocale
+			})
+		}, SpeechDock);
+		const inputDock = scoped.slots.register({
+			name: "conversation.input.dock",
+			id: "speech-microphone-selector",
+			order: 100,
+			locale: "speech",
+			inject: () => ({
+				controller,
+				getLocale
+			})
+		}, SpeechInputDock);
+		return () => {
+			controller.detachBlocks(blocks);
+			mic();
+			dock();
+			inputDock();
+		};
+	});
+}
+
+//#endregion
+exports.apply = apply;
+exports.inject = inject;
+return module.exports; } });
+//# sourceMappingURL=client.js.map