Skip to content

feat(shadcn): add volumeBands override prop to agents-ui visualizers#1399

Open
thomasyuill-livekit wants to merge 5 commits into
mainfrom
ty/volume-bands-prop
Open

feat(shadcn): add volumeBands override prop to agents-ui visualizers#1399
thomasyuill-livekit wants to merge 5 commits into
mainfrom
ty/volume-bands-prop

Conversation

@thomasyuill-livekit

@thomasyuill-livekit thomasyuill-livekit commented Jul 24, 2026

Copy link
Copy Markdown
Contributor

Issue

Related to https://github.com/livekit/web/pull/4377

The demo's on livekit.com/products/agents-ui require simulated audio.
We don't have a mechanism for providing an audioTrack, so the components needed to be forked.
This complicates updates and maintenance.

Overview

Adds override props to the agents-ui audio visualizer components,
letting callers provide precomputed volume data overriding the live audio hooks.

Multiband visualizers (Bar/Radial/Grid) accept a volumeBands array
Single-value visualizers (Wave/Aura) accept a scalar volume.

Summary of changes

Component Prop Behavior
AgentAudioVisualizerBar volumeBands?: number[] Overrides useMultibandTrackVolume; still gated on state === 'speaking'. Array is trimmed or padded (duplicating the last value) to match barCount.
AgentAudioVisualizerRadial volumeBands?: number[] Same override; still gated on audioTrack being present. Normalized to barCount.
AgentAudioVisualizerGrid volumeBands?: number[] Same override; still gated on state === 'speaking'. Normalized to columnCount.
AgentAudioVisualizerWave volume?: number Overrides the internally-computed useTrackVolume value directly.
AgentAudioVisualizerAura volume?: number Same as Wave.
  • Added normalizeVolumeBands in packages/shadcn/lib/utils.ts
    • trim/pad-by-duplicating-last-value rule shared by Bar/Radial/Grid.

Testing

Lets callers drive Bar/Radial/Grid/Wave/Aura visualizers with precomputed
volume data instead of live useMultibandTrackVolume/useTrackVolume output,
while preserving existing state/track visibility gates.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@vercel

vercel Bot commented Jul 24, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
components-js-storybook-5kld Ready Ready Preview, Comment Jul 24, 2026 4:28pm

Request Review

@changeset-bot

changeset-bot Bot commented Jul 24, 2026

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 1bae996

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@github-actions

Copy link
Copy Markdown
Contributor

size-limit report 📦

Path Size
LiveKitRoom only 7.89 KB (0%)
LiveKitRoom with VideoConference 32.52 KB (0%)
All exports 44.13 KB (0%)

Bar/Radial/Grid now trim excess values or pad by duplicating the last
value when a supplied volumeBands array doesn't match the expected count.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Replace volumeBands (number[]) with a scalar volume prop on Wave/Aura,
since they only ever needed one value. Drops the now-unused
resolveVolumeFromBands averaging helper.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Bar/Grid never gated on audioTrack, only Radial did, which silently
zeroed out an explicitly-provided volumeBands override whenever no live
track was connected. Also adds Storybook demos (with a shared simulated
speech-waveform generator) showing the volumeBands/volume override for
all 5 agents-ui visualizers.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants