Skip to content

feat(mosaic): lead UserButton with the active organization, badged with the user - #10159

Draft
alexcarpenter wants to merge 3 commits into
carp/mosaic-organization-switcherfrom
carp/mosaic-user-button-org
Draft

alexcarpenter wants to merge 3 commits into
carp/mosaic-organization-switcherfrom
carp/mosaic-user-button-org

Conversation

@alexcarpenter

@alexcarpenter alexcarpenter commented Oct 9, 2026 •

Copy link
Copy Markdown
Member

Description

Preview: https://swingset-git-carp-mosaic-user-button-org.clerkstage.dev/user-button/user-button

Stacked on #10129.

In combined mode with an active organization, UserButton now leads with the organization instead of the user:

  • The organization's square avatar leads, with the user's avatar as a small circular badge cut out of its corner.
  • The trigger and popover header are titled with the organization's name, with the user's identifier beneath it.
  • The trigger's accessible name still names the user, since it is a user button.
  • Settings in the header still opens both Organization settings and Profile settings.
  • In the avatar-only trigger, the focus ring follows the organization avatar's radius. In the labelled trigger, the avatar is vertically centered and inset from the start edge.
  • The trigger's chevron has an equal inline margin on both sides.

Internally, the switcher's member lead is folded into organization, which now carries an optional badging user, and SwitcherAvatar is replaced by a BadgedAvatar that only models the organization + user badge case.

The swingset UserButton page is updated to match.

Checklist

  • pnpm test runs as expected.
  • pnpm build runs as expected.
  • (If applicable) JSDoc comments have been added or updated for any package exports
  • (If applicable) Documentation has been updated

Type of change

  • 🐛 Bug fix
  • 🌟 New feature
  • 🔨 Breaking change
  • 📖 Refactoring / dependency upgrade / documentation
  • other:

@changeset-bot

changeset-bot Bot commented Oct 9, 2026 •

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: d5963f5

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages
Name Type
@clerk/mosaic Patch
@clerk/swingset Patch

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

@vercel

vercel Bot commented Oct 9, 2026 •

Copy link
Copy Markdown

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

Project Deployment Actions Updated
clerk-js-sandbox Ready Ready Preview Oct 9, 2026 7:25pm UTC
swingset Ready Ready Preview Oct 9, 2026 7:25pm UTC

Request Review

@coderabbitai

coderabbitai Bot commented Oct 9, 2026 •

Copy link
Copy Markdown
Contributor

Important

Draft PR not reviewed

Draft PRs are not automatically reviewed by default.

  • Trigger a manual review

To automatically review draft PRs, update your CodeRabbit configuration:

reviews:
  auto_review:
    drafts: true
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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

This branch was successfully deployed

2 active deployments
Preview – swingset — d5963f52 Deployed Oct 9, 2026 by vercel[bot]
Preview – clerk-js-sandbox — d5963f52 Deployed Oct 9, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant