@kitn.ai/ui
Version:
Framework-agnostic, Shadow-DOM web components for building AI chat interfaces — works in React, Vue, Angular, Svelte, or plain HTML. Authored in SolidJS.
34 lines (33 loc) • 1.62 kB
TypeScript
/** Imperative handle exposed via `controllerRef` — surfaces the playback controls
* so the `<kai-voice-output>` facade can forward them as instance methods. Both
* the native (speechSynthesis) and model (synthesize → Audio) paths run through
* these, so manual clicks and programmatic calls behave identically. */
export interface VoiceOutputController {
/** Speak the current `text` (native by default, model if `synthesize` is set). */
speak(): void;
/** Pause playback (resumable). */
pause(): void;
/** Resume paused playback. */
resume(): void;
/** Stop playback and reset. */
stop(): void;
}
export interface VoiceOutputProps {
/** The utterance to read aloud. */
text: string;
/** Speak automatically when `text` is set/changed. */
autoplay?: boolean;
/** TTS model seam: given text, return an audio Blob to play. When set, the
* native speechSynthesis path is bypassed. Mirrors VoiceInput's `onTranscribe`. */
onSynthesize?: (text: string) => Promise<Blob>;
/** Fires whenever playback starts or stops. */
onSpeakingChange?: (speaking: boolean) => void;
/** Fires once the model path resolves audio (model path only). */
onSynthesized?: (blob: Blob) => void;
disabled?: boolean;
class?: string;
/** Receive the imperative controller once mounted. The `<kai-voice-output>`
* facade forwards these as element methods (speak/pause/resume/stop). */
controllerRef?: (controller: VoiceOutputController) => void;
}
export declare function VoiceOutput(props: VoiceOutputProps): import("solid-js").JSX.Element;