feat(ui): add composed profile shell, providers infra and stub router by alexcarpenter · Pull Request #9133 · clerk/javascript

alexcarpenter · 2026-07-10T20:57:43Z

Stack 4/7. New (unexported) infra for the composed profile API: ProfileProviderShell, stubRouter, useBillingRouter, useRequirePage, PageContext, createSection, plus the shared APIKeysSection/BillingSection used by both User and Org composed dirs.

Nothing is exported from the package yet.

Changesets live only on the release PR #9144; this PR carries none.

Stack

Reviewed as a stack. The 7 PRs merge bottom-up into release branch #9144, which integrates into main as a single unit.

#	PR	Layer
–	#9144	release → `main` (integration)
1	#9130	moduleManager getter across build boundary
2	#9131	shared profile UI infra
3	#9132	extract Section components from profile pages
4	#9133 👈	composed shell + providers infra
5	#9134	composed UserProfile
6	#9135	composed OrganizationProfile
7	#9136	expose `@clerk/ui/experimental` (public API)

changeset-bot · 2026-07-10T20:57:47Z

⚠️ No Changeset found

Latest commit: 96548da

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

coderabbitai · 2026-07-10T20:57:49Z

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: fa66fdf3-f203-4ef2-9dd8-a3dd49920523

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

🔍 Trigger review

_{Comment @coderabbitai help to get the list of available commands.}

vercel · 2026-07-10T20:57:49Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
clerk-js-sandbox	Ready	Preview, Comment	Jul 15, 2026 2:09pm
swingset	Error		Jul 15, 2026 2:09pm

… on nonce/layer Consolidate the duplicated environment + module-manager reads from the composed providers into resolveComposedClerkRuntime, dropping the `as any` casts for narrow structural types and warning once on version skew instead of a silent blank render. Store the shared emotion cache with the nonce/cssLayerName it was built from so a later change rebuilds it (matching the AIO StyleCacheProvider).

brkalow · 2026-07-15T18:14:02Z

