[Bug]: Command from cmdk not working even with Combobox

[usernameNiD4niel]

Describe the bug

I used the "Combobox" with "Command" to my previous project and it does indeed work but the thing now is the "Command" with "Combobox" won't work as expected anymore.

Affected component/components

Command, Popover, Combobox

How to reproduce

Here's the solutions I made:

1. Re-install the "Popover" and "Command" (cause I think I am using the old version --- but I am using the latest) so clearly this is not the problem.
2. Try to use only the "Popover" without "Command" --- it works just fine. So Popover is not the problem here.
3. I used only the "Command" and I am right the command has the bug --- I checked the current version of my "cmdk" and I am using the latest one.

Now we know the problem, I checked my previous project version of "cmdk" which is "0.2.0". So the solution that make this works was by removing the current "cmdk" for me I used pnpm uninstall cmdk and reinstall it but I specify the version my of previous project "cmdk" which happens to be pnpm install cmdk@0.2.0 and now I try to use the "Command" and it works now!

Can you guys fix this? The other devs might encounter this issue like me (this bug actually consumes my 2 hours) Thank you guys!

Codesandbox/StackBlitz link

No response

Logs

No response

System Info

Processor	Intel(R) Core(TM) i3-1005G1 CPU @ 1.20GHz   1.20 GHz
Installed RAM	8.00 GB (7.75 GB usable)
System type	64-bit operating system, x64-based processor
Pen and touch	No pen or touch input is available for this display
Google Chrome   Latest
React           18.2.0

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues

[danpiths]

please have a look at this issue, it solves the problem. #2944

you basically need a <CommandList> wrapper after your <CommandInput>. this has happened due to cmdk releasing 1.0 with these breaking changes.

also you would need to replace data-[disabled] with data-[disabled='true'] in the className for whichever element uses that class attribute relating to cmdk, to avoid having cmdk be disabled.

[usernameNiD4niel]

please have a look at this issue, it solves the problem. #2944

you basically need a <CommandList> wrapper after your <CommandInput>. this has happened due to cmdk releasing 1.0 with these breaking changes.

also you would need to replace data-[disabled] with data-[disabled='true'] in the className for whichever element uses that class attribute relating to cmdk, to avoid having cmdk be disabled.

Thank you sir! It makes sense now to me.

[jhnguyen521]

This should be fixed by #2945 :)

[sostenesapollo]

Command list not being updated cmdk

<CommandList>
            {/* <CommandGroup> */}
            {options?.map((row) => (
              <CommandItem
                key={row.value}
                value={row.value}
                onSelect={(currentValue) => {
                  text.value = currentValue === text.value ? "" : currentValue;
                  setOpen(false);
                }}
              >
                <Check
                  className={cn(
                    "mr-2 h-4 w-4",
                    text.value === row.value ? "opacity-100" : "opacity-0"
                  )}
                />
                {row.label}
              </CommandItem>
            ))}
            {/* </CommandGroup> */}
          </CommandList>

const [options, setOptions] = React.useState(
    [] as { label: string; value: string }[]
  );

  const search = (text: string) => {
    axios
      .get(`/api/list?table=clients&query=${text}`)
      .then(({ data }) => {
        // consolez.log(data.clients);
        setOptions(
          data.clients.map((e: any) => ({
            value: e.id,
            label: e.name,
          }))
        );
      })
      .catch((e) => notify.error("Erro ao buscar clientes."));
  };

when I close and open again it has the new options, but why does not updates reacivelly ?

[kasvith]

@sostenesapollo did you find a solution? im also suffering from same problem

[sostenesapollo]

@kasvith yeah, do u want to see it ?

[kasvith]

hey @sostenesapollo i removed the auto filtering and did manual filtering

it worked

[grafficmedia]

@kasvith @sostenesapollo can one of you post an example of the fix?