Prompt

Auto-resizing textarea with send button and keyboard shortcut hints. Submits on Enter, newline on Shift+Enter.

Thumbs up/down rating bar for AI responses. Optionally reveals a comment textarea on thumbs-down.

Drag-and-drop file upload zone with click-to-browse and uploaded file list.

Clickable suggestion chip for pre-filling prompt ideas. Supports an optional icon prefix.

Renders a list of user/assistant messages as styled chat bubbles with proper alignment.

Character-by-character streaming text simulation with blinking cursor. Optionally loops.

Compact chip showing model name, version, provider, and optional live status dot.

Collapsible reasoning chain showing numbered steps with done/active/pending status indicators.

Styled code display with language badge, optional filename, and one-click copy button.

Zero-dependency markdown renderer. Parses headings, bold, italic, inline code, fenced blocks, lists, and links.

Structured message row with avatar initial, sender name, timestamp, and slot for content.

Collapsible reasoning block with animated expand/collapse. Shows streaming dots while thinking.

Multi-paragraph streaming text display with blinking cursor for in-progress AI responses.

Citation chip with index number, title, and domain. Hover to reveal excerpt.

Vertical numbered step list for multi-step AI processes with complete/current/upcoming states.

Centered muted divider message for chat events like model changes or context clears.

Collapsible tool call display showing name, JSON input, output, and running/done/error status.

Animated three-dot loading indicator for AI thinking state. Pure CSS, no dependencies.

Four loading variants: animated dots, spinning ring, pulsing circle, and progress bar fill.

Live token count with spring-animated number and a color-coded fill bar that shifts green→yellow→red as tokens approach the limit.

Scrollable fixed-height container that auto-scrolls to bottom when children change.

Animated jump-to-bottom button for chat interfaces. Fades in/out with framer-motion.

Dropdown for selecting an AI model. Shows the active model and provider badge; opens an animated popover listing models with colored dots and capability descriptions.

Toggleable grid of AI capability chips (Web Search, Code Exec, etc.). Selected chips highlight with an animated checkmark.