Most design systems we benchmarked were React-only. The best of
them ship a dist/ folder of .tsx files and a Storybook. Their
shape ends at the React boundary.
Helix went the other way: every component is a Lit-based custom element. React, Vue, Solid, and the next framework all consume the same primitive, and so does any AI agent we ask to build on top of the system.
The bet
Wrappers are mechanical. Once a component is a custom element with a Custom Elements Manifest, code generation gives you wrappers in any framework for free. The author writes one file. Every framework gets a typed component. An AI agent reading the manifest gets the same shape, the same enums, the same docs, and emits idiomatic code on the first try.
That last part is the real prize. We're building Fusion for a decade where the AI helping you ship a product needs to read your design system as confidently as a teammate. CEM-first authoring is the cheapest way to give it that.
What we gave up
You give up React-specific patterns: server components emit
HTML without your styles or scripts, you can't render shadow
DOM on the server, and React's hydration semantics treat custom
elements as opaque. We built @fusion-io/helix-next to paper over the
rough edges.
What we got back
Component logic that survives framework rewrites. AI agents can read one manifest and emit a wrapper in any target. The same component ships to Next, to a Vite Vue prototype, and to a vanilla HTML demo without forking. When backend and infra primitives roll into Helix, the same discipline applies: every piece of the substrate is legible to the agent that's going to build on top of it.