<div
  style="--spectrum-popover-height:142px;--spectrum-popover-width:166px;position:relative;display:inline-flex;align-items:center;justify-content:center;"
>
  <div
    class="spectrum-Combobox spectrum-Combobox--sizeM is-open"
    id="popover-trigger-6ms50"
    data-testid="combobox"
    style=""
  >
    <div
      class="spectrum-Textfield spectrum-Textfield--sizeM spectrum-Combobox-textfield"
      style=""
      id="textfield-cft6h"
    >
      <input
        type="text"
        name="field"
        id="textfield-cft6h-input"
        class="spectrum-Textfield-input spectrum-Combobox-input"
      />
    </div>

    <button
      aria-haspopup="listbox"
      class="spectrum-PickerButton spectrum-PickerButton--uiicononly spectrum-PickerButton--right spectrum-PickerButton--sizeM is-open spectrum-Combobox-button"
      style=""
      id="picker-9ndyt"
      tabindex="-1"
    >
      <div class="spectrum-PickerButton-fill">
        <svg
          focusable="false"
          aria-hidden="true"
          role="img"
          class="spectrum-Icon spectrum-UIIcon-ChevronDown100 spectrum-PickerButton-icon"
          id="icon-kshos"
          aria-label="ChevronDown100"
        >
          <title id="Chevron100">Chevron100</title>
          <use
            xlink:href="#spectrum-css-icon-Chevron100"
            href="#spectrum-css-icon-Chevron100"
          ></use>
        </svg>
      </div>
    </button>
  </div>

  <div
    role="presentation"
    class="spectrum-Popover is-open spectrum-Popover--sizeM spectrum-Popover--bottom-start"
    style="inset-block-start:100%;inset-inline-start:0;"
    id="popover-z6xgs"
    data-testid="popover-z6xgs"
  >
    <ul
      class="spectrum-Menu spectrum-Menu--sizeM is-selectable"
      id="menu-urbbs"
      role="listbox"
      aria-labelledby="menu-label-xpb5g"
      aria-disabled="false"
      style=""
    >
      <li
        class="spectrum-Menu-item is-selected"
        style=""
        id="menuitem-37u8c"
        role="option"
        aria-selected="true"
        aria-disabled="false"
        tabindex="0"
      >
        <svg
          focusable="false"
          aria-hidden="true"
          role="img"
          class="spectrum-Icon spectrum-UIIcon-Checkmark100 spectrum-Menu-itemIcon spectrum-Menu-checkmark"
          id="icon-pdoj7"
          aria-label="Checkmark100"
        >
          <title id="Checkmark100">Checkmark100</title>
          <use
            xlink:href="#spectrum-css-icon-Checkmark100"
            href="#spectrum-css-icon-Checkmark100"
          ></use>
        </svg>

        <span class="spectrum-Menu-itemLabel">Ballard</span>
      </li>

      <li
        class="spectrum-Menu-item"
        style=""
        id="menuitem-ukrib"
        role="option"
        aria-selected="false"
        aria-disabled="false"
        tabindex="0"
      >
        <span class="spectrum-Menu-itemLabel">Fremont</span>
      </li>

      <li
        class="spectrum-Menu-item"
        style=""
        id="menuitem-by5j0"
        role="option"
        aria-selected="false"
        aria-disabled="false"
        tabindex="0"
      >
        <span class="spectrum-Menu-itemLabel">Greenwood</span>
      </li>
      <div
        role="separator"
        class="spectrum-Divider spectrum-Divider--sizeS spectrum-Menu-divider"
        style=""
      ></div>
      <li
        class="spectrum-Menu-item is-disabled"
        style=""
        id="menuitem-m03m1"
        role="option"
        aria-selected="false"
        aria-disabled="true"
      >
        <span class="spectrum-Menu-itemLabel">United States of America</span>
      </li>
    </ul>
  </div>
</div>