[alexcarpenter]

Description

The Mosaic UserProfile email and phone number lists now show the primary entry first, and setting a new primary slides that row to the top instead of jumping.

• UserProfileContactListRowView orders items primary-first before rendering.
• A new useFlipReorder hook animates the reorder with FLIP: it snapshots child rects when the order key changes, measures again after commit, and plays the delta through the Web Animations API on transform only. Duration and easing come from the --cl-duration-slow and --cl-ease-enter tokens on the container's computed style, and the slide is skipped under prefers-reduced-motion or when the tokens are not defined.

Preview: https://swingset-git-carp-mosaic-reorder.clerkstage.dev/user-profile/user-profile

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 detected

Latest commit: ac9d5d5

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

This PR includes changesets to release 3 packages

Name	Type
@clerk/ui	Patch
@clerk/chrome-extension	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]

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

Project	Deployment	Actions	Updated
clerk-js-sandbox	Ready	Preview	Sep 15, 2026 10:54pm UTC
swingset	Ready	Preview	Sep 15, 2026 10:54pm UTC

[coderabbitai]

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

---

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

[pkg-pr-new]

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@9778

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@9778

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@9778

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@9778

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@9778

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@9778

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@9778

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@9778

@clerk/expo-google-signin

npm i https://pkg.pr.new/@clerk/expo-google-signin@9778

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@9778

@clerk/express

npm i https://pkg.pr.new/@clerk/express@9778

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@9778

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@9778

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@9778

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@9778

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@9778

@clerk/react

npm i https://pkg.pr.new/@clerk/react@9778

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@9778

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@9778

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@9778

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@9778

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@9778

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@9778

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@9778

commit: ac9d5d5