Limit DropdownMenu height to 80% of viewport (#2181)

make DropdownMenu scrollable with 80vh height limit

The DropdownMenu component now automatically becomes scrollable when its content
exceeds 80% of the viewport height. This enhances usability by:

- Limiting maximum height to 80vh using Tailwind's max-h-[80vh]
- Enabling vertical scrolling with overflow-y-auto
- Preserving dropdown positioning and accessibility
This commit is contained in:
axmo 2025-04-01 19:48:22 -04:00 committed by GitHub
parent e189b265ca
commit 2cd4753e89
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -106,7 +106,7 @@ export const SelectDropdown = React.forwardRef<React.ElementRef<typeof DropdownM
onEscapeKeyDown={() => setOpen(false)}
onInteractOutside={() => setOpen(false)}
container={portalContainer}
className={contentClassName}>
className={cn("overflow-y-auto max-h-[80vh]", contentClassName)}>
{options.map((option, index) => {
if (option.type === DropdownOptionType.SEPARATOR) {
return <DropdownMenuSeparator key={`sep-${index}`} />