A chat box is the easy part of an agent product. The work is in everything the chat box turns out to need: an answer that streams in, a view of the tool call the agent is about to make, a place for a person to approve it, a way to hand the conversation to someone else. None of that is the agent, and every team builds it again.
Unseen UI is my React component library for those parts, and the first piece of a wider set of tools I am building for agentic AI products. This site is built with it, and it is on npm as an alpha: @stackunseen/ui (opens in a new tab), with live examples at unseenui.com (opens in a new tab). It is my own library, so read what follows as a declared interest.
Why it exists
Most UI kits stop at buttons, forms and tables. Agent interfaces need more, and the extra parts are where things quietly go wrong: a tool call nobody saw, an approval recorded against a different version of the request than the one on screen, model output rendered as if it were trusted. I wanted those parts built once, tested, and shared across my own projects, starting with this one.
Built against this site
Before the first release it was a monorepo of ninety-three components, a gallery and a plain React consumer, all of it tested and none of it published. Two decisions shaped the release. Contracts and state handling went into a core with no framework in it, with the React components on top, so it ships as two packages. And it ships under an alpha tag, with breaking changes expected along the way.
This site was the first real consumer. Within a day it found three gaps that no gallery had shown:
- A button could not render as a link, so every call to action on this site was a hand-styled anchor.
- Compound parts such as
Card.Headercame through as undefined in a Next.js Server Component, because static properties do not cross the client reference boundary. Export compound parts flat as well. - There was no chip, tag or avatar, so filters, labels and bylines were custom CSS.
A gallery shows that components render. Only a consumer shows whether the API is complete, so build the consumer first.
What is in it
The gallery has 93 components: 44 for everyday application interfaces and 49 for AI.
- Conversation. Threads with branches and queued messages, streaming responses, and rich answers with Markdown, math, diagrams and highlighted code.
- Agent work. Tool calls, permission requests and agent handoffs, each in card, banner and compact layouts, plus inspectors for the state your application holds.
- Application. Forms, menus, overlays, tables, a data grid, date controls, a terminal view and application layouts.
- Patterns to start from. An agent workbench, a coding studio, and Relay, a dashboard and assistant template.
The interface shows, the server decides
Every component is controlled. It displays the state your application gives it and reports what the person did through a callback. It never authorizes or executes anything. Your server checks who is asking, ties the decision to the exact version and scope that was on screen, runs the action and reconciles any outcome it is unsure of. Model and tool output is treated as untrusted content throughout.
That is the same split this journal argues for elsewhere: an approve button is not human oversight unless the system behind it enforces the decision, and retrieved content is data, never instructions.
What it gives an agent developer
- Less to build. Streaming, tool calls, approvals and handoffs already exist as components, so the effort goes into the agent and its evaluation.
- Decisions you can audit. Permission requests and handoffs carry versions, scopes and receipts, so a decision is tied to what the person actually saw.
- A core without React. Contracts and state handling live in
@stackunseen/ui-core, which has no framework in it; the React package draws on top. - Your own look.
AIThemesets the appearance and theme tokens, with scoped overrides, and nothing requires Next.js or Tailwind.
If you already use something else
There are good libraries here already, and most of them focus on the conversation:
- assistant-ui (opens in a new tab) is the established choice for a chat thread: composable primitives, streaming, tool call views and inline approvals, with runtimes for the AI SDK, LangGraph and custom backends.
- AI Elements (opens in a new tab) from Vercel is a shadcn/ui registry: the components are copied into your project, built around the AI SDK and styled with Tailwind.
- CopilotKit (opens in a new tab) is aimed at copilots inside an existing application, with hooks for keeping a person in the loop.
Unseen UI is for a different job: one design system for the whole product around an agent, not only the chat panel. The same library draws the settings page, the data grid and the approval card. It ships as a versioned package with its own CSS, so it does not need Tailwind, and it treats each approval or handoff as a decision with a version, a scope and a receipt your server can check. It is also the interface layer of a larger ecosystem rather than a standalone chat kit, and the next pieces are on their way. If a chat panel is all you need, the libraries above are more mature.
Where it fits, and where it does not
It fits React applications that show an agent at work: chat, tool calls, approvals and streaming. It does not fit other frameworks. It is an alpha, so the API still changes between versions.
Getting started
npm install @stackunseen/ui@alpha react@^19.3.0 react-dom@^19.3.0Import the stylesheet once and wrap the interface in AITheme. In Next.js, put interactive parts in a Client Component.
'use client';
import { AITheme, Button } from '@stackunseen/ui';
import '@stackunseen/ui/styles.css';
export function Example() {
return (
<AITheme>
<Button type="button">It works</Button>
</AITheme>
);
}Pin the exact version in your lockfile: the alpha tag moves with every prerelease.
Keeping up
This page is the overview, and it will not change with every release. Versions are listed on npm (opens in a new tab).
Unseen UI is the first part of the ecosystem, not the whole of it. As the next pieces ship, each gets its own post, and this page will link them.
Key takeaways
- The interface around an agent repeats the same hard parts in every product. Take them as components and spend the time on the agent.
- A component should show a decision and report what the person chose. Authorizing and executing it is the server's job.
- It is an alpha. Pin the exact version and check what changed before you upgrade.
- The first real consumer finds gaps no gallery does. Build the consumer first.
About this article
- Format
- Article
- Level
- Practitioner
- Read
- 4 min read
- Published
- Oct 12, 2026
- Disciplines
Considered pieces on one idea.
Discussion