+  }
+}
+
+export function useBillingRouter(): { router: RouteContextValue; route: BillingRoute } {


is this a pattern we're going to need elsewhere? We have the VirtualRouter component already, which could potentially be usable here in some fashion, but that one is sort of geared towards modal routing so might not slot in as cleanly.

Food for thought, don't think we need to adjust now but I expect to see this pattern emerge more than once.

brkalow · 2026-07-15T18:14:45Z

+export function useRequirePage(componentName: string): boolean {
+  const page = useContext(PageContext);
+  if (!page) {
+    if (typeof __DEV__ === 'undefined' || __DEV__) {


this would only throw when the package is being developed, not in Clerk dev mode. I think this is intentional, but calling it out regardless

brkalow · 2026-07-15T18:16:55Z

 // Why: composed profile roots (UserProfile + OrganizationProfile) mount as
 // separate React roots in the consumer tree, so N can be live per clerk instance.
 // One `cl-internal` emotion cache per instance is the invariant (two live caches,
 // same key = duplicate style inserts, broken emotion dedup/ordering). AIO gets this
 // free from its single portal tree; composed reconstructs it by keying the cache
 // on the clerk instance here so sibling roots reuse one cache instead of each making
-// their own.
-const store = new WeakMap<object, EmotionCache>();
+// their own. The cache is stored with the nonce/cssLayerName it was built from so a
+// later change to either rebuilds it (matching the AIO StyleCacheProvider) instead
+// of pinning whatever the first-mounted root happened to see.


not sure if this is really needed. I would recommend that the comment is trimmed down to more clearly explain why this construct exists, or removed.

brkalow · 2026-07-15T18:17:47Z

+  // Match the portal path's normalization (Components.tsx:209) so a cssLayerName
+  // nested inside appearance.theme gets hoisted to top-level for @layer wrapping.


this reference file / line no. will get out of date quickly

brkalow · 2026-07-15T18:19:02Z

+  // SAFETY: __internal_environment is a real getter on the clerk-js Clerk class
+  // but not on the shared LoadedClerk interface. Narrowing to an optional field
+  // (not `any`) keeps the access typed and forces callers to handle `undefined`.


Suggested change

// SAFETY: __internal_environment is a real getter on the clerk-js Clerk class

// but not on the shared LoadedClerk interface. Narrowing to an optional field

// (not `any`) keeps the access typed and forces callers to handle `undefined`.

github-actions Bot added the ui label Jul 10, 2026

vercel Bot deployed to Preview – clerk-js-sandbox July 10, 2026 20:58 View deployment

vercel Bot deployed to Preview – swingset July 10, 2026 21:00 View deployment

alexcarpenter force-pushed the carp/profile-stack-04-composed-shell branch from 6ff5709 to cb7fd8a Compare July 13, 2026 14:08

vercel Bot deployed to Preview – clerk-js-sandbox July 13, 2026 14:09 View deployment

alexcarpenter mentioned this pull request Jul 13, 2026

feat(ui): composed profile components (release) #9144

Draft

vercel Bot deployed to Preview – swingset July 13, 2026 14:10 View deployment

alexcarpenter force-pushed the carp/profile-stack-03-extract-sections branch from 411027c to 9c65dee Compare July 13, 2026 14:12

alexcarpenter force-pushed the carp/profile-stack-04-composed-shell branch from cb7fd8a to 13f68a7 Compare July 13, 2026 14:12

vercel Bot deployed to Preview – clerk-js-sandbox July 13, 2026 14:13 View deployment

vercel Bot had a problem deploying to Preview – swingset July 13, 2026 14:14 Failure

alexcarpenter force-pushed the carp/profile-stack-03-extract-sections branch from 9c65dee to e791dc6 Compare July 13, 2026 14:34

alexcarpenter force-pushed the carp/profile-stack-04-composed-shell branch from 13f68a7 to 669a561 Compare July 13, 2026 14:34

vercel Bot deployed to Preview – clerk-js-sandbox July 13, 2026 14:35 View deployment

vercel Bot had a problem deploying to Preview – swingset July 13, 2026 14:35 Failure

feat(ui): add composed profile shell, providers infra and stub router

8e09a06

alexcarpenter force-pushed the carp/profile-stack-04-composed-shell branch from 669a561 to 8e09a06 Compare July 13, 2026 19:20

alexcarpenter force-pushed the carp/profile-stack-03-extract-sections branch from e791dc6 to 5cb97b6 Compare July 13, 2026 19:20

vercel Bot deployed to Preview – clerk-js-sandbox July 13, 2026 19:21 View deployment

vercel Bot had a problem deploying to Preview – swingset July 13, 2026 19:21 Failure

vercel Bot deployed to Preview – clerk-js-sandbox July 15, 2026 14:08 View deployment

vercel Bot had a problem deploying to Preview – swingset July 15, 2026 14:09 Failure

alexcarpenter marked this pull request as ready for review July 15, 2026 15:04

brkalow reviewed Jul 15, 2026

View reviewed changes

brkalow approved these changes Jul 15, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat(ui): add composed profile shell, providers infra and stub router#9133

feat(ui): add composed profile shell, providers infra and stub router#9133
alexcarpenter wants to merge 2 commits into
carp/profile-stack-03-extract-sectionsfrom
carp/profile-stack-04-composed-shell

alexcarpenter commented Jul 10, 2026 •

edited

Loading

Uh oh!

changeset-bot Bot commented Jul 10, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented Jul 10, 2026 •

edited

Loading

Review skipped

Uh oh!

vercel Bot commented Jul 10, 2026 •

edited

Loading

Uh oh!

brkalow Jul 15, 2026

Uh oh!

brkalow Jul 15, 2026

Uh oh!

brkalow Jul 15, 2026

Uh oh!

brkalow Jul 15, 2026

Uh oh!

brkalow Jul 15, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

		// Match the portal path's normalization (Components.tsx:209) so a cssLayerName
		// nested inside appearance.theme gets hoisted to top-level for @layer wrapping.

	// SAFETY: __internal_environment is a real getter on the clerk-js Clerk class
	// but not on the shared LoadedClerk interface. Narrowing to an optional field
	// (not `any`) keeps the access typed and forces callers to handle `undefined`.

Uh oh!

Conversation

alexcarpenter commented Jul 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Stack

Uh oh!

changeset-bot Bot commented Jul 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

coderabbitai Bot commented Jul 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review skipped

Uh oh!

vercel Bot commented Jul 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

brkalow Jul 15, 2026

Choose a reason for hiding this comment

Uh oh!

brkalow Jul 15, 2026

Choose a reason for hiding this comment

Uh oh!

brkalow Jul 15, 2026

Choose a reason for hiding this comment

Uh oh!

brkalow Jul 15, 2026

Choose a reason for hiding this comment

Uh oh!

brkalow Jul 15, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

alexcarpenter commented Jul 10, 2026 •

edited

Loading

changeset-bot Bot commented Jul 10, 2026 •

edited

Loading

coderabbitai Bot commented Jul 10, 2026 •

edited

Loading

vercel Bot commented Jul 10, 2026 •

edited

Loading