Docs
Typing Indicator
Typing Indicator
A simple animated typing indicator component.
A minimal and elegant typing indicator component that shows three animated dots to indicate ongoing activity, commonly used in chat interfaces to show when someone is typing.
Installation
npx shadcn@latest add https://shadcn-chatbot-kit.vercel.app/r/typing-indicator.json
Usage
import { TypingIndicator } from "@/components/ui/typing-indicator"
type MessageProps = {
isPending: boolean
content: string
}
export function Message({ isPending, content }: MessageProps) {
// ...
return isPending ? <TypingIndicator /> : <p>{content}</p>
}