feat(ui): add combobox - #9655
Conversation
🦋 Changeset detectedLatest commit: 7705087 The changes in this PR will be included in the next version bump. This PR includes changesets to release 0 packagesWhen changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types 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 |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Important Draft PR not reviewedDraft PRs are not automatically reviewed by default.
To automatically review draft PRs, update your CodeRabbit configuration: reviews:
auto_review:
drafts: trueComment |
83a843c to
e51838e
Compare
e51838e to
99e689f
Compare
99e689f to
7705087
Compare
maxyinger
left a comment
maxyinger
left a comment
There was a problem hiding this comment.
maybe make this whole thing align and give the popup some more margin so it's not touching the focus shadow?
| <div | ||
| {...mergeStyleProps( | ||
| themeProps('combobox-viewport'), | ||
| stylex.props(reset.base, ...scrollAreaViewport(), styles.viewport), |
There was a problem hiding this comment.
keep goin back n forth on if we should have a scroll bar on here at all. I like the fade regardless tho, almost want to make it a bit smaller tho. think it's customizeable through css vars, but can't remember
| <Primitive.Positioner | ||
| {...mergeStyleProps(themeProps('combobox-positioner'), stylex.props(reset.base, styles.positioner))} | ||
| > | ||
| <Primitive.Popup |
There was a problem hiding this comment.
We might need to add a Freeze on close for the popup primitive. if it doesn't make sense in the primitive we should add one here so it doesn't flash when we select and it exits
| 'use client'; | ||
|
|
||
| import type { AutocompleteProps } from '@clerk/headless/autocomplete'; | ||
| import { Autocomplete as Primitive } from '@clerk/headless/autocomplete'; |
There was a problem hiding this comment.
one thing that's interesting here is that baseui separates these out:
https://ui.shadcn.com/docs/components/aria/combobox
https://base-ui.com/react/components/autocomplete
might just be our nomenclature meaning different things, but I think they're supposed to have slightly different functionality. this is the interesting blurb there on the autocomplete:
Use Combobox instead of Autocomplete if the selection should be remembered and the input value cannot be custom. Unlike Combobox, Autocomplete’s input can contain free-form text, as its suggestions only optionally autocomplete the text
There was a problem hiding this comment.
I wonder if that's functionality we're kinda baking into the country code selector that should just be intrinsic to the combobox?
2 participants
Description
Adds a styled Mosaic
Comboboxwith searchable options in floating and inline list layouts. Its input supports the headless variant for use insideInputGroup.https://swingset-git-austin-combobox.clerkstage.dev/components/combobox