Commit Graph

4085 Commits

Author SHA1 Message Date
Jordan Ritter 16d940779a chore(showcase/shell-docs): a11y-hide commit-SHA overlay; short-sha 7 chars; distinguish dev vs empty
- Add aria-hidden=true so the SHA is not announced by screen readers.
- Shorten to the conventional 7-char git short-sha (was 9).
- Distinguish 'dev' (NEXT_PUBLIC_COMMIT_SHA undefined) from 'unknown'
  (env present but empty string) so Docker ARG-scope bugs surface as
  something other than a misleading 'dev' label in production.
2026-04-20 16:37:25 -07:00
Jordan Ritter b69846c353 fix(showcase/shell-docs): tighten middleware matcher + log posthog errors + module-load warning
Three smaller cleanups to the middleware:

1. Matcher regex: `(?!api|...)` matched `/apidocs` as well as `/api`,
   dropping analytics for any docs path whose first segment starts with
   'api'. The pattern now uses `api/` with a terminator, and also
   excludes `robots.txt`, `sitemap.xml`, `manifest.webmanifest`, and
   the `.well-known/` prefix, which some static-path tooling expects
   to reach without middleware interception.

2. Capture errors are now logged via `console.warn` rather than
   silently swallowed. PostHog 401/403/5xx, DNS failures, etc. were
   invisible to operators.

3. The missing-`POSTHOG_PROJECT_KEY` warning now fires once at module
   load rather than via a module-scoped mutable flag. Edge runtime
   isolates are short-lived and per-request, so the in-memory
   warn-once flag was unreliable. Module-load is the cleanest
   available single-fire hook.
2026-04-20 16:37:07 -07:00
Jordan Ritter bb1c337255 fix(showcase/shell-docs): guard knownFrameworks against reserved-route-slug collisions
If a registry integration ever ships a slug matching a top-level route
segment (docs, ag-ui, reference, api, matrix, integrations), the
FrameworkProvider.urlFramework resolver would treat the route as a
framework scope and hijack navigation. Filter those slugs out in the
root layout and log a dev-only console.error so the collision is
visible to the maintainer.
2026-04-20 16:37:06 -07:00
Jordan Ritter 6a355693ea fix(showcase/shell-docs): drop redundant env block in next.config.ts; validate NEXT_PUBLIC_BASE_URL at build time 2026-04-20 16:37:01 -07:00
Jordan Ritter 6faf3a7bb7 fix(showcase/shell-docs): middleware uses per-visitor distinct_id via first-party cookie
The previous hard-coded distinct_id ("docs-pageview-tracker") collapsed
every visitor into a single synthetic PostHog person, which destroyed
unique-visitor analytics.

Each visitor now gets a stable UUID minted on first visit, persisted
in a first-party `ph_distinct_id` cookie (Lax, Secure, ~2 year TTL)
and read back on subsequent requests. This avoids IP+UA hashing and
the PII concerns that come with it.

Also wraps the PostHog capture POST in `event.waitUntil()` — the
middleware signature now takes `NextFetchEvent` — so the Edge runtime
keeps the request alive until the POST resolves. A bare fire-and-forget
fetch can be torn down as soon as `NextResponse.next()` returns,
dropping events.
2026-04-20 16:36:40 -07:00
Jordan Ritter 9c4503ec3b chore(showcase/shell-dojo): add .gitignore and lockfile for parity with sibling shell packages 2026-04-20 14:22:58 -07:00
Jordan Ritter 8d56c2230b chore: apply formatter to integration branch
- Extend .oxfmtrc.json ignore to cover shell-docs/src/content
  (mirrors existing shell/src/content ignore, which was not updated
  when shell-ops-v2 moved MDX content into the new shell-docs package)
- Format showcase/scripts/generate-registry.ts and probe-docs.ts
2026-04-20 14:13:30 -07:00
Jordan Ritter a6836556d7 chore(showcase/shell-docs): add package-lock.json
Matches shell/ and shell-dashboard/ which commit their npm lockfiles to
pin standalone (non-pnpm-workspace) install closures. Ensures reproducible
Docker builds in CI.
2026-04-20 14:05:11 -07:00
Jordan Ritter b6568518ee fix(showcase/shell-docs): drop @copilotkitnext/react CSS import
shell-docs renders pure MDX docs with iframed live demos (via <InlineDemo>
and <IframeSwitcher>) — it never instantiates the live copilot runtime
inline, so it doesn't need @copilotkitnext/react or its styles. Dropping
the import also removes the package from shell-docs's dep closure, keeping
the docs shell lean.
2026-04-20 14:04:51 -07:00
Jordan Ritter c320457180 chore(showcase/shell-docs): add .gitignore matching shell-dashboard pattern 2026-04-20 14:02:45 -07:00
Jordan Ritter c298fe2ae2 fix(showcase/shell-docs): move 4085-added unselected/prebuilt-components content into shell-docs
These files were added in #4085 but landed in showcase/shell/src/content/docs/
after the MDX-docs extraction had already moved the rest of content/docs into
shell-docs. Follow The Rule (MDX docs content belongs in shell-docs) and
relocate them so they render correctly on docs.showcase.copilotkit.ai.
2026-04-20 14:00:57 -07:00
Jordan Ritter debfa6600d refactor(showcase): update generator scripts to emit into both shell and shell-docs where applicable
MDX docs moved from shell to shell-docs, but several generated artifacts
are still consumed by both shells:
- registry.json: shell uses it (home grid, integrations, matrix,
  middleware, layout); shell-docs uses it (docs renderer framework lookup)
