Introduction

How it works

You don't install a package. The CLI copies each component's source into your project, so you can read it, change it and own it. Updates are opt-in: re-run the add command and review the diff.

Why another system

General-purpose libraries give you buttons and dialogs. Agent products need more: a composer that knows when the model is streaming, a way to show reasoning without drowning the answer, tool calls users can inspect, a gate before the agent does something irreversible, and a voice mode that shows it's listening. JDS starts there, with the primitives underneath.

Principles

Agent state is always visible. Thinking, running a tool, waiting for approval, listening: each state has a component, so users never wonder if the agent is stuck.

Neutral by default. No brand color. Activity reads through motion and contrast, so JDS fits your product instead of competing with it.

Motion carries meaning. Springs are tuned per role: snappy for controls, gentle for content, soft for ambient voice. See Motion.

AI SDK compatible, not coupled. Status and tool states use the same strings as the AI SDK, so parts drop straight in. Nothing imports it.

Primitives, components and recipes

Primitives are Base UI building blocks with the JDS look: button, menu, dialog. Components are the agent and voice pieces built on them. Recipes are complete experiences, like a voice agent or a side panel, that install with one command and take the styles you set in the Studio.

Built for humans and agents

Every component is small, flat and commented where the intent isn't obvious, so a coding agent can read and change it as easily as you can. Each page's source is plain TSX.