Usage
This demo uses your device's microphone.
Features
- Visualize an agent's audio track
- Configure the number of bars used in the visualizer
- Select from five sizes:
icon,sm,md,lg, andxl - Responds to agent state with unique animations
Installation
pnpm dlx shadcn@latest add @agents-ui/agent-audio-visualizer-bar
Props
| Prop name | Type | Default |
|---|---|---|
size? | enum | md |
state? | enum | connecting |
color? | `#${string}` | – |
barCount? | number | – |
audioTrack? | LocalAudioTrack | RemoteAudioTrack | TrackReferenceOrPlaceholder | – |
className? | string | – |
children? | ReactNode | – |
ref? | Ref<HTMLDivElement> | – |
...props? | ComponentProps<'div'> | |