BREAKING: every utility this package emits is now fui:* instead of
lib:*. Consumers who wrote lib:-prefixed classes against @foomo/ui must
rename them.
"lib" is a plausible prefix for any in-house library, so it risked
colliding in apps that consume more than one. 3658 occurrences across
59 files, plus tailwind.config.js and components.json. The ./lib/*
export path is untouched — only the prefix token moved.
Also drops the ASCII banner comments and the explanatory docblocks I
had added to data-table and the dashboard story.
Verified: 19 stories x 2 themes, 194 overlays opened, 0 console errors
and 0 elements left unstyled.
The .dark block reused the light chart values, so the darkest series sat
on top of the dark card: chart-4 measured 1.73:1 and chart-5 1.17:1
against --card, which is why the revenue/expenses lines looked washed
out. Lightness now ascends 0.52 -> 0.92, keeping the light ramp's
prominence order and its low-chroma mist character.
Measured in the browser: expenses 1.73:1 -> 10.01:1, revenue
3.76:1 -> 5.01:1. All five clear the 3:1 WCAG 1.4.11 non-text minimum;
light mode is unchanged.
Ships the Base UI migration on top of the published alpha.3.
Consumers upgrading from alpha.3 hit breaking changes despite the
prerelease bump: asChild -> render across Button, Badge,
BreadcrumbLink, Item, ButtonGroupText, Prose and every overlay/menu
trigger; AspectRatio.ratio is required; Checkbox takes `indeterminate`;
Separator loses `decorative`; Label is a native <label>;
AlertDialogAction no longer auto-closes; FormControl needs a single
element child. Per-component notes are in .migration/.
Menu.GroupLabel requires a Menu.Group ancestor, which radix's
DropdownMenu.Label did not. Four labels were orphaned and threw
"MenuGroupContext is missing" as soon as those menus opened.
"Workspaces" moves into the group it labels; the standalone headings
("My account", "lena@foomo.org", "Toggle columns") each get their own
group so the visual order is unchanged.
The first QA pass missed this because it opened only the Notifications
menu, which has no label. Replaced with a sweep over every overlay
trigger in every story and tab panel at two viewports: 203 layers, 0
errors.
Regenerates the remaining 18 wrappers as base-maia variants via the
shadcn CLI and removes the radix-ui dependency. src no longer references
radix anywhere.
Using the CLI rather than hand-porting was the deciding factor: it
reapplies the lib: tailwind prefix, lucide resolution and the
menuColor/menuAccent translucent menu treatment, which raw registry
JSON does not contain and which had looked like hand customizations on
dropdown-menu, context-menu and menubar.
BREAKING:
- asChild -> render on Item, ButtonGroupText, Prose and every
overlay/menu trigger
- AlertDialogAction is a plain Button and no longer auto-closes
- Select aligns the active item over the trigger (alignItemWithTrigger)
- FormControl requires a single React element child
Also:
- form/typography move off Slot.Root to useRender
- command narrows children to ReactNode; Base UI Dialog.Root accepts a
render-function child that DialogContent does not
- sidebar drops the stable setOpenMobile setter the registry added to
two dependency arrays
Reports in .migration/, one per component plus project.md.
BREAKING: Badge and BreadcrumbLink no longer accept `asChild`; pass
`render` instead. The Slot idiom becomes useRender + mergeProps, with
data-slot/data-variant supplied via useRender `state`.
BREAKING: AspectRatio has no Base UI primitive and is now a div using
CSS aspect-ratio; `ratio` is required rather than defaulting to 1.
- Content -> Panel (accordion, collapsible, tabs); tabs Trigger -> Tab
- accordion height var -> --accordion-panel-height, with
data-starting-style/data-ending-style for the collapse transition
- accordion/tabs triggers gain aria-disabled variants
- dashboard story: CollapsibleTrigger asChild -> render, and
data-[state=open] -> data-open
BREAKING: Button no longer accepts `asChild`. Use `render` instead:
<Button render={<a href="..." />}>. Matches the shadcn base registry,
which also drops the passthrough data-variant/data-size attributes
(nothing in the library selects on them).
Repoints the internal call-sites in alert-dialog and pagination.
checkbox, switch, separator, scroll-area and label move off radix-ui.
Classes are unchanged: the maia style already uses Base UI data
attributes (data-checked, data-vertical), which radix never emitted.
- label drops the primitive for a native <label>
- separator becomes callable and loses `decorative`
- scroll-area renames ScrollAreaScrollbar/ScrollAreaThumb to
Scrollbar/Thumb
- data-table's header checkbox uses the new `indeterminate` prop
Replace the 26 individual @radix-ui/react-* packages with the unified
radix-ui package and regenerate all components against the maia preset.
- add DataTable built on @tanstack/react-table v9 with sorting, global
filtering, row selection, pagination and column visibility
- add Admin Dashboard and Data Table stories
- clamp the radius scale at lg so maia's 2xl/4xl radii match the system
- drop the bundled Inter typeface from ui.css; hosts now load it
- fix duplicate ./lib/* export and exclude the Vite playground entry
from the library build so react-dom/client is no longer inlined
- paint the Storybook canvas from --background so dark mode applies
outside fullscreen stories
Wlad Meixner