AI & AgentsPro

Voice Input

Talk instead of typing: idle, listening with a live waveform and transcript, then transcribing.

Usage

Tap to talkNova writes down what you say

bash

npm install @wunderui/react

Then import what you need:

tsx

import { VoiceInput } from "@wunderui/react"

Tap to start talking.

Tap to talkNova writes down what you say

A live waveform, the time and the words heard so far.

Rename the Tabs props to match…0:07

Waiting for the text.

Transcribing…7 seconds of audio

How the component is used inside real screens — the same compositions as the Usage section of the Figma page.

Listening with a live transcript. Stop, and the text lands in the prompt ready to edit.

Add a line for the expired card…0:07

Tap the red button to stop · Esc to cancel

Prop	Type	Default
state	"idle" \| "listening" \| "transcribing"	"idle"
transcript	ReactNode	—
seconds	number	0
onStart / onStop	() => void	—
hint	ReactNode	"Nova writes down what you say"