Creance — React UI Kit for Supervising AI Agents
Creance is a React component library for agent supervision — the interfaces for agents that run commands, edit files or spend money, where control matters more than chat. Beyond 70 general-purpose components (buttons, forms, navigation, dialogs, tables, alerts) it ships 20 agent components: approval prompts that name the exact action and its risk level, run timelines, tool-call cards, per-hunk diff review, plans you can edit before they run, kill switches, checkpoint rewinds and a ledger of standing permissions. Styling is one plain stylesheet with stable class names and data-* variants and no runtime styling layer; colours, radii, shadows and fonts all come from --cr-* CSS variables, with light, dark and a solid high-contrast mode shipped together. Every component is its own module, so importing ApprovalPrompt costs 1.87 kB. Simple controls use native elements and harder widgets (dialogs, menus, sliders) use Radix; keyboard shortcuts only fire while focus is inside the component, and status is always carried by shape, icon and text, never colour alone. The site includes a simulated Deploy Fixer run, a live component browser with editable code, Storybook, an llms.txt, and a Vercel AI SDK example app that runs a real model.
Products I own and operate end to end — my roadmap, my users, my on-call.
- ▸Agent products need UI that chat kits don't have: approvals, run timelines, diff review, a way to stop the agent mid-run
- ▸A component library has to theme into someone else's product without dragging in a runtime styling layer
- ▸Supervision UI is safety-critical — an approval a user can't read, reach by keyboard or tell apart without colour is a failure
- ▸20 agent-specific components — risk-labelled approval prompts, tool-call cards, per-hunk diff review, editable plans, kill switches, checkpoint rewinds, a permissions ledger — alongside 70 general-purpose ones
- ▸Plain CSS with stable class names and data-* variants, themed entirely through --cr-* variables; light, dark and solid modes ship together
- ▸One module per component for tree-shaking (ApprovalPrompt is 1.87 kB), tested with Vite and the Next.js App Router
- ▸Native elements for simple controls, Radix for complex widgets, focus-scoped keyboard shortcuts, and status carried by shape, icon and text
Published on npm as @creance-ui/react under the MIT licence
Docs site with a simulated agent run, a live component browser with editable code, Storybook and llms.txt
Vercel AI SDK example app wiring the components to a real model
JobJam.io — AI Job Search & Application Platform
AI-powered job search platform: discover roles, evaluate fit, tailor applications, and close skill gaps. One-time pricing, no subscriptions.
Fathohm — Comprehension-Debt System of Record
See how much of your codebase no human understands. A treemap of your repo colored by human comprehension score, with a tracked, assignable metric for 'who understands what' in an AI-native codebase.
Grenz — Firewall for AI Agents
A local firewall for AI agents: scoped, revocable, observable permissions instead of your full GitHub token. Deny-by-default, MIT licensed, live at grenz.dev.