@seams/voice-capture 0.0.0-stage → 0.67.0

package/dist/esm/card/surface.js

@@ -0,0 +1,224 @@
+import { captureConfig } from "../config.js";
+import { voiceActivityModel } from "../voiceActivity.js";
+import { expectedSpeechMs } from "../speechPause.js";
+import { VoiceMicrophoneInterruptedError } from "../microphoneInput.js";
+import { recordVoice, voiceQualityMessage } from "../microphone.js";
+import { PhraseCard } from "./phraseCard.js";
+import { VoicePrompt, leaveSurface } from "./prompt.js";
+//#region src/card/surface.ts
+const LABEL = "Say this with your voice";
+const PROMPT_LABEL = "Say this sentence";
+const PROMPT_MESSAGE = "Read it naturally, then pause.";
+/**
+* Shows the given sentence in the prompt. The surface records clips with the quality check, and
+* stays open so the caller can show its check and the result in the same card. A too quiet or
+* interrupted recording stays on the surface for another try.
+*/
+function openPhraseCard(input) {
+	return new CardSurface(input);
+}
+var CardSurface = class {
+	element;
+	prompt;
+	card;
+	unmounted;
+	outer;
+	detector;
+	recorder = null;
+	recording = null;
+	choice = null;
+	view = null;
+	started = false;
+	closed = false;
+	/** The voiced time of the whole sentence, after which a shorter pause ends a recording. */
+	expectedSpeechMs;
+	/** The speech detector has started; before that, a recording waits for it to load. */
+	speechDetectorReady = false;
+	constructor(input) {
+		const { sentence, frame = {} } = input;
+		const outer = input.signal;
+		this.outer = outer;
+		this.detector = input.detector;
+		this.expectedSpeechMs = expectedSpeechMs(sentence);
+		const handedOver = document.querySelector(".seams-voiceid-activation-surface[data-seams-voiceid-handoff]");
+		if (input.detector === "level") this.speechDetectorReady = true;
+		else voiceActivityModel.prepare().then(this.detectorStarted, ignoreEarlyLoad);
+		const parent = frame.parent ?? document.body;
+		this.element = document.createElement("section");
+		this.element.className = ["seams-voiceid-activation-surface", frame.className].filter(Boolean).join(" ");
+		this.element.setAttribute("role", "dialog");
+		this.element.setAttribute("aria-modal", "true");
+		this.element.setAttribute("aria-label", LABEL);
+		this.prompt = new VoicePrompt(document, LABEL, sentence);
+		this.prompt.title.textContent = PROMPT_LABEL;
+		const shown = /[.!?]$/.test(sentence) ? sentence : `${sentence}.`;
+		this.prompt.phrase.textContent = shown;
+		delete this.prompt.phrase.dataset.voiceidPhrase;
+		this.prompt.status.textContent = PROMPT_MESSAGE;
+		this.prompt.record.textContent = "Record";
+		if (frame.back) this.prompt.showBack();
+		const handedOverPrompt = handedOver?.querySelector(":scope > .seams-voiceid-prompt") ?? null;
+		const rows = handedOverPrompt ? handedOverRows(handedOverPrompt) : null;
+		if (handedOverPrompt) {
+			this.prompt.continueFrom(handedOverPrompt);
+			this.prompt.record.hidden = true;
+		}
+		this.card = new PhraseCard(this.prompt, {
+			label: PROMPT_LABEL,
+			sentence: shown,
+			message: PROMPT_MESSAGE,
+			action: "Record"
+		}, rows);
+		this.element.append(this.prompt.element);
+		this.prompt.record.addEventListener("click", this.press);
+		this.prompt.cancel.addEventListener("click", this.cancel);
+		this.element.addEventListener("cancel", this.cancel);
+		outer.addEventListener("abort", this.cancel);
+		if (handedOver) handedOver.replaceWith(this.element);
+		else parent.appendChild(this.element);
+		if (frame.hugged) this.element.classList.add("seams-voiceid-hugged");
+		this.unmounted = frame.mounted?.(this.element);
+		if (rows) this.prompt.element.focus({ preventScroll: true });
+		else this.prompt.record.focus();
+		if (outer.aborted) this.cancel();
+	}
+	record() {
+		if (this.closed) return Promise.resolve({ kind: "cancelled" });
+		this.settleChoice("replaced");
+		this.recording?.resolve({ kind: "cancelled" });
+		const recording = deferred();
+		this.recording = recording;
+		if (this.view) {
+			this.view = null;
+			this.card.showPrompt();
+		}
+		return recording.promise;
+	}
+	show(view) {
+		if (this.closed) return Promise.resolve("closed");
+		this.settleChoice("replaced");
+		this.view = view;
+		this.card.show(view);
+		return new Promise((resolve) => {
+			this.choice = resolve;
+		});
+	}
+	close() {
+		if (this.closed) return;
+		this.closed = true;
+		this.recorder?.abort();
+		this.recording?.resolve({ kind: "cancelled" });
+		this.settleChoice("closed");
+		this.unmounted?.();
+		this.outer.removeEventListener("abort", this.cancel);
+		this.element.removeEventListener("cancel", this.cancel);
+		this.prompt.record.removeEventListener("click", this.press);
+		this.prompt.cancel.removeEventListener("click", this.cancel);
+		this.card.dispose();
+		this.prompt.dispose();
+		leaveSurface(this.element);
+	}
+	/** The one button records on the prompt and answers a result. */
+	press = () => {
+		if (this.view) {
+			if (this.view.kind === "result" && !this.view.action.busy) this.settleChoice("action");
+			return;
+		}
+		if (!this.recording || this.started) return;
+		this.started = true;
+		this.prompt.record.disabled = true;
+		this.prompt.status.textContent = this.speechDetectorReady ? "Opening microphone…" : `Loading ${captureConfig().label}…`;
+		this.attempt(this.recording);
+	};
+	async attempt(recording) {
+		const recorder = new AbortController();
+		this.recorder = recorder;
+		try {
+			const recorded = await recordVoice(recorder.signal, this.capture, {
+				expectedSpeechMs: this.expectedSpeechMs,
+				detector: this.detector
+			});
+			if (this.recording !== recording || this.closed) {
+				recorded.samples?.fill(0);
+				return;
+			}
+			if (recorded.kind === "insufficient_audio") {
+				this.retry(voiceQualityMessage(recorded.quality));
+				return;
+			}
+			const endOfSpeechAt = recorded.lastSoundAtMs ?? performance.now();
+			this.started = false;
+			this.recording = null;
+			recording.resolve({
+				kind: "recorded",
+				samples: recorded.samples,
+				endOfSpeechAt
+			});
+		} catch (error) {
+			if (this.recording !== recording || this.closed) return;
+			if (error instanceof VoiceMicrophoneInterruptedError) {
+				this.retry(error.message);
+				return;
+			}
+			this.started = false;
+			this.recording = null;
+			recording.reject(error instanceof Error ? error : new Error(String(error)));
+		}
+	}
+	detectorStarted = () => {
+		this.speechDetectorReady = true;
+	};
+	/** The end of speech starts the check in place; every other capture event is the prompt's. */
+	capture = (event) => {
+		if (event.kind === "processing") this.card.beginCheck();
+		else this.prompt.capture(event);
+	};
+	retry(message) {
+		this.started = false;
+		this.prompt.record.textContent = "Try again";
+		this.prompt.ready(message);
+		this.prompt.record.focus();
+	}
+	settleChoice(choice) {
+		const settle = this.choice;
+		this.choice = null;
+		settle?.(choice);
+	}
+	/** A close during a check is not possible: the button is hidden while the caller works. */
+	cancel = () => {
+		if (this.view?.kind === "check" && !this.outer.aborted) return;
+		if (this.recording) {
+			this.recorder?.abort();
+			this.recording.resolve({ kind: "cancelled" });
+			this.recording = null;
+			this.started = false;
+		}
+		this.settleChoice("closed");
+		if (this.outer.aborted) this.close();
+	};
+};
+/** A failed early load runs again when Record needs the detector, and shows its error there. */
+function ignoreEarlyLoad() {}
+/** The rows that the handed-over card shows now. */
+function handedOverRows(prompt) {
+	const read = (selector) => prompt.querySelector(`:scope > ${selector}`)?.textContent ?? "";
+	return {
+		label: read("h2"),
+		message: read(".seams-voiceid-status")
+	};
+}
+/** A promise with its two settle functions. */
+function deferred() {
+	let resolve;
+	let reject;
+	return {
+		promise: new Promise((onResolve, onReject) => {
+			resolve = onResolve;
+			reject = onReject;
+		}),
+		resolve,
+		reject
+	};
+}
+//#endregion
+export { openPhraseCard };

package/dist/esm/card/visual.js

@@ -0,0 +1,2 @@
+import { t as VoiceVisual } from "../chunks/visual-Di3ojTED.js";
+export { VoiceVisual };