Morphkit

Problem

Morphkit is the React component library behind Snapp’s back-office apps. Before v1 it was 99 separately versioned packages, one per component or hook, with 1,389 release tags between them.

What I did

I own the library. I merged the 99 packages into one @morphkit/react, next to packages for styles, shared configs, a Vitest preset, blocks, Storybook and the codemod. Accessibility comes from React Aria rather than hand-written focus and keyboard code, and inputs render native form elements, so they work with plain forms, React Hook Form or TanStack Form.

To move the apps already on the old API, I wrote an AST codemod CLI with 39 transforms and ran it blind against a real Nx monorepo, Invoker, keeping a journal of every bug each pilot found. One pilot caught renamed components producing duplicate imports, which crashed the codemod’s re-parse step and left it silently writing back files it had not transformed.

I also built two MCP servers, a Claude Code plugin and agent skills, all generated from the component source and MDX docs. A CI job fails any merge request whose generated output differs from what is committed, so the docs coding agents read cannot drift from the code.

Result

About 95 components, each with Vitest unit tests and a Storybook story checked by the a11y addon. Packages to release went from 99 to about 6. Morphkit is used by 30+ apps on the back-office dashboard, and I presented it to the 45-developer frontend chapter.