Demos
204 resultsMost Popular
MastraMastra CloudCLI Start Command
Copy-paste command to scaffold the canonical Mastra starter
MastraMastra CloudAgentic Chat
Natural conversation with frontend tool execution
MastraMastra CloudIn-Chat HITL (useHumanInTheLoop — ergonomic API)
Interactive approval/decision surface rendered inline in the chat via the high-level `useHumanInTheLoop` hook
MastraMastra CloudIn-App Human in the Loop (Frontend Tools + async HITL)
Agent requests approval via useFrontendTool with an async handler; the approval UI pops up as an app-level modal OUTSIDE the chat
MastraMastra CloudTool Rendering
Custom per-tool renderers plus a wildcard catch-all for every other tool
MastraMastra CloudTool Rendering (Default Catch-all)
Out-of-the-box tool rendering — backend defines tools; frontend adds zero custom renderers
MastraMastra CloudTool Rendering (Custom Catch-all)
Single branded wildcard renderer via useDefaultRenderTool
MastraMastra CloudAgentic Generative UI
Long-running agent tasks with generated UI
MastraMastra CloudState Streaming
Per-token state delta streaming from agent to UI
MastraMastra CloudReadonly State (Agent Context)
Frontend provides read-only context to the agent via useAgentContext
MastraMastra CloudPre-Built: Sidebar
Docked sidebar chat via <CopilotSidebar />
MastraMastra CloudPre-Built: Popup
Floating popup chat via <CopilotPopup />
MastraMastra CloudChat Customization (Slots)
Customize CopilotChat via its slot system
MastraMastra CloudChat Customization (CSS)
Default CopilotChat re-themed via CopilotKitCSSProperties
MastraMastra CloudHeadless Chat (Simple)
Minimal custom chat surface built on useAgent
MastraMastra CloudFrontend Tools (In-App Actions)
Agent invokes client-side handlers registered with useFrontendTool
MastraMastra CloudFrontend Tools (Async)
useFrontendTool with an async handler — agent awaits a client-side async operation and uses the returned result
MastraMastra CloudAgent Config Object
Forward a typed config object (tone / expertise / response length) from the provider to the agent via useAgentContext
MastraMastra CloudDeclarative Generative UI (A2UI — Dynamic Schema)
Dynamic A2UI surfaces generated by the `generate_a2ui` tool; frontend supplies a typed catalog (Card, Metric, PieChart, BarChart, …)
MastraMastra CloudA2UI Error Recovery
Dynamic A2UI where the toolkit's validate→retry recovery loop is made visible — a malformed first render self-heals into a valid surface; an always-invalid render exhausts the attempt cap and shows a tasteful fallback instead of a broken surface. Backend-owned via getA2UITools.
MastraMastra CloudA2UI Fixed Schema
Frontend-owned component tree; agent streams data into the data model (flight card built from Card > Column > Title/Airport/Arrow/AirlineBadge/PriceTag/Button)
MastraMastra CloudHeadless Chat (Complete)
Full chat-from-scratch on useAgent — custom bubbles, manual generative-UI composition via useRenderToolCall / useRenderActivityMessage / useRenderCustomMessages
MastraMastra CloudAuthentication
Bearer-token gate enforced by the V2 runtime's onRequest hook — unauthenticated requests 401 before reaching the agent
MastraMastra CloudShared State (Read + Write)
Bidirectional shared state — UI writes preferences via agent.setState; backend reads them every turn and writes notes back via the set_notes tool
MastraMastra CloudSub-Agents
Supervisor Mastra Agent delegates to research / writing / critique sub-agents; every delegation appended to a live UI log via shared state
MastraMastra CloudBeautiful Chat (Flagship)
Flagship CopilotKit showcase combining A2UI, Open Generative UI, and MCP Apps in one cell
MastraMastra CloudMultimodal Attachments
Image + PDF uploads forwarded to a vision-capable Mastra agent (gpt-4o)
MastraMastra CloudOpen Generative UI
Agent-authored HTML + CSS streamed into a sandboxed iframe via the runtime's openGenerativeUI flag
MastraMastra CloudOpen Generative UI (Advanced)
Open Generative UI with host-side sandbox functions wired through the iframe bridge
MastraMastra CloudVoice Input
Mic-to-text input via OpenAI Whisper, streamed into the chat composer
MastraMastra CloudTool-Based Generative UI
Agent uses a frontend tool to trigger rich generative UI inline in the chat
MastraMastra CloudHuman in the Loop (Step Selection)
Step-selection HITL surface rendered inline via `useHumanInTheLoop` (the LangGraph-specific `useLangGraphInterrupt` branch is a no-op on Mastra)
MastraMastra CloudIn-Chat HITL (Booking)
Time-picker card rendered inline via useHumanInTheLoop for a booking flow (alias of hitl-in-chat)
MastraMastra CloudMCP Apps
MCP server-driven UI rendered inline via the runtime's mcpApps config and the built-in activity renderer
MastraMastra CloudTool Rendering + Reasoning Chain
Sequential tool calls rendered with per-tool components plus a reasoning chain rendered inline via a custom reasoningMessage slot
MastraMastra CloudReasoning: Default
Built-in CopilotChatReasoningMessage rendering with no slot override — the v1 bridge emits reasoning start/content/end events straight into the default renderer.
MastraMastra CloudReasoning: Custom
Visible reasoning/thinking chain alongside the final answer via a custom reasoningMessage slot.
MastraMastra CloudGen UI Interrupt (Frontend Tool)
In-chat time-picker via useFrontendTool with an async handler that blocks until the user picks a slot — Strategy B adaptation of the LangGraph interrupt primitive
MastraMastra CloudHeadless Interrupt (Frontend Tool)
Time-picker popup rendered outside the chat in the app surface — headless variant of the Strategy B interrupt adaptation
MastraMastra CloudBackground Agents
A long-running deep-research tool dispatched as a Mastra background task, surfaced inline as a live "working" activity card
MastraMastra CloudBrowser Use (Local Browser)
Mastra-only, real-LLM demo — the agent drives a real LOCAL headless browser (Playwright Chromium, no hosted-browser API key) to fetch top Hacker News stories or read a page, and renders the results inline in chat. Non-deterministic, so no aimock replay — requires `npx playwright install chromium` at runtime.
MastraMastra CloudObservational Memory
Mastra Observational Memory compresses and activates conversation context out of band; the background work surfaces inline as activity cards via the runtime's observationalMemory surfacing toggle
CrewAI FlowsCrewAI EnterpriseCLI Start Command
Copy-paste command to clone the canonical starter
CrewAI FlowsCrewAI EnterpriseAgentic Chat
Natural conversation with frontend tool execution
CrewAI FlowsCrewAI EnterprisePre-Built: Sidebar
Docked sidebar chat via <CopilotSidebar />
CrewAI FlowsCrewAI EnterprisePre-Built: Popup
Floating popup chat via <CopilotPopup />
CrewAI FlowsCrewAI EnterpriseChat Customization (Slots)
Customize CopilotChat via its slot system
CrewAI FlowsCrewAI EnterpriseChat Customization (CSS)
Default CopilotChat re-themed via CopilotKitCSSProperties
CrewAI FlowsCrewAI EnterpriseHeadless Chat (Simple)
Minimal custom chat surface built on useAgent
CrewAI FlowsCrewAI EnterpriseHeadless Chat (Complete)
Full chat implementation built from scratch on useAgent
CrewAI FlowsCrewAI EnterpriseReasoning: Default
Built-in CopilotChat reasoning rendering backed by native CrewAI Flow reasoning events
CrewAI FlowsCrewAI EnterpriseReasoning: Custom
Native CrewAI reasoning tokens rendered through a custom reasoning message slot
CrewAI FlowsCrewAI EnterpriseIn-Chat Human in the Loop
User approves agent actions before execution
CrewAI FlowsCrewAI EnterpriseIn-Chat HITL (Booking)
Time-picker card rendered inline via useHumanInTheLoop for a booking flow
CrewAI FlowsCrewAI EnterpriseIn-App Human in the Loop
Agent requests approval via useFrontendTool; the approval UI pops up as an app-level modal OUTSIDE the chat
CrewAI FlowsCrewAI EnterpriseIn-Chat Human in the Loop (original)
Original CrewAI HITL demo — kept for backwards-compat
CrewAI FlowsCrewAI EnterpriseTool Rendering
Custom per-tool renderers plus a wildcard catch-all for every other tool
CrewAI FlowsCrewAI EnterpriseTool Rendering (Default Catch-all)
Out-of-the-box tool rendering — backend defines the tools; the frontend adds zero custom renderers and relies on CopilotKit's built-in default UI
CrewAI FlowsCrewAI EnterpriseTool Rendering (Custom Catch-all)
Single branded wildcard renderer via useDefaultRenderTool — the same app-designed card paints every tool call
CrewAI FlowsCrewAI EnterpriseTool Rendering + Reasoning Chain
Sequential tool calls with reasoning tokens side-by-side
CrewAI FlowsCrewAI EnterpriseAgentic Generative UI
Long-running agent tasks with generated UI
CrewAI FlowsCrewAI EnterpriseTool-Based Generative UI
Agent uses tools to trigger UI generation
CrewAI FlowsCrewAI EnterpriseFrontend Tools (In-App Actions)
Agent invokes client-side handlers registered with useFrontendTool
CrewAI FlowsCrewAI EnterpriseFrontend Tools (Async)
useFrontendTool with an async handler
CrewAI FlowsCrewAI EnterpriseState Streaming
Per-token state delta streaming from agent to UI
CrewAI FlowsCrewAI EnterpriseShared State (Read + Write)
Bidirectional shared state - UI writes preferences, agent writes notes
CrewAI FlowsCrewAI EnterpriseSub-Agents
Supervisor delegates to research / writing / critique CrewAI sub-crews with a live delegation log
CrewAI FlowsCrewAI EnterpriseReadonly State (Agent Context)
Frontend provides read-only context to the agent via useAgentContext
CrewAI FlowsCrewAI EnterpriseFully Open-Ended Generative UI
Agent generates UI from an arbitrary component library
CrewAI FlowsCrewAI EnterpriseOpen-Ended Gen UI (Advanced)
Agent-authored UI that invokes host sandbox functions from inside the iframe
CrewAI FlowsCrewAI EnterpriseAgent Config Object
Forward a typed config object (tone / expertise / response length) from the provider to the agent
CrewAI FlowsCrewAI EnterpriseAuthentication
Runtime-level bearer-token auth via the V2 onRequest hook
CrewAI FlowsCrewAI EnterpriseVoice Input
Speech-to-text transcription via @copilotkit/voice mounted on a per-demo runtime
CrewAI FlowsCrewAI EnterpriseMultimodal Attachments
Image and PDF uploads routed through the AG-UI attachment pipeline
CrewAI FlowsCrewAI EnterpriseDeclarative Generative UI (A2UI - Dynamic Schema)
Branded A2UI components generated by a secondary LLM against a custom catalog
CrewAI FlowsCrewAI EnterpriseA2UI Fixed-Schema
Pre-authored component tree; the agent streams only data into the data model
CrewAI FlowsCrewAI EnterpriseA2UI Error Recovery
CrewAI Flow-owned validate-to-retry recovery that heals a malformed render or shows a graceful exhausted fallback
CrewAI FlowsCrewAI EnterpriseBeautiful Chat
Flagship showcase - polished brand-styled chat with A2UI, Open Generative UI, and shared-state todos
CrewAI FlowsCrewAI EnterpriseMCP Apps
MCP server-driven UI via activity renderers
CrewAI FlowsCrewAI EnterpriseHuman in the Loop: Interrupts
Native CrewAI Flow human feedback rendered inline through useInterrupt
CrewAI FlowsCrewAI EnterpriseHeadless Interrupt
Native CrewAI Flow human feedback rendered in the app surface outside chat
CrewAI Conversational FlowsCrewAI EnterpriseStart with CrewAI Flows
Scaffold a CrewAI Flow, then promote it to conversational mode
CrewAI Conversational FlowsCrewAI EnterpriseAgentic Chat
Natural conversation with frontend tool execution
CrewAI Conversational FlowsCrewAI EnterprisePre-Built: Sidebar
Docked sidebar chat via <CopilotSidebar />
CrewAI Conversational FlowsCrewAI EnterprisePre-Built: Popup
Floating popup chat via <CopilotPopup />
CrewAI Conversational FlowsCrewAI EnterpriseChat Customization (Slots)
Customize CopilotChat via its slot system
CrewAI Conversational FlowsCrewAI EnterpriseChat Customization (CSS)
Default CopilotChat re-themed via CopilotKitCSSProperties
CrewAI Conversational FlowsCrewAI EnterpriseHeadless Chat (Simple)
Minimal custom chat surface built on useAgent
CrewAI Conversational FlowsCrewAI EnterpriseHeadless Chat (Complete)
Full chat implementation built from scratch on useAgent
CrewAI Conversational FlowsCrewAI EnterpriseReasoning: Default
Built-in CopilotChat reasoning rendering backed by native CrewAI Flow reasoning events
CrewAI Conversational FlowsCrewAI EnterpriseReasoning: Custom
Native CrewAI reasoning tokens rendered through a custom reasoning message slot
CrewAI Conversational FlowsCrewAI EnterpriseIn-Chat Human in the Loop
User approves agent actions before execution
CrewAI Conversational FlowsCrewAI EnterpriseIn-Chat HITL (Booking)
Time-picker card rendered inline via useHumanInTheLoop for a booking flow
CrewAI Conversational FlowsCrewAI EnterpriseIn-App Human in the Loop
Agent requests approval via useFrontendTool; the approval UI pops up as an app-level modal OUTSIDE the chat
CrewAI Conversational FlowsCrewAI EnterpriseIn-Chat Human in the Loop (original)
Original CrewAI HITL demo — kept for backwards-compat
CrewAI Conversational FlowsCrewAI EnterpriseTool Rendering
Custom per-tool renderers plus a wildcard catch-all for every other tool
CrewAI Conversational FlowsCrewAI EnterpriseTool Rendering (Default Catch-all)
Out-of-the-box tool rendering — backend defines the tools; the frontend adds zero custom renderers and relies on CopilotKit's built-in default UI
CrewAI Conversational FlowsCrewAI EnterpriseTool Rendering (Custom Catch-all)
Single branded wildcard renderer via useDefaultRenderTool — the same app-designed card paints every tool call
CrewAI Conversational FlowsCrewAI EnterpriseTool Rendering + Reasoning Chain
Sequential tool calls with reasoning tokens side-by-side
CrewAI Conversational FlowsCrewAI EnterpriseAgentic Generative UI
Long-running agent tasks with generated UI
CrewAI Conversational FlowsCrewAI EnterpriseTool-Based Generative UI
Agent uses tools to trigger UI generation
CrewAI Conversational FlowsCrewAI EnterpriseFrontend Tools (In-App Actions)
Agent invokes client-side handlers registered with useFrontendTool
CrewAI Conversational FlowsCrewAI EnterpriseFrontend Tools (Async)
useFrontendTool with an async handler
CrewAI Conversational FlowsCrewAI EnterpriseState Streaming
Per-token state delta streaming from agent to UI
CrewAI Conversational FlowsCrewAI EnterpriseShared State (Read + Write)
Bidirectional shared state - UI writes preferences, agent writes notes
CrewAI Conversational FlowsCrewAI EnterpriseSub-Agents
Supervisor delegates to research / writing / critique CrewAI sub-crews with a live delegation log
CrewAI Conversational FlowsCrewAI EnterpriseReadonly State (Agent Context)
Frontend provides read-only context to the agent via useAgentContext
CrewAI Conversational FlowsCrewAI EnterpriseFully Open-Ended Generative UI
Agent generates UI from an arbitrary component library
CrewAI Conversational FlowsCrewAI EnterpriseOpen-Ended Gen UI (Advanced)
Agent-authored UI that invokes host sandbox functions from inside the iframe
CrewAI Conversational FlowsCrewAI EnterpriseAgent Config Object
Forward a typed config object (tone / expertise / response length) from the provider to the agent
CrewAI Conversational FlowsCrewAI EnterpriseAuthentication
Runtime-level bearer-token auth via the V2 onRequest hook
CrewAI Conversational FlowsCrewAI EnterpriseVoice Input
Speech-to-text transcription via @copilotkit/voice mounted on a per-demo runtime
CrewAI Conversational FlowsCrewAI EnterpriseMultimodal Attachments
Image and PDF uploads routed through the AG-UI attachment pipeline
CrewAI Conversational FlowsCrewAI EnterpriseDeclarative Generative UI (A2UI - Dynamic Schema)
Branded A2UI components generated by a secondary LLM against a custom catalog
CrewAI Conversational FlowsCrewAI EnterpriseA2UI Fixed-Schema
Pre-authored component tree; the agent streams only data into the data model
CrewAI Conversational FlowsCrewAI EnterpriseA2UI Error Recovery
CrewAI Flow-owned validate-to-retry recovery that heals a malformed render or shows a graceful exhausted fallback
CrewAI Conversational FlowsCrewAI EnterpriseBeautiful Chat
Flagship showcase - polished brand-styled chat with A2UI, Open Generative UI, and shared-state todos
CrewAI Conversational FlowsCrewAI EnterpriseMCP Apps
MCP server-driven UI via activity renderers
CrewAI Conversational FlowsCrewAI EnterpriseHuman in the Loop: Interrupts
Native CrewAI Flow human feedback rendered inline through useInterrupt
CrewAI Conversational FlowsCrewAI EnterpriseHeadless Interrupt
Native CrewAI Flow human feedback rendered in the app surface outside chat
Emerging
AWS Strands (Python)AWS Bedrock AgentCoreCLI Start Command
Copy-paste command to clone the canonical starter
AWS Strands (Python)AWS Bedrock AgentCoreAgentic Chat
Natural conversation with frontend tool execution
AWS Strands (Python)AWS Bedrock AgentCoreChat Customization (CSS)
Default CopilotChat re-themed via CopilotKitCSSProperties
AWS Strands (Python)AWS Bedrock AgentCorePre-Built: Sidebar
Docked sidebar chat via <CopilotSidebar />
AWS Strands (Python)AWS Bedrock AgentCorePre-Built: Popup
Floating popup chat via <CopilotPopup />
AWS Strands (Python)AWS Bedrock AgentCoreChat Customization (Slots)
Customize CopilotChat via its slot system
AWS Strands (Python)AWS Bedrock AgentCoreHeadless Chat (Simple)
Minimal custom chat surface built on useAgent
AWS Strands (Python)AWS Bedrock AgentCoreHeadless Chat (Complete)
Full chat implementation built from scratch on useAgent
AWS Strands (Python)AWS Bedrock AgentCoreFrontend Tools (In-App Actions)
Agent invokes client-side handlers registered with useFrontendTool
AWS Strands (Python)AWS Bedrock AgentCoreFrontend Tools (Async)
useFrontendTool with an async handler
AWS Strands (Python)AWS Bedrock AgentCoreIn-Chat HITL (useHumanInTheLoop)
Inline approval/decision surface via the ergonomic useHumanInTheLoop hook
AWS Strands (Python)AWS Bedrock AgentCoreIn-Chat HITL (Booking)
Time-picker card rendered inline via useHumanInTheLoop for a booking flow
AWS Strands (Python)AWS Bedrock AgentCoreIn-App Human in the Loop
Agent requests approval via async useFrontendTool; UI pops as an app-level modal
AWS Strands (Python)AWS Bedrock AgentCoreIn-Chat HITL (Steps)
Agent pauses for user approval via step-based human-in-the-loop
AWS Strands (Python)AWS Bedrock AgentCoreTool Rendering
Custom render for tool calls inline in the chat stream
AWS Strands (Python)AWS Bedrock AgentCoreTool Rendering (Default Catch-all)
Out-of-the-box tool rendering — backend defines the tools; the frontend adds zero custom renderers and relies on CopilotKit's built-in default UI
AWS Strands (Python)AWS Bedrock AgentCoreTool Rendering (Custom Catch-all)
Single branded wildcard renderer via useDefaultRenderTool — the same app-designed card paints every tool call
AWS Strands (Python)AWS Bedrock AgentCoreTool Rendering + Reasoning Chain
Sequential tool calls with reasoning tokens rendered side-by-side
AWS Strands (Python)AWS Bedrock AgentCoreAgentic Generative UI
Long-running agent tasks with generated UI
AWS Strands (Python)AWS Bedrock AgentCoreTool-Based Generative UI
Agent uses tools to trigger UI generation
AWS Strands (Python)AWS Bedrock AgentCoreDeclarative Generative UI (A2UI)
Dynamic A2UI BYOC via a custom catalog
AWS Strands (Python)AWS Bedrock AgentCoreDeclarative Generative UI (A2UI — Fixed Schema)
A2UI rendering against a known client-side schema
AWS Strands (Python)AWS Bedrock AgentCoreA2UI Error Recovery
Makes the A2UI validate->retry recovery loop visible — an invalid first render heals to a valid one, and an always-invalid render shows a graceful recovery-exhausted fallback. The Strands adapter runs the recovery loop on its auto-inject path; reuses the declarative-gen-ui catalog.
AWS Strands (Python)AWS Bedrock AgentCoreShared State (Read + Write)
Bidirectional agent state — UI writes preferences, agent writes notes back
AWS Strands (Python)AWS Bedrock AgentCoreShared State: Read-only
Recipe editor publishes form state via agent.setState; the agent reads the recipe context but does not mutate it (no backend tool — neutral default agent).
AWS Strands (Python)AWS Bedrock AgentCoreSub-Agents
Multiple agents with visible task delegation
AWS Strands (Python)AWS Bedrock AgentCoreState Streaming
Per-token state delta streaming from agent to UI
AWS Strands (Python)AWS Bedrock AgentCoreReadonly State (Agent Context)
Frontend provides read-only context to the agent via useAgentContext
AWS Strands (Python)AWS Bedrock AgentCoreMultimodal Attachments
Image and PDF uploads via CopilotChat attachments
AWS Strands (Python)AWS Bedrock AgentCoreVoice Input
Speech-to-text via @copilotkit/voice with a bundled sample audio button
AWS Strands (Python)AWS Bedrock AgentCoreAuthentication
Bearer-token gate via runtime onRequest hook
AWS Strands (Python)AWS Bedrock AgentCoreAgent Config Object
Forward a typed config object (tone / expertise / response length) from provider to agent
AWS Strands (Python)AWS Bedrock AgentCoreDeclarative UI: Hashbrown
Streaming structured output via @hashbrownai/react, rendering a sales dashboard catalog (MetricCard + PieChart + BarChart)
AWS Strands (Python)AWS Bedrock AgentCoreDeclarative UI: json-render
Streaming hierarchical JSON UI spec rendered via @json-render/react, with a Zod-validated catalog (MetricCard + PieChart + BarChart)
AWS Strands (Python)AWS Bedrock AgentCoreOpen Generative UI (Minimal)
Agent-authored HTML/CSS/SVG in a sandboxed iframe, minimal variant
AWS Strands (Python)AWS Bedrock AgentCoreOpen Generative UI (Advanced)
Sandboxed iframe that invokes host-registered sandbox functions via Websandbox.connection.remote
AWS Strands (Python)AWS Bedrock AgentCoreMCP Apps
MCP server-driven UI via activity renderers
AWS Strands (Python)AWS Bedrock AgentCoreBeautiful Chat
Polished landing-style chat surface with brand theming and suggestion pills
AWS Strands (Python)AWS Bedrock AgentCoreReasoning: Default
Built-in CopilotChatReasoningMessage rendering with no slot override, so the bridge's reasoning start/content/end events land in the default renderer.
AWS Strands (Python)AWS Bedrock AgentCoreReasoning: Custom
Visible reasoning/thinking chain alongside the final answer via a custom reasoningMessage slot.
AWS Strands (Python)AWS Bedrock AgentCoreIn-Chat HITL (useInterrupt — low-level primitive)
Interactive component rendered inline in the chat via the lower-level `useInterrupt` primitive, driven by Strands' native `tool_context.interrupt()` on the backend
AWS Strands (Python)AWS Bedrock AgentCoreHeadless Interrupt (testing)
Resolve interrupts from a plain button grid — no chat, no useInterrupt render prop
AWS Strands (TypeScript)AWS Bedrock AgentCoreCLI Start Command
Copy-paste command to clone the canonical starter
AWS Strands (TypeScript)AWS Bedrock AgentCoreAgentic Chat
Natural conversation with frontend tool execution
AWS Strands (TypeScript)AWS Bedrock AgentCoreChat Customization (CSS)
Default CopilotChat re-themed via CopilotKitCSSProperties
AWS Strands (TypeScript)AWS Bedrock AgentCorePre-Built: Sidebar
Docked sidebar chat via <CopilotSidebar />
AWS Strands (TypeScript)AWS Bedrock AgentCorePre-Built: Popup
Floating popup chat via <CopilotPopup />
AWS Strands (TypeScript)AWS Bedrock AgentCoreChat Customization (Slots)
Customize CopilotChat via its slot system
AWS Strands (TypeScript)AWS Bedrock AgentCoreHeadless Chat (Simple)
Minimal custom chat surface built on useAgent
AWS Strands (TypeScript)AWS Bedrock AgentCoreHeadless Chat (Complete)
Full chat implementation built from scratch on useAgent
AWS Strands (TypeScript)AWS Bedrock AgentCoreFrontend Tools (In-App Actions)
Agent invokes client-side handlers registered with useFrontendTool
AWS Strands (TypeScript)AWS Bedrock AgentCoreFrontend Tools (Async)
useFrontendTool with an async handler
AWS Strands (TypeScript)AWS Bedrock AgentCoreIn-Chat HITL (useHumanInTheLoop)
Inline approval/decision surface via the ergonomic useHumanInTheLoop hook
AWS Strands (TypeScript)AWS Bedrock AgentCoreIn-Chat HITL (Booking)
Time-picker card rendered inline via useHumanInTheLoop for a booking flow
AWS Strands (TypeScript)AWS Bedrock AgentCoreIn-App Human in the Loop
Agent requests approval via async useFrontendTool; UI pops as an app-level modal
AWS Strands (TypeScript)AWS Bedrock AgentCoreIn-Chat HITL (Steps)
Agent pauses for user approval via step-based human-in-the-loop
AWS Strands (TypeScript)AWS Bedrock AgentCoreTool Rendering
Custom render for tool calls inline in the chat stream
AWS Strands (TypeScript)AWS Bedrock AgentCoreTool Rendering (Default Catch-all)
Out-of-the-box tool rendering — backend defines the tools; the frontend adds zero custom renderers and relies on CopilotKit's built-in default UI
AWS Strands (TypeScript)AWS Bedrock AgentCoreTool Rendering (Custom Catch-all)
Single branded wildcard renderer via useDefaultRenderTool — the same app-designed card paints every tool call
AWS Strands (TypeScript)AWS Bedrock AgentCoreTool Rendering + Reasoning Chain
Sequential tool calls with reasoning tokens rendered side-by-side
AWS Strands (TypeScript)AWS Bedrock AgentCoreAgentic Generative UI
Long-running agent tasks with generated UI
AWS Strands (TypeScript)AWS Bedrock AgentCoreTool-Based Generative UI
Agent uses tools to trigger UI generation
AWS Strands (TypeScript)AWS Bedrock AgentCoreDeclarative Generative UI (A2UI)
Dynamic A2UI BYOC via a custom catalog
AWS Strands (TypeScript)AWS Bedrock AgentCoreDeclarative Generative UI (A2UI — Fixed Schema)
A2UI rendering against a known client-side schema
AWS Strands (TypeScript)AWS Bedrock AgentCoreA2UI Error Recovery
Makes the A2UI validate->retry recovery loop visible — an invalid first render heals to a valid one, and an always-invalid render shows a graceful recovery-exhausted fallback. The Strands adapter runs the recovery loop on its auto-inject path; reuses the declarative-gen-ui catalog.
AWS Strands (TypeScript)AWS Bedrock AgentCoreShared State (Read + Write)
Bidirectional agent state — UI writes preferences, agent writes notes back
AWS Strands (TypeScript)AWS Bedrock AgentCoreShared State: Read-only
Recipe editor publishes form state via agent.setState; the agent reads the recipe context but does not mutate it (no backend tool — neutral default agent).
AWS Strands (TypeScript)AWS Bedrock AgentCoreSub-Agents
Multiple agents with visible task delegation
AWS Strands (TypeScript)AWS Bedrock AgentCoreState Streaming
Per-token state delta streaming from agent to UI
AWS Strands (TypeScript)AWS Bedrock AgentCoreReadonly State (Agent Context)
Frontend provides read-only context to the agent via useAgentContext
AWS Strands (TypeScript)AWS Bedrock AgentCoreMultimodal Attachments
Image and PDF uploads via CopilotChat attachments
AWS Strands (TypeScript)AWS Bedrock AgentCoreVoice Input
Speech-to-text via @copilotkit/voice with a bundled sample audio button
AWS Strands (TypeScript)AWS Bedrock AgentCoreAuthentication
Bearer-token gate via runtime onRequest hook
AWS Strands (TypeScript)AWS Bedrock AgentCoreAgent Config Object
Forward a typed config object (tone / expertise / response length) from provider to agent
AWS Strands (TypeScript)AWS Bedrock AgentCoreDeclarative UI: Hashbrown
Streaming structured output via @hashbrownai/react, rendering a sales dashboard catalog (MetricCard + PieChart + BarChart)
AWS Strands (TypeScript)AWS Bedrock AgentCoreDeclarative UI: json-render
Streaming hierarchical JSON UI spec rendered via @json-render/react, with a Zod-validated catalog (MetricCard + PieChart + BarChart)
AWS Strands (TypeScript)AWS Bedrock AgentCoreOpen Generative UI (Minimal)
Agent-authored HTML/CSS/SVG in a sandboxed iframe, minimal variant
AWS Strands (TypeScript)AWS Bedrock AgentCoreOpen Generative UI (Advanced)
Sandboxed iframe that invokes host-registered sandbox functions via Websandbox.connection.remote
AWS Strands (TypeScript)AWS Bedrock AgentCoreMCP Apps
MCP server-driven UI via activity renderers
AWS Strands (TypeScript)AWS Bedrock AgentCoreBeautiful Chat
Polished landing-style chat surface with brand theming and suggestion pills
AWS Strands (TypeScript)AWS Bedrock AgentCoreReasoning: Default
Built-in CopilotChatReasoningMessage rendering with no slot override, so the bridge's reasoning start/content/end events land in the default renderer.
AWS Strands (TypeScript)AWS Bedrock AgentCoreReasoning: Custom
Visible reasoning/thinking chain alongside the final answer via a custom reasoningMessage slot.
AWS Strands (TypeScript)AWS Bedrock AgentCoreIn-Chat HITL (useInterrupt — low-level primitive)
Interactive component rendered inline in the chat via the lower-level `useInterrupt` primitive, driven by Strands' native `tool_context.interrupt()` on the backend
AWS Strands (TypeScript)AWS Bedrock AgentCoreHeadless Interrupt (testing)
Resolve interrupts from a plain button grid — no chat, no useInterrupt render prop