feat(ui): Render OAuth consent scopes as checkboxes

[alexcarpenter]

Description

Renders each scope on <OAuthConsent /> as a checkbox, checked by default, with the scope description as its label (clicking the text toggles it). This is UI only: the checkboxes have no name, so the form still submits the full requested scope. Wiring the selection through to FAPI is pending backend support.

• New ListGroupCheckboxItem in ListGroup.tsx; <OAuthDeviceVerification /> keeps the bulleted ListGroupItem.
• New listGroupItemCheckbox appearance element.
• focusRing={false} on the checkbox, matching the legal-consent checkbox, so the base theme's box-shadow outline isn't overridden on mouse focus.
• user-select: none on the row so double-clicking doesn't highlight the text.
• Reduces the list's --fade-distance from 2.5rem to 2rem. A single row (~35px) was shorter than the sticky top fade, which caused a stray scrollbar when only one scope was shown. This also affects <OAuthDeviceVerification />.
• Sandbox /oauth-consent route adds a scope with a long description to preview text wrapping.

Open questions before this is functional:

• How the selected scopes are sent to FAPI (likely a narrowed scope in the consent POST).
• Whether onAllow (accounts portal path) should receive the selected scopes.
• Whether any scope (e.g. openid) should be locked on.

Checklist

• pnpm test runs as expected. (OAuthConsent and OAuthDeviceVerification suites only)
• pnpm build runs as expected. (@clerk/ui only)
• (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
clerk-js-sandbox	Ready	Preview	Oct 8, 2026 1:55pm UTC
swingset	Ready	Preview	Oct 8, 2026 1:55pm UTC

[changeset-bot]

🦋 Changeset detected

Latest commit: db37953

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]

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

• Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

---

_{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@10139

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/electron

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

@clerk/electron-passkeys

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

@clerk/eslint-plugin

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

@clerk/expo

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

@clerk/expo-biometrics

npm i https://pkg.pr.new/@clerk/expo-biometrics@10139

@clerk/expo-google-signin

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/mosaic

npm i https://pkg.pr.new/@clerk/mosaic@10139

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: db37953