CountrySelect - Admin Components
Note: This component is available since Medusa v2.21.0.
The CountrySelect component is a Combobox pre-populated with countries, where the value of a country is its lowercased ISO 2 code. The Medusa Admin uses it in address and shipping forms.
Example#
Use CountrySelect as the control of a Form field, as shown in the Forms guide:
import {
CountrySelect,
Form,
} from "@medusajs/dashboard/components"
const CountryField = ({ control }) => {
return (
<Form.Field
control={control}
name="country_code"
render={({ field }) => (
<Form.Item>
<Form.Label>Country</Form.Label>
<Form.Control>
<CountrySelect
autoComplete="country_code"
{...field}
/>
</Form.Control>
<Form.ErrorMessage />
</Form.Item>
)}
/>
)
}
The field's value is the country's ISO 2 code in lowercase, such as us, which is the format that the Medusa backend expects.
Props#
accepts the same props as Combobox, except for , since it populates the countries itself. It also accepts the following props:
Loading...
Was this page helpful?