- demo-content.json: shell uses it (integrations/[slug]/[demo]); shell-docs
  uses it (<Snippet> in docs renderer)
- search-index.json: shell-docs consumes it for the docs search modal;
  shell also keeps a copy so its header search still works — links 301
  across to docs.showcase.copilotkit.ai.

Updated scripts:
- generate-registry.ts: dual-emits registry.json to both shells
  (constraints.json stays shell-only — integration-explorer is shell)
- bundle-demo-content.ts: dual-emits demo-content.json
- generate-search-index.ts: scans from shell-docs/src/content (where MDX
  now lives), writes to both shells' data dirs
- probe-docs.ts: scans shell-docs/src/content/docs (content source moved),
  still writes docs-status.json under shell/ for the dashboard
- sync-docs-from-main.ts: target path updated to shell-docs/src/content

Tests in __tests__/ reference shell/src/data paths; dual-emit keeps
those stable so existing afterEach-restore hooks continue to work.
2026-04-20 14:00:28 -07:00
Jordan Ritter c6e4b809e9 feat(showcase/shell): add 301 redirects from /docs /ag-ui /reference /[framework] to docs.showcase.copilotkit.ai
Shell no longer hosts MDX docs routes — they live on shell-docs
(docs.showcase.copilotkit.ai). Add permanent redirects from the legacy
shell paths so old URLs and SEO authority carry over to the new host.

Framework slugs are enumerated from registry.json at build time (not a
:slug* wildcard) so /integrations and /matrix — both still owned by
shell — are NOT caught by the redirect. Fixed routes (/docs, /ag-ui,
/reference) cover the three other docs catch-alls.
2026-04-20 14:00:28 -07:00
Jordan Ritter fc80501048 feat(showcase): move MDX docs routes + components + libs + content into shell-docs
Extracts everything that exists to render MDX documentation (docs/[[...slug]],
[framework]/[[...slug]], ag-ui/[[...slug]], reference/[...slug]) out of shell
into the new shell-docs package that will serve docs.showcase.copilotkit.ai.

