Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | 106x 3x 2120x | import { COUNTRY_CODES } from "./country-codes";
type CountryCodeSelectProps = {
value: string;
onChange: (code: string) => void;
};
export function CountryCodeSelect({ value, onChange }: CountryCodeSelectProps) {
return (
<select
value={value}
onChange={(e) => onChange(e.target.value)}
className="inline-flex items-center rounded-l-md border border-r-0 border-border-default bg-background-muted px-2 py-2 text-sm text-foreground-default focus:outline-none focus:ring-2 focus:ring-green-500 cursor-pointer appearance-none min-w-[5.5rem]"
aria-label="Country code"
>
{COUNTRY_CODES.map((c) => (
<option key={`${c.code}-${c.name}`} value={c.code}>
{c.flag} +{c.code}
</option>
))}
</select>
);
}
|