feat(ui): Add experimental mosaic components export#9045
feat(ui): Add experimental mosaic components export#9045alexcarpenter wants to merge 17 commits into
Conversation
🦋 Changeset detectedLatest commit: 98ef8ea The changes in this PR will be included in the next version bump. This PR includes changesets to release 3 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 |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
📝 WalkthroughWalkthroughThe PR restructures Mosaic organization profile into compound section components, updates MosaicProvider styling insertion and reset behavior, adds an experimental Mosaic entrypoint, and rewires swingset stories, registry entries, and docs to the new organization-profile structure. ChangesOrganization Profile section/controller restructure
Estimated code review effort: 4 (Complex) | ~60 minutes MosaicProvider insertion point and CSS reset
Estimated code review effort: 3 (Moderate) | ~25 minutes Public experimental/mosaic export surface
Estimated code review effort: 4 (Complex) | ~45 minutes Swingset storybook, registry, and docs restructuring
Estimated code review effort: 3 (Moderate) | ~25 minutes Possibly related PRs
Suggested reviewers: Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches📝 Generate docstrings
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 Biome (2.5.1)packages/swingset/src/lib/registry.tsFile contains syntax errors that prevent linting: Line 54: Expected an expression but instead found '}'. Comment |
@clerk/astro
@clerk/backend
@clerk/chrome-extension
@clerk/clerk-js
@clerk/electron
@clerk/electron-passkeys
@clerk/eslint-plugin
@clerk/expo
@clerk/expo-passkeys
@clerk/express
@clerk/fastify
@clerk/hono
@clerk/localizations
@clerk/nextjs
@clerk/nuxt
@clerk/react
@clerk/react-router
@clerk/shared
@clerk/tanstack-react-start
@clerk/testing
@clerk/ui
@clerk/upgrade
@clerk/vue
commit: |
|
!snapshot |
|
!snapshot |
This comment has been minimized.
This comment has been minimized.
|
!snapshot |
This comment has been minimized.
This comment has been minimized.
|
!snapshot |
This comment has been minimized.
This comment has been minimized.
|
Hey @alexcarpenter - the snapshot version command generated the following package versions:
Tip: Use the snippet copy button below to quickly install the required packages. npm i @clerk/astro@3.4.11-snapshot.v20260630204952 --save-exact
npm i @clerk/backend@3.9.1-snapshot.v20260630204952 --save-exact
npm i @clerk/chrome-extension@3.1.47-snapshot.v20260630204952 --save-exact
npm i @clerk/clerk-js@6.23.1-snapshot.v20260630204952 --save-exact
npm i @clerk/electron@0.0.8-snapshot.v20260630204952 --save-exact
npm i @clerk/electron-passkeys@0.0.4-snapshot.v20260630204952 --save-exact
npm i @clerk/eslint-plugin@0.2.1-snapshot.v20260630204952 --save-exact
npm i @clerk/expo@3.6.5-snapshot.v20260630204952 --save-exact
npm i @clerk/expo-passkeys@1.1.13-snapshot.v20260630204952 --save-exact
npm i @clerk/express@2.1.35-snapshot.v20260630204952 --save-exact
npm i @clerk/fastify@3.1.45-snapshot.v20260630204952 --save-exact
npm i @clerk/headless@0.0.7-snapshot.v20260630204952 --save-exact
npm i @clerk/hono@0.1.45-snapshot.v20260630204952 --save-exact
npm i @clerk/localizations@4.12.1-snapshot.v20260630204952 --save-exact
npm i @clerk/msw@0.0.43-snapshot.v20260630204952 --save-exact
npm i @clerk/nextjs@7.5.12-snapshot.v20260630204952 --save-exact
npm i @clerk/nuxt@2.6.11-snapshot.v20260630204952 --save-exact
npm i @clerk/react@6.11.4-snapshot.v20260630204952 --save-exact
npm i @clerk/react-router@3.5.4-snapshot.v20260630204952 --save-exact
npm i @clerk/shared@4.23.1-snapshot.v20260630204952 --save-exact
npm i @clerk/swingset@0.0.13-snapshot.v20260630204952 --save-exact
npm i @clerk/tanstack-react-start@1.4.12-snapshot.v20260630204952 --save-exact
npm i @clerk/testing@2.2.2-snapshot.v20260630204952 --save-exact
npm i @clerk/ui@1.24.1-snapshot.v20260630204952 --save-exact
npm i @clerk/upgrade@2.0.5-snapshot.v20260630204952 --save-exact
npm i @clerk/vue@2.4.11-snapshot.v20260630204952 --save-exact |
| import { expandConditions } from './conditions'; | ||
| import { useMosaicTheme } from './MosaicProvider'; | ||
| import { resolveSlotClassName, resolveSlotCss } from './resolveSlot'; | ||
| import { defaultMosaicVariables, resolveVariables } from './variables'; | ||
| import type { MosaicTheme } from './variables'; | ||
| import { defaultMosaicVariables, resolveVariables } from './variables'; |
There was a problem hiding this comment.
just a sorting change
…imental exports Rename the experimental Mosaic parts and their files so the source symbols match how they are exported from @clerk/ui/experimental/mosaic: - DeleteOrganization -> OrganizationProfileDeleteSection - LeaveOrganization -> OrganizationProfileLeaveSection - OrganizationProfileGeneral -> OrganizationProfileGeneralPanel - OrganizationProfile unchanged The rename cascades through each part's view, controller, and machine symbols and their co-located tests. The experimental entry no longer needs to alias on re-export. In @clerk/swingset, flatten the AIO/Panels/Sections sidebar groups into a single Organization group, and render each entry by its export name (components as <Name />, hooks as useName()), wrapping long names instead of overflowing. Public export names from @clerk/ui/experimental/mosaic are unchanged, so there is no user-facing impact.
API Changes Report
Summary
@clerk/uiCurrent version: 1.24.2 Subpath
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (5)
packages/ui/src/experimental/mosaic.ts (1)
3-40: 🧹 Nitpick | 🔵 TrivialDocs team should review this public entrypoint JSDoc.
This module-level doc will surface in generated Clerk Docs, so please confirm the RSC/client-boundary wording and exported surface stay aligned with the intended public API.
As per path instructions, public/reference-facing APIs may appear in generated docs.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/ui/src/experimental/mosaic.ts` around lines 3 - 40, The module JSDoc in Mosaic’s experimental entrypoint needs a docs review to ensure its client/RSC boundary explanation and exported API description match the actual public surface. Update the comment around the top-level exports from mosaic.ts so it accurately reflects what consumers can import and how OrganizationProfile versus the flat panel/section exports should be used, keeping the wording aligned with the intended Clerk Docs output.Source: Path instructions
packages/ui/src/mosaic/sections/organization-profile-delete-section.tsx (1)
6-18: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winConsider adding JSDoc for this public flat export.
OrganizationProfileDeleteSectionis one of the flat exports intended for direct RSC usage per the PR summary. Since Clerk Docs generates reference pages from JSDoc on public/reference-facing APIs, consider documenting this component (purpose, usage note about requiringMosaicProvider, etc.) so it renders correctly in generated docs.As per path instructions, "If a PR adds or changes public/reference-facing API surface area, check whether the corresponding JSDoc is present, accurate, and aligned with the implementation" and reference-facing changes "may need Docs-team review."
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/ui/src/mosaic/sections/organization-profile-delete-section.tsx` around lines 6 - 18, Add JSDoc to the public flat export OrganizationProfileDeleteSection so Docs can generate a reference page for it. Document its purpose, the direct RSC usage intent, and the requirement that it be rendered within MosaicProvider, keeping the description aligned with the implementation and other reference-facing exports in this area.Source: Path instructions
packages/ui/src/mosaic/aio/organization-profile.tsx (1)
9-30: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winAdd JSDoc on the
OrganizationProfilecompound export.
OrganizationProfileis the primary public export of the newexperimental/mosaicentrypoint (compound with.GeneralPanel,.LeaveSection,.DeleteSection). Since it's reference-facing, consider adding a JSDoc block (purpose, requiredMosaicProviderancestor,'use client'requirement noted in the PR description, and documenting the attached parts) so generated docs reflect this API accurately.As per path instructions, "If a PR adds or changes public/reference-facing API surface area, check whether the corresponding JSDoc is present, accurate, and aligned with the implementation."
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/ui/src/mosaic/aio/organization-profile.tsx` around lines 9 - 30, Add a JSDoc block to the public OrganizationProfile export so the reference docs capture this compound API accurately. Document that OrganizationProfile is the primary experimental/mosaic entrypoint, that it requires a MosaicProvider ancestor and a client-only environment, and list the attached compound parts (GeneralPanel, LeaveSection, DeleteSection). Place the comment on the OrganizationProfile binding in organization-profile.tsx so it stays aligned with the implementation and its Object.assign-based export shape.Source: Path instructions
packages/ui/src/mosaic/panels/organization-profile-general-panel.tsx (1)
7-14: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winConsider adding JSDoc for this public flat export.
Same as
OrganizationProfileDeleteSection—OrganizationProfileGeneralPanelis one of the flat exports intended for direct RSC usage. Documenting it would help keep generated reference docs accurate for this new public surface.As per path instructions, reference-facing exports should have JSDoc so generated docs reflect the implementation.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/ui/src/mosaic/panels/organization-profile-general-panel.tsx` around lines 7 - 14, Add JSDoc to the public flat export OrganizationProfileGeneralPanel so generated reference docs include it for direct RSC usage. Update the function declaration in OrganizationProfileGeneralPanel to include a concise descriptive comment, matching the documentation style used by OrganizationProfileDeleteSection and other reference-facing exports.Source: Path instructions
packages/ui/src/mosaic/sections/organization-profile-delete-section.controller.tsx (1)
23-42: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winDuplicate post-action navigation logic vs. leave controller.
The revalidate + fire-and-forget
router.navigate(afterLeaveUrl)block (Lines 36-42) is duplicated nearly verbatim inorganization-profile-leave-section.controller.tsx. Consider extracting a small shared hook (e.g.,useAfterOrgActionNavigate(afterLeaveUrl)) since more sections are being added to this namespace.♻️ Sketch of a shared helper
// packages/ui/src/mosaic/hooks/useAfterOrgActionNavigate.ts export function useAfterOrgActionNavigate() { const router = useMosaicRouter(); const afterLeaveUrl = useMosaicEnvironment()?.displayConfig.afterLeaveOrganizationUrl; return () => { if (afterLeaveUrl) { void router.navigate(afterLeaveUrl); } }; }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/ui/src/mosaic/sections/organization-profile-delete-section.controller.tsx` around lines 23 - 42, The post-action navigation/revalidate logic inside useOrganizationProfileDeleteSectionController is duplicated in the leave controller, so extract the shared “after org action” behavior into a reusable hook or helper and call it from both controllers. Keep the existing destroy/revalidate flow in organizationProfileDeleteSectionMachine’s context, but move the afterLeaveUrl lookup and fire-and-forget router.navigate behavior into a shared function such as useAfterOrgActionNavigate so future organization sections can reuse it.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/mosaic/__tests__/MosaicProvider.test.tsx`:
- Around line 85-94: The MosaicProvider reset test only covers the unlayered CSS
path; extend the existing test around MosaicProvider/styleText to also assert
the layered reset output when cssLayerName is provided and that the nonce value
is forwarded to the generated style tag. Use the existing `MosaicProvider`
render setup and `styleText()` assertions to verify both the wrapped CSS branch
and nonce propagation, alongside the current `:where([data-cl-slot])` reset
checks.
---
Nitpick comments:
In `@packages/ui/src/experimental/mosaic.ts`:
- Around line 3-40: The module JSDoc in Mosaic’s experimental entrypoint needs a
docs review to ensure its client/RSC boundary explanation and exported API
description match the actual public surface. Update the comment around the
top-level exports from mosaic.ts so it accurately reflects what consumers can
import and how OrganizationProfile versus the flat panel/section exports should
be used, keeping the wording aligned with the intended Clerk Docs output.
In `@packages/ui/src/mosaic/aio/organization-profile.tsx`:
- Around line 9-30: Add a JSDoc block to the public OrganizationProfile export
so the reference docs capture this compound API accurately. Document that
OrganizationProfile is the primary experimental/mosaic entrypoint, that it
requires a MosaicProvider ancestor and a client-only environment, and list the
attached compound parts (GeneralPanel, LeaveSection, DeleteSection). Place the
comment on the OrganizationProfile binding in organization-profile.tsx so it
stays aligned with the implementation and its Object.assign-based export shape.
In `@packages/ui/src/mosaic/panels/organization-profile-general-panel.tsx`:
- Around line 7-14: Add JSDoc to the public flat export
OrganizationProfileGeneralPanel so generated reference docs include it for
direct RSC usage. Update the function declaration in
OrganizationProfileGeneralPanel to include a concise descriptive comment,
matching the documentation style used by OrganizationProfileDeleteSection and
other reference-facing exports.
In
`@packages/ui/src/mosaic/sections/organization-profile-delete-section.controller.tsx`:
- Around line 23-42: The post-action navigation/revalidate logic inside
useOrganizationProfileDeleteSectionController is duplicated in the leave
controller, so extract the shared “after org action” behavior into a reusable
hook or helper and call it from both controllers. Keep the existing
destroy/revalidate flow in organizationProfileDeleteSectionMachine’s context,
but move the afterLeaveUrl lookup and fire-and-forget router.navigate behavior
into a shared function such as useAfterOrgActionNavigate so future organization
sections can reuse it.
In `@packages/ui/src/mosaic/sections/organization-profile-delete-section.tsx`:
- Around line 6-18: Add JSDoc to the public flat export
OrganizationProfileDeleteSection so Docs can generate a reference page for it.
Document its purpose, the direct RSC usage intent, and the requirement that it
be rendered within MosaicProvider, keeping the description aligned with the
implementation and other reference-facing exports in this area.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository YAML (base), Repository UI (inherited)
Review profile: CHILL
Plan: Pro Plus
Run ID: e135a058-7b33-4d86-98fd-ad4eaf44879e
📒 Files selected for processing (51)
.changeset/open-heads-brush.mdpackages/swingset/src/components/Composition.tsxpackages/swingset/src/components/DocsViewer.tsxpackages/swingset/src/components/app-sidebar.tsxpackages/swingset/src/lib/registry.tspackages/swingset/src/stories/delete-organization.stories.tsxpackages/swingset/src/stories/leave-organization.stories.tsxpackages/swingset/src/stories/organization-profile-delete-section.mdxpackages/swingset/src/stories/organization-profile-delete-section.stories.tsxpackages/swingset/src/stories/organization-profile-general-panel.mdxpackages/swingset/src/stories/organization-profile-general-panel.stories.tsxpackages/swingset/src/stories/organization-profile-general.mdxpackages/swingset/src/stories/organization-profile-general.stories.tsxpackages/swingset/src/stories/organization-profile-leave-section.mdxpackages/swingset/src/stories/organization-profile-leave-section.stories.tsxpackages/swingset/src/stories/organization-profile.mdxpackages/swingset/src/stories/organization-profile.stories.tsxpackages/ui/package.jsonpackages/ui/src/experimental/__tests__/mosaic.test.tsxpackages/ui/src/experimental/mosaic.tspackages/ui/src/mosaic/MosaicProvider.tsxpackages/ui/src/mosaic/__tests__/MosaicProvider.test.tsxpackages/ui/src/mosaic/aio/__tests__/organization-profile.controller.test.tsxpackages/ui/src/mosaic/aio/__tests__/organization-profile.test.tsxpackages/ui/src/mosaic/aio/organization-profile.controller.tsxpackages/ui/src/mosaic/aio/organization-profile.tsxpackages/ui/src/mosaic/hooks/useMosaicEnvironment.tspackages/ui/src/mosaic/hooks/useMosaicRouter.tspackages/ui/src/mosaic/machine/__tests__/delete-organization-machine.tspackages/ui/src/mosaic/panels/organization-profile-general-panel-view.tsxpackages/ui/src/mosaic/panels/organization-profile-general-panel.tsxpackages/ui/src/mosaic/panels/organization-profile-general.tsxpackages/ui/src/mosaic/sections/__tests__/organization-profile-delete-section.controller.test.tsxpackages/ui/src/mosaic/sections/__tests__/organization-profile-delete-section.machine.test.tspackages/ui/src/mosaic/sections/__tests__/organization-profile-delete-section.view.test.tsxpackages/ui/src/mosaic/sections/__tests__/organization-profile-leave-section.controller.test.tsxpackages/ui/src/mosaic/sections/__tests__/organization-profile-leave-section.machine.test.tspackages/ui/src/mosaic/sections/__tests__/organization-profile-leave-section.view.test.tsxpackages/ui/src/mosaic/sections/delete-organization.tsxpackages/ui/src/mosaic/sections/leave-organization.controller.tsxpackages/ui/src/mosaic/sections/leave-organization.tsxpackages/ui/src/mosaic/sections/organization-profile-delete-section.controller.tsxpackages/ui/src/mosaic/sections/organization-profile-delete-section.machine.tspackages/ui/src/mosaic/sections/organization-profile-delete-section.tsxpackages/ui/src/mosaic/sections/organization-profile-delete-section.view.tsxpackages/ui/src/mosaic/sections/organization-profile-leave-section.controller.tsxpackages/ui/src/mosaic/sections/organization-profile-leave-section.machine.tspackages/ui/src/mosaic/sections/organization-profile-leave-section.tsxpackages/ui/src/mosaic/sections/organization-profile-leave-section.view.tsxpackages/ui/src/mosaic/slot-recipe.tspackages/ui/tsdown.config.mts
💤 Files with no reviewable changes (8)
- packages/ui/src/mosaic/sections/delete-organization.tsx
- packages/swingset/src/stories/delete-organization.stories.tsx
- packages/swingset/src/stories/leave-organization.stories.tsx
- packages/ui/src/mosaic/sections/leave-organization.tsx
- packages/ui/src/mosaic/panels/organization-profile-general.tsx
- packages/swingset/src/stories/organization-profile-general.mdx
- packages/ui/src/mosaic/sections/leave-organization.controller.tsx
- packages/swingset/src/stories/organization-profile-general.stories.tsx
| const icons = React.useMemo(() => appearance?.icons ?? {}, [appearance]); | ||
| const cache = React.useMemo(() => { | ||
| const el = getInsertionPoint(); | ||
| const el = ensureInsertionPoint(); |
There was a problem hiding this comment.
cssLayerName only wraps the reset <style> below; styles generated through this cache are inserted unlayered, so they outrank a consumer's layered app styles. StyleCacheProvider solves this by wrapping cache.insert with @layer, and this memo already mirrors its prepend logic, so it looks like the insert wrap got left behind; mirroring it (or sharing a cache factory) fixes it.
🤖 Generated with Claude Code
There was a problem hiding this comment.
fixed in 61d1f45
also changed how the icon overrides work to be serialize-able too.
Wrap the Mosaic Emotion cache's insert with @layer so generated component styles carry the same layer as the reset (mirroring StyleCacheProvider). Previously only the reset was layered, so component styles were inserted unlayered and outranked a consumer's @layer-ed app styles. Change appearance.icons overrides from render functions to React elements, injected via cloneElement. Elements serialize across the RSC server/client boundary, so consumers can supply icon overrides from a Server Component.
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/ui/src/mosaic/components/icon.tsx`:
- Around line 40-66: The override path in Icon drops the forwarded ref, so refs
only work for the built-in SVG branch. Update the MosaicIcon forwardRef handler
to pass the received ref into React.cloneElement for the override element,
alongside the existing props/className/data-cl-slot injection, and add a
regression test that verifies consumer refs resolve for overridden icons as well
as the default glyph.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository YAML (base), Repository UI (inherited)
Review profile: CHILL
Plan: Pro Plus
Run ID: 52840a83-c54e-4ee9-9912-011db6c6f5fb
📒 Files selected for processing (7)
packages/swingset/src/stories/icon.stories.tsxpackages/ui/src/mosaic/MosaicProvider.tsxpackages/ui/src/mosaic/__tests__/MosaicProvider.ssr.test.tsxpackages/ui/src/mosaic/__tests__/MosaicProvider.test.tsxpackages/ui/src/mosaic/__tests__/icon.test.tsxpackages/ui/src/mosaic/appearance.tspackages/ui/src/mosaic/components/icon.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/ui/src/mosaic/MosaicProvider.tsx
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
packages/swingset/src/lib/registry.ts (1)
35-55: 🎯 Functional Correctness | 🔴 Critical | ⚡ Quick winFix the broken import block in
packages/swingset/src/lib/registry.ts
Restore the missingimport {beforeDefault as OrganizationProfileGeneralDefault; as written, this file won’t parse. The leftover block also points at../stories/organization-profile-general.stories, which no longer exists, so remove it or switch it to the renamed panel story if that’s the intended import.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/swingset/src/lib/registry.ts` around lines 35 - 55, The import block in registry.ts is broken because the OrganizationProfileGeneralDefault entry is missing its import opening and still references a non-existent organization-profile-general.stories module. Fix the import group around OrganizationProfileGeneralDefault and organizationProfileGeneralMeta so it parses correctly, and either remove that import or update it to use the renamed organization-profile-general-panel.stories source consistently with the other story imports.Source: Linters/SAST tools
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Outside diff comments:
In `@packages/swingset/src/lib/registry.ts`:
- Around line 35-55: The import block in registry.ts is broken because the
OrganizationProfileGeneralDefault entry is missing its import opening and still
references a non-existent organization-profile-general.stories module. Fix the
import group around OrganizationProfileGeneralDefault and
organizationProfileGeneralMeta so it parses correctly, and either remove that
import or update it to use the renamed
organization-profile-general-panel.stories source consistently with the other
story imports.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository YAML (base), Repository UI (inherited)
Review profile: CHILL
Plan: Pro Plus
Run ID: 5c024363-df5e-4e48-be7c-52e6fd92c56e
📒 Files selected for processing (3)
packages/swingset/src/components/DocsViewer.tsxpackages/swingset/src/lib/registry.tspackages/ui/package.json
🚧 Files skipped from review as they are similar to previous changes (2)
- packages/swingset/src/components/DocsViewer.tsx
- packages/ui/package.json
2 participants
Description
New
@clerk/ui/experimental/mosaicentry.Exports:
MosaicProvider— styling/appearance + emotion cache.OrganizationProfile(compound:.GeneralPanel/.LeaveSection/.DeleteSection) — client-only, consumer needs'use client'(property access on client ref can't cross RSC boundary).OrganizationProfile{GeneralPanel,LeaveSection,DeleteSection}— each own client ref, drop straight into RSC, no consumer'use client'.Entry carries
'use client'(hooks/context/emotion). Components gate on Clerk loaded → rendernulltil ready, so no server markup; UI after hydration.Preview: https://swingset-git-feat-mosaic-experimental-export.clerkstage.dev/
Summary by CodeRabbit