Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA user lookup that shows recent people when the box is empty, searches the server as you type with debounce and cancellation, and shows skeleton rows, errors with Retry and empty results. Use this when people pick a user from a directory too big to load.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it for mentions, assignees and sharing in products with thousands of users, where the same few people are picked again and again and the rest must be found by name.
Do not use it when the whole directory fits in memory. Filter it locally instead.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
| --------------- | ---------------------------------------- | ------- | ----------------------------------------- | ------------------------------- |
| search | (query, { signal }) => Promise<User[]> | - | Looks users up. Pass signal to fetch. |
| recents | User[] | [] | Shown while the box is empty. |
| value | User \\ | null | - | The selected user (controlled). |
| defaultValue | User \\ | null | null | Initial user. |
| onValueChange | (user: User) => void | - | Runs when a user is picked. |
| debounceMs | number | 250 | Wait after the last keystroke. |
combobox; its name is the chosen person or Choose a person.role="status" line announces Searching…, N results, No one found and Could not search.aria-hidden; the status line carries the meaning.The pattern ships with a Testing Library test (async-user-search-with-recents.test.tsx) that covers recents when empty, debounced search with abort, the empty and error states with Retry and selecting.