Agent UI for Angular · MIT

Ship production agent UIs in Angular.

Signal-native chat, threads, interrupts, tool progress, and generative UI for LangGraph, AG-UI, and A2UI. MIT-licensed, self-hostable, app telemetry off by default, no React rewrite.

Talk to our engineers
MITAngular-native SignalsLangGraph + AG-UIA2UI-compatibleSelf-hostableApp telemetry off by default

Not another backend agent runtime. Keep LangGraph, Genkit, Mastra, CrewAI, or your own service. Cacheplane solves the Angular UI layer.

Works with your agent stack

Bring the model, runtime, and UI protocol you already use.

NGAF gives Angular teams signal-native primitives for LangGraph, AG-UI, chat, and generative UI without locking the backend to one provider.

Model providers
OpenAI
model provider
Anthropic
model provider
Google Gemini
model provider
Azure OpenAI
cloud provider
Amazon Bedrock
cloud provider
Agent runtimes
LangGraph
native adapter
AG-UI
protocol adapter
CrewAI
via AG-UI
Mastra
via AG-UI
Pydantic AI
via AG-UI
Microsoft Agent Framework
via AG-UI
AWS Strands
via AG-UI
CopilotKit Runtime
via AG-UI
Angular surface
Angular
native DI + signals
RxJS
interop ready
Vercel json-render
render protocol
Google A2UI
render protocol

Why this exists

The fullstack agentic library for Angular.

NGAF brings the pieces of an agentic product into one Angular-first SDK: runtime adapters, signal-native streaming, tool events, generative UI, and production patterns. It is built from real agent UI experience, not a thin integration layer.

Runtime layer

One Angular contract for every agent runtime.

Wire LangGraph, AG-UI, CrewAI, Mastra, Pydantic AI, AWS Strands, or your own backend behind the same Angular primitives.

Streaming state

Messages, status, errors, and tools as signals.

agent() exposes token streams, interrupts, tool progress, branch history, error(), status(), and reload().

Generative UI

Agent output renders into your component system.

Render Vercel json-render and Google A2UI specs into Angular components you already own.

Production surface

The pieces that move a demo into production.

Fallbacks, reloads, persistence patterns, observability hooks, and MIT-licensed primitives you can own long term.

Stream

Stream tokens to Angular signals — no glue code.

provideAgent + agent() give you signals for messages, status, errors, and interrupts. LangGraph and AG-UI adapters share the contract — swap runtimes without rewriting the UI.

  • Token-level streaming straight into Angular signals
  • Thread state, interrupts, tool progress, branch/history
  • Adapters: LangGraph (@ngaf/langgraph), AG-UI (@ngaf/ag-ui)
  • One contract, swappable runtimes
provideAgent
Wire the agent into your app.config.ts.
AgUiAdapter
Any AG-UI compliant backend.
LangGraphAdapter
Native LangGraph streaming.
Read the streaming guide →
cockpit.cacheplane.ai/langgraph/streaming
Cockpit reference app — Angular streaming guide with provideAgent setup

Render

Generative UI that renders into your design system.

Server-emitted JSON specs become Angular components you already own. Vercel json-render and Google A2UI both supported, with per-component fallback and a readiness gate.

  • Per-component fallback API + readiness gate
  • A2UI v0.9-compatible protocol + Vercel json-render adapter
  • Renders into your existing component library
  • Server-side schema, client-side trust
chat-timeline
Drop-in conversation surface.
chat-debug
Live devtools for tool calls.
GenUI surfaces
Schema-driven UI from agent output.
See @ngaf/render →
cockpit.cacheplane.ai/langgraph/api
Cockpit reference app — API reference rendered as structured cards

Ship

Patterns built for production, not demos.

Error boundaries, observability hooks, fallback strategies — the stuff that turns a demo into a real app. MIT-licensed, so the code is yours forever.

  • error() / status() / reload() signals
  • Readiness gate + per-component fallback
  • Thread persistence patterns
  • MIT licensed — own it forever
