Next.js 13中shadcn-ui Command组件集成Google地点自动补全失败

我需要在Next.js 13项目中，通过shadcn-ui的Command组件实现Google地点自动补全功能。参考的教程使用了@reach/combobox，但该组件在Next.js 13中无法正常运行，因此我基于shadcn-ui Command组件改写了代码，如下：

return (
    <Command>
      <CommandInput
        value={value}
        onValueChange={(value) => {
          setValue(value);
        }}
        disabled={!ready}
        placeholder="Search an address"
        className="combobox-input"
      />
      <CommandList>
        <CommandGroup>
          {status === "OK" &&
            data.map(({ place_id, description }) => (
              <CommandItem
                key={place_id}
                value={description}
                onSelect={handleSelect}
              />
            ))}
        </CommandGroup>
      </CommandList>
    </Command>
  );
};

实际运行后没有出现自动补全效果，截图如下：

教程中使用@reach/combobox的原始代码如下：

return (
    <Combobox onSelect={handleSelect}>
      <ComboboxInput
        value={value}
        onChange={(e) => setValue(e.target.value)}
        disabled={!ready}
        className="combobox-input"
        placeholder="Search an address"
      />
      <ComboboxPopover>
        <ComboboxList>
          {status === "OK" &&
            data.map(({ place_id, description }) => (
              <ComboboxOption key={place_id} value={description} />
            ))}
        </ComboboxList>
      </ComboboxPopover>
    </Combobox>
  );

内容的提问来源于stack exchange，提问作者Amith A G