Repository navigation
feat(mosaic): render compound components from Server Components - #10795
alexcarpenter wants to merge 7 commits into
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
🦋 Changeset detectedLatest commit: 6733f4e The changes in this PR will be included in the next version bump. This PR includes changesets to release 2 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the
|
|



Description
Compound components (
<Avatar.Root>,<Item.Group>, ...) can now be rendered from React Server Components.Before this change, each compound was a plain object exported from a
'use client'module. Next replaces every export of such a module with a client reference, soAvatar.Rootwasundefinedon the server.Each of the 25 compound components now follows the Base UI layout:
<name>.tsxis a'use client'leaf with prefixed exports (CardRoot,CardBanner, ...).<name>.parts.tsre-exports them under the part names (Root,Banner, ...).index.tshas no directive and doesexport * as Card from './card.parts'.X.Partusage and theXPropstypes are unchanged. Each compound is now a module namespace object, so its parts are read-only.Other changes:
tsdownbuilds withunbundle: true, so each file keeps its own'use client'directive.scripts/check-bundle.mjsnow checks rules instead of a file list. It reads.,./components/*and./primitives/*from theexportsmap. Each entry must either start with'use client'or only re-export namespaces built from directive-free parts files. Any parts module that importsreactmust be a'use client'leaf.dist/index.jsis now a small re-export file, sopnpm bundlewatchfirst bundles it with rolldown (dependencies and peer dependencies left external) intodist/.bundlewatch/index.jsand measures that against the existing 95KB budget.dist/.bundlewatchis excluded from the published files.Panel.Titlepasses[ref, panelTitleRef]touseRender. Theforward-ref-partsrule now checks it because it is exported, and it could not trace the old conditional ref. Behavior is unchanged, becauseuseRenderreturns before attaching refs whenenabledis false.Notes for review:
Dialog.createHandleis the one part that isn't a component. On the server it is a client reference and can't be called.Stacked on #10754.
Checklist
pnpm testruns as expected.pnpm buildruns as expected.Type of change