Voice AI Orb

A voice-agent status orb for listening, reasoning, and speaking — with EQ bars, mute, and a short transcript.

Listening

Mic-active idle. Use the control bar or pass defaultState.

Loading…

Installation

CLI

npx @sonojs/ui@latest add voice-ai-orb

Also needsnpm i lucide-react

Usage

voice-ai-orb.tsx

import { VoiceAiOrb } from "@/components/ui/voice-ai-orb"

export function Example() {
  return (
    <VoiceAiOrb
      state="listening"
      transcript="Can you audit our PostgreSQL query latency?"
    />
  )
}

Props

Prop	Type	Default	Description
state	"listening" · "reasoning" · "speaking"	uncontrolled	Controlled voice state. Omit for internal control bar.
defaultState	VoiceAiOrbState	"listening"	Initial state when uncontrolled.
muted	boolean	uncontrolled	Controlled mute. Collapses EQ bars when true.
transcript	string	sample audit question	Quoted line under the status label.
showControls	boolean	true	Listen / Reason / Speak / mute control bar.
className	string	—	Merge classes on the root.