useSearch

1import { useSearch } from '@markprompt/react';
2
3function Search() {
4  const { searchResults, searchQuery, setSearchQuery, submitSearchQuery } =
5    useSearch({ projectKey: 'YOUR-PROJECT-KEY' });
6
7  return (
8    <div className="flex h-full w-full flex-col">
9      {searchResults.map((result) => (
10        <a key={result.href} href={result.href}>
11          {result.title}
12        </a>
13      ))}
14
15      <form
16        onSubmit={async (e) => {
17          e.preventDefault();
18          await submitSearchQuery(searchQuery);
19        }}
20      >
21        <input
22          className="fixed inset-x-2 bottom-0 rounded border border-neutral-200 p-2"
23          value={input}
24          placeholder="Send a message"
25          onChange={(e) => {
26            setSearchQuery(event.target.value);
27            submitSearchQuery(event.target.value);
28          }}
29        />
30      </form>
31    </div>
32  );
33}