migrate-radix-to-base

Run the shadcn CLI info command to detect the current style, then fetch the matching base-style registry variant per component and replay your customizations onto it. Migrate one component at a time, typecheck after each, and flip components.json to the base style only after the last Radix wrapper is gone.

Write the migrated version to a new accordion-base.tsx file, leaving the original untouched, then repoint consumers one at a time with typechecks between each. Once no consumer imports the original, delete it, rename the base file, and commit.

Base UI replaces asChild with the render prop, which accepts a React element or a function receiving props and state. For example, <Trigger asChild><Button/></Trigger> becomes <Trigger render={<Button/>}>, with nativeButton set to false for non-button elements.

No. AspectRatio maps to a CSS aspect-ratio div, Label to a native label element, and VisuallyHidden to the sr-only class. Popover Anchor and NavigationMenu Indicator have no equivalent and are passed through inertly with a flag in the migration report.

Base UI Tabs default to manual activation while Radix defaults to automatic, so keyboard focus no longer switches tabs automatically. The migration flags this as a behavior delta; opt into the old feel with Tabs.List activateOnFocus if desired.

Yes, both libraries coexist without conflicts, which enables progressive migration. Install @base-ui/react alongside Radix packages and remove the Radix dependencies only after the final component is migrated.