refactor(shadcn): replace ai-elements chat components with shadcn base#1365
Open
thomasyuill-livekit wants to merge 3 commits into
Open
refactor(shadcn): replace ai-elements chat components with shadcn base#1365thomasyuill-livekit wants to merge 3 commits into
thomasyuill-livekit wants to merge 3 commits into
Conversation
|
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
size-limit report 📦
|
1egoman
approved these changes
Jul 10, 2026
…e primitives Drops the external @ai-elements registry dependency in agents-ui, rebuilding the chat transcript and pre-connect shimmer on shadcn's native MessageScroller, Message, and Bubble components plus the shimmer CSS utility. Also bumps Tailwind to 4.3.2 so the scroll button's logical-inset centering utility (inset-s-*, added in 4.2.0) actually resolves.
thomasyuill-livekit
force-pushed
the
ty/replace-ai-elements-shadcn
branch
from
266ed98 to
2ce66f7
Compare
…cript hit-testing Adds a WithConversation story that populates the transcript with a scripted conversation by emitting fake chat events onto the session's Room, plus a play function to open the panel. Extends the sample conversation to 20 messages so the transcript overflows and scrolls. While verifying it, found that TileLayout's absolutely positioned wrapper (z-50, rendered after the transcript in DOM order) intercepts all pointer/wheel events over the transcript whenever the chat panel is open, even with no messages -- confirmed via AgentSessionView_01's Default story. Fixes it with pointer-events-none, since nothing in that layer is interactive today.
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
2 participants
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 linked Linear ticket — please add one if this tracks a specific issue.
Overview
agents-ui(packages/shadcn) vendored its chat UI (Conversation,Message,Shimmer) from the external ai-elements registry (registry.ai-sdk.dev). This PR drops that dependency and rebuilds the same UI on shadcn's own native chat primitives (MessageScroller,Message,Bubble, and theshimmerCSS utility), released by shadcn in June 2026.Summary of changes
components/ai-elements/*conversation.tsx,message.tsx,shimmer.tsx)components/ui/{message-scroller,message,bubble}.tsxshadcn addagent-chat-transcript.tsxMessageScroller/Message/Bubble+ directStreamdownagent-session-block.tsxshimmerCSS utility instead of aShimmercomponent wrapped inmotion.createagent-chat-indicator.tsxcomponents.json,registry.json,package.json@ai-elementsregistry alias,use-stick-to-bottomdep; registry deps repointed tomessage-scroller/message/bubbletailwindcss(docs/storybook)4.1.17→4.3.2— the scroll button's centering utility (inset-s-*) only exists from Tailwind4.2.0onward@/components/ai-elements/*to@/components/ui/*Testing
No Vercel preview is configured for this repo. Verified locally:
pnpm --filter @agents-ui test— 277 tests passpnpm --filter @agents-ui run registry:build— registry builds cleanlypnpm dev:storybook) — visually confirmedAgentChatTranscriptandAgentSessionView-01stories, including the scroll-to-bottom button centering fix