fixed long list items in dropdown were hidden, rename <Menu /> to <DropdownMenu />
#3206
Conversation
🦋 Changeset detectedLatest commit: 1216ef1 The changes in this PR will be included in the next version bump. This PR includes changesets to release 3 packages
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 |
| ); | ||
| } | ||
|
|
||
| export const Menu = createComponentGroup(DropdownMenu.Root, { |
There was a problem hiding this comment.
@thomasheyenbrock I renamed Menu to DropdownMenu because
- for me menu, listbox are confused names
- we follow radix convention
- even this file is name dropdown 😅
- major release is coming so we can do some adjustments :)
There was a problem hiding this comment.
Sounds good 👍
Since we're still on 0.x, I'd even be fine with doing this in a minor. The expectations around @graphiql/react always were that it's not yet stable.
| [data-radix-menu-content] { | ||
| .graphiql-dropdown-content { |
There was a problem hiding this comment.
to avoid conflicts with users’ maybe radix components
| @@ -8,9 +8,11 @@ | |||
| padding: var(--px-4); | |||
| font-family: var(--font-family); | |||
| color: hsl(var(--color-neutral)); | |||
| max-height: calc(var(--radix-dropdown-menu-content-available-height) - 10px); | |||
There was a problem hiding this comment.
There was a problem hiding this comment.
Using all the available height seems too much for me, having the dropdown fill the whole height of the page looks weird. I'd propose to go with a smaller value here like 400px.
There was a problem hiding this comment.
hardcoding 400px would provoke issues on small vh, we should use css' min function with it
Screen.Recording.2023-06-02.at.11.59.41.mov
fixes #3187 cc @jetsstarplus
Screen.Recording.2023-06-02.at.01.30.05.mov