Component Doc Generator
An interactive tool that turns a bare component into a documented one. Paste in a component's source (React, Vue, or anything else) or pick a sample, and it writes a description, a props table, and two usage snippets.
The model doesn't write free text that the page then has to parse. It has to call one tool, and that tool's input schema is the docs themselves: a description, a list of props, and two snippets. The API route streams the tool's input as it arrives, so the page fills in section by section instead of waiting on one long response.
The finished result is checked against the same zod schema that generates the tool definition, so a bad response becomes an error message instead of a broken page. Input that isn't a component, like a stack trace or a config file, is refused instead of getting invented docs. Oversized pastes and text with no code in it are rejected before they reach the model.
It's built as a playground, not a form: a client-side island that holds the component source and the incoming docs, plus a live preview for the three bundled samples.
The pitch is design-systems teams write component docs by hand, or not at all. This is what that step looks like when an LLM does the first pass and a human edits from there instead of starting blank.
links
No separate repo: this ships as a route inside tbssnch.dev's own codebase.
design-systems, ai-native, react, anthropic-api