Skip to content

feat(headless): Add headless ui primitives package#8392

Draft
alexcarpenter wants to merge 6 commits intomainfrom
carp/headless-package
Draft

feat(headless): Add headless ui primitives package#8392
alexcarpenter wants to merge 6 commits intomainfrom
carp/headless-package

Conversation

@alexcarpenter
Copy link
Copy Markdown
Member

@alexcarpenter alexcarpenter commented Apr 23, 2026

Description

  • New internal (private: true) package: unstyled, accessible React compound components built on Floating UI
  • 8 primitives: Accordion, Autocomplete, Dialog, Menu, Popover, Select, Tabs, Tooltip
  • Shared renderElement util enabling consumer render prop overrides + automatic state-to-data-cl-* attribute mapping
  • CSS-driven animation system using Web Animations API (getAnimations().finished)
  • All tests run in real Chromium via @vitest/browser-playwright

Why a separate package

@clerk/ui uses @emotion/react as its JSX source, which conflicts with the standard react-jsx transform these primitives need. Splitting them out avoids the transform conflict.

Architecture

  • Compound components via Object.assign (Select.Trigger, Select.Popup, etc.)
  • Positioning/interactions/focus/ARIA delegated to @floating-ui/react
  • Zero emitted styles — consumers style via data-cl-* attribute selectors

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
Copy link
Copy Markdown

changeset-bot Bot commented Apr 23, 2026

⚠️ No Changeset found

Latest commit: 36dbb3d

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

@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 23, 2026

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

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
clerk-js-sandbox Skipped Skipped Apr 23, 2026 7:09pm

Request Review

@github-actions github-actions Bot added the ui label Apr 23, 2026
@alexcarpenter alexcarpenter changed the title feat: Add headless ui primitives package feat(headless): Add headless ui primitives package Apr 23, 2026
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