ProjectsBreakthrough UI
Breakthrough UI
Renamed from Royer UI in October 2026.
Stack
- Next.js
- React
- TypeScript
- Tailwind
- Storybook
What it is
Breakthrough UI, my own component library at ui.royeradames.com. The public catalog had more than 160 components, blocks and pages on October 12. A private tier, Breakthrough UI Pro, sits behind my own sign-in.
Why it exists
My side projects need shared UI that each app copies and owns, built on parts I can reuse and learn from.
How it works
Public entries come only from MIT sources, shadcn/ui and Kibo UI, and from original work. Licensed blocks stay private, for my own projects. Signed out, private pages send you to sign-in, and the private registry answers like an entry that doesn't exist. New public components are generalized from three or more versions already shipped.
Story
The most useful part is what I kept out.
I wanted my own UI library: components, blocks and pages my side projects copy and own. A day in, I bought a subscription to a paid block catalog built on shadcn/ui. The plan became one original block for each of theirs. Then I asked whether its free blocks could go straight in.
They couldn't. The terms call even the free blocks the vendor's copyrighted work and forbid republishing them as a library or catalog. Free to use was not free to publish.
So I split the library in two. The public side takes only shadcn/ui, Kibo UI and original work, with their MIT notices kept. The private side holds licensed blocks tailored to my own projects, behind my sign-in. A test plants a canary entry and fails if it shows up anywhere public.
I set that rule, asked to generalize the way shadcn did and approved turning the private side on; AI coding agents wrote the code, ran the checks and merged.
The public side still needed original components. The shadcn/ui changelog says its author built 30+ sidebars before simplifying them into one. The rule: generalize only from three or more shipped versions.
The pilot was Empty, the screen for when there's nothing to show. Fifteen shipped versions, twelve of them in six of my Frontend Mentor apps, became six parts and three option sets of two values each. Eight rebuilt on the parts kept their structure, so the API was frozen.
It showed where versions hide. Searching for the component's name found one. Searching the text found a second, one-line shape in fourteen places. And the docs page is a caller too: its own demo broke heading order and dropped focus.
Merging needed its own fix. Of my open pull requests, 93% of pairs collided, mostly on files nobody writes by hand. Those files are now generated at build time, and six reviewed pull requests then landed together, checked once as one combined change.
Where it stands: Breakthrough UI Pro is live behind my sign-in. Empty is merged.
The line I drew decided my design method: what I can't publish, I find in work I've already shipped.
Public components build on shadcn/ui and Kibo UI (MIT, notices kept). The 30+ sidebars detail is from the shadcn/ui changelog. Frontend Mentor designs are matched by structure only. Build: Royer Adames, with AI coding agents.