@tangle-network/agent-ui
v0.2.0
Published
Shared agent UI components and sidecar integration hooks for Tangle blueprints
Keywords
Readme
@tangle-network/agent-ui
Shared agent-facing UI package for Tangle apps.
Scope
Put code in @tangle-network/agent-ui when it is:
- Agent chat/session UX (
ChatContainer, run timeline, tool previews) - Agent markdown rendering and tool/result presentation
- Sidecar auth/session orchestration and PTY terminal integration
- Reusable agent-focused primitives/hooks (
@tangle-network/agent-ui/primitives)
Do not put code here when it is:
- Chain/contract/provisioning infra (belongs in
@tangle-network/blueprint-ui) - Product-specific route composition, copy, or business workflows (belongs in the app)
- Sandbox-only shell/layout styling concerns (belongs in the sandbox app)
Public API
Entrypoints:
@tangle-network/agent-ui: main agent components/hooks/types@tangle-network/agent-ui/primitives: small shared helpers/hooks for consumer UIs@tangle-network/agent-ui/terminal: lazy terminal view entry@tangle-network/agent-ui/styles: package stylesheet
Treat exported symbols as stable contract; prefer additive changes over breaking renames/removals.
Usage
import { ChatContainer, useWagmiSidecarAuth } from '@tangle-network/agent-ui';
import { copyText, timeAgo } from '@tangle-network/agent-ui/primitives';
const TerminalView = React.lazy(() =>
import('@tangle-network/agent-ui/terminal').then((m) => ({ default: m.TerminalView })),
);Extraction Rule
If Sandbox and Arena share substantial agent-facing code (roughly 20+ lines), extract it here instead of duplicating app-local logic.
Release
- Publish target: npm package
@tangle-network/agent-ui - Workflow:
.github/workflows/publish-agent-ui.yml - Tag format:
agent-ui-vX.Y.Z(must matchpackages/agent-ui/package.jsonversion)
Repo Strategy
@tangle-network/agent-ui is a cross-product package for shared agent experience building blocks.
Keep it in this repo while:
- Most API changes are driven by sandbox-runtime sidecar integration work.
- Release cadence matches this monorepo.
Split to its own repo when:
- There are 3+ external consumers with independent release cadence.
- Separate ownership/review boundaries are needed.
- Most changes no longer depend on this monorepo internals.
Consumer Checklist
Before merging changes that touch agent UX:
- Check if the same pattern exists in both UIs.
- If yes and app-agnostic, move it into
@tangle-network/agent-ui. - Keep exports explicit in
src/index.tsorsrc/primitives.ts. - Verify both consumers still typecheck/build after the change.
