For some reason the input appears as disabled

[ZeldOcarina]

Selecting a flag doesn't give any outcome. Do you have any idea?

[omeralpi]

Hi.

1. Could you please provide details about the browser you are using?
2. Would you be able to record a screen video regarding the issue you are experiencing?

[ZeldOcarina]

Of course! I am using Chrome on latest version, here's a Loom: https://www.loom.com/share/564ff3509a0648b18510e0aed2a5d4da?sid=27499613-6e64-4950-9833-75540200f501

Here's a snippet of the implementation:

<FormField
          control={form.control}
          name="phoneNumber"
          render={({ field }) => (
            <FormItem>
              <FormLabel>Phone Number</FormLabel>
              <FormControl>
                <PhoneInput
                  placeholder="Enter a phone number"
                  {...field}
                  className="w-full"
                  defaultCountry="US"
                  disabled={false}
                />
              </FormControl>
              <FormMessage />
            </FormItem>
          )}
        />

Except for a border radius change the phone-input.tsx is exactly what you gave in the repo! :)

Thanks for this project btw it's something I wanted to do but did not have time to!

[omeralpi]

The cause of your issue could be the Google extensions you're using. Have you tried opening it in an incognito tab? 🤔

[ZeldOcarina]

I did not. I tried now but the outcome is the same..

[omeralpi]

Got it.

Make sure you have version "^0.2.1" of "cmdk" in your package.json file.

[Justbeingjustin]

I had the same problem and changing the version of cmdk to "^0.2.1" did the trick.