Command is not working properly.
HamidShaikh1499 opened this issue · 6 comments
Describe the bug
I can't use mouse to select an item from list(CommandList). I attached below video please see.
2024-05-07.10-44-22.mp4
Affected component/components
Command, CommandList and CommandItem
How to reproduce
i used code from https://github.com/shadcn-ui/ui/pull/2773. and also used different variant of multi select and also tried to modify but failed. due to commandList.
Codesandbox/StackBlitz link
No response
Logs
No response
System Info
No
Before submitting
- I've made research efforts and searched the documentation
- I've searched for existing issues
I found issue in className of CommadItem
previous one: "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
Changed: "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground"
I just removed: "data-[disabled]:pointer-events-none data-[disabled]:opacity-50"
what is use of data-[disabled]:pointer-events-none data-[disabled]:opacity-50?
Hello, the code you removed will make the item with an opacity of 50 when the item is marked as disabled.
I would suggest you to look at this on going pull request that is doing the right fix for this : #3680
this man is a lifesaver thank you, I agree too this pr should be looked at
Okay, i got solution from that PR. Thanks @loiclefloch. So i am closing this one....
@ricardoraposo thankkkssss .. ui -> command.tsx -> [search] CommandPrimitive.Item -> [Copy Paste]
ClassName={cn(
"relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 0"