Usage
A headless speech-recognition control. It does not write into a composer. Read the transcript from interimTranscript and onResult, and draw your own UI from isListening and volume. Check isSupported first. useChatDictation adds composer interim text and start and stop cues on top of this hook.
tsimport {useSpeechRecognition} from '@astryxdesign/core/Chat'
Best practices
| Guidance | Practices |
|---|---|
| Do | Hide or disable the control when isSupported is false. |
| Do | Use onResult for the committed transcript. interimTranscript changes while the person is still speaking. |
| Don't | Use this hook to fill a ChatComposerInput. useChatDictation owns that interim text. |
Parameters
| Param | Type | Description |
|---|---|---|
options | Recognition options. Omit them to listen in the provider locale until stop is called. | |
options.lang | string | BCP-47 language tag for recognition. |
options.continuous | boolean (default: true) | Whether recognition continues until stop or abort. |
options.interimResults | boolean (default: true) | Whether partial transcripts are reported before the final one. |
options.audioContext | AudioContext | A shared audio context for the microphone level. Omit it to use the hook's own context. |
options.transformTranscript | (text: string) => string | Rewrites each transcript before it is reported. |
options.onTranscript | (transcript: string, isFinal: boolean) => void | Called for each partial transcript and each final one. |
options.onResult | (transcript: string) => void | Called with each final transcript. Keep this text: interimTranscript clears when the phrase is final. |
options.onError | (error: {error: string, message?: string}) => void | Called when recognition fails. |
options.onStart | () => void | Called when recognition starts. |
options.onEnd | () => void | Called when recognition ends. |
Returns
| Field | Type | Description |
|---|---|---|
| isSupported | boolean | Whether this browser provides speech recognition. |
| isListening | boolean | Whether recognition is active. |
| isSpeaking | boolean | Whether the microphone currently hears speech. |
| interimTranscript | string | The partial transcript, empty when none is pending. |
| volume | number | Microphone level from 0 to 1 while listening. |
| bands | number[] | Frequency band levels from low to high, each from 0 to 1. |
| rawBands | number[] | The same bands before calibration. |
| start | () => void | Start recognition. |
| stop | () => void | Stop recognition and wait for the final transcript. |
| abort | () => void | Stop recognition immediately. |
| toggle | () => void | Start when idle, and stop when listening. |
Examples
Common configurations, variations, and states.A headless useSpeechRecognition control. It shows whether the browser can listen, the words still being recognized, and each finished phrase from onResult.
Use with shadcn
Already using the shadcn registry workflow? Install the real Astryx package and a local public re-export. Component implementation source stays in Astryx.
This install URL expires with the draft preview.bashnpx shadcn@4.19.0 add https://astryx-9e2z4y5kv-fbopensource.vercel.app/shadcn/hooks/use-speech-recognition.json