interfaces for intelligence
streaming-first components for chat, agents and tool use

open source and shadcn-compatible. copy the code into your project and own every line.

How does streaming markdown stay smooth?

Here's a quick example of a streaming reply with inline code:

export function greet(name: string) {
  return `Hello, ${name}!`;
}

Blocks are memoized, so finished content never re-renders 1
Code is highlighted once the block settles 2

Feature	Status
Markdown	Done
Tables	Done

works with the vercel ai sdk, langchain, openai, anthropic, next.js, tailwind and base ui

every reply streams smoothly
markdown is split into blocks, so only the live block re-renders

reasoning, tool calls and citations

collapsible thinking, live tool status and numbered sources with previews, all keyboard reachable.

plans and traces

show what an agent is doing as it happens, then how long each step took.

humans stay in control
approvals, artifacts and feedback are first-class

approvals

a named dialog that keeps focus where the decision was made.

artifacts

a side pane with preview and code tabs for generated work.

feedback

thumbs with an optional follow-up, returning focus afterwards.

an input that does it all
files, slash commands and a model picker, in one composer

slash commands and attachments

drop, paste or attach files, and type / to run a command or insert a template.

one api, any backend

plain props and no provider. wire it to the vercel ai sdk, langchain or raw server-sent events.

your code, not a dependency

install with the shadcn cli and edit every line. components stay self-contained.

keyboard first

every control is reachable and operable without a mouse, and focus is never dropped.

screen reader aware

live regions wait for a reply to finish, and state is spoken, not just colored.

clear contrast

text meets the 4.5:1 minimum on every surface.

reduced motion

movement stops when your system asks for less.

read the accessibility notes →

copy it into your project
no package to install and nothing to fork

add a component

pull the source in with the shadcn cli. dependencies resolve automatically.

compose

wire it to your data with plain props. no wrappers and no context.

make it yours

it is your file now. change the markup, tokens and behavior freely.

npx shadcn@latest add https://turnui.xyz/r/prompt-composer.json

interfaces for intelligencestreaming-first components for chat, agents and tool use

every reply streams smoothlymarkdown is split into blocks, so only the live block re-renders