Renames the ADK byoc-hashbrown demo to declarative-hashbrown to match the
LP naming, and ports the LP declarative-hashbrown frontend (page + chat +
hashbrown renderer + charts + suggestions + types + metric card) verbatim.
Also renames the dedicated API route from copilotkit-byoc-hashbrown to
copilotkit-declarative-hashbrown, keeping the existing HttpAgent + AGENT_URL
pattern (URL now points at /declarative-hashbrown on the Python backend).
The runtime-side agent ID remains "declarative-hashbrown-demo" (matching
LP); the backend registry / agentNames rename (byoc_hashbrown -> declarative-
hashbrown), the manifest slug rename, and main route.ts agentNames update
are out of scope per the task and are reported separately.
Copies the hitl-in-app demo verbatim from langgraph-python (north-star):
page.tsx, approval-dialog.tsx, suggestions.ts, tickets-panel.tsx. Updates
the ADK agent instruction to match the LP support-operations prompt and
the {approved, reason} tool-return shape.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Copy page.tsx and time-picker-card.tsx verbatim from the langgraph-python
north-star demo. Delete README.md (not present upstream). Frontend now uses
agent="hitl-in-chat" / agentId="hitl-in-chat" exactly as LP — registry and
route.ts currently key on "hitl_in_chat", which will need a follow-up
rename to wire end-to-end.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Replace the inline-styled brand-palette version with a 1:1 verbatim copy of
the langgraph-python north-star demo: ShadCN-flavoured Card/Badge/Button
primitives under _components/, neutral zinc chart palette, and the
chat.tsx + suggestions.ts split out of page.tsx.
The ADK agent already emits the same a2ui_operations container shape
(via build_a2ui_operations_from_tool_call in agents/main.py) so no
backend changes are needed; the frontend swap is sufficient.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Copy LP gen-ui-agent demo verbatim: page.tsx now uses InlineAgentStateCard
in messageView.children (subscribing to live state via useAgent v2 +
UseAgentUpdate.OnStateChanged), plus the supporting
InlineAgentStateCard.tsx, message-list-with-state.tsx, suggestions.ts, and
README.md.
Update the ADK gen_ui_agent to emit the same Step shape the LP frontend
reads — {id, title, status} with the three-state lifecycle pending ->
in_progress -> completed, driven by a six-call sequence so the card
animates through every step. Without this, the card would render empty
titles and never show the in_progress marker.
Delete the orphan agent.py stub from the demo dir — the real backend
agent lives in src/agents/gen_ui_agent.py and is wired through the
shared registry.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Verbatim copy of the langgraph-python tool-rendering demo frontend to
google-adk: page.tsx + weather-card + flight-list-card + stock-card +
d20-card + custom-catchall-renderer + suggestions + README. Also adds
the _shared/parse-json-result helper required by page.tsx. Removes the
stale agent.py stub and render-flight-tool.snippet.tsx that don't exist
in the LP north-star.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Mirror the north-star (langgraph-python) mcp-apps demo verbatim: split the
single-file page.tsx into page.tsx + chat.tsx + suggestions.ts, and switch
the agent identifier from "mcp_apps" to "mcp-apps" to match LP exactly.
Update copilotkit-mcp-apps/route.ts to register the HttpAgent under the
"mcp-apps" key so the LP-verbatim frontend resolves. Delete the demo-local
README.md (no LP equivalent).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Copy LP's tool-rendering-reasoning-chain frontend verbatim: page.tsx with
useRenderTool registrations for get_weather + search_flights and a
useDefaultRenderTool catchall, plus ReasoningBlock, WeatherCard,
FlightListCard, and CustomCatchallRenderer components. Keeps the LP
agent/agentId values ("tool-rendering-reasoning-chain") as required by
the parity north-star.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Bring shared-state-streaming demo frontend to 1:1 parity with the
langgraph-python north-star: split page.tsx into demo-layout.tsx +
suggestions.ts modules, swap CopilotChat-in-aside for
CopilotSidebar+DemoLayout, and adopt LP's DocumentView styling +
testids (document-view, document-live-badge, document-char-count,
document-content).
The ADK agent (shared_state_streaming_agent.py) is already wired with
streaming_function_call_arguments=True on the ADKAgent middleware and
PredictStateMapping(stream_tool_call=True), so per-token (or chunk-level
fallback on Gemini Studio) state-delta streaming into state["document"]
works end-to-end. The 2026-05-07 not_supported_features bucket was
conservative — the wiring is complete and the LIVE badge / growing
document UX functions even on the chunk-level fallback path.
README adjusted from LangGraph's StateStreamingMiddleware to ADK's
PredictStateMapping + streaming_function_call_arguments wording.
Manifest change needed (not in this commit): remove
shared-state-streaming from not_supported_features and add to features.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Copy the readonly-state-agent-context demo frontend verbatim from
langgraph-python (the north-star) into google-adk. The ADK demo
previously had a different layout (sidebar + CopilotChat with 3 simple
fields); replace it with the LP layout (identity card + activity card +
published-context JSON viewer + CopilotPopup, all on a neutral-50
background with the indigo accent system).
Adds local _components/ shadcn primitives (Badge, Card, Checkbox, Input,
Label, Select), demo-layout.tsx, and suggestions.ts. The page.tsx is
identical to LP — agent="readonly-state-agent-context" and
agentId="readonly-state-agent-context" (dash form) are kept verbatim per
the parity rules; the orchestrator will rename the registry key so the
backend matches.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Verbatim port of langgraph-python's agent-config demo frontend:
page.tsx, config-card.tsx, config-context-relay.tsx, config-types.ts,
demo-layout.tsx, use-agent-config.ts. Keeps agent="agent-config-demo"
and runtimeUrl="/api/copilotkit-agent-config" as in LP.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Copy the auth demo verbatim from langgraph-python (the parity north-star).
The demo now uses an unauthenticated-first UX with a dedicated SignInCard
landing page; <CopilotKit> mounts only after the user signs in at least
once, sidestepping the transport 401 that would crash <CopilotChat /> on
its initial /info handshake. Once mounted, it persists across the
sign-out -> sign-in cycle so the post-sign-out state actually demonstrates
the runtime rejecting unauthenticated requests in the chat surface.
Workspace plumbing required to make the verbatim port runnable:
- Add shadcn primitives (button, card) and `cn` util at
src/components/ui/* + src/lib/utils.ts.
- Add class-variance-authority, clsx, radix-ui, tailwind-merge to
package.json.
- Extend globals.css with Tailwind v4 @theme tokens that map onto the
shadcn CSS variables (background/foreground/card/muted/border/etc.) so
utilities like `bg-muted` and `text-muted-foreground` actually generate
styles.
The ADK auth API route already had the onRequest bearer-token gate
mirroring LP's pattern; it points at the `_simple_chat`-backed `/auth`
agent path, which is correct per the auth-at-route-level model. No
backend (registry / agent) changes required.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Verbatim copy of the LP beautiful-chat frontend — page.tsx, home-page.tsx,
showcase.json, declarative-generative-ui/, components/ (example-layout,
example-canvas, generative-ui, ui, tool-rendering), hooks/, lib/. The demo
now uses ThemeProvider + CopilotKit with a2ui catalog + openGenerativeUI,
ExampleLayout/Canvas with todos, generative UI chart components, and the
full suggestion-pill set.
Add the dedicated ADK runtime route at /api/copilotkit-beautiful-chat
modelled after the LP route shape but adapted for ADK (HttpAgent +
AGENT_URL pattern, mirroring declarative-gen-ui and mcp-apps routes).
Combined runtime: openGenerativeUI + a2ui.injectA2UITool:false + mcpApps
to support all three flagship surfaces simultaneously, matching LP.
Add missing npm deps to package.json: @radix-ui/react-checkbox,
@radix-ui/react-separator, class-variance-authority, clsx, lucide-react,
tailwind-merge — required by the verbatim-copied shadcn primitives.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Align google-adk's /demos/voice with the langgraph-python north-star:
- page.tsx now mounts <CopilotKit runtimeUrl="/api/copilotkit-voice"
agent="voice-demo" useSingleEndpoint={false} enableInspector={false}>
around a dedicated <VoiceChat /> component (split out of page.tsx).
- voice-chat.tsx (new) hosts the textarea-injection handler and renders
<CopilotChat agentId="voice-demo" /> alongside the sample-audio button.
- sample-audio-button.tsx is the single-button "Try a sample audio" variant
with the mic emoji and tooltip-style preview — the surrounding "Sample:"
wrapper from the old ADK version is gone.
- Drops voice-frontend.snippet.tsx and voice-runtime.snippet.ts (not in LP).
Agent untouched: src/agents/shared_chat._simple_chat already mirrors LP's
main.py simple chat shell. The existing route at
src/app/api/copilotkit-voice/[[...slug]]/route.ts already maps
"voice-demo" → HttpAgent(AGENT_URL + "/voice") which lines up with the
registry key "voice".
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Copy the full headless-complete demo verbatim from langgraph-python (the
parity north-star). The demo now exposes the full headless surface
CopilotKit provides: useRenderTool / useDefaultRenderTool, useComponent,
useConfigureSuggestions, useAttachments, plus useRenderToolCall and
useRenderActivityMessage rendered inside a hand-rolled chat shell built on
useAgent + useCopilotKit.
Workspace plumbing required to make the verbatim port runnable:
- Add shadcn primitives (avatar, badge, button, card, scroll-area,
separator, textarea) and `cn` util at src/components/ui/* + src/lib/utils.ts.
- Add lucide-react, radix-ui, react-markdown, remark-gfm, clsx,
tailwind-merge, class-variance-authority to package.json.
- Extend globals.css with Tailwind v4 @theme tokens that map onto the
shadcn CSS variables (background/foreground/card/muted/border/etc.) so
utilities like `bg-background` actually generate styles.
- Register a `headless-complete` HttpAgent on the existing MCP Apps
runtime route so the LP frontend's `agent="headless-complete"` resolves
to the ADK backend path `/headless_complete` (mapped to _simple_chat in
registry.py).
The ADK `_simple_chat` agent is left unchanged — it already covers the
behaviour the demo exercises (frontend tools, MCP Apps tool calls).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Reduce google-adk's agentic-chat to the minimum-viable CopilotChat surface
matching langgraph-python: vanilla <CopilotChat /> + three starter
suggestion pills. Strip useFrontendTool (change_background), useRenderTool
(get_weather — was silently failing, no backend tool registered), and
useAgentContext (Bob's name). These concepts already have dedicated demos
(frontend-tools, tool-rendering, readonly-state-agent-context).
Also: make GOOGLE_GEMINI_BASE_URL overridable via .env so the same
container can flip between aimock (deterministic D5 probes) and real
Gemini (manual verification) without editing the compose file.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Three layers of regression guards for the runtime reasoning-role filter and
the chained demo behavior:
1. Runtime unit test — packages/runtime/.../run-message-filtering.test.ts:
- Verifies `LangGraphAgent.run` strips `role:"reasoning"` from
`input.messages` before delegating to super.run.
- Verifies user/assistant/system/tool messages pass through in order.
- Verifies empty + missing messages arrays are tolerated.
- Verifies pre-existing forwardedProps.streamSubgraphs default + override
behavior is preserved.
- 6/6 tests pass against the runtime package's vitest config.
2. D5 harness probe — showcase/harness/.../d5-tool-rendering-reasoning-chain.ts:
- Expanded from one chained turn (flights→weather) to all three chained
pills in a single thread (stocks AAPL→MSFT, dice d20→d6, flights→weather).
- This is the canonical multi-pill regression at the harness layer:
without the runtime reasoning-role filter, the second pill would crash
before the model was called.
- Each turn asserts the per-turn delta of reasoning-block mounts (idx+1),
the minimum card count for each tool group, and unique transcript
substrings that scope to that turn.
3. Playwright e2e spec — showcase/integrations/langgraph-python/tests/e2e/
tool-rendering-reasoning-chain.spec.ts:
- Mirrors the pattern of the sibling tool-rendering-default-catchall spec
(notably its multi-pill regression at lines 162-212).
- Page-loads test verifies the 3 pills mount and no cards leak from a
prior session.
- One test per chained pill (stocks, dice, flights+weather) asserts the
full chain renders with reasoning-block + correct per-tool cards +
narration matching the aimock fixture text.
- Sequential-pills regression test clicks all 3 pills in one thread,
asserts each chain renders independently AND the reasoning-block count
increases monotonically across turns.
Agent: extend `get_stock_price` to accept optional `price_usd` and
`change_pct` arguments (mirrors the basic tool-rendering agent's signature
introduced in #4770). The aimock fixtures script the chained AAPL/MSFT
comparison by passing deterministic prices via these args; without the
wider signature, pydantic rejects the tool call and the card never mounts.
The runtime unit test is the strongest guard — it would catch any
regression on the role-filter logic without depending on the full Docker
stack. The harness probe and Playwright spec catch end-to-end regressions
in the canonical CI environment.
The tool-rendering-reasoning-chain demo previously promised chained tool
calls in its pill titles but the agent and fixtures only delivered single
tools — clicking "Weather + flights to Tokyo" produced just a WeatherCard,
"Compare two stocks" only fetched AAPL, "Find flights from SFO to JFK"
showed flights but no destination weather. Three changes close the gap.
Agent: replace the soft "call 2+ tools when relevant" system prompt with
concrete per-pill chain examples mirroring the pattern already used by the
langgraph-typescript `tool-rendering` agent (weather→flights, ticker→peer,
roll→contrast die, flights→destination weather).
Pills: drop the redundant Tokyo pill (it was the SFO/JFK chain in reverse)
and reword each remaining pill message to PRE-DISCLOSE the chain so the
model commits to the follow-up call:
- "Compare AAPL and MSFT stocks for me."
- "Roll a 20-sided die for me and compare it to a smaller one."
- "Find flights from SFO to JFK and show me the weather there."
Fixtures: 9 fixtures (3 per pill: final-content → second-leg → first-leg,
ordered by toolCallId specificity for first-match-wins). Each fixture is
scoped by a langgraph-python-UNIQUE userMessage tail ("Compare AAPL and
MSFT stocks", "compare it to a smaller one", "show me the weather there").
Those substrings appear nowhere else across the 14+ integrations sharing
showcase-aimock on Railway, so the new fixtures cannot cross-contaminate
the other reasoning-chain demos that still ship the older prompt set.
A toolName-based gate was considered and rejected because most fleet
agents register `roll_dice` and aimock's `toolName` matcher is a tool-LIST
gate, not a tool-CALL gate — it would NOT have isolated this demo.
Probe: collapse the two-turn flow (Tokyo + SFO/JFK) into one chained turn
(SFO→JFK + JFK weather) that asserts BOTH per-tool renderers
(FlightListCard + WeatherCard) mount in a single response. Same coverage
at half the wall-clock and exercises the actual chained-tool path.
Four independent showcase production bugs Alem reported, plus the
D5 multimodal harness regression they unblocked.
Shared-state-read-write: "Greet me" ("Say hi and introduce yourself.")
and "Plan a weekend" ("Suggest a weekend plan based on my interests.")
were matching the bare `hi` and `plan` catch-alls in feature-parity.json
and returning the generic showcase-assistant blurb / 5-step content plan
instead of shared-state-aware responses. Added pill-specific fixtures in
shared-state.json (mirrored into d5-all.json) so the longer userMessage
substrings win first-match-wins ahead of feature-parity.
Auth sign-out: signing out unmounted CopilotKit entirely and bounced
the user back to the SignInCard, so the demo never showcased the
runtime returning 401 — its whole point. The QA contract in
qa/auth.md spelled out the intended UX. Restored it: CopilotKit stays
mounted after the first sign-in, the AuthBanner flips to an amber
"Signed out — the agent will reject your messages" state with a
re-Sign-in button, and CopilotKit's `onError` callback drives a
`data-testid="auth-demo-error"` surface that displays the runtime's
401 the moment the user sends an unauthenticated message. Updated the
e2e spec to match (the old "SignInCard re-mounts after sign-out" test
pinned the regression).
Gen-ui-agent: the aimock fixture short-circuited the 7-step
progression spelled out in `gen_ui_agent.py`'s SYSTEM_PROMPT to a
single set_steps call with all three steps already `completed`, so
the InlineAgentStateCard rendered the final 3/3 state instantly with
no sequential pending → in_progress → completed animation.
Regenerated as a 7-leg toolCallId chain per pill (8 fixtures × 3
pills): seed leg keyed on userMessage with NO `hasToolResult` gate
(matching PR #4770's pattern — `hasToolResult: false` would block the
seed from firing on the second pill in a multi-pill session), then
six toolCallId-keyed transitions, then a final narration. Fixture
order: toolCallId legs FIRST so the most specific match wins.
Multimodal D5: the sample-attachment buttons auto-send via
`agent.addMessage + copilotkit.runAgent` (restored in PR #4761), but
the D5 harness still typed `input` + pressed Enter via the runner
after `preFill`, sending a second user message that competed with the
in-flight image upload — the v1 LangGraph runtime SSE stream got
tangled (browser DevTools showed `statusCode: pending` indefinitely)
and the assistant message never rendered. Added `skipSend?: boolean`
to ConversationTurn (distinct from `skipFill`, which still presses
Enter once the textarea has content) and switched d5-multimodal.ts to
`skipSend: true` with `responseTimeoutMs: 60_000` so the runner waits
on the assistant response without poking the chat further. Bumped the
PDF auto-prompt fixture in feature-parity.json to include the word
"document" so the existing `buildModalityAssertion("document")` check
still lands.
D5 result: 37 → 39 of 40 features passing. Only
`tool-rendering-reasoning-chain` remains and is a separate
agent/runtime bug (Tokyo Responses-API `reasoning` message survives
into the next turn's conversation history, runtime returns
`RUN_ERROR: "message role is not supported"`).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Matches the CopilotKit runtime's extractForwardableHeaders() which
already forwards all x-* prefixed headers. Enables any custom
x-* header to propagate from browser through AG-UI to LLM calls.
The tool-rendering, frontend-tools-async, and hitl-in-app fixtures all gated
their first-leg (tool-emitting) vs. follow-up (narration) responses on
`hasToolResult: false/true` and/or `turnIndex`. Those constraints count the
*entire* thread, so once a user clicked a tool-using pill the thread already
contained tool messages and assistant turns and subsequent pill clicks fell
through to the wrong branch — d20 dropped from 5 rolls to 3, Chain tools
emitted no cards, query_notes returned narration without the Notes DB card,
and the second HITL pill never raised an approval dialog.
Re-key every follow-up fixture on the prior step's `toolCallId` (the matcher
checks `messages[last].tool_call_id`), drop the global `hasToolResult` gates
from the tool-emitting fixtures, and reorder so the toolCallId-specific
fixtures come first under first-match-wins. The d20 chain becomes a linear
toolCallId graph (`call_tr_d20_seq_001` → `_002` → … → `_005`), Chain tools
gets disambiguators for each of its three parallel tool_call_ids, and
Weather/AAPL/query_notes/HITL approve+reject branches all gate on the
specific request_user_approval / get_weather / query_notes / get_stock_price
id that landed last. userMessage matchers are unchanged.
Adds Playwright multi-pill regression tests to the four affected demos that
click every pill sequentially in one thread and assert the full card counts:
- tool-rendering-default-catchall: Find flights → 5 d20 rolls (with 20 last)
- tool-rendering-custom-catchall: 1 flights + 5 d20 + 3 chain = 9 cards
- frontend-tools-async: 3 NOTES DB cards with the right keyword per pill
- hitl-in-app: refund approve then escalate, each with its own dialog
The previous fixture regression (HTML+CSS only, no jsFunctions) slipped
past CI because the e2e suite only asserted "iframe mounts with non-empty
srcdoc" — which passes whether or not the iframe is interactive. Adds
two layers of guard so the same regression cannot land silently:
1. showcase/scripts/__tests__/open-gen-ui-advanced-fixtures.test.ts
(vitest, runs in showcase_validate on every PR): asserts each of the
three interactive fixture entries in d5-all.json ships jsFunctions
referencing the matching host bridge (evaluateExpression / notifyHost).
Catches "someone removed jsFunctions" at PR-time with no
infrastructure dependencies.
2. showcase/integrations/langgraph-python/tests/e2e/open-gen-ui-advanced.spec.ts
(playwright, runs in test_e2e-showcase-on-demand): adds three
round-trip tests that drive the in-iframe controls and assert the
host-side handler ran by capturing its console.log + verifying the
iframe output element reflects the host response. Catches "the
renderer fails to inject jsFunctions into the sandbox" too.
The e2e tests also switch the existing smoke tests off pill-click and
onto a textarea-driven fill+Enter path, following the same precedent as
commit 15db0bbf3 (gen-ui-headless-complete) — chip mounts diverge
between EmptyState and SuggestionBar surfaces, and Playwright's pill
click races React hydration. Using [data-testid="copilot-chat-textarea"]
with an explicit click + waitForLoadState("networkidle") makes the
suite reliable end-to-end (7/7 passing locally against the aimock-driven
stack).
The chat-slots cell is wired to the neutral sample_agent graph (plain
ChatOpenAI, no Responses API, no reasoning config), so it never emits
AG-UI REASONING_MESSAGE_* events. The pill could never light up the
wrapped messageView.reasoningMessage slot, and its prompt didn't match
any fixture in showcase/aimock/d5-all.json — aimock-backed runs hit
"No fixture matched". Drop the pill (the QA doc and the e2e spec
already only expect "Write a sonnet" and "Tell me a joke") and leave a
note pointing reasoning demos at /demos/reasoning-default and
/demos/reasoning-custom where the dedicated reasoning_agent graph lives.
The `[&_div[style*='flex-direction:_row']]:gap-4` arbitrary variant
(quotes inside doubly-nested brackets) is the most exotic Tailwind
syntax in this PR and lines up exactly with when the Vercel
form-filling deploy started failing. Tailwind v4's content scanner is
likely choking on the apostrophes in the nested attribute selector.
The Metric `flex-1 min-w-[120px]` and the chart `flex-1 min-w-0`
already give us even distribution inside the basic catalog's gap-less
Row; the auto-injected nested gap was nice-to-have, not load-bearing.
Drop the inline <style> override that widened the chat's `cpk:max-w-3xl`
column and the outer max-w-6xl bump. The chat keeps its normal width;
the real bug was that the basic catalog's Row/Column primitives are
bare `display: flex` divs with no gap and no min-width control on
children, so when the agent dropped multiple Metrics or charts into a
Row they collapsed to content width and looked glued together.
Four targeted fixes inside our renderers:
- Metric gains `flex-1 min-w-[120px]` so a row of KPI tiles distributes
the available width evenly inside the gap-less basic Row, instead of
shrinking to content.
- PieChart and BarChart switch from a hardcoded max-w to `flex-1
min-w-0` so two charts side-by-side each take half the card column
with Recharts' ResponsiveContainer doing the rest, instead of one
chart insisting on 640px and overflowing.
- Card's CardContent picks up a Tailwind arbitrary variant
`[&_div[style*='flex-direction:_row']]:gap-4` (plus the column
equivalent) that injects a gap into any nested basic Row/Column the
agent drops in. Underscores in the arbitrary value compile to literal
spaces, matching React's serialized inline `flex-direction: row`.
- Card itself drops the old `min-w-[260px]` floor in favour of
`min-w-0` so it cooperates if the agent ever stacks Cards horizontally
inside a Row.
Tyler Slaton