Skip to content

Add Transcript Viewer and Scrub Bar UI components#23

Merged
louisjoecodes merged 15 commits intoelevenlabs:mainfrom
ryandotelliott:transcript-visualizer
Nov 3, 2025
Merged

Add Transcript Viewer and Scrub Bar UI components#23
louisjoecodes merged 15 commits intoelevenlabs:mainfrom
ryandotelliott:transcript-visualizer

Conversation

@ryandotelliott
Copy link
Contributor

Overview

There's not currently a good way to view a transcript generated with timestamps. I previously created something similar to this, and decided it'd be useful to have a more composable + standardized component.

Features

  • Created a basic scrub-bar that adds an abstraction on top of the Progress component with more customization.
  • Created TranscriptViewer components / hook that:
    • Allow for per-word styling
    • Support seeking to a specific word
    • Composes words based on alignments
    • Removes custom audio tags
    • Uses requestAnimationFrame to not be bottlenecked by default ontimeupdate events

Demo

result

Notes

  • I generated most of the docs with AI - I reviewed them but some parameters / descriptions are possible incorrect and could use a second look.
  • I'm sure there's a lot of optimizations / code improvements that can be made - happy to handle them, but let me know if anything stands out.

@vercel
Copy link
Contributor

vercel bot commented Oct 28, 2025

@ryandotelliott is attempting to deploy a commit to the ElevenLabs Team on Vercel.

A member of the Team first needs to authorize it.

@vercel
Copy link
Contributor

vercel bot commented Nov 3, 2025

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

Project Deployment Preview Comments Updated (UTC)
ui Ready Ready Preview Comment Nov 3, 2025 10:01am

@louisjoecodes louisjoecodes merged commit 2d6f6b0 into elevenlabs:main Nov 3, 2025
6 checks passed
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