Moves (git mv preserves history):
  - App routes: /docs, /[framework], /ag-ui, /reference
  - Docs-only components: docs-page-view, docs-callout, docs-steps, docs-tabs,
    mdx-components, framework-tabs, framework-selector, sidebar-*, snippet,
    property-reference, router-pivot, stored-framework-highlight, react/*
  - Docs-only libs: lib/docs-render, lib/mdx-registry
  - All content: content/docs, content/ag-ui, content/reference, content/snippets
  - .docs-sync-sha marker (follows the content)

Duplicates into shell-docs (both shells need them):
  - brand-nav, search-modal, search-trigger, copy-button, framework-provider
  - lib/registry.ts, data/registry.json, data/demo-content.json,
    data/search-index.json
  - app/layout.tsx + globals.css + public/{images,logos}

shell-docs gets its own minimal middleware (PostHog-only — no SEO redirect
table, docs host never served legacy URLs). shell keeps seo-redirects.ts
for the legacy-URL migration table; framework-scope protection in its
middleware is now effectively dead but harmless (next.config.ts redirects
fire before middleware ever sees /<framework>/ paths).

InlineDemo updated for cross-host context: 'Open full demo' link points
at the shell host (showcase.copilotkit.ai) since the integration profile
route only exists there.
2026-04-20 14:00:28 -07:00
Jordan Ritter dc73b9f334 chore(showcase): scaffold shell-docs package 2026-04-20 13:59:48 -07:00
Jordan Ritter 878ac3af2d chore(showcase): rename shell-dojolike → shell-dojo for naming consistency with dojo.showcase.copilotkit.ai
- Renamed showcase/shell-dojolike/ → showcase/shell-dojo/ (git mv for history).
- Updated package name to @copilotkit/showcase-shell-dojo.
- Updated .github/workflows/showcase_deploy.yml: dispatch option, paths-filter key, ALL_SERVICES entry (context, image, comment).
- Updated .github/workflows/static_check-binaries.yml size allowlist path.
- Renamed Railway service showcase-shell-dojolike → showcase-shell-dojo (id 7ad1ece7-2228-49cd-8a78-bddf30322907 preserved; domain dojo.showcase.copilotkit.ai unchanged).
- Updated image source to ghcr.io/copilotkit/showcase-shell-dojo:latest.
2026-04-20 13:54:42 -07:00
Jordan Ritter daf09358c4 chore(showcase): rename shell-internal → shell-dashboard and provision Railway service @ dashboard.showcase.copilotkit.ai
- Renamed showcase/shell-internal/ → showcase/shell-dashboard/ (git mv for history).
- Updated package name to @copilotkit/showcase-shell-dashboard (+ lockfile).
- Updated external references: showcase/scripts/{probe-docs,generate-status}.ts comments and showcase/README.md.
- Added dispatch + filter + ALL_SERVICES entry for shell-dashboard in .github/workflows/showcase_deploy.yml.
- Provisioned Railway service showcase-shell-dashboard (id 4d5dfd74-be61-40b2-8564-b53b7dd4c15b):
  - image source ghcr.io/copilotkit/showcase-shell-dashboard:latest
  - env vars OPENAI_API_KEY, ANTHROPIC_API_KEY, PORT copied from showcase-shell
  - custom domain dashboard.showcase.copilotkit.ai attached (CNAME → 6u9icvje.up.railway.app)
  - image will be built and pushed via showcase_deploy.yml on merge
2026-04-20 13:54:17 -07:00
Jordan Ritter 82e9769f5c fix(showcase/starters/langroid): restore /api/health 200 by dropping sed log-prefix wrappers and gating Next.js on agent readiness
Production showcase-starter-langroid returns ``{"status":"degraded","agent":"down"}`` HTTP 503
at ``/api/health`` — the exact path the showcase-deploy workflow's ``ALL_SERVICES.health_path``
verify step asserts, so the next CI redeploy of this starter would fail verification.

Root cause: two compounding bugs in ``showcase/starters/langroid/entrypoint.sh``.

1. Process-substitution log prefixers suppressed stdout. Both backgrounded
   services were wrapped with ``> >(sed 's/^/[agent] /') 2>&1 &`` /
   ``> >(sed 's/^/[nextjs] /') 2>&1 &``. In Railway's V2 runtime this shape
   reliably produced ZERO ``[agent]``/``[nextjs]`` log lines (confirmed against
   several weeks of Railway logs for this service) and correlated with
   agent-unreachable 503s at ``/api/health``. The package entrypoint
   (``showcase/packages/langroid/entrypoint.sh``) uses the plain-``&`` pattern
   with no wrapper, stays green on the same Railway runtime, and shows full
   uvicorn ``INFO:`` startup logs including ``127.0.0.1:...  "GET /health
   HTTP/1.1" 200 OK`` from Next.js's fetch. Match the working package pattern.

2. Cold-start race amplified by ``sleepApplication=true``. Railway sleeps
   idle services. On wake, Next.js is ready in <1s but Python + langroid
   imports take 10-20s. Without a readiness gate, Next.js answered the first
   post-wake ``/api/health`` probe with ``agent:"down"`` before uvicorn had
   bound port 8123. The deploy workflow's verify step then saw the 503 and
   reported the deploy as unhealthy. Add a 30s readiness probe that curls
   ``http://127.0.0.1:8123/health`` in a loop before starting Next.js. The
   IPv4 literal (``127.0.0.1`` not ``localhost``) is load-bearing — Node
   22+'s fetch resolves ``localhost`` to IPv6 ``::1`` first, and uvicorn
   binds IPv4 only; the readiness probe must not false-negative on resolver
   semantics alone.

Also export ``PYTHONUNBUFFERED=1`` so Python import-time tracebacks (e.g.
langroid module-load failures) reach the container log immediately instead
of sitting in userspace buffers until process exit closes them off.

Verification:
- Built langroid starter image locally from this branch. ``/api/health``
  returns 200 with ``{"status":"ok","agent":"ok"}``. Full uvicorn INFO
  logs visible including ``127.0.0.1:xxxxx - "GET /health HTTP/1.1"
  200 OK`` confirming Next.js -> agent path works.
- Readiness probe fires before Next.js launch: ``[entrypoint] Agent
  /health ready after 3s``.
- New regression guards in ``starter-consistency.test.ts`` cover all four
  invariants (no sed wrapping around uvicorn, no sed wrapping around next
  start, ``PYTHONUNBUFFERED=1`` export, readiness probe on 127.0.0.1:8123
  before ``next start``). Verified red→green (reverted entrypoint -> 4
  fails; restored -> 4 pass). Full showcase/scripts suite: 1079/1079 pass.
2026-04-20 13:53:08 -07:00
Martha Schumann 857c7bd106 docs(mastra): use requestContext in Agent instructions example
Restores the API-surface change from the original QA PR #3866 (merged
via mirror #4040) that was inadvertently reverted in 804c5d0f. Keeps
Jordan's other fixes (imports, model, null guards, grammar) intact.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-20 13:40:29 -07:00
Atai Barkai a12579167e fix(showcase/scripts): validate-parity skips command-only demos in missing-dir check
The auditableDemos filter (introduced for cli-start's informational
`command:` entry) was applied to the spec/qa SHOULD checks but not
the missing-demo-dir MUST check. Result: cli-start in langgraph-python's
manifest triggered a false missing-dir failure even though it has no
on-disk folder by design.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 21:37:00 -07:00
Atai Barkai 7644f180a6 fix(showcase): restore shared-state-read-write scaffolds + regen starters
Post-merge CI caught two regressions:

1. shared-state-read-write demo directories were on disk but never
   committed — 16 packages' manifests reference the demo but the
   page.tsx scaffolds weren't tracked. This failed validate-parity,
   bundle-demo-content tests, and drift-check transitively.

2. langgraph-python starter templates drifted after main added
   docstring region markers to weather-tool-backend; regenerating
   via `npx tsx generate-starters.ts` syncs the 17 starters.

Bundle (showcase/shell/src/data/demo-content.json) regenerated to
pick up the new demo content.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 21:34:13 -07:00
Atai Barkai 62a05003c1 Merge remote-tracking branch 'origin/main' into atai/2026-04-18/feature-port-no-docker-restructure
# Conflicts:
#	.github/workflows/showcase_deploy.yml
2026-04-19 21:29:07 -07:00
Atai Barkai 151ccb9ad8 perf(showcase/langgraph-python): mcp-apps — speed-biased system prompt (target <30s generation)
Drops the aspirational 185-line prompt (read_me preflight, multi-call
iteration, palette discipline, zone backgrounds, label/fixedPoint rules,
opening+mid+final cameraUpdates) in favor of a ~35-line shape that biases
the agent toward exactly one create_view call with 3-5 elements and a
single framing cameraUpdate. Downgrades gpt-4.1 → gpt-4o-mini since the
element schema is simple JSON and model latency dominates end-to-end time.

Measured end-to-end (agent/run SSE to RUN_FINISHED) on the showcase
runtime: 5-6s per prompt across two prompts × two runs, all producing a
single create_view call with 8 elements (clean 3-step flowchart;
client/server/db diagram). Previously 3-5 minutes.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 21:14:48 -07:00
Atai Barkai 8e07f479c5 refactor(showcase/langgraph-python): interrupt-headless — side-by-side chat + empty-app-pane popup
Restructure the headless-interrupt cell so the app surface is empty by
default and the popup appears there (not inside the chat or as a global
modal) when the backend calls `interrupt()`. The user triggers the run
from a pre-built suggestion chip in the right-hand `CopilotChat`, which
mirrors the other in-app-action demos (hitl-in-app, gen-ui-interrupt).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 21:12:57 -07:00
Atai Barkai 9eddb3004e docs(showcase/shell): unselected/prebuilt-components — folder with sub-pages
Convert unselected/prebuilt-components.mdx single-file into a folder
matching the main /docs/prebuilt-components/ structure:
  index.mdx, chat.mdx, sidebar.mdx, popup.mdx, meta.json

This way the nav builder creates a GROUP with CopilotChat /
CopilotSidebar / CopilotPopup children in the Built-in Agent sidebar
section, not just a single page link.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 21:07:33 -07:00
Jordan Ritter 4d1147d05f fix(showcase/agno): read SSE incrementally in smoke route to work around agno SDK success-path hang
Reimplements the approach from the now-closed PR #4093 (which I closed
after #4095 merged the agno 2.5.17 upgrade, on the belief that the SDK
bump had fixed the underlying SSE termination bug).

Follow-up evidence collected 2026-04-19 showed the SDK upgrade only
addressed the error path — production /api/smoke with real API keys
still hangs because the agno SDK does not reliably emit TEXT_MESSAGE_END
/ RUN_FINISHED on the success path. Documented in Notion page
3473aa381852815b9765fd28fa53275a, item #5.

Change: instead of `await res.text()` (which only resolves when the
server closes the stream), read res.body incrementally with
getReader() + TextDecoder. Short-circuit as soon as the buffer contains
`"type":"TEXT_MESSAGE_CONTENT"` with `"OK"` — the agent has produced
the expected output, so we cancel the reader and return a 200 success
envelope without awaiting a terminal event that may never arrive. If
the stream closes cleanly without confirmation, return a diagnostic
502 with stage="response_incomplete" so regressions surface clearly.
Keep the existing 45s AbortSignal timeout as a final safety net.

Response envelope shape is preserved for the smoke monitor parser.

This is a client-side mitigation, not a fix. The real fix belongs
upstream in the agno SDK's AG-UI interface. Keep this PR open until
upstream is addressed and verified in production with real keys.
2026-04-19 21:07:21 -07:00
Atai Barkai 0b171a5d12 feat(showcase/langgraph-python): mcp-apps — rich Excalidraw prompting guidance
Rewrites the mcp-apps agent system prompt from a minimal "call a tool and
populate the canvas" instruction into a detailed Excalidraw-aware
playbook. Adoptions:

- Workflow: instructs the agent to call `read_me` first (the Excalidraw
  MCP server's own format reference) before `create_view`, and to use
  `restoreCheckpoint` for follow-up edits.
- Layout principles: left-to-right vs. top-down vs. hub-and-spoke,
  3-7 node target, consistent sizing (160x70 rectangles, 120x80
  diamonds) and spacing (40-80px gutters, 60-120px viewport padding).
- Camera framing: opening `cameraUpdate` with a 4:3 size (400x300 →
  1600x1200), optional mid-diagram pans, and a REQUIRED final
  cameraUpdate that re-frames the whole diagram (otherwise the Excalidraw
  animation camera ends zoomed on the last-drawn element).
- Labels: prefer `label: {text, fontSize}` on shapes/arrows (auto-centers,
  auto-resizes) over bare `text:` fields (which Excalidraw silently
  ignores on rectangles).
- Arrow bindings via `fixedPoint` edge anchors rather than hand-placed
  coordinates; dashed stroke for async/optional paths; short label
  annotations on decision transitions.
- Palette discipline: draws from the read_me palette (pastel fills +
  primary strokes), caps at 3-4 background colors per diagram, assigns
  them semantically (blue=frontend, green=success, yellow=decision,
  red=error).
- Progressive emission order so the draw-on animation tells a story
  (zone → shape → its label → its outgoing arrows → next shape), with
  decorations last.

Also upgrades the model from gpt-4o-mini to gpt-4.1 because Excalidraw
element emission is structured/coordinate-heavy and a smarter model
produces visibly cleaner layouts (aligned nodes, edge-bound arrows,
labeled shapes) in practice.

Before: 3 colored boxes with no text (bare `text:` field silently
dropped), arrows ending on shape centers, no camera framing, no title.
After: 3 labeled boxes with consistent palette, edge-bound arrows with
transition labels, title text, cameraUpdate framing the diagram, and
the agent correctly consults `read_me` once per conversation for the
authoritative format reference.

Progressive streaming (Part 2 of the ask) was investigated and flagged
as shared-package-bound: `@ag-ui/mcp-apps-middleware` emits a single
`ACTIVITY_SNAPSHOT` only AFTER `RUN_FINISHED`, so there are no partial
tool-input events to consume in the cell. The Excalidraw MCP server does
animate elements in order once the full input arrives, which gives the
visual impression of progressive drawing without runtime changes.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 21:05:00 -07:00
Atai Barkai ac361eb853 feat(showcase/langgraph-python): open-gen-ui — educational visualization suggestions + rich prompt guidance
Replaces the generic greeting-card / Pomodoro / revenue-chart suggestions
on the Fully Open-Ended Generative UI (minimal) cell with a set tuned for
intricate, educational visualisations: 3D airplane pitch/yaw/roll, a
feed-forward neural network's forward pass, quicksort, and a Fourier
series square-wave build-up.

Uses the provider's `openGenerativeUI.designSkill` prop (which injects
agent context for the built-in `generateSandboxedUi` tool) to swap in a
visualisation-tuned authoring prompt in place of the default shadcn
design language — covering SVG/canvas geometry, CSS keyframe motion,
mandatory labels + legends + callouts, a semantic palette (indigo /
emerald / amber / rose / slate), typography scale, and the self-running
constraint for the minimal cell. Agent system prompt updated in parallel
so the LLM knows the cell's focus and contract up-front.

Advanced variant untouched.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 21:01:21 -07:00
Atai Barkai 420bc802b6 fix(showcase/langgraph-python): interrupt-headless cell re-run flow
The per-kickoff `agent.setMessages([])` call was racing with the
subsequent `addMessage` + `runAgent` pair, causing the second run
attempt to silently not dispatch (connection-refused on resume in some
timings). Drop the reset — rely on the fresh langgraph thread that each
`runAgent` implicitly produces, and on the existing `runId` marker to
gate ResultCard visibility so the stale result doesn't flash under the
button mid-run.

Validated: initial → modal → result → re-click → modal appears again,
all without a page refresh.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 21:01:06 -07:00
Atai Barkai 4bc5f0f179 refactor(showcase/langgraph-python): gen-ui-agent uses CopilotKitMiddleware + direct state_schema
`create_deep_agent` does not accept `state_schema=` as a kwarg (confirmed
against the installed signature; state schema is only pluggable via
middleware). The minimal state-extending middleware is kept but renamed
to `_GenUiStateMiddleware` with a comment pinning its one purpose, and
`CopilotKitMiddleware` is added so this cell matches every other
langgraph-python cell.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:57:10 -07:00
Atai Barkai 319d2fac19 fix(showcase/shell): prebuilt-components customization ladder — avoid nested <p> hydration error
MDX wraps inline text inside HTML elements in <p> tags. Using <p> as
the outer wrapper for each card's description causes <p><p>text</p></p>
which breaks hydration. Switch to <div> as the outer wrapper.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:56:21 -07:00
Atai Barkai 9a737b6c8d fix(showcase/langgraph-python): open-gen-ui-advanced sandbox-function bridge round-trip
The sandboxed iframe runs with `sandbox="allow-scripts"` only, so a
`<form>` with `<button type="submit">` had its submit blocked by the
browser BEFORE the onsubmit handler could call `e.preventDefault()` —
which meant `Websandbox.connection.remote.evaluateExpression(...)`
never fired. The agent also read `res.result` while the host handler
returns `{ ok, value }`.

Tightened the system prompt and per-suggestion prompts to explicitly
forbid `<form>` / `type="submit"` and to steer the LLM toward the
handler's exact return shape (`res.value` / `res.error`). Validated
end-to-end via Playwright: both `evaluateExpression` and `notifyHost`
now round-trip with visible results in the sandbox UI.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:53:45 -07:00
Atai Barkai d8e9092e99 feat(showcase/langgraph-python): declarative-gen-ui — advertise PieChart + BarChart in a2ui_dynamic system prompt
The PieChart + BarChart renderers were added in 8be81821e as part of the
brand-polish pass, but the a2ui_dynamic agent's system prompt was still
only mentioning dashboards/status/KPIs. Expand the prompt to enumerate
the registered catalog (Card, StatusBadge, Metric, InfoRow, PrimaryButton,
PieChart, BarChart) and name when each chart fits — so the LLM reliably
reaches for PieChart on part-of-whole breakdowns and BarChart on
cross-category comparisons.

Validated on port 4100 with Playwright: "Show a pie chart of sales by
region" renders a brand-coloured donut with legend + percentages, and
"Render a bar chart of quarterly revenue" renders a polished Recharts bar
chart with tooltip. No "Unknown component" errors.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:50:54 -07:00
Atai Barkai a425ffc273 chore(showcase): regenerate registry after gen-ui-agent reorder 2026-04-19 20:50:18 -07:00
Atai Barkai 01b8d17578 refactor(showcase): move gen-ui-agent to bottom of Operational Generative UI
Reorders gen-ui-agent (Agentic Generative UI / In-Chat State Rendering)
to appear AFTER Reasoning (Default Render) in the Operational
Generative UI category, per user preference.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:50:11 -07:00
Atai Barkai 8be81821e2 refactor(showcase/langgraph-python): polish custom cell components to CopilotKit brand
Apply the verified CopilotKit brand palette (lilac #BEC2FF, mint #85ECCE,
near-black #010507, neutral greys) across every custom-defined component in
the langgraph-python cells. Replaces ad-hoc indigo/purple/amber/slate
Tailwind classes with brand tokens, softens corners (rounded-xl/2xl),
switches shadow-lg to shadow-sm, and normalises pill/label styling to
10-11px uppercase tracking-wider.

Preserves all component props, data-testid attributes, and @region markers.
Beautiful-chat (reference) is untouched.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:38:36 -07:00
Atai Barkai bed8081340 chore(showcase): regenerate bundles after HITL row rename
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:32:53 -07:00
Atai Barkai 0cb9cd13ba refactor(showcase): rename In-Chat HITL rows to name the hook API
gen-ui-interrupt and hitl-in-chat both render an interactive time-picker
inline in the chat, but via different API layers:

- gen-ui-interrupt -> useInterrupt (low-level primitive)
- hitl-in-chat -> useHumanInTheLoop (ergonomic wrapper)

Rename to make the dashboard row label reflect the API distinction.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:32:23 -07:00
Atai Barkai 52b9b2012a docs(showcase/shell): custom-look-and-feel — CSS first, Slots (Subcomponents), align unselected tree
- Reorder meta.json so CSS is the first sub-page (easiest rung of the
  customization ladder), then Slots, Headless UI, Reasoning Messages.
- Retitle slots.mdx frontmatter to "Slots (Subcomponents)" so the sidebar
  nav reads the user-facing term people actually search for.
- css.mdx: demonstrate the new file+lines Snippet by pulling the
  user/assistant bubble block straight from the cell's theme.css.
- headless-ui.mdx: expand from a bare IntegrationGrid stub into a full
  page with minimal + complete examples, the three core hooks, and
  Snippet pulls from both headless-simple and headless-complete cells.
- Mirror the css/slots changes into unselected/custom-look-and-feel/ so
  the framework-agnostic tree stays in step (add css.mdx, reorder
  meta.json, retitle slots nav).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:30:53 -07:00
Atai Barkai 384a803935 docs(showcase/shell): prebuilt-components — customization spectrum + per-component sub-pages
- Rewrite overview to present the 4-level customization ladder (drop-in →
  CSS → slots → headless), with a 2x2 card grid linking out to each rung.
- Add a new chat.mdx sub-page for CopilotChat with intro, InlineDemo,
  the CopilotChat GIF, provider-setup snippet, and the standard code
  example from docs.copilotkit.ai.
- Reorder meta.json to chat → sidebar → popup.
- Add gif embeds to sidebar.mdx and popup.mdx (matching docs.copilotkit.ai).
- Point stale /prebuilt-components cross-links at the new
  /prebuilt-components/chat page.
- Align unselected/prebuilt-components.mdx with the ladder framing.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:30:38 -07:00
Atai Barkai e01168e5ef feat(showcase/shell): add Snippet file+lines support for arbitrary-file inclusion
<Snippet> now supports a second lookup mode alongside the existing
region="..." marker: file="..." lines="A-B" pulls a line range (or
the whole file when lines is omitted) from any file in the cell's
bundled files[]. Region lookup wins when both are passed, preserving
all existing call sites.

Parses dash ("10-20"), en-dash, and single-line ("12") ranges.
Surfaces the same graceful WarningBox on missing files / bad ranges
as the region path.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 20:30:24 -07:00
Atai Barkai 63a0c19de7 refactor(showcase/langgraph-python): gen-ui-agent as deep agent with explicit state + tool
Rewrites the gen-ui-agent demo as a minimal deepagents-powered agent that
defines its own `GenUiAgentState` schema (extending langchain's AgentState)
and exposes a custom `set_steps` tool. The tool returns Command(update=...)
to mutate the typed `steps: list[Step]` field, and a one-line middleware
registers the extended schema with deepagents. A last-wins reducer on
`steps` tolerates concurrent tool calls.

No StateGraph, no copilotkit_emit_state, no TodoListMiddleware - the pattern
mirrors how real applications extend deepagents with domain state.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 17:02:21 -07:00
Atai Barkai a1ed347faa Merge remote-tracking branch 'origin/main' into atai/2026-04-18/feature-port-no-docker-restructure
# Conflicts:
#	showcase/scripts/__tests__/bundle-demo-content.test.ts
#	showcase/scripts/lib/manifest.ts
#	showcase/scripts/validate-parity.ts
2026-04-19 16:40:48 -07:00
Atai Barkai d32e780696 refactor(showcase/langgraph-python): rewrite reasoning agents as minimal deep agents
Replace the synthetic _ReasoningEmitterModel + hand-rolled StateGraph
scaffolding in reasoning_agent.py and tool_rendering_reasoning_chain_agent.py
with minimal create_deep_agent graphs (mirrors gen_ui_agent). Drops ~340
lines of custom graph wrappers / synthetic reasoning emitters while
keeping the four mock tools (get_weather, search_flights, get_stock_price,
roll_dice) intact for the tool-rendering-reasoning-chain cell.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 16:31:47 -07:00
Atai Barkai 4bc956346f fix(showcase): null out hallucinated docs-links entries (wrong framework, wrong shell path)
Prior 4085 port blindly copied 4084 docs-links.json patterns, producing many
entries that pointed at wrong-framework docs (e.g. crewai-crews → crewai-flows),
nonexistent shell paths (e.g. /claude-sdk-typescript/... prefix doubled into
/claude-sdk-typescript/claude-sdk-typescript/...), or the wrong field name
(mastra used `shell_docs_url` with absolute http://localhost:3000 URLs).

Audit against live docs.copilotkit.ai and the 4085 shell at :4010 surfaced:
- 9 og_docs_url 404s (8 on claude-sdk-typescript under a nonexistent
  /claude-sdk-typescript/* slug, 1 on /ag2/multi-agent/subagents)
- 24 shell_docs_path 404s (8 claude-sdk-typescript, 6 pydantic-ai, 4 strands,
  4 mastra, 2 langgraph-python)
- crewai-crews pointing entirely at /crewai-flows/... (different product)

Fix: point each entry at a real docs.copilotkit.ai page scoped to the correct
framework OR null it out; normalize shell_docs_path to leading-slash form
that composes with the DocsRow `${shellUrl}/${slug}/unselected${path}` scheme;
null google-adk shell paths (no google-adk-scoped shell docs exist, better to
show ✗ than mislead). Regenerated registry + docs-status bundles.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 16:11:52 -07:00
Atai Barkai dfaae83bcf refactor(showcase/langgraph-python): promote gen-ui-agent to primary via useCoAgentStateRender
- Backend: rewrite `gen_ui_agent.py` as a custom StateGraph that plans a
  3-5 step list via an LLM, then walks through pending->running->completed
  transitions for each step, publishing updates via copilotkit_emit_state.
  The planner LLM call uses copilotkit_customize_config(emit_messages=False)
  so its raw JSON plan never leaks into the chat transcript.
- Frontend: replace the v2 messageView.children + useAgent subscription
  with v1 useCoAgentStateRender from @copilotkit/react-core. The v1
  CopilotKit provider wraps v2 internally, so v2 CopilotChat still works
  inside it. The render prop receives {state, nodeName, status} and
  inlines an InlineAgentStateCard reading the agent's `steps` list.
- InlineAgentStateCard: refactor from a generic key/value dump to a
  proper stepwise tracker with per-step marker (pending number, running
  spinner, completed check) and completion headline.
- Registry: drop `kind: testing` from gen-ui-agent in feature-registry
  and polish its description to highlight the canonical pattern; also
  tighten the manifest.yaml demo description for the same reason.
- Regenerated showcase bundles (registry.json, demo-content.json,
  constraints.json) via `pnpm --filter @copilotkit/showcase-scripts run
  generate-registry && bundle-content`.

Validation (Playwright against localhost:4100/demos/gen-ui-agent):
- Initial: clean welcome screen + three suggestion pills.
- Mid-run: "Step 2 of 5" with first step checkmarked, second spinning,
  rest numbered -- planner JSON no longer leaking as raw text.
- Final: "All 5 steps complete" card + 1-2 sentence LLM summary.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 16:06:00 -07:00
Atai Barkai a84eaaadc9 fix(showcase/langgraph-python): a2ui-fixed-schema book button updates after click (per beautiful-chat)
Override the basic catalog's stateless Button with an ActionButton that
tracks a local `done` state, so clicking "Book flight" visually
transitions to a disabled "✓ Booked" confirmation. Mirrors the
beautiful-chat ActionButton pattern in
src/app/demos/beautiful-chat/declarative-generative-ui/renderers.tsx.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 16:04:08 -07:00
Atai Barkai 1935abd120 feat(showcase/langgraph-python): add Frontend Tools (Async) cell demonstrating async useFrontendTool handler
Introduces the "Frontend Tools (Async)" showcase cell — the async sibling
to the in-app-actions "Frontend Tools" cell. Demonstrates the canonical
async useFrontendTool pattern where the handler awaits a real client-side
async operation and RETURNS A RESULT the agent uses.

Concept: a simulated client-side "notes database" query. The frontend
registers a `query_notes` tool whose async handler sleeps 500ms (emulating
IndexedDB / localStorage / local-cache latency) then filters an in-browser
notes array by keyword and returns matching notes. The agent awaits the
result and summarizes matches for the user.

Files:
- src/agents/frontend_tools_async.py — helpful-assistant graph with no
  backend tools; system prompt instructs the model to call `query_notes`
  for note searches (schema is injected at runtime from the frontend via
  CopilotKitMiddleware)
- src/app/demos/frontend-tools-async/page.tsx — CopilotKit provider +
  CopilotChat, `useFrontendTool({ handler: async (...) => { await sleep;
  return matches; } })` + per-tool render hook that shows a branded
  NotesCard, `useConfigureSuggestions` with three prompts
- src/app/demos/frontend-tools-async/notes-card.tsx — emerald/teal
  gradient card listing matched notes with tag chips
- langgraph.json — register `frontend_tools_async` graph
- manifest.yaml — features list + demos entry
- feature-registry.json — expanded description + docs URLs point to the
  canonical /frontend-tools docs (shared with the sibling cell)
- constraints.yaml — added to all three generative_ui profiles
- docs-links.json — langgraph-python override pointing at /frontend-tools

Validated end-to-end: agent successfully calls `query_notes` with keywords
extracted from natural-language prompts, awaits the async handler, and
summarizes the returned notes for the user.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 16:00:02 -07:00
Atai Barkai 5596c0f08f chore(showcase): delete Frontend Tools (Sync) cell (tool-rendering-frontend-tools)
Removes the `tool-rendering-frontend-tools` cell which was rendering as
"Frontend Tools (Sync)" on the dashboard. Also removes the orphaned
`frontend-tools-sync` feature-registry entry (no package referenced it).
A replacement "Frontend Tools (Async)" cell lands in a follow-up commit.

- Delete demo: src/app/demos/tool-rendering-frontend-tools/ (page + weather-card)
- Delete agent: src/agents/tool_rendering_frontend_tools.py
- Remove from: feature-registry, constraints.yaml (all three generative_ui
  profiles), manifest.yaml (features + demos), langgraph.json (graph),
  docs-links.json

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 15:59:37 -07:00
Atai Barkai 2c10faef6b refactor(showcase): rename hitl-in-app to "(Frontend Tools + async HITL)"
Clarify the positioning of the In-App Human in the Loop cell. The old
label was ambiguous with the in-chat variant; the new label surfaces
the core technical story at-a-glance: this is the async useFrontendTool
pattern where the approval UI pops up OUTSIDE the chat surface.

Also register the cell in the langgraph-python manifest (features list
+ demos entry pointing to the new files).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 15:58:33 -07:00