# AI workspace app UI for React Agents at work: tasks, runs, answers with sources, models and their tools. 15 live React screens in [Beamline](https://beamline.io/), in working order, each in nine looks. ## Screens 1. [AI agent workspace](https://beamline.io/components/agent-workspace.md): Threads, a conversation that opens on the thread's earlier turns (each with its trace, the tools the agent called, a cited answer and any table it… 2. [Agent runs monitor](https://beamline.io/components/agent-runs.md): Every run of your agents in one place: success rate, run time, tokens and spend; the last runs as a strip of status blocks; a live table where running… 3. [Agent monitor](https://beamline.io/components/agent-monitor.md): Agents in production and on test. Monitor shows every agent or one over 24 hours, 7 or 14 days: runs, tokens, estimated cost and average run time counted… 4. [Conversation history](https://beamline.io/components/conversation-history.md): Past conversations with an assistant, ready to pick up again: the list by day with bookmarks and unsent drafts, a search through every message that… 5. [Knowledge base manager](https://beamline.io/components/knowledge-base.md): What your assistant knows and whether it is fresh: sources with live sync status (syncing with progress, out of date, failed with the reason and Retry)… 6. [Reading library](https://beamline.io/components/reading-library.md): A read-it-later library: saved views that are live filters (a query with every unreadable part named, the number that matches now, saved with a name; a… 7. [Artifact workbench](https://beamline.io/components/artifact-workbench.md): Where the things an assistant makes are checked before they leave: every document, piece of code, small app and data result from a conversation, each… 8. [AI image studio](https://beamline.io/components/image-studio.md): Write a prompt, pick a shape, a style and how many, and watch the variations generate side by side; each one opens full screen and can be upscaled or… 9. [Voice agent](https://beamline.io/components/voice-agent.md): A voice agent in three layouts on one session: a workspace with the agent's orb large on a stage (the line being said shows under it, questions to ask… 10. [Model playground](https://beamline.io/components/model-playground.md): Try one prompt on up to three models side by side: pick each model with its price and speed in view, set the system prompt, temperature and length once… 11. [Model inspector](https://beamline.io/components/model-inspector.md): A design model's objects without needing the 3D view: the model tree, where objects with the same name are told apart by id and path; the selected… 12. [Model issues](https://beamline.io/components/model-issues.md): Issues pinned to the objects of a design model. The queue says the scope beside every count (open in the project, on the loaded models, on this version)… 13. [Agent builder](https://beamline.io/components/agent-builder.md): An agent's configuration beside an assistant that proposes tools. Ask for what the agent should do and the assistant's proposal lists each tool with why… 14. [Workflow composer](https://beamline.io/components/workflow-composer.md): A workflow drafted from a sentence and finished by hand. The prompt drafts steps that arrive one by one on the graph (a draft cut short keeps what came… 15. [Data binding](https://beamline.io/components/data-binding.md): Bind an object's properties to a view model. Each property says whether it is bound, incomplete or mismatched. A binding takes its source from the… ## The parts they're built from - [Label](https://beamline.io/components/label.md) (free): in 15 of these screens - [Spinner](https://beamline.io/components/spinner.md) (free): in 15 of these screens - [Tooltip](https://beamline.io/components/tooltip.md) (free): in 15 of these screens - [Button](https://beamline.io/components/button.md) (free): in 14 of these screens - [Select](https://beamline.io/components/select.md) (free): in 14 of these screens - [Text morph](https://beamline.io/components/text-morph.md) (free): in 12 of these screens - [Empty state](https://beamline.io/components/empty-state.md) (free): in 10 of these screens - [Segmented control](https://beamline.io/components/segmented-control.md) (free): in 10 of these screens - [Dropdown menu](https://beamline.io/components/dropdown-menu.md) (free): in 9 of these screens - [Glow](https://beamline.io/components/glow.md) (free): in 9 of these screens - [Kbd](https://beamline.io/components/kbd.md) (free): in 9 of these screens - [Skeleton](https://beamline.io/components/skeleton.md) (free): in 9 of these screens - [Chip group](https://beamline.io/components/chip-group.md) (free): in 8 of these screens - [Avatar](https://beamline.io/components/avatar.md) (free): in 7 of these screens - [Bottom sheet](https://beamline.io/components/bottom-sheet.md) (free): in 7 of these screens - [Checkbox](https://beamline.io/components/checkbox.md) (free): in 7 of these screens - [Input](https://beamline.io/components/input.md) (free): in 7 of these screens - [Popover](https://beamline.io/components/popover.md) (free): in 7 of these screens - [Search field](https://beamline.io/components/search-field.md) (free): in 7 of these screens - [Slot text](https://beamline.io/components/slot-text.md) (free): in 7 of these screens - [Textarea](https://beamline.io/components/textarea.md) (free): in 7 of these screens - [Badge](https://beamline.io/components/badge.md) (free): in 6 of these screens - [Response](https://beamline.io/components/response.md): in 6 of these screens - [Switch](https://beamline.io/components/switch.md) (free): in 6 of these screens - [Sheet](https://beamline.io/components/sheet.md) (free): in 5 of these screens - [Text shimmer](https://beamline.io/components/text-shimmer.md) (free): in 5 of these screens - [Model picker](https://beamline.io/components/model-picker.md): in 4 of these screens - [Alert](https://beamline.io/components/alert.md) (free): in 3 of these screens - [Attachment](https://beamline.io/components/attachment.md): in 3 of these screens - [Copy button](https://beamline.io/components/copy-button.md) (free): in 3 of these screens Install the parts you need in your React app as compiled packages or editable source. [Get Beamline](https://beamline.io/checkout?pack=complete) · [Connect your agent](https://beamline.io/connect) Next: [Trading](https://beamline.io/components/apps/trading.md) · [All apps](https://beamline.io/components/apps.md) Part of [Beamline UI: polished, editable React components and complete screens for custom applications](https://beamline.io/). [Build your own style from any look; tokens, fonts, radii, motion; not only colours](https://beamline.io/docs/customize).