Introduction
@ngaf/ag-ui is the runtime adapter that wraps an AG-UI AbstractAgent into the runtime-neutral Agent contract from @ngaf/chat. The chat UI primitives consume the Agent contract; the AG-UI adapter translates between the contract and the AG-UI event protocol.
What is AG-UI?
AG-UI is the open agent-to-UI protocol from the CopilotKit ecosystem. It standardizes how agent runtimes stream events (messages, tool calls, state updates) to a frontend. Used by CrewAI, Mastra, Microsoft Agent Framework, AG2, Pydantic AI, AWS Strands, and the CopilotKit runtime. One adapter unlocks all of them.
#How it fits
#What you get
toAgent(source: AbstractAgent): Agent- wraps anyAbstractAgentsubclass (custom transports, mocks) into the runtime-neutralAgentcontract.provideAgUiAgent({ url })- DI convenience that instantiatesHttpAgentunder the hood for the common SSE/HTTP case.FakeAgent- in-processAbstractAgentsubclass that emits canned streaming events for offline demos and tests.
#What's covered
Scope of the first release:
messages(streaming token deltas viaTEXT_MESSAGE_*events)status/isLoading/error(lifecycle viaRUN_STARTED/FINISHED/ERROR)toolCalls(streaming tool calls viaTOOL_CALL_*events)state(snapshots and JSON-Patch deltas)events$(custom events; discriminatesstate_update)
Out of scope for now (use @ngaf/langgraph if you need these):
- Interrupts
- Subagents
- History / time-travel
#Next steps
- Quick Start - bind
<chat>to an AG-UI backend in 5 minutes. - Installation - npm install + provider setup.
- Architecture - understand the adapter boundary and provider choices.
- Event Mapping - see how AG-UI events update
Agentfields. - Fake Agent - build UI without a backend.
- Citations - attach sources through
state.citations. - Troubleshooting - debug provider, stream, state, and citation issues.