A country, with or without its code

// apps/docs/examples/ui/nationality-combobox.tsx'use client';
import {useMemo, useState} from 'react';
import {NationalityCombobox} from '@workspace/active-ui/components/composed/nationality-combobox';import {  Field,  FieldDescription,  FieldLabel,} from '@workspace/active-ui/components/primitives/field';import {Switch} from '@workspace/active-ui/components/primitives/switch';
// The application's list and order: two common countries first, then the rest.const FIRST = ['NL', 'BE'];const REST = ['DE', 'FR', 'ES', 'IT', 'PL', 'PT', 'SE', 'TR', 'MA', 'GB', 'US'];
/** * A country by its ISO 3166-1 code, with names from `Intl.DisplayNames`. * The code is searchable even when it is not shown; switch on "Show codes" * to see it before the name. */export default function NationalityComboboxExample() {  const [country, setCountry] = useState('');  const [showCode, setShowCode] = useState(false);  const options = useMemo(() => {    const names = new Intl.DisplayNames(['en'], {type: 'region'});    const named = (code: string) => ({code, name: names.of(code) ?? code});    return [      ...FIRST.map(named),      ...REST.map(named).sort((a, b) => a.name.localeCompare(b.name, 'en')),    ];  }, []);  return (    <div className="grid w-full max-w-xs gap-6">      <Field orientation="horizontal">        <Switch          id="show-codes"          checked={showCode}          onCheckedChange={setShowCode}        />        <FieldLabel htmlFor="show-codes">Show codes</FieldLabel>      </Field>      <Field>        <FieldLabel htmlFor="nationality">Nationality</FieldLabel>        <NationalityCombobox          id="nationality"          value={country}          onValueChange={setCountry}          options={options}          showCode={showCode}          locale="en"          placeholder="Choose a country"          searchLabel="Search countries"          searchPlaceholder="Search…"          emptyText="No country found."          aria-describedby="nationality-value"        />        <FieldDescription id="nationality-value">          Value: <code>{country || "''"}</code>        </FieldDescription>      </Field>    </div>  );}