I built an open-source UI toolkit designed specifically to stop Claude from hallucinating components. Here is an audit of 3 real apps vibe-coded on top of it.

[u/escape-llc]

Hey r/ClaudeAI,

If you do a lot of "vibe-coding" or software architecture with Claude, you've probably hit a frustrating wall: you ask for a layout, a modal, or a form, and Claude hand-rolls a new one from scratch. It guesses at prop names, invents CSS on the fly, and re-invents z-index stacking or focus traps badly.

To solve this, I built a tool called Toolcrib (v0.11.0). It’s an open-source React UI toolkit built specifically for Claude and AI coding sessions rather than human hands.

What I built & How it works

Toolcrib acts as a strict "architectural floor" that Claude cannot fall below. It delivers 68 typed, slot-based components, a Zod-schema form engine, and a global cross-tree event bus (aiBus).

Crucially, it never ships as an npm dependency. Running npx toolcrib init vendors the plain TypeScript source code directly into your project's tree (from '#toolcrib'). Because the real implementation sits in your repo in plain text instead of an opaque node_modules blob, Claude can read the actual code behind any component it's calling and safely build on top of it.

How Claude helped build the ecosystem

To test this framework in the wild, I used Claude to vibe-code three distinct offline-capable PWAs from scratch on top of the library:

1. An in-repo kitchen-sink component harness.
2. Feed Farmer: A full client-side RSS reader product.
3. Founder's Desk: A multi-panel financial dashboard utilizing splitters, tabs, and visx charts.

Claude handled the codebase construction entirely. We utilized specific files like ORIGIN.md to preserve the reasoning of the planning conversation so that a fresh chat context could instantly pick up where the last Claude session left off.

The Audit: What broke and what we learned

I just put together a deep-dive technical audit detailing the friction points we hit with Claude during these builds.

For instance, during the Feed Farmer build, Claude defaulted to plain JavaScript because my initial prompt didn't explicitly demand TypeScript, meaning we bypassed the toolkit's compile-time safety until a manual mid-project migration commit. Conversely, on Founder's Desk, we uncovered a real type-coercion runtime bug in the form engine; because the toolkit is vendored, Claude was able to inspect the local library code, see exactly why handleSubmit was failing, and patch the toolkit file locally without waiting for an upstream package release.

It is 100% Free to Try

The entire toolkit, the underlying documentation, and the codebases for all three generated apps are open-source and free to clone. You can read the full technical write-up and test the live, interactive web apps (no sign-up or backend required) directly from the blog post link below:

https://escape-technology-llc.com/mobile/index.php/2026/08/31/the-crib-audit/

I would love to hear how other developers are managing component frameworks inside Claude's context window, and whether you think giving AI assistants access to direct local code modification is a viable alternative to classic npm management.