Skip to content

feat(ui): Add composite, button, and text components#8220

Draft
alexcarpenter wants to merge 2 commits intoalexcarpenter/mosaic-theme-providerfrom
carp/mosaic-components
Draft

feat(ui): Add composite, button, and text components#8220
alexcarpenter wants to merge 2 commits intoalexcarpenter/mosaic-theme-providerfrom
carp/mosaic-components

Conversation

@alexcarpenter
Copy link
Copy Markdown
Member

@alexcarpenter alexcarpenter commented Apr 1, 2026

Description

Introduces a small component primitives layer on top of the ceramic design system. All components require CeramicThemeProvider in the tree.

Composite — base primitive. Handles render-prop polymorphism, CSS reset, and sx styling. Everything else builds on this.

// defaults to <div>
<Composite sx={t => ({ color: t.colors.primary })} />

// render any element
<Composite render={<section />} sx={{ display: 'flex' }} />

// render function for full prop control
<Composite render={props => <MyEl {...props} />} />

Text — typography variants on top of Composite

<Text>body copy</Text>                              // <p>, body-2, default color
<Text render={<h1 />} variant="heading-1" />        // <h1>
<Text variant="label-3" color="muted" />
<Text font="mono" sx={t => ({ letterSpacing: t.spacing[1] })} />

Button — button variants on top of Composite

<Button>primary</Button>
<Button color="secondary" fullWidth />
<Button render={<a href="/x" />}>link button</Button>  // <a> with button styles
<Button sx={t => ({ borderRadius: t.spacing[3] })} />

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

vercel bot commented Apr 1, 2026

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

Project Deployment Actions Updated (UTC)
clerk-js-sandbox Ready Ready Preview, Comment Apr 1, 2026 4:00pm

Request Review

@changeset-bot
Copy link
Copy Markdown

changeset-bot bot commented Apr 1, 2026

⚠️ No Changeset found

Latest commit: 543cba6

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

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