error/status/reload
Boundary signals for every agent.
readiness gate
Hold renders until the surface is real.
thread persistence
Restore conversations across sessions.
Production patterns →
demo.cacheplane.ai
Loading demo…

For teams

Ship your first Angular agent in 8 weeks.

Pilot-to-Prod is a concierge delivery — concrete outcomes, your engineers in the driver's seat, no lock-in.

  • Working agent demo on your domain
  • Hardened production patterns (error/fallback/observability)
  • Deploy-ready integration with your CI/CD
  • Team trained on the framework + LangGraph
1
Discover
Map your stack, surfaces, and the agentic work that earns its keep.
2
Build
Ship a working demo on your real data, in your real Angular app.
3
Harden
Observability, error boundaries, deploy paths, on-call patterns.
4
Train
Your team owns the stack. We leave you with a runbook, not a black box.

Field report

The last-mile gap in Angular AI.

  • Six production-readiness dimensions for Angular AI
  • Concrete patterns — error boundaries, fallbacks, observability, deploy
  • No vendor pitch. Just what we learned shipping it.

Already on the list? Download the PDF directly.

angular-agent-readiness-guide.pdf
Field report · 18 pages
From Prototype to Production
Six production-readiness dimensions for Angular AI teams.
Agent UI for Angular

Built on principles

What we won't do.

Honest commitments, not aspirations.

No closed core

MIT today, MIT tomorrow. Primitives and compositions both stay in the open repo. Pilot-to-Prod is the only paid thing.

No abandoned majors

We support Angular’s current and previous LTS versions.

No required cloud

Self-host LangGraph + your Angular app. Run it all in your VPC.

No app telemetry

We don’t collect prompts, completions, tool data, or app runtime content by default. Package installs send a minimal opt-out ping.

No model lock-in

Adapters work with any LLM your runtime supports. Swap providers without changing Angular code.

Questions

Frequently asked questions.

How is this different from CopilotKit or AG-UI directly?
CopilotKit has an Angular SDK; ours is built around signals and DI as the substrate, not a port. AG-UI is a protocol, not a UI library — you still build the Angular side. Agent UI for Angular gives you signal-native primitives plus adapters that hide the protocol, so you can swap LangGraph for AG-UI without rewriting your UI.
Does it work with my existing Angular app?
Yes. Drop provideAgent (or provideAgUiAgent) into your app.config.ts. The headless primitives don’t impose any UI; the chat compositions are opt-in.
Can I use this without LangGraph?
Yes. Use the @ngaf/ag-ui adapter for any AG-UI compliant backend, or implement the agent contract yourself. The Angular side doesn’t know which runtime is behind it.
Is the Pilot-to-Prod program required?
No. The libraries are MIT-licensed and complete on their own. Pilot-to-Prod is for teams who want concierge delivery, not a paywall.
What does it cost?
Libraries: free, MIT. Pilot-to-Prod: scoped per engagement — see the pricing page.
Is this production-ready today?
It runs the full stack in our reference deployment (cockpit.cacheplane.ai), and breaking changes are called out in release notes. We support Angular’s current and previous LTS versions.
Where do I report issues?
GitHub Issues. Pilot customers also get a private channel.
I’m using CopilotKit today — how hard is the migration?
Component-by-component. CopilotKit’s chat hooks have rough equivalents in our agent() signal API, and CopilotKit actions map to LangGraph/AG-UI tool calls. Thread state lives in a service (not the component tree), so plan a session to port that. There isn’t a one-shot codemod.
Does it work with Angular Universal / SSR?
Streaming is client-side by design — agents are stateful and signal-based. If your shell is SSR’d, the agent-talking parts stay client-only; render fallbacks during hydration via standard Angular SSR patterns.
How do I test agent-driven components?
The agent is provided through Angular DI, so test doubles work the way you’re used to — supply a stub agent in your test module, drive it with signals, assert on the rendered output. See /docs/agent/guides/testing.

Stop stalling on agentic Angular.

Install the framework, read the docs, and have a streaming chat in your app this afternoon.

Try the demo →See each feature in action →

MIT · No signup required · App telemetry off by default