[WIP] - feat(shadcn): add embed-popup-view-01 block to agents-ui - #1414
Draft
thomasyuill-livekit wants to merge 8 commits into
Draft
[WIP] - feat(shadcn): add embed-popup-view-01 block to agents-ui#1414thomasyuill-livekit wants to merge 8 commits into
thomasyuill-livekit wants to merge 8 commits into
Conversation
Adds a floating chat-bubble trigger that expands into a compact agent session popup, ported from livekit/web's embed-popup components and adapted to be a portable block: token acquisition uses the registry's existing useSession/TokenSource pattern instead of cloud-specific plumbing, and it composes the existing AgentSessionProvider and AgentSessionView_01 block rather than duplicating them. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
|
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
size-limit report 📦
|
thomasyuill-livekit
marked this pull request as draft
August 4, 2026 17:06
Give AgentSessionView-01 and EmbedPopupView-01 an explicit agents-ui/Blocks/* title and sort that group ahead of the rest of the agents-ui section so the composed blocks are easy to find. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Thread an optional onDisconnect callback through AgentSessionView_01 -> PopupView so AgentClient can pass its trigger's handleToggle, closing the popup the same way clicking the trigger bubble does when the user ends the call from inside it. Falls back to session.end when no override is supplied, so the standalone agent-session-view-01 block is unaffected. Also switches AgentSessionView_01's chat/camera/screenShare controls from separate supports* booleans to a single controls object, and moves the control bar's responsive breakpoints to container queries scoped to the control bar itself. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
thomasyuill-livekit
force-pushed
the
ty/embed-popup-view-01-block
branch
from
August 4, 2026 19:27
ab82844 to
ccc2723
Compare
The previous storySort comparator returned 0 for any pair outside agents-ui/*, relying on sort stability to preserve order. Combined with the strict Blocks-first rule inside agents-ui/*, that comparator wasn't transitive, so the resulting sidebar order was undefined and the Blocks group could intermittently split apart or vanish across reloads. Switch to a real total order (rank, then title) so the sort is deterministic. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Default turbo.json ui to "stream" so dev/build/test/lint output plain logs, and force --ui=tui explicitly on shadcn:publish:all instead of the previous TURBO_UI=true (not a value Turbo's --ui/TURBO_UI actually accepts). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
…-view-01 Thread AgentClient's pre-connect/visualizer/theme props (previously only settable on the full-page agent-session-view-01) down through PopupView, and rename the trigger's color prop to triggerColor to disambiguate it from the visualizer color. Also simplifies Trigger's connecting/destructive ring styling to Tailwind utilities instead of a hand-rolled contrast/luminance calculation. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
…torybook controls AgentClientProps documented themeMode but never forwarded it past AgentClient, so the aura visualizer inside the popup couldn't be theme-overridden like it can in agent-session-view-01. Thread it through AgentClient -> PopupView -> AgentSessionView_01. Also refreshes both blocks' Storybook stories to match the current controls-object API (replacing the stale supports*/color args), gives EmbedPopupView-01 the same visualizer/pre-connect controls already exposed on AgentSessionView-01, and fixes the audioVisualizerType select control (options belongs alongside control, not nested inside it, so the dropdown had no options). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Aligns the embed-popup-view-01 block's exported component/prop names with the agent-session-view-01 naming convention, and makes AgentSessionView_01's controls prop optional to match. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Issue
No Linear ticket — requested directly in this session.
Overview
agents-uishadcn block,embed-popup-view-01: a floating chat-bubble trigger that expands into a compact agent-session popup, suitable for embedding on any page.livekit/web'sapps/cloud/components/embed-popup/{popup-view,trigger,agent-client}.tsx, but generalized into a portable block — cloud-specific config/token-fetch plumbing is replaced with the registry's existinguseSession/TokenSourcepattern, and it reuses the existingAgentSessionProviderandAgentSessionView_01block instead of duplicating them. No existing components were modified.Summary of changes
embed-popup-block.tsx(new)AgentClient— owns the session (useSession(tokenSource)), starts/ends it as the popup opens/closes, and composesTrigger+PopupViewinside the existingAgentSessionProvidertrigger.tsx(new)Button+lucide-reacticons); shows connecting/error/connected states viauseAgent(), with brand-color contrast logic for the fallback iconpopup-view.tsx(new)StartAudio, and the existingAgentSessionView_01blockregistry.json,index.tsregistry:block(+ added to theallaggregate item) and exportsAgentClientfrom the package rootEmbedPopupView-01.stories.tsx(new)AgentClientmanages its own session, so no decorator is needed — just passes atokenSourcetests/{embed-popup-block,trigger,popup-view}.test.tsx(new)Testing
pnpm --filter @livekit/agents-ui test— 329 tests passing (25 files, no regressions)pnpm --filter @livekit/agents-ui shadcn:build— registry build + prop-doc generation succeed for the new block🤖 Generated with Claude Code