feat(ui): Add appearance option to disable autofocus

[alexcarpenter]

Description

Adds new appearance option to disable autofocus input behaviors within the components.

Docs PR: clerk/clerk-docs#3360

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:

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
clerk-js-sandbox	Ready	Preview, Comment	May 12, 2026 1:02pm

[changeset-bot]

🦋 Changeset detected

Latest commit: 6dd8ff2

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

This PR includes changesets to release 2 packages

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

[coderabbitai]

📝 Walkthrough

Walkthrough

This PR introduces a configurable autoFocus appearance option to the @clerk/ui package, enabling applications to globally disable automatic input focusing behavior. The option is defined in the Options type with a default value of true, then integrated across form and input components—including FieldControl, MfaBackupCodeCreateForm, SuccessPage, CodeControl, and TagInput—so they read the appearance option and apply it to control autofocus on element mount.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately and concisely summarizes the main change: adding an appearance option to disable autofocus behavior in UI components.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Description check	✅ Passed	The PR description clearly explains the purpose: adding a new appearance option to disable autofocus input behaviors. It is directly related to the changeset modifications.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

Tip

💬 Introducing Slack Agent: The best way for teams to turn conversations into code.

Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.

• Generate code and open pull requests
• Plan features and break down work
• Investigate incidents and troubleshoot customer tickets together
• Automate recurring tasks and respond to alerts with triggers
• Summarize progress and report instantly

Built for teams:

• Shared memory across your entire org—no repeating context
• Per-thread sandboxes to safely plan and execute work
• Governance built-in—scoped access, auditability, and budget controls

One agent for your entire SDLC. Right inside Slack.

👉 Get started

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[pkg-pr-new]

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/dev-cli

npm i https://pkg.pr.new/@clerk/dev-cli@8521

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 6dd8ff2