P
syeddhasnainn
/
pastaui
/
components
Files
Code
Info
Agent Activity
agent-activity
A chronological stream for reasoning, searches, terminal work, and tool execution.
Agent Status
agent-status
A compact task summary with the current activity and an optional task tray.
Approval Card
approval-card
A human-in-the-loop decision surface for questions, review steps, and consequential actions.
Attachments
attachments
File and image attachments with progress, failure recovery, metadata, and removal actions.
Audio Player
audio-player
A controlled playback surface for speech, generated audio, and recorded tool output.
Background Inbox
background-inbox
Work still running elsewhere and completed results waiting to be collected.
Background Runs
background-runs
Ongoing and completed agent jobs collected in one actionable inbox.
Citations
citations
A compact source summary that expands into grounded references with useful context.
Code Block
code-block
A muted code surface with line numbers, focused rows, filename metadata, and copy feedback.
Color Picker
color-picker
A Tailwind palette picker with search, hex and opacity inputs, and optional linear, radial, and conic gradients with draggable stops.
Commit
commit
An expandable changed-file summary with folder groups, line counts, and a diff action.
Connection State
connection-state
Clear connected, reconnecting, resumed, and offline states for resumable agent streams.
Context Breakdown
context-breakdown
Where an agent context window went, with token attribution and remaining capacity.
Cost Meter
cost-meter
Run cost split by model or task and compared against an optional session budget.
Data Table
data-table
A virtualized, sortable table with resizable columns, a sticky header, and left or right pinned columns for scanning dozens of fields at once.
Document Reference
document-reference
A source card that preserves document identity, location, metadata, and the cited excerpt.
Edit Message
edit-message
An in-place message editor with cancel and save actions.
Email Composer
email-composer
A minimal email draft with inline fields, a spacious message, and copy, expand, and send actions.
Environment Variables
environment-variables
A secret-aware configuration surface with masked values and explicit reveal or copy actions.
Feedback Dialog
feedback-dialog
A low-friction reason and note form for turning negative feedback into signal.
File Diff
file-diff
A compact code-change surface with old and new line numbers plus live change counts.
File Tree
file-tree
A compact repository tree with selection, nesting, expansion, and change status.
Follow Up
follow-up
Compact follow-up prompts that continue the conversation with one click.
Follow-up Suggestions
follow-up-suggestions
Contextual next-step prompts that invite a useful continuation after an answer.
Image Generation Loader
image-generation-loader
A streaming image surface with live progress, a playable Snake diversion, and an in-place completed result.
Inline Citation
inline-citation
A numbered reference inside prose with an inspectable source preview.
Job Progress
job-progress
A weighted multi-stage progress surface for work measured in minutes rather than seconds.
Link Preview
link-preview
A horizontal link preview with an image, seller details, and optional product pricing and ratings.
Memory
memory
Visible, removable facts an agent retains about the user or ongoing work.
Message Bubble
message-bubble
A focused conversational surface with distinct user, assistant, and system treatments.
Message Queue
message-queue
Pending user turns that remain visible, removable, and immediately sendable while an agent is busy.
Message Scroller
message-scroller
A compact conversation minimap that navigates user turns while keeping the full thread visible.
Model Picker
model-picker
A compact model menu with descriptions, plan badges, effort controls, and additional models.
Permission Grant
permission-grant
A capability-level consent surface that explains reach and duration before access is granted.
Plan Approval Card
plan-approval-card
A proposed plan with clear steps and controls to edit, cancel, or start the work.
Prompt Input
prompt-input
An auto-growing agent composer with attachment, model, submit, and stop controls.
Quota Banner
quota-banner
Usage remaining, reset timing, and an upgrade path without hiding the limit.
Reasoning Effort
reasoning-effort
A compact dropdown for choosing how much reasoning power a response should use.
Reasoning Text
reasoning-text
A timed reasoning stream that follows the latest thought, then folds into an inspectable duration summary.
Research Report
research-report
A structured, citation-ready report for research agents and deep-search results.
Retrieval Chunks
retrieval-chunks
Ranked source passages that make retrieval-augmented answers inspectable.
Schedule Card
schedule-card
A recurring agent job with human-readable timing, next run, and pause controls.
Search Results Tabs
search-results-tabs
Ranked search results with site icons, titles, source URLs, and plain text category tabs.
Task Card
task-card
One delegated task with state, timing, assigned agent, and returned result.
Thinking Shimmer
thinking-shimmer
A quiet live status that keeps the agent current action readable while work continues.
Todo List
todo-list
A live agent plan with completion counts, task states, and expandable detail.
Tool Approval
tool-approval
A permission gate that shows scope and command detail before an agent tool runs.
Tool Error
tool-error
A recoverable connection failure with a clear explanation and compact recovery actions.
Tool Group
tool-group
Consecutive tool calls collapsed into one readable execution group.
Tool Result
tool-result
An execution disclosure for running, successful, or failed tools with optional raw output.
Tool Timeline
tool-timeline
A compact narrative of the verbs, targets, state, and timing in an agent run.
Video Player
video-player
A compact video result with controllable playback, seek position, and metadata.
Voice Input
voice-input
A tactile recording control with a recessed waveform, red playhead, and pause control.
Select a component to view its code
Click on any item in the sidebar to get started
Select a component to view its information
Agent Activity
agent-activity
A chronological stream for reasoning, searches, terminal work, and tool execution.
Agent Status
agent-status
A compact task summary with the current activity and an optional task tray.
Approval Card
approval-card
A human-in-the-loop decision surface for questions, review steps, and consequential actions.
Attachments
attachments
File and image attachments with progress, failure recovery, metadata, and removal actions.
Audio Player
audio-player
A controlled playback surface for speech, generated audio, and recorded tool output.
Background Inbox
background-inbox
Work still running elsewhere and completed results waiting to be collected.
Background Runs
background-runs
Ongoing and completed agent jobs collected in one actionable inbox.
Citations
citations
A compact source summary that expands into grounded references with useful context.
Code Block
code-block
A muted code surface with line numbers, focused rows, filename metadata, and copy feedback.
Color Picker
color-picker
A Tailwind palette picker with search, hex and opacity inputs, and optional linear, radial, and conic gradients with draggable stops.
Commit
commit
An expandable changed-file summary with folder groups, line counts, and a diff action.
Connection State
connection-state
Clear connected, reconnecting, resumed, and offline states for resumable agent streams.
Context Breakdown
context-breakdown
Where an agent context window went, with token attribution and remaining capacity.
Cost Meter
cost-meter
Run cost split by model or task and compared against an optional session budget.
Data Table
data-table
A virtualized, sortable table with resizable columns, a sticky header, and left or right pinned columns for scanning dozens of fields at once.
Document Reference
document-reference
A source card that preserves document identity, location, metadata, and the cited excerpt.
Edit Message
edit-message
An in-place message editor with cancel and save actions.
Email Composer
email-composer
A minimal email draft with inline fields, a spacious message, and copy, expand, and send actions.
Environment Variables
environment-variables
A secret-aware configuration surface with masked values and explicit reveal or copy actions.
Feedback Dialog
feedback-dialog
A low-friction reason and note form for turning negative feedback into signal.
File Diff
file-diff
A compact code-change surface with old and new line numbers plus live change counts.
File Tree
file-tree
A compact repository tree with selection, nesting, expansion, and change status.
Follow Up
follow-up
Compact follow-up prompts that continue the conversation with one click.
Follow-up Suggestions
follow-up-suggestions
Contextual next-step prompts that invite a useful continuation after an answer.
Image Generation Loader
image-generation-loader
A streaming image surface with live progress, a playable Snake diversion, and an in-place completed result.
Inline Citation
inline-citation
A numbered reference inside prose with an inspectable source preview.
Job Progress
job-progress
A weighted multi-stage progress surface for work measured in minutes rather than seconds.
Link Preview
link-preview
A horizontal link preview with an image, seller details, and optional product pricing and ratings.
Memory
memory
Visible, removable facts an agent retains about the user or ongoing work.
Message Bubble
message-bubble
A focused conversational surface with distinct user, assistant, and system treatments.
Message Queue
message-queue
Pending user turns that remain visible, removable, and immediately sendable while an agent is busy.
Message Scroller
message-scroller
A compact conversation minimap that navigates user turns while keeping the full thread visible.
Model Picker
model-picker
A compact model menu with descriptions, plan badges, effort controls, and additional models.
Permission Grant
permission-grant
A capability-level consent surface that explains reach and duration before access is granted.
Plan Approval Card
plan-approval-card
A proposed plan with clear steps and controls to edit, cancel, or start the work.
Prompt Input
prompt-input
An auto-growing agent composer with attachment, model, submit, and stop controls.
Quota Banner
quota-banner
Usage remaining, reset timing, and an upgrade path without hiding the limit.
Reasoning Effort
reasoning-effort
A compact dropdown for choosing how much reasoning power a response should use.
Reasoning Text
reasoning-text
A timed reasoning stream that follows the latest thought, then folds into an inspectable duration summary.
Research Report
research-report
A structured, citation-ready report for research agents and deep-search results.
Retrieval Chunks
retrieval-chunks
Ranked source passages that make retrieval-augmented answers inspectable.
Schedule Card
schedule-card
A recurring agent job with human-readable timing, next run, and pause controls.
Search Results Tabs
search-results-tabs
Ranked search results with site icons, titles, source URLs, and plain text category tabs.
Task Card
task-card
One delegated task with state, timing, assigned agent, and returned result.
Thinking Shimmer
thinking-shimmer
A quiet live status that keeps the agent current action readable while work continues.
Todo List
todo-list
A live agent plan with completion counts, task states, and expandable detail.
Tool Approval
tool-approval
A permission gate that shows scope and command detail before an agent tool runs.
Tool Error
tool-error
A recoverable connection failure with a clear explanation and compact recovery actions.
Tool Group
tool-group
Consecutive tool calls collapsed into one readable execution group.
Tool Result
tool-result
An execution disclosure for running, successful, or failed tools with optional raw output.
Tool Timeline
tool-timeline
A compact narrative of the verbs, targets, state, and timing in an agent run.
Video Player
video-player
A compact video result with controllable playback, seek position, and metadata.
Voice Input
voice-input
A tactile recording control with a recessed waveform, red playhead, and pause control.
Select a component to view its code
Click on any item in the sidebar to get started
Select a component to view its information