Skip to main content
inkbridge
Free

Adopt a component with form logic

Real components aren't always cleanly presentational — a field wired to react-hook-form, redux, or animation. How to cut the seam so Inkbridge can model it: a story per state, a decorator for the runtime, or a presentational extraction.

How it works

A Storybook story is a component frozen at one state and cut off from its runtime — args instead of redux, static instead of animated. That is the seam Inkbridge models. A component fused with form logic, a store, or motion has no seam yet, so the scanner (which drops hooks and resolves expressions to static snapshots) sees little. The fix is the best practice you would want anyway: add a story per meaningful state with mocked args, wrap the runtime in a decorator (a store or context provider), and if presentation and behaviour are truly tangled, extract a presentational view the story renders. The `diagnose_component` MCP tool does the reading for you — it names the couplings with evidence, proposes the states worth storying, and verdicts whether a decorator or a presentational extraction is the fix — and then write_component lands the result, conformance-gated. Presentation becomes reviewable and round-trips; the behaviour stays in code, untouched.

onboardingencapsulationstoriesagentsworkflow

Related