# —kit

> AI interface states (listening, thinking, tool calls) built as instruments: the chrome reports what the agent is actually doing. A shadcn registry of React components in a HUD aesthetic, zero runtime dependencies beyond React, Tailwind v4.

Truth rule: every readout is bound to real data. If a value is not passed, its readout does not render.
Install any item with: npx shadcn@latest add <registry URL>. Then import styles/hud.css in your global CSS.

## Components

- [Listening](https://kit.ulasalyesil.com/docs/listening): Turns any child into a level meter. The ticks, the peak and the dB are the microphone, measured. Registry: https://kit.ulasalyesil.com/r/listening.json
- [Thinking](https://kit.ulasalyesil.com/docs/thinking): The agent's working state as a log. Steps come from the agent's events, durations from the clock. Registry: https://kit.ulasalyesil.com/r/thinking.json
- [Tool call](https://kit.ulasalyesil.com/docs/tool-call): A bracketed card while a tool is running, a single log row once it is done. Registry: https://kit.ulasalyesil.com/r/tool-call.json
- [AI SDK adapter](https://kit.ulasalyesil.com/docs/ai-sdk): useKitTurn maps useChat messages onto Thinking and Tool call. It imports nothing from the SDK. Registry: https://kit.ulasalyesil.com/r/ai-sdk.json
- [HUD utilities](https://kit.ulasalyesil.com/docs): cx, the shared frame loop, reduced-motion helpers, formatters. Registry: https://kit.ulasalyesil.com/r/hud-utils.json
- [useMicrophone](https://kit.ulasalyesil.com/docs/listening): Microphone access plus a frame-rate level meter that never touches React state. Registry: https://kit.ulasalyesil.com/r/use-microphone.json

## Primitives and tokens

- [HUD tokens](https://kit.ulasalyesil.com/docs): The --hud-* tokens, light and dark, and the Tailwind v4 mapping. Registry: https://kit.ulasalyesil.com/r/hud.json
- [Marks](https://kit.ulasalyesil.com/docs/primitives#marks): Corner brackets, frame or select, optional edge ticks. Registry: https://kit.ulasalyesil.com/r/marks.json
- [Caption](https://kit.ulasalyesil.com/docs/primitives#caption): A float label pinned to a selection. A fact, never prose. Registry: https://kit.ulasalyesil.com/r/caption.json
- [Readout](https://kit.ulasalyesil.com/docs/primitives#readout): LABEL [value] pairs. A missing value drops its row. Registry: https://kit.ulasalyesil.com/r/readout.json
- [Block label](https://kit.ulasalyesil.com/docs/primitives#block-label): Console heading with a dashed rule. Registry: https://kit.ulasalyesil.com/r/block-label.json
- [Cursor](https://kit.ulasalyesil.com/docs/primitives#cursor): Blinking block caret. Static under reduced motion. Registry: https://kit.ulasalyesil.com/r/cursor.json
- [Rolling](https://kit.ulasalyesil.com/docs/primitives#rolling): A settled value rolling in. Screen readers get the true value. Registry: https://kit.ulasalyesil.com/r/rolling.json
- [Elapsed](https://kit.ulasalyesil.com/docs/primitives#elapsed): Live elapsed time from the frame loop, zero React renders. Registry: https://kit.ulasalyesil.com/r/elapsed.json
- [—kit](https://kit.ulasalyesil.com/): Listening, Thinking and Tool call with everything they depend on. Registry: https://kit.ulasalyesil.com/r/kit.json

## Docs

- [Getting started](https://kit.ulasalyesil.com/docs): install, tokens, theming, the truth rule
- [Primitives](https://kit.ulasalyesil.com/docs/primitives)
- [AI SDK adapter](https://kit.ulasalyesil.com/docs/ai-sdk): state map and timing caveats