A design system built on shadcn/ui: every component restyled on one token set, plus AI chat, diff and usage components and ready-made blocks.
A vertically stacked set of headers that expand and collapse their panels, revealing one section of content at a time.
A message composer for AI chats: one row with actions around the text that opens into a column once the text wraps or attachments are added, with an expand action and a send button.
Lines of agent activity — reasoning, tool calls, searches, sources, plans and subagent runs — each with an icon, a title and an optional description and status, expandable into nested detail.
A callout that surfaces important contextual information — such as a status update or a failure — without interrupting the user's flow.
A modal confirmation dialog that interrupts the user before a destructive or irreversible action is carried out.
Constrains its content to a fixed width-to-height ratio so media, embeds, and placeholders keep their shape at any container size.
An uploaded or in-flight file as a picture, a card that names its type or a row (full or compact) with its icon, name and metadata, with its upload state and actions.
Displays a user's image with an automatic initials fallback, plus optional status badge and stacked group with overflow count.
A small inline label for surfacing statuses, categories, and metadata next to other content.
Displays the path to the current page as a hierarchy of links so users can see where they are and jump back to any parent level.
A chat message bubble for conversation UIs, with sender alignment, tonal variants, grouped messages, and emoji reactions.
Triggers an action. Six emphasis levels, five sizes with icon-only counterparts and an optional count chip.
Groups related buttons and controls into a single connected segment with shared borders and rounded outer corners.
A month grid for picking a single date, multiple dates, or a date range, built on react-day-picker.
An opaque surface that groups related content, with slots for a header, title, description, action, content, and footer.
A slide container for cycling through related content, built on Embla with previous/next buttons and arrow-key navigation.
Recharts-based building blocks — a themed container, tooltip, and legend that pull series labels and colors from a single chart config.
Chat history in a sidebar: new chat with its shortcut, search, conversations grouped by date with pinning, per-chat actions on hover and the account menu.
A conversation with an assistant: your messages and attachments on the right, answers across the full width with folded reasoning, lists and bold text, copy / feedback / share / retry actions, and a thinking state.
The empty state of a new chat: a greeting, the prompt input and suggestion buttons that start a conversation in one click.
A control that lets the user toggle a single option between checked and unchecked states.
A panel that expands and collapses to reveal or hide secondary content behind a trigger.
An input that filters a list of options as the user types and lets them pick a value from a popup.
A searchable command menu for finding and running actions, with grouped, keyboard-navigable results and built-in filtering.
A menu of contextual actions that opens at the pointer position when the user right-clicks (or long-presses) a target element.
A modal window over the page content. Composed from focused subcomponents.
Shows the changes to a file as a unified or split diff — line numbers, added and removed lines, +/- counts in the header and syntax highlighting — from a patch or from two versions of the file.
A context provider that switches Base UI components between left-to-right and right-to-left reading directions.
A panel that slides in from an edge of the screen and can be swiped away, for supplementary content and quick actions.
A menu of actions or options that opens from a trigger element, with support for groups, submenus, checkbox and radio items.
A model-effort picker: a stepped slider whose thumb is pulled toward the nearest level and springs onto it, with a cross-fading level name, a recommended mark and a pixel field that lights the track at the top level.
A placeholder state for screens with no data yet, combining an icon, a title, a description, and follow-up actions.
Composable building blocks for form fields — label, description, error, and layout primitives that wrap any control.
A coloured icon for each kind of file — document, spreadsheet, presentation, PDF, image, video, music, archive or a plain file — sized like a Lucide icon in attachments and lists.
A card that previews linked content, such as a user or project, when the pointer rests on its trigger.
A single-line text field. Three heights that line up with Button.
Groups an input or textarea with icons, text, buttons, and keyboard hints inside a single field container.
A one-time password input with individual character slots, caret animation, and paste support for verification codes.
A composable list row that arranges media, text content, and actions into a single flexible container.
Displays a keyboard key or key combination, used for surfacing shortcut hints in menus, tooltips, and documentation.
An accessible caption for a form control, associated via htmlFor and styled to dim automatically when its control is disabled.
A muted inline label row with an optional icon for annotating lists, feeds, and timelines — usable as a plain note, a centered separator, or a bordered section heading.
A horizontal bar of persistent dropdown menus, like the command menus along the top of a desktop application.
A layout wrapper for chat threads that positions an avatar, message bubbles, a sender header, and a timestamp footer, with start or end alignment per message.
A scroll container for chat and feed interfaces that starts at the latest message, keeps its position while history changes, and shows a button to jump back to the newest content.
A header menu for choosing the model a chat runs on — each option with a one-line description and a Pro badge — plus an upgrade entry.
A styled wrapper around the browser's built-in select element for compact, dependency-free option pickers that use the platform's native dropdown UI.
A horizontal menu of links and animated dropdown panels for top-level site or product navigation.