Combobox

<form data-validate ui="stack" style="max-inline-size:22rem">
  <label ui="field"><span>شهر</span>
    <select name="city" data-combobox required>
      <option value="">انتخاب کنید…</option>
      <optgroup label="مرکز">
        <option value="thr">تهران</option>
        <option value="qom">قم</option>
        <option value="isf">اصفهان</option>
      </optgroup>
      <optgroup label="جنوب">
        <option value="shz" data-keywords="shiraz">شیراز</option>
        <option value="bnd">بندرعباس</option>
        <option value="ahv" disabled>اهواز (به‌زودی)</option>
      </optgroup>
      <optgroup label="شمال و شرق">
        <option value="rsh">رشت</option>
        <option value="mhd" data-keywords="mashhad">مشهد</option>
        <option value="tbz">تبریز</option>
        <option value="krm">کرمان</option>
      </optgroup>
    </select>
  </label>
  <button ui="primary" type="submit">ادامه</button>
</form>