function Demo() {
  const [value, setValue] = useState('nextjs');
  return (
    <ComboBox
      id="framework"
      label="Framework"
      options={COMBO_OPTIONS}
      value={value}
      onChange={setValue}
    />
  );
}

<ComboBox id="search" label="Async search" options={COMBO_OPTIONS} onSearch={search} value={value} onChange={setValue} />

async function suggest(query, signal) {
  const res = await fetch('/api/suggest?q=' + encodeURIComponent(query), { signal });
  return res.json();
}

<ComboBox
  id="cb-async-debounced"
  label="Debounced suggestions"
  options={[]}
  value={value}
  onChange={setValue}
  onSearch={suggest}      // signature: (q, signal) => Promise<Option[]>
  debounceMs={300}        // useAsync debounces & cancels in-flight
  placeholder="Type to search…"
/>