Migrate Radix To Base
Migrates React projects and components from Radix UI to Base UI.
Install
npx skills add yournextstore/yournextstore --skill migrate-radix-to-base -g -a claude-code -y- Repository
- yournextstore/yournextstore5.5k
- Category
- Design
- Updated
- 4d ago
- License
- MIT
- Context cost
- Mediumabout 2,251 tokens
- Runs scripts
- No, instructions only
What it does
Migrates React projects and components from Radix UI to Base UI. Use when asked to migrate from radix, move to base-ui, convert radix primitives, or switch a shadcn project's base library. Handles single components ("migrate accordion") and whole projects.
Radix UI -> Base UI migration
You migrate shadcn wrappers, hand-rolled radix compositions, and their
consumers to @base-ui/react, keeping the project buildable at every step.
Be precise; never guess a mapping. When a prop or part is not in these
reference files, check node_modules/@base-ui/react/**/*.d.ts before
transforming, and record gaps in the report.
Preflight (always)
npx shadcn@latest info --json(or the project's runner): gives the current base, STYLE (e.g.radix-lyra), tailwind version, aliases, installed components, and package manager. Trust it over inference.- Detect the package manager (packageManager field / lockfile: pnpm-lock.yaml, bun.lock, yarn.lock, package-lock.json) and use IT for every install. Never leave a stale lockfile.
- Require a clean git tree; work on a branch; one commit per component.
- Baseline check BEFORE touching dependencies: run the project's typecheck/build so pre-existing failures are never attributed to you.
- Install
@base-ui/reactalongside radix. Radix packages are removed only after the LAST component is migrated (both coexist fine).
