2026 · Creator & Maintainer
ng-agentic
Agent UI your compliance team can sign off on.
The problem
In fintech, KYC, legal and health, an AI feature comes with three extra expectations: a human can step in, AI content is distinguishable from human content, and every decision is traceable. Most agent UI kits treat those as edge cases, and very few of them are built for Angular. Teams end up hand-rolling chat, tool-call views and approval dialogs for every product.
The solution
An open-source library of signal-driven, standalone Angular components for AI and agent interfaces, published on npm under MIT as @ng-agentic/core and @ng-agentic/themes.
- Chat: streaming with smooth markdown reveal, syntax-highlighted code, a collapsible reasoning trace and a live cursor.
- Tool Call: cards that make every tool the agent uses visible.
- Plan: execution plans that show the agent's work step by step.
- Approval: human-in-the-loop gates to approve, edit or reject an action, with full state tracking.
- Provenance: one consistent visual language for what the AI wrote, suggested or summarized, across chat, summaries and form fields.
- Suggestion, Summary and Sidebar: the supporting pieces to place an assistant inside an existing product.
It is backend-agnostic: you bring your own transport through an AG-UI-compatible contract. Theming runs on three layers of design tokens (primitive, semantic, component) with light and dark presets, AA contrast and keyboard-first interaction.
Why I built it
I spent years at Ontop working on two things: a shared component library and the KYB and KYC onboarding around it. When I started building with AI agents I noticed the UI side of regulated products was missing in Angular, so I put both experiences together. I own the whole thing: scope, semantic versioning, release strategy and documentation.
See it working: KYC Vetted
KYC Vetted is a live demo of AI-assisted KYC onboarding built on @ng-agentic/core and the Claude Agent SDK, using synthetic data. Documents are extracted automatically with per-field confidence, forms are auto-filled, and a contextual assistant helps the reviewer. The agent flags high-risk cases and recommends a decision, but nothing closes without a human, and the audit log separates what the AI did from what a person did.
Tech stack
Angular 21 Signals Standalone Components TypeScript RxJS SCSS Design tokens AG-UI npm Claude Agent SDK (demo)
Challenges
Streaming without jank
Revealing markdown token by token (including code blocks) while keeping the layout stable and the reasoning trace collapsible.
Approvals as state, not a confirm()
Modeling approve, edit and reject as tracked state so the product always knows who decided what, and when.
Themeable without forking CSS
Three token layers so a team can swap a preset or restyle a single component without touching the library's styles.
A contract instead of a backend
Keeping the components independent from any model or server through an AG-UI-compatible transport.