chore: make select scrollable

This commit is contained in:
ValdiANS
2026-01-09 15:23:56 +07:00
parent c9c618e3f8
commit 76c68d0d79
2 changed files with 4 additions and 4 deletions
@@ -58,7 +58,7 @@ export function MultiSelect({
}; };
return ( return (
<Popover open={open} onOpenChange={setOpen}> <Popover open={open} onOpenChange={setOpen} modal>
<PopoverTrigger asChild> <PopoverTrigger asChild>
<Button <Button
variant='outline' variant='outline'
@@ -115,8 +115,8 @@ export function MultiSelect({
onValueChange={onSearchChange} onValueChange={onSearchChange}
/> />
<CommandEmpty>No item found.</CommandEmpty> <CommandEmpty>No item found.</CommandEmpty>
<CommandList> <CommandList className='max-h-[300px] overflow-y-auto'>
<CommandGroup className='max-h-64 overflow-auto'> <CommandGroup className='overflow-visible'>
{options.map((option) => ( {options.map((option) => (
<CommandItem <CommandItem
key={option.value} key={option.value}
+1 -1
View File
@@ -61,7 +61,7 @@ function SelectContent({
<SelectPrimitive.Content <SelectPrimitive.Content
data-slot='select-content' data-slot='select-content'
className={cn( className={cn(
'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md', 'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-[300px] min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md',
position === 'popper' && position === 'popper' &&
'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1', 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
className className