REACT COMPONENT LIBRARY · OPEN-SOURCE

The UI your agent already needs.

102 React components for AI agent surfaces and cloud dashboards — the ones you would otherwise build from scratch.

Editorial typography. Three runtime-swappable themes. shadcn-compatible registry. Apache-2.0.

102Components (81 primitives + 21 composites)
453Tests passing
126Stories in Ladle
0Accessibility violations
ESM-onlyModule format
Apache-2.0License

$ pnpm add @theokit/ui

Install library Browse 102 component docs

Other libraries ship Button and Card. We shipped AgentEvent, ToolCall, DeploymentRow, BuildLogStream, and 98 others. Generic primitives optimize for marketing pages. @theokit/ui is built for the surfaces agents and dashboards actually need to render.

What you get

Concretely, what ships.

102 components, agent-shaped

81 primitives (AgentEvent, ChatMessage, ToolCall, MCPServerCard, MemoryEditor, …) and 21 composites (AgentComposer, DeploymentRow, EnvVarEditor, RollbackUI, CommandPalette, …).

Three themes, runtime-swappable

Violet Forge (dark, AI workspace), Classic Paper (warm light), Aurora Terminal (high-contrast dev). Swap live via ThemeProvider.

Copy-paste OR install

`npx shadcn add` to copy a single component, or `pnpm add @theokit/ui` for the whole package. Same registry powers both paths.

Framework-agnostic

React peer-deps only. Drop into Vite, Next 14+, Remix, Astro, Tanstack Start.

453 tests. 126 stories. Zero a11y violations.

axe-core asserts every story. Bundle size enforced ±5%. Taxonomy enforced. Every PR runs the gates.

Feel it

tsx

import { ThemeProvider, AgentEvent, ToolCall, DeploymentRow } from "@theokit/ui";
import "@theokit/ui/tokens.css";
import "@theokit/ui/styles.css";

export default function App() {
  return (
    <ThemeProvider defaultTheme="violet-forge" defaultMode="dark">
      <AgentEvent
        event={{
          id: "e1",
          type: "file_read",
          label: "Reading repository structure",
          status: "running",
        }}
      />
      <ToolCall name="bash" summary="Ran 2 commands" />
      <DeploymentRow
        deployment={{
          id: "d1",
          status: "live",
          environment: "production",
          branch: "main",
          commitSha: "a1b2c3d",
          commitMessage: "Ship search index",
          timeAgo: "2 min ago",
        }}
      />
    </ThemeProvider>
  );
}

Three components. Three primitives nobody else ships. Themed by default.

What you'd ship

Things you would actually build.

01Coding assistant interface. Chat thread, streaming assistant, tool-call timeline, file diff viewer.
02Agent dashboard. Run stats, session timeline, MCP server admin, cron job scheduler, memory editor.
03cloud dashboard. Project switcher, deployment row, build log stream, env var editor.
04Internal AI tools. Quick-action chips, intent selector, system-prompt editor, skill manager.
05Onboarding & auth surfaces. Login split, social auth row, folder selector.

Why TheoUI

How it compares.

The agent UI gap is real. Most teams reach for shadcn for the primitives and then build the agent-specific parts from scratch — losing weeks before shipping a real surface.

Capability	@theokit/ui	shadcn / Radix	Tremor	Build it yourself
Frame	The UI your agent already needs	"Copy-paste components"	"Dashboard primitives"	(you)
Generic primitives	Yes (same Radix foundation)	Yes	Limited	Slow
Agent-specific primitives	Yes — 81 of them	None	None	Weeks
cloud-specific composites	Yes — 21 of them	None	None	Weeks
Three runtime-swappable themes	Built-in	DIY	DIY	DIY
a11y as quality gate	Yes — vitest-axe on 126 stories	Per-component manual	Manual	Often skipped

Same Radix UI underneath as shadcn — no philosophy fight. We just shipped the next 102 components you were about to write — real components for real agent surfaces, not yet another button library.

Why now

Agent surfaces emerged as a UI category in 2026. The components nobody had a name for last year — ToolCall, AgentEvent, MCPServerCard — are now the building blocks of every agent product.

Status

Honest claims only.

Production. 102 components, 453 tests passing, zero a11y violations on 126 Ladle stories, bundle size enforced.
Registry distribution. Artifacts shipped at registry/r/*.json; canonical ui.usetheo.dev/r/*.json planned.
ESM-only. Modern bundlers only.