Skip to content

Migrate frontend UI primitives to Nebari design registry - #460

Open
MUFFANUJ wants to merge 7 commits into
nebari-dev:mainfrom
MUFFANUJ:migrateToNebariDesign
Open

Migrate frontend UI primitives to Nebari design registry#460
MUFFANUJ wants to merge 7 commits into
nebari-dev:mainfrom
MUFFANUJ:migrateToNebariDesign

Conversation

@MUFFANUJ

Copy link
Copy Markdown
Member

Reference Issues or PRs

Closes #439

What does this implement/fix?

Put a x in the boxes that apply

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds a feature)
  • Breaking change (fix or feature that would cause existing features not to work as expected)
  • Documentation Update
  • Code style update (formatting, renaming)
  • Refactoring (no functional changes, no API changes)
  • Build related changes
  • Other (please describe):

Testing

  • Did you test the pull request locally?
  • Did you add new tests?

Documentation

Access-centered content checklist

Text styling

  • The content is written with plain language (where relevant).
  • If there are headers, they use the proper header tags (with only one level-one header: H1 or # in markdown).
  • All links describe where they link to (for example, check the Nebari website).
  • This content adheres to the Nebari style guides.

Non-text content

  • All content is represented as text (for example, images need alt text, and videos need captions or descriptive transcripts).
  • If there are emojis, there are not more than three in a row.
  • Don't use flashing GIFs or videos.
  • If the content were to be read as plain text, it still makes sense, and no information is missing.

Any other comments?

This PR migrates Nebi’s frontend shadcn setup to the @nebari design registry, replaces the registry-backed UI primitives with Nebari versions, reconciles theme/utils integration, and keeps registry-absent local components explicitly documented. It also updates affected call sites to the new Base UI component APIs while preserving existing behavior and accessibility.

  • Added frontend/components.json with the @nebari registry
  • Installed/reconciled @nebari/theme in frontend/src/index.css
  • Reconciled @nebari/utils with existing cn, capitalize, and getWorkspaceStatusColor
  • Replaced registry-backed primitives: button, input, textarea, badge, card, dialog, tabs, select
  • Added required registry dependency: spinner
  • Kept local-only primitives with notes: alert-dialog, select-v2, split-button, confirm-dialog, user-badge
  • Preserved Nebi-specific tokens like --color-primary-hover and --color-nav-hover
  • Updated feature components for new Dialog, Tabs, Select, and Button APIs
  • Documented the one intentional select ref compatibility exception
  • Verified snapshots do not need updates

@netlify

netlify Bot commented Jul 19, 2026

Copy link
Copy Markdown

Deploy Preview for nebi-docs canceled.

Name Link
🔨 Latest commit 2bf9307
🔍 Latest deploy log https://app.netlify.com/projects/nebi-docs/deploys/6a84d830ab20340008e7a6b1

MUFFANUJ and others added 6 commits August 16, 2026 07:27
Resolved PublishDialog.test.tsx conflicts in favor of the Nebari Select
(combobox) interaction pattern, porting main's focus assertion and
adapting the new refreshes-defaults test from native selectOptions to
combobox clicks.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…tion

The merge from main brought in tests written against the old native
select and Radix dialog autofocus. The Nebari/Base UI Select trigger is
a combobox button, so assert on its visible text instead of .value, and
drop the focus wait the Base UI dialog no longer satisfies.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Migrate nebi Frontend shadcn Components & Theme to the @nebari Design Registry

